/* =====================
WHY SECTION
===================== */


.why-section{

background:#050505;

padding:

110px 25px;

}





.why-container{


max-width:1200px;

margin:auto;


display:grid;

grid-template-columns:

.9fr 1.1fr;


gap:70px;


align-items:center;

}







/* LEFT */


.why-content h2{


font-size:

clamp(34px,4vw,54px);


line-height:1.1;


letter-spacing:-1.5px;


font-weight:900;


color:white;


margin-bottom:25px;

}






.why-content p{


font-size:17px;


line-height:1.8;


color:#bdbdbd;

}





.why-content strong{

color:#ffffff;

}









/* GOLD BOX */


.why-box{


margin-top:35px;


padding:28px;



border-radius:26px;



background:

linear-gradient(

135deg,

rgba(212,175,55,.15),

rgba(255,255,255,.04)

);



border:

1px solid rgba(212,175,55,.35);


}







.why-box strong{


display:block;


font-size:22px;


margin-bottom:12px;


color:#d4af37;

}





.why-box span{


display:block;


font-size:15px;


line-height:1.7;


color:#ddd;

}










/* RIGHT */


.why-grid{


display:grid;


grid-template-columns:

repeat(2,1fr);


gap:22px;

}








.why-card{


padding:

30px;



border-radius:26px;



background:

linear-gradient(

145deg,

rgba(255,255,255,.08),

rgba(255,255,255,.02)

);



border:

1px solid rgba(212,175,55,.18);



transition:.35s;

}







.why-card:hover{


transform:

translateY(-7px);



border-color:

rgba(212,175,55,.55);

}









.why-icon{


width:46px;

height:46px;


display:flex;


align-items:center;

justify-content:center;



border-radius:15px;



background:

linear-gradient(

135deg,

#d4af37,

#fff1a8

);



color:#050505;


font-weight:900;



margin-bottom:25px;

}








.why-card h3{


font-size:20px;


font-weight:900;


color:#ffffff;


margin-bottom:15px;

}







.why-card p{


font-size:15px;


line-height:1.7;


color:#aaa;

}









/* RESPONSIVE */


@media(max-width:950px){


.why-container{


grid-template-columns:1fr;


gap:55px;

}



}








@media(max-width:600px){



.why-section{


padding:

80px 20px;

}



.why-grid{


grid-template-columns:1fr;

}



.why-card{


padding:26px;

}



}