/* =====================
ARTICLE LIST + SIDEBAR
===================== */


.article-section{

background:#050505;

padding:110px 25px;

}





.article-container{

max-width:1200px;

margin:auto;


display:grid;

grid-template-columns:
1fr 360px;


gap:50px;


align-items:start;

}







/* HEADING */


.article-heading{

margin-bottom:40px;

}




.article-heading h2{

font-size:

clamp(32px,4vw,52px);


line-height:1.1;


font-weight:900;


color:white;

}









/* ARTICLE CARD */


.article-main{

display:flex;

flex-direction:column;

gap:30px;

}








.article-card{

display:grid;

grid-template-columns:

280px 1fr;


overflow:hidden;



border-radius:32px;



background:
linear-gradient(
145deg,
rgba(255,255,255,.08),
rgba(255,255,255,.02)
);



border:
1px solid rgba(212,175,55,.20);



transition:.35s;

}







.article-card:hover{

transform:

translateY(-6px);



border-color:
rgba(212,175,55,.55);

}








.article-card img{

width:100%;

height:100%;


object-fit:cover;

}









.article-content{

padding:32px;

}








.article-content span{

color:#d4af37;


font-size:14px;


font-weight:900;

}








.article-content h3{

font-size:24px;


line-height:1.3;


font-weight:900;


color:white;


margin:

14px 0;

}








.article-content p{

font-size:15px;


line-height:1.7;


color:#aaa;

}









.article-content a{

display:inline-flex;


margin-top:22px;


padding:

12px 22px;



border-radius:50px;



background:

linear-gradient(
135deg,
#d4af37,
#fff1a8
);



color:#050505;



font-weight:900;


text-decoration:none;

}











/* SIDEBAR */


.article-sidebar{

position:sticky;

top:100px;


display:flex;

flex-direction:column;


gap:25px;

}








.sidebar-widget,
.sidebar-cta{

padding:32px;


border-radius:30px;



background:
linear-gradient(
145deg,
rgba(255,255,255,.08),
rgba(255,255,255,.02)
);



border:
1px solid rgba(212,175,55,.20);

}








.sidebar-widget h3,
.sidebar-cta h3{

font-size:22px;


font-weight:900;


color:white;


margin-bottom:25px;

}









.sidebar-widget a{

display:block;


padding:

18px 0;



border-bottom:

1px solid rgba(255,255,255,.08);



text-decoration:none;

}







.sidebar-widget strong{

display:block;


font-size:15px;


line-height:1.5;


color:white;

}






.sidebar-widget span{

font-size:13px;


color:#d4af37;

}










/* CATEGORY */


.category-list{

display:flex;


flex-wrap:wrap;


gap:12px;

}






.category-list a{

padding:

10px 15px;


border-radius:30px;


border:
1px solid rgba(212,175,55,.25);



color:#d4af37;


font-weight:800;

}









/* CTA */


.sidebar-cta p{

font-size:15px;


line-height:1.7;


color:#aaa;


margin-bottom:25px;

}







.sidebar-cta a{

display:flex;

justify-content:center;


padding:14px;



border-radius:50px;



background:
linear-gradient(
135deg,
#d4af37,
#fff1a8
);



color:#050505;


font-weight:900;


text-decoration:none;

}










/* RESPONSIVE */


@media(max-width:950px){


.article-container{

grid-template-columns:1fr;

}



.article-sidebar{

position:relative;

top:auto;

}



}






@media(max-width:650px){



.article-section{

padding:

80px 20px;

}




.article-card{

grid-template-columns:1fr;

}



.article-card img{

height:230px;

}



}