/*=========================================
CASE STUDY
=========================================*/

.case-study-section{

padding:120px 0;

background:#050505;

}

.case-container{

max-width:1200px;

margin:auto;

padding:0 20px;

}

.case-heading{

max-width:850px;

margin:auto;

text-align:center;

margin-bottom:70px;

}

.case-heading h2{

font-size:46px;

font-weight:800;

color:#fff;

margin:22px 0;

line-height:1.2;

}

.case-heading p{

font-size:17px;

line-height:1.9;

color:#bfbfbf;

}

.case-grid{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:30px;

}

.case-card{

background:linear-gradient(180deg,#101010,#191919);

padding:35px;

border-radius:22px;

border:1px solid rgba(212,175,55,.12);

transition:.35s;

display:flex;

flex-direction:column;

}

.case-card:hover{

transform:translateY(-8px);

border-color:#d4af37;

box-shadow:0 20px 45px rgba(212,175,55,.12);

}

.case-badge{

display:inline-block;

background:#d4af37;

color:#000;

padding:8px 18px;

border-radius:30px;

font-size:13px;

font-weight:700;

margin-bottom:20px;

}

.case-category{

color:#d4af37;

font-size:14px;

font-weight:700;

margin-bottom:18px;

text-transform:uppercase;

letter-spacing:1px;

}

.case-card h3{

font-size:28px;

color:#fff;

margin-bottom:18px;

line-height:1.3;

}

.case-card p{

font-size:15px;

line-height:1.9;

color:#bdbdbd;

margin-bottom:30px;

}

.case-result{

display:flex;

justify-content:space-between;

gap:20px;

margin-top:auto;

padding-top:25px;

border-top:1px solid rgba(255,255,255,.08);

}

.case-result div{

text-align:center;

flex:1;

}

.case-result strong{

display:block;

font-size:28px;

color:#d4af37;

margin-bottom:8px;

}

.case-result span{

font-size:13px;

color:#999;

}

.case-note{

margin-top:50px;

padding:25px;

border-left:4px solid #d4af37;

background:#111;

border-radius:12px;

}

.case-note p{

margin:0;

color:#cfcfcf;

line-height:1.8;

}

@media(max-width:991px){

.case-grid{

grid-template-columns:1fr;

}

.case-heading h2{

font-size:36px;

}

}

@media(max-width:768px){

.case-heading h2{

font-size:30px;

}

.case-card{

padding:28px;

}

.case-result{

flex-direction:column;

gap:15px;

}

}