/* case-study.php — layout only; components come from ui-v2.css */
.cs-hero{padding:calc(var(--nav-h) + clamp(32px,5vw,64px)) 0 clamp(36px,5vw,56px)}
.cs-hero::before,.cs-hero::after{content:none}
.cs-hero .breadcrumb{margin-bottom:var(--s-5)}
.cs-hero .breadcrumb__current{color:var(--text-inverse-muted)}
.cs-hero__eyebrow{display:inline-flex;margin-bottom:var(--s-4)}
.cs-hero h1{margin:0 0 var(--s-3)}
.cs-hero__loc{color:var(--text-inverse-muted);font-size:var(--fs-body);margin:0}
@media (max-width:768px){
  .cs-hero .breadcrumb{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block}
  .cs-hero .breadcrumb a,.cs-hero .breadcrumb span{display:inline}
}

/* meta strip: one dark card of ruled cells */
.cs-hero .cs-meta{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:0;padding:0;margin-top:var(--s-6);overflow:hidden}
.cs-hero .cs-meta-item{min-height:0;padding:16px 20px;border:0;border-left:var(--border-dark);border-radius:0;background:none}
.cs-hero .cs-meta-item:first-child{border-left:0}
.cs-hero .cs-meta-item .label{font-size:12px;color:var(--text-inverse-muted)}
.cs-hero .cs-meta-item .val{margin-top:6px;font-size:var(--fs-small)}
.cs-hero .cs-meta-item .val a{display:inline-flex;align-items:center;min-height:40px;margin:-11px 0;color:#fff;text-decoration:underline;text-decoration-color:rgba(125,213,253,.4);text-underline-offset:3px}
.cs-hero .cs-meta-item .val a:hover{color:var(--blue-2);text-decoration-color:var(--blue-2)}
@media (max-width:768px){
  .cs-hero .cs-meta{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cs-hero .cs-meta-item{padding:14px 16px}
  .cs-hero .cs-meta-item:nth-child(odd){border-left:0}
  .cs-hero .cs-meta-item:nth-child(n+3){border-top:var(--border-dark)}
}

/* hero screenshot pulled across the dark/paper edge */
.cs-hero-media{background:linear-gradient(to bottom,var(--ink) 0,var(--ink) 55%,transparent 55%)}
.cs-hero__img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;object-position:top;border-radius:var(--r-xl);border:var(--border);background:var(--paper-3);box-shadow:var(--shadow-lg)}

/* body sections: label left, prose right */
.cs-body{max-width:none;padding:var(--section-pad-tight) 0 var(--section-pad);background:var(--paper)}
.cs-section{display:grid;grid-template-columns:200px minmax(0,1fr);gap:var(--s-4) var(--s-7);padding:0 0 var(--s-6);margin:0 0 var(--s-6);border-bottom:var(--border);align-items:start}
.cs-section h2{position:sticky;top:calc(var(--nav-h) + 24px);font-size:var(--fs-h3);font-weight:600;letter-spacing:-.015em;line-height:1.25;margin:0;color:var(--ink)}
.cs-section__body p{font-size:var(--fs-body);line-height:1.7;color:var(--text-muted);margin:0}
.cs-section__body p + p{margin-top:var(--s-4)}
.cs-section:last-of-type{border-bottom:0}
.cs-stack{margin:0}
@media (max-width:768px){
  .cs-section{grid-template-columns:minmax(0,1fr);gap:var(--s-3);padding-bottom:var(--s-5);margin-bottom:var(--s-5)}
  .cs-section h2{position:static}
}

/* quote + CTA */
.cs-quote{margin:var(--s-2) 0 var(--s-6);padding:var(--card-pad);border-radius:var(--r-xl);box-shadow:none}
.cs-quote .q{font-size:var(--fs-lead);line-height:1.5;font-weight:500;letter-spacing:-.01em;margin:0}
.cs-quote .who{font-family:var(--font-mono);font-size:12px;letter-spacing:.04em;color:var(--text-inverse-muted);margin:0}
.cs-body .cs-cta{margin-top:var(--s-7);box-shadow:none}
.cs-body .cs-cta h3,.cs-body .cs-cta p,.cs-body .cs-cta .btn{position:relative;z-index:1}

/* related */
.cs-related-pages{margin-top:var(--s-6)}
.cs-related-label{display:block;margin-bottom:var(--s-3)}
.cs-related-pages .service-links{justify-content:flex-start;margin-top:0}

/* related compact work cards */
.cs-related-grid .card__media .placeholder{width:100%;height:100%;background:var(--grad-ink)}
.cs-related-grid .card__body h3{font-size:var(--fs-h4);line-height:1.3}
.cs-related-grid .tag-mono{align-self:flex-start;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block;line-height:28px}
@media (max-width:768px){
  .cs-related-grid .card__body h3{font-size:15px}
  .cs-related-grid .tag-mono{min-height:24px;line-height:24px;padding:0 8px}
}

/* prev / next */
.cs-pn{background:var(--paper-2);border-top:var(--border)}
.cs-pn-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--grid-gap)}
.cs-pn .cs-pn-card{padding:var(--s-3);border-radius:var(--r-lg)}
.cs-pn .cs-pn-card .card__media{flex:0 0 112px;aspect-ratio:16/10}
.cs-pn .cs-pn-card img{width:100%;height:100%;border-radius:0}
.cs-pn-txt{display:flex;flex-direction:column;gap:3px;min-width:0}
.cs-pn-txt b{font-size:var(--fs-h4);line-height:1.25;letter-spacing:-.01em;color:var(--ink)}
.cs-pn-ind{font-size:13px;line-height:1.4;color:var(--text-muted)}
.cs-pn .cs-pn-next{flex-direction:row-reverse;text-align:right}
@media (max-width:640px){
  .cs-pn-grid{grid-template-columns:1fr}
  .cs-pn .cs-pn-card .card__media{flex-basis:88px}
  .cs-pn .cs-pn-next{flex-direction:row;text-align:left}
}