/* SECTION */

.event-modern{
padding:100px 8%;
}


.title-area span{
color:#2563eb;
font-weight:700;
letter-spacing:3px;
font-size:14px;
}


.title-area h2{

font-size:42px;

margin-top:15px;

margin-bottom:50px;

color:#0f172a;

line-height:1.3;
}



/* FILTER */

.filter-buttons{

display:flex;

gap:15px;

flex-wrap:wrap;

margin-bottom:50px;

}


.filter-buttons button{

padding:14px 25px;

border:none;

border-radius:100px;

background:#e9e9e9;

cursor:pointer;

font-size:15px;

transition:.4s;

font-weight:600;
}


.filter-buttons button:hover{

background:#2563eb;
color:white;

}


.filter-buttons .active{

background:#ff1b1b;
color:white;

}



/* GRID */

.event-list{

display:grid;

grid-template-columns:
repeat(auto-fit,minmax(360px,1fr));

gap:35px;

}



/* CARD */

.event-item{

background:white;

border-radius:25px;

overflow:hidden;

box-shadow:
0 20px 50px rgba(0,0,0,.07);

transition:.4s;

}


.event-item:hover{

transform:
translateY(-12px);

box-shadow:
0 25px 60px rgba(0,0,0,.15);

}



/* IMAGE */

.event-item img{

width:100%;

height:230px;

object-fit:cover;

}



/* CONTENT */

.event-content{

padding:28px;

}


.badge{

display:inline-block;

padding:8px 18px;

background:red;

color:white;

font-size:13px;

border-radius:50px;

margin-bottom:20px;

}


.event-content h3{

font-size:26px;

margin-bottom:10px;

line-height:1.4;

color:#111827;

}


.event-content p{

color:#64748b;

line-height:1.8;

font-size:15px;

min-height:60px;

}


.meta{

display:flex;

justify-content:space-between;

margin-top:20px;

padding-top:20px;

border-top:1px solid #eee;

font-size:14px;

font-weight:700;

color:#2563eb;

}



/* MOBILE */

@media(max-width:768px){

.event-modern{

padding:70px 6%;

}

.title-area h2{

font-size:30px;

}

.event-list{

grid-template-columns:1fr;

}

}