/* ===== Case Studies page — built on top of style.css tokens ===== */

.case-hero{padding:150px 0 var(--space-8);background:var(--bg-soft);}
.case-hero .eyebrow{margin-bottom:var(--space-4);}
.case-hero h1{
  font-size:clamp(21px, 2.85vw, 42.6px);
  line-height:1.38;max-width:100%;margin-bottom:var(--space-5);
}
.case-hero .hero-body{font-size:16.6px;color:var(--mist);max-width:680px;}

.case-note{
  margin-top:var(--space-7);max-width:680px;
  border-left:2px solid var(--gold);padding:var(--space-3) 0 var(--space-3) var(--space-4);
}
.case-note span{font-family:var(--font-mono);font-size:12.3px;color:var(--gold);letter-spacing:0.08em;display:block;margin-bottom:6px;}
.case-note p{font-size:14.6px;color:var(--mist);}

.case-stat-row{
  border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  display:grid;grid-template-columns:repeat(3,1fr) 1.6fr;
}
.case-stat-row.cols-2{grid-template-columns:repeat(2,1fr) 2.2fr;}
.case-stat-row.no-statement{grid-template-columns:repeat(2,1fr);max-width:520px;margin:0 auto;}
.case-stat-row .stat{padding:var(--space-6) var(--space-4);text-align:center;border-right:1px solid var(--line);}
.case-stat-row.no-statement .stat:last-child{border-right:none;}
.case-stat-row .stat-num{font-family:var(--font-mono);font-size:clamp(24px, 1.6vw + 12px, 34px);font-weight:700;color:var(--gold);}
.case-stat-row .stat-label{font-size:13.4px;color:var(--mist-dim);margin-top:6px;line-height:1.5;}
.case-stat-row .stat-statement{
  padding:var(--space-6) var(--space-6);display:flex;flex-direction:column;justify-content:center;background:var(--panel);
}
.case-stat-row .stat-statement span{font-family:var(--font-mono);font-size:12.3px;color:var(--gold);letter-spacing:0.06em;margin-bottom:8px;}
.case-stat-row .stat-statement strong{font-family:var(--font-heading);font-size:17.4px;font-weight:700;color:var(--ivory);line-height:1.5;}

.cases-intro{padding:var(--space-8) 0 var(--space-6);}
.cases-intro h2{font-size:clamp(22px, 1.4vw + 16px, 32px);line-height:1.4;margin:var(--space-3) 0 var(--space-4);max-width:720px;}
.cases-intro p{color:var(--mist);font-size:16.6px;max-width:680px;}

.case-block{padding:var(--space-8) 0;border-top:1px solid var(--line);}
.case-block .wrap{
  display:grid;grid-template-columns:0.95fr 1.05fr;gap:var(--space-8);align-items:start;
}
.case-block.reverse .case-visual{order:2;}
.case-block.reverse .case-copy{order:1;}

.case-visual{display:grid;gap:10px;}
.case-visual.double{grid-template-columns:1fr 1fr;}
.case-visual.double figure:first-child{grid-column:1/-1;}
.case-visual.pair{grid-template-columns:1fr 1fr;}
.case-visual figure{margin:0;aspect-ratio:4/3;overflow:hidden;border:1px solid var(--line);background:var(--card);}
.case-visual figure img{width:100%;height:100%;object-fit:cover;display:block;}
.case-visual.collage figure{aspect-ratio:13/15;}

.case-topline{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px;margin-bottom:10px;}
.case-index{font-family:var(--font-mono);font-size:12.3px;color:var(--gold);letter-spacing:0.1em;text-transform:uppercase;}
.case-status{
  font-family:var(--font-mono);font-size:11.8px;color:var(--mist);
  border:1px solid var(--line-strong);padding:3px 10px;letter-spacing:0.03em;white-space:nowrap;
}
.case-status.is-order{color:var(--gold);border-color:var(--gold-line);}
.case-copy h2{font-size:clamp(22px, 1.2vw + 16px, 29.1px);letter-spacing:0.03em;margin-bottom:var(--space-3);}
.case-hook{font-size:17.4px;color:var(--ivory);font-family:var(--font-heading);margin-bottom:var(--space-5);line-height:1.6;}

.case-facts{display:flex;flex-direction:column;gap:var(--space-4);margin-bottom:var(--space-5);}
.case-facts>div{display:grid;grid-template-columns:96px 1fr;gap:var(--space-4);padding-bottom:var(--space-4);border-bottom:1px solid var(--line);}
.case-facts>div:last-child{border-bottom:none;padding-bottom:0;}
.case-facts dt{font-family:var(--font-mono);font-size:12px;color:var(--mist-dim);letter-spacing:0.03em;padding-top:2px;}
.case-facts dd{font-size:15.3px;color:var(--mist);line-height:1.68;}

