/* Case Studies Site CSS */
:root{
  --navy:#0b1628;
  --blue:#2563eb;
  --gold:#f0a500;
  --light:#e8f0fd;
  --card:#ffffff;
  --text:#1e3a5f;
  --muted:#3d5a80;
  --radius:16px;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
body{font-family:'Plus Jakarta Sans',sans-serif;background:var(--light);color:var(--text);line-height:1.6;}
a{text-decoration:none;color:inherit;}
img{display:block;max-width:100%;}

/* ── HEADER ── */
.cs-header{
  background:var(--navy);
  padding:16px 40px;
  display:flex;align-items:center;justify-content:space-between;
  position:sticky;top:0;z-index:100;
  box-shadow:0 2px 20px rgba(0,0,0,.3);
}
.cs-header-logo img{height:44px;object-fit:contain;}
.cs-header-nav{display:flex;gap:24px;align-items:center;}
.cs-header-nav a{font-size:.85rem;font-weight:600;color:rgba(255,255,255,.7);transition:color .2s;}
.cs-header-nav a:hover{color:var(--gold);}
.cs-header-cta{
  background:var(--gold);color:#000;
  font-weight:700;font-size:.82rem;
  padding:9px 20px;border-radius:100px;
  transition:opacity .2s;
}
.cs-header-cta:hover{opacity:.88;}

/* ── HERO ── */
.cs-hero{
  background:linear-gradient(135deg,var(--navy) 0%,#102040 100%);
  padding:80px 40px;text-align:center;
  position:relative;overflow:hidden;
}
.cs-hero::before{
  content:'';position:absolute;inset:0;
  background:radial-gradient(ellipse at 50% 0%,rgba(240,165,0,.15),transparent 65%);
  pointer-events:none;
}
.cs-hero-label{
  display:inline-flex;align-items:center;gap:6px;
  background:rgba(240,165,0,.1);border:1px solid rgba(240,165,0,.3);
  color:var(--gold);font-size:.65rem;font-weight:700;
  letter-spacing:.14em;text-transform:uppercase;
  padding:5px 14px;border-radius:100px;margin-bottom:20px;
}
.cs-hero h1{
  font-family:'Outfit',sans-serif;
  font-size:clamp(1.8rem,4vw,3rem);font-weight:800;
  color:#fff;line-height:1.1;margin-bottom:16px;
}
.cs-hero h1 span{color:var(--gold);}
.cs-hero p{
  font-size:1rem;color:rgba(255,255,255,.6);
  max-width:540px;margin:0 auto 32px;
}
.cs-hero-stats{
  display:flex;gap:32px;justify-content:center;flex-wrap:wrap;
}
.cs-hero-stat{text-align:center;}
.cs-hero-stat strong{
  display:block;font-family:'Outfit',sans-serif;
  font-size:1.8rem;font-weight:900;color:var(--gold);
}
.cs-hero-stat span{font-size:.7rem;color:rgba(255,255,255,.5);text-transform:uppercase;letter-spacing:.08em;}

/* ── GRID ── */
.cs-main{max-width:1280px;margin:0 auto;padding:64px 40px;}
.cs-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;}

/* ── CARD ── */
.cs-card{
  background:var(--card);
  border:1px solid rgba(59,130,246,.18);
  border-radius:var(--radius);
  overflow:hidden;
  box-shadow:0 4px 20px rgba(11,22,40,.08);
  transition:transform .28s,box-shadow .28s;
  display:flex;flex-direction:column;
}
.cs-card:hover{
  transform:translateY(-6px);
  box-shadow:0 14px 40px rgba(37,99,235,.16);
}
.cs-card-thumb{
  width:100%;aspect-ratio:16/9;
  background:linear-gradient(135deg,#dde8fa,#e8f0fd);
  display:flex;align-items:center;justify-content:center;
  font-size:3.5rem;
  border-bottom:1px solid rgba(59,130,246,.1);
}
.cs-card-body{padding:24px;flex:1;display:flex;flex-direction:column;}
.cs-card-meta{
  display:flex;align-items:center;gap:10px;
  margin-bottom:12px;flex-wrap:wrap;
}
.cs-card-industry{
  font-size:.62rem;font-weight:700;letter-spacing:.12em;
  text-transform:uppercase;color:var(--gold);
}
.cs-card-country{font-size:.75rem;color:var(--muted);}
.cs-card h2{
  font-family:'Outfit',sans-serif;
  font-size:1.05rem;font-weight:700;
  color:var(--navy);margin-bottom:10px;line-height:1.35;
}
.cs-card p{
  font-size:.85rem;color:var(--muted);
  line-height:1.68;margin-bottom:18px;flex:1;
}
/* results chips */
.cs-card-results{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:18px;}
.cs-result-chip{
  font-size:.7rem;font-weight:700;
  background:rgba(240,165,0,.1);
  border:1px solid rgba(240,165,0,.3);
  color:#b07800;
  padding:4px 10px;border-radius:100px;
}
.cs-card-link{
  font-size:.78rem;font-weight:700;
  color:var(--blue);
  display:inline-flex;align-items:center;gap:5px;
  transition:gap .2s,color .2s;
}
.cs-card-link:hover{color:var(--gold);gap:9px;}

/* ── SINGLE CASE ── */
.cs-post{max-width:860px;margin:0 auto;padding:64px 40px;}
.cs-post-header{margin-bottom:48px;}
.cs-post-badge{
  display:inline-flex;align-items:center;gap:8px;
  background:rgba(240,165,0,.1);border:1px solid rgba(240,165,0,.3);
  color:var(--gold);font-size:.65rem;font-weight:700;
  letter-spacing:.14em;text-transform:uppercase;
  padding:5px 14px;border-radius:100px;margin-bottom:16px;
}
.cs-post h1{
  font-family:'Outfit',sans-serif;
  font-size:clamp(1.6rem,3.5vw,2.4rem);font-weight:800;
  color:var(--navy);line-height:1.15;margin-bottom:20px;
}
/* summary box */
.cs-summary{
  background:linear-gradient(135deg,#fff8e0,#fef0c0);
  border:1px solid rgba(240,165,0,.3);
  border-radius:var(--radius);
  padding:28px 32px;
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:20px;margin-bottom:48px;
}
.cs-summary-item{}
.cs-summary-label{
  font-size:.6rem;font-weight:700;letter-spacing:.14em;
  text-transform:uppercase;color:var(--muted);margin-bottom:4px;
}
.cs-summary-value{
  font-family:'Outfit',sans-serif;font-size:.95rem;
  font-weight:700;color:var(--navy);
}
/* results strip */
.cs-results-strip{
  background:var(--navy);border-radius:var(--radius);
  padding:28px 32px;margin-bottom:48px;
  display:flex;gap:0;
}
.cs-result-item{
  flex:1;text-align:center;
  border-right:1px solid rgba(255,255,255,.1);
  padding:0 20px;
}
.cs-result-item:last-child{border-right:none;}
.cs-result-n{
  font-family:'Outfit',sans-serif;font-size:1.6rem;
  font-weight:900;color:var(--gold);display:block;line-height:1;
  margin-bottom:6px;
}
.cs-result-l{font-size:.72rem;color:rgba(255,255,255,.55);line-height:1.4;}

/* post body */
.cs-post-body h2{
  font-family:'Outfit',sans-serif;font-size:1.3rem;
  font-weight:700;color:var(--navy);margin:36px 0 14px;
}
.cs-post-body p{
  font-size:.93rem;color:var(--muted);line-height:1.78;margin-bottom:16px;
}
.cs-post-body ul,.cs-post-body ol{
  margin:0 0 16px 20px;
}
.cs-post-body li{
  font-size:.93rem;color:var(--muted);line-height:1.78;margin-bottom:6px;
}
.cs-post-body pre{
  background:var(--navy);color:#e8eaf0;
  border-radius:10px;padding:20px;
  font-size:.82rem;line-height:1.65;
  overflow-x:auto;margin-bottom:20px;
}
.cs-post-body code{
  background:rgba(37,99,235,.08);
  color:#1e3a5f;padding:2px 6px;border-radius:4px;
  font-size:.85em;
}

/* services used */
.cs-services-used{
  display:flex;flex-wrap:wrap;gap:8px;margin-bottom:40px;
}
.cs-service-tag{
  font-size:.78rem;font-weight:600;
  background:rgba(37,99,235,.08);
  border:1px solid rgba(37,99,235,.2);
  color:var(--blue);padding:6px 14px;border-radius:100px;
}

/* CTA box */
.cs-cta-box{
  background:linear-gradient(135deg,var(--navy),#102040);
  border-radius:var(--radius);padding:40px;
  text-align:center;margin-top:48px;
}
.cs-cta-box h3{
  font-family:'Outfit',sans-serif;font-size:1.4rem;
  font-weight:800;color:#fff;margin-bottom:10px;
}
.cs-cta-box p{font-size:.9rem;color:rgba(255,255,255,.55);margin-bottom:24px;}
.cs-cta-btn{
  display:inline-flex;align-items:center;gap:7px;
  background:var(--gold);color:#000;
  font-family:'Outfit',sans-serif;font-weight:700;
  padding:13px 30px;border-radius:100px;
  font-size:.92rem;transition:opacity .2s,transform .2s;
}
.cs-cta-btn:hover{opacity:.9;transform:translateY(-2px);}

/* ── FOOTER ── */
.cs-footer{
  background:var(--navy);padding:32px 40px;
  text-align:center;
  border-top:1px solid rgba(59,130,246,.15);
}
.cs-footer a{color:var(--gold);font-weight:600;}
.cs-footer p{font-size:.82rem;color:rgba(179,210,255,.45);}

/* ── RESPONSIVE ── */
@media(max-width:1020px){
  .cs-grid{grid-template-columns:1fr 1fr;}
  .cs-summary{grid-template-columns:1fr 1fr;}
}
@media(max-width:640px){
  .cs-header{padding:14px 18px;}
  .cs-header-nav{display:none;}
  .cs-hero{padding:60px 18px;}
  .cs-main{padding:40px 18px;}
  .cs-grid{grid-template-columns:1fr;}
  .cs-post{padding:40px 18px;}
  .cs-summary{grid-template-columns:1fr;}
  .cs-results-strip{flex-direction:column;gap:16px;}
  .cs-result-item{border-right:none;border-bottom:1px solid rgba(255,255,255,.1);padding-bottom:16px;}
  .cs-result-item:last-child{border-bottom:none;}
}