.deliverables{display:flex;flex-wrap:wrap;gap:8px;}
.deliverables span{
  font-family:var(--font-mono);font-size:12.3px;color:var(--mist);
  border:1px solid var(--line-strong);padding:6px 12px;letter-spacing:0.02em;
}

.order-proof{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:var(--space-5) 0 var(--space-6);}
.order-proof>div{background:var(--card);border:1px solid var(--line);padding:var(--space-4);}
.order-proof small{display:block;font-family:var(--font-mono);font-size:10.6px;color:var(--mist-dim);letter-spacing:0.05em;margin-bottom:6px;}
.order-proof strong{font-size:15.8px;color:var(--ivory);font-weight:700;}

.case-legacy{padding:var(--space-8) 0;border-top:1px solid var(--line);background:var(--panel);}
.case-legacy .section-head{margin-bottom:var(--space-7);}
.case-legacy .section-head h2{font-size:clamp(22px, 1.2vw + 16px, 28px);}
.case-legacy .section-head p{max-width:640px;}
.legacy-grid{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line);}
.legacy-card{background:var(--card);display:flex;flex-direction:column;}
.legacy-card img{width:100%;aspect-ratio:16/9;object-fit:cover;}
.legacy-card .legacy-body{padding:var(--space-5) var(--space-6) var(--space-6);}
.legacy-card span{font-family:var(--font-mono);font-size:12px;color:var(--gold);letter-spacing:0.06em;}
.legacy-card h3{font-family:var(--font-heading);font-size:19px;margin:var(--space-3) 0 var(--space-3);}
.legacy-card p{font-size:14.6px;color:var(--mist);}

.case-evidence{padding:var(--space-8) 0;border-top:1px solid var(--line);}
.case-evidence-inner{display:grid;grid-template-columns:0.7fr 1.3fr;gap:var(--space-7);align-items:start;}
.case-evidence-inner h2{font-size:clamp(22px, 1.2vw + 16px, 28px);line-height:1.4;}
.case-evidence-inner p{color:var(--mist);font-size:16.2px;margin-bottom:var(--space-4);}
.case-evidence-inner.centered{display:block;text-align:center;max-width:640px;margin:0 auto;}
.case-evidence-inner.centered .eyebrow{justify-content:center;}
.case-evidence-inner.centered h2{font-size:clamp(20px, 1vw + 15px, 26px);}

@media (max-width:1200px){
  .case-block .wrap{grid-template-columns:1fr;}
  .case-block.reverse .case-visual,.case-block.reverse .case-copy{order:initial;}
  .case-visual.double,.case-visual.pair{grid-template-columns:1fr 1fr;}
  .order-proof{grid-template-columns:1fr 1fr;}
  .legacy-grid{grid-template-columns:1fr;}
  .case-evidence-inner{grid-template-columns:1fr;}
  .case-stat-row{grid-template-columns:repeat(3,1fr);}
  .case-stat-row.cols-2{grid-template-columns:repeat(2,1fr);}
  .case-stat-row .stat-statement{grid-column:1/-1;border-right:none;border-top:1px solid var(--line);}
}
@media (max-width:768px){
  .case-visual.double,.case-visual.pair{grid-template-columns:1fr;}
  .case-facts>div{grid-template-columns:1fr;gap:4px;}
  .order-proof{grid-template-columns:1fr 1fr;}
}

/* ---- brand wordmarks in place of the case title ----------------------
   max-height AND max-width are both set with auto sides, so each logo fits
   its own box: wide wordmarks (BLOOMINGWARE, OAKLANDWARE) are capped by
   width, compact lockups with an icon (Cubette, HARTLANDWOOD) by height.
   The <h2> stays — the brand name lives in the img's alt for search and
   screen readers. */
.case-copy h2.has-logo{line-height:0;margin-bottom:var(--space-4);}
.brand-logo{
  display:block;width:auto;height:auto;
  max-height:40px;max-width:min(100%, 340px);
}
@media (max-width:768px){
  .brand-logo{max-height:32px;max-width:min(100%, 260px);}
}
/* a lockup with a tagline under the wordmark needs more height than a plain
   wordmark to stay legible, and less width to keep the same visual weight */
.brand-logo.is-tall{max-height:58px;max-width:min(100%, 240px);}
@media (max-width:768px){ .brand-logo.is-tall{max-height:46px;max-width:min(100%, 190px);} }
