.case-page{--case-accent:#ff5c35;background:var(--ink);color:var(--bone)}
.case-page::after{content:"";position:absolute;inset:5.25rem 0 auto;height:30rem;z-index:-1;pointer-events:none;background:linear-gradient(105deg,color-mix(in srgb,var(--case-accent) 9%,transparent),transparent 42%);opacity:.65;mask-image:linear-gradient(#000,transparent)}
.case-header{position:relative;z-index:100;display:flex;align-items:center;justify-content:space-between;gap:.8rem;min-height:5.25rem;border-bottom:1px solid var(--line)}
.case-top-nav{display:flex;align-items:center;gap:.6rem}
.case-top-nav>a:first-child{display:none;align-items:center;min-height:2.75rem;padding-inline:.65rem;color:var(--bone-2);font-size:.72rem;font-weight:700}
.case-top-nav>a:first-child:hover{color:var(--case-accent)}
.case-top-nav .header-cta{font-size:.67rem}
.case-page .status-dot{background:var(--case-accent);box-shadow:0 0 0 .22rem color-mix(in srgb,var(--case-accent) 14%,transparent)}

.case-hero{padding-block:clamp(2.1rem,7vw,5.8rem) clamp(3rem,9vw,6rem)}
.case-breadcrumb{display:flex;flex-wrap:wrap;align-items:center;gap:.55rem;margin-bottom:clamp(2.2rem,7vw,4.8rem);color:var(--muted);font-size:.68rem}
.case-breadcrumb a{display:inline-flex;align-items:center;min-height:2.75rem}
.case-breadcrumb a:hover{color:var(--bone)}
.case-breadcrumb b{color:var(--case-accent);font-family:var(--font-mono);font-weight:600}
.case-hero-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:2.2rem}
.case-identity,.case-intro{min-width:0}
.case-kicker{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.6rem 1.2rem;margin-bottom:1.25rem;padding-bottom:.8rem;border-bottom:1px solid var(--line);color:var(--case-accent);font-family:var(--font-mono);font-size:.56rem;letter-spacing:.07em}
.case-kicker span:last-child{color:var(--muted)}
.case-identity h1{margin:0;line-height:.9;letter-spacing:-.065em}
.case-identity h1>span{display:block;max-width:100%;font-family:var(--font-display);font-size:clamp(2.55rem,12.1vw,8.6rem);font-weight:700;overflow-wrap:anywhere;text-transform:uppercase}
.case-identity h1>small{display:block;margin-top:1.25rem;color:var(--bone-2);font-family:var(--font-fa);font-size:clamp(1.15rem,4vw,2rem);font-weight:750;letter-spacing:-.035em;line-height:1.45}
.case-intro{align-self:end}
.case-intro>p{max-width:33rem;margin:0;color:var(--bone-2);font-size:clamp(1.05rem,3.2vw,1.45rem);font-weight:550;line-height:1.9}
.case-actions{display:grid;grid-template-columns:minmax(0,1fr);gap:.65rem;margin-top:1.65rem}
.case-button{display:inline-flex;align-items:center;justify-content:space-between;gap:1rem;min-height:3.35rem;padding:.72rem 1rem;border:1px solid var(--line);color:var(--bone);font-size:.74rem;font-weight:780;transition:transform .2s var(--ease),background-color .2s ease,border-color .2s ease,color .2s ease}
.case-button svg{width:1.05rem;height:1.05rem;flex:none;fill:none;stroke:currentColor;stroke-width:1.7}
.case-button:hover{transform:translateY(-2px);border-color:var(--bone)}
.case-button-live{background:var(--case-accent);border-color:var(--case-accent);color:var(--ink)}
.case-button-live:hover{background:var(--bone);border-color:var(--bone)}
.case-meta{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));margin-top:clamp(2.2rem,7vw,4rem);border-block:1px solid var(--line)}
.case-meta>div{min-width:0;padding:1rem .65rem;border-bottom:1px solid var(--line);border-inline-start:1px solid var(--line)}
.case-meta>div:nth-child(odd){border-inline-start:0}
.case-meta>div:nth-last-child(-n+2){border-bottom:0}
.case-meta span,.case-meta strong{display:block}
.case-meta span{margin-bottom:.45rem;color:var(--case-accent);font-family:var(--font-mono);font-size:.52rem;letter-spacing:.06em}
.case-meta strong{color:var(--bone-2);font-family:var(--font-display);font-size:.58rem;font-weight:500;line-height:1.55;overflow-wrap:anywhere}

.case-evidence{padding-bottom:clamp(2rem,7vw,4.5rem)}
.case-capture,.case-schematic{margin:0;border:1px solid var(--line);background:var(--ink-2);overflow:hidden}
.capture-bar{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.72rem .85rem;border-bottom:1px solid var(--line);color:var(--muted);font-family:var(--font-mono);font-size:.5rem;letter-spacing:.05em}
.capture-bar span:first-child{color:var(--case-accent)}
.capture-frame{position:relative;aspect-ratio:1200/683;overflow:hidden;background:#111}
.capture-frame::after{content:"";position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 0 1px rgba(0,0,0,.28)}
.capture-frame img{width:100%;height:100%;object-fit:cover;object-position:top center}
.case-capture figcaption,.case-schematic figcaption{display:grid;gap:.35rem;padding:.85rem;border-top:1px solid var(--line)}
.case-capture figcaption span,.case-schematic figcaption span{color:var(--case-accent);font-family:var(--font-mono);font-size:.53rem}
.case-capture figcaption p,.case-schematic figcaption p{margin:0;color:var(--muted);font-size:.7rem}
.schematic-canvas{position:relative;aspect-ratio:1200/675;min-height:14rem;background:var(--ink-3);overflow:hidden}
.schematic-canvas::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(to bottom,transparent 0,transparent 3px,rgba(0,0,0,.18) 4px);pointer-events:none}
.schematic-canvas svg{width:100%;height:100%;direction:ltr}
.schematic-grid path{fill:none;stroke:var(--line-soft);stroke-width:1}
.schematic-muted,.schematic-live{fill:none;stroke-linejoin:miter;stroke-linecap:square}
.schematic-muted{stroke:rgba(233,230,220,.18);stroke-width:12}
.schematic-live{stroke:var(--case-accent);stroke-width:4;stroke-dasharray:.82 .18}
.schematic-nodes rect{fill:var(--ink);stroke:var(--bone);stroke-width:3}
.schematic-title{fill:var(--bone);font-family:var(--font-display);font-size:clamp(1.2rem,3.2vw,2.9rem);font-weight:700;letter-spacing:-.04em}
.schematic-code,.schematic-axis{fill:var(--muted);font-family:var(--font-mono);font-size:.72rem;letter-spacing:.08em}
.schematic-axis{fill:var(--case-accent)}

.case-fact-ledger{display:grid;grid-template-columns:minmax(0,1fr);padding-bottom:clamp(4rem,11vw,7rem)}
.case-fact-ledger>div{display:grid;grid-template-columns:minmax(5.5rem,.38fr) minmax(0,1fr);gap:1rem;padding:1rem 0;border-top:1px solid var(--line)}
.case-fact-ledger>div:last-child{border-bottom:1px solid var(--line)}
.case-fact-ledger span{color:var(--muted);font-size:.7rem}
.case-fact-ledger strong{font-size:.8rem;font-weight:650;line-height:1.75}

.case-system{padding-block:clamp(4.5rem,12vw,8rem);background:var(--bone);color:var(--ink)}
.system-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:2.8rem}
.system-grid>header .case-eyebrow{color:var(--signal-dark)}
.system-grid>header h2{max-width:11ch;margin:0;font-size:clamp(2.15rem,8vw,5.7rem);line-height:1.08;letter-spacing:-.06em}
.system-grid>header p{max-width:35rem;margin:1.2rem 0 0;color:#555650;font-size:.86rem;line-height:1.95}
.case-eyebrow{display:block;margin-bottom:.8rem;color:var(--case-accent);font-family:var(--font-mono);font-size:.56rem;letter-spacing:.08em}
.case-flow{list-style:none;margin:0;padding:0;border-bottom:1px solid rgba(11,12,10,.22)}
.case-flow li{display:grid;grid-template-columns:3.2rem minmax(0,1fr);gap:1rem;padding:1.35rem 0;border-top:1px solid rgba(11,12,10,.22)}
.flow-code{color:var(--signal-dark);font-family:var(--font-mono);font-size:.58rem}
.case-flow h3{margin:0 0 .35rem;font-size:1rem;line-height:1.5}
.case-flow p{max-width:38rem;margin:0;color:#555650;font-size:.78rem;line-height:1.85}

.case-narrative{padding-block:clamp(4.5rem,12vw,8rem)}
.case-chapter{position:relative;display:grid;grid-template-columns:2.5rem minmax(0,1fr);gap:1.1rem;padding-block:clamp(2.4rem,7vw,4.4rem);border-top:1px solid var(--line)}
.case-chapter:last-child{border-bottom:1px solid var(--line)}
.chapter-marker{display:flex;flex-direction:column;align-items:center;gap:.75rem;padding-top:.25rem}
.chapter-marker span{color:var(--case-accent);font-family:var(--font-mono);font-size:.58rem}
.chapter-marker i{width:1px;height:100%;min-height:2rem;background:linear-gradient(var(--case-accent),transparent)}
.case-chapter header{min-width:0}
.case-chapter header>span{display:block;margin-bottom:.75rem;color:var(--muted);font-family:var(--font-mono);font-size:.55rem;letter-spacing:.08em}
.case-chapter h2{max-width:17ch;margin:0;font-size:clamp(1.65rem,5.7vw,3.8rem);line-height:1.3;letter-spacing:-.045em}
.chapter-copy{grid-column:2;max-width:46rem}
.chapter-copy p{margin:0;color:var(--bone-2);font-size:.9rem;line-height:2.05}
.chapter-copy p+p{margin-top:1rem}
.case-chapter:last-child h2{color:var(--case-accent)}

.case-gallery{padding-bottom:clamp(4.5rem,12vw,8rem)}
.case-gallery>header{display:grid;gap:.6rem;margin-bottom:2rem}
.case-gallery h2{max-width:13ch;margin:0;font-size:clamp(2rem,7vw,4.5rem);line-height:1.15;letter-spacing:-.055em}
.gallery-grid{display:grid;gap:1rem}
.gallery-grid figure{margin:0;border:1px solid var(--line);background:var(--ink-2)}
.gallery-grid img{width:100%;height:auto;aspect-ratio:1200/683;object-fit:cover;object-position:top center}
.gallery-grid figcaption{padding:.85rem;border-top:1px solid var(--line);color:var(--muted);font-family:var(--font-mono);font-size:.56rem;direction:ltr}

.case-output{padding-bottom:clamp(4.5rem,12vw,8rem)}
.output-heading{display:grid;gap:.85rem;margin-bottom:2.4rem}
.output-heading h2{max-width:13ch;margin:0;font-size:clamp(2rem,7vw,4.5rem);line-height:1.15;letter-spacing:-.055em}
.output-heading p{max-width:38rem;margin:0;color:var(--muted);font-size:.83rem}
.deliverable-list{list-style:none;margin:0;padding:0;border-bottom:1px solid var(--line)}
.deliverable-list li{display:grid;grid-template-columns:2.8rem minmax(0,1fr);gap:1rem;align-items:center;min-height:4.5rem;border-top:1px solid var(--line)}
.deliverable-list span{color:var(--case-accent);font-family:var(--font-mono);font-size:.58rem}
.deliverable-list strong{font-size:.85rem;font-weight:680}
.capability-band{margin-top:2rem;border:1px solid var(--line);background:var(--ink-2)}
.capability-band>span{display:block;padding:.7rem .8rem;border-bottom:1px solid var(--line);color:var(--muted);font-family:var(--font-mono);font-size:.52rem}
.capability-band ul{display:flex;flex-wrap:wrap;gap:0;list-style:none;margin:0;padding:0}
.capability-band li{flex:1 1 50%;min-width:0;padding:.8rem;border-bottom:1px solid var(--line);border-inline-start:1px solid var(--line);color:var(--case-accent);font-family:var(--font-display);font-size:.61rem;font-weight:600;letter-spacing:.04em}

.case-contact{padding-block:clamp(3rem,9vw,6rem);border-block:1px solid var(--line)}
.case-contact h2{max-width:12ch;margin:0;font-size:clamp(2.2rem,8vw,5.2rem);line-height:1.1;letter-spacing:-.06em}
.case-contact p{max-width:42rem;margin:1.2rem 0 2rem;color:var(--bone-2);font-size:.9rem;line-height:2}
.case-contact .case-button{width:100%;max-width:27rem}
.case-pagination{display:grid;grid-template-columns:minmax(0,1fr);border-bottom:1px solid var(--line)}
.case-pagination a{display:flex;flex-direction:column;justify-content:center;min-height:7.5rem;padding:1.2rem 0;border-top:1px solid var(--line);transition:padding .2s var(--ease),background-color .2s ease,color .2s ease}
.case-pagination a:hover{padding-inline:1rem;background:var(--bone);color:var(--ink)}
.case-pagination a:last-child{text-align:left;align-items:flex-end}
.case-pagination span{margin-bottom:.6rem;color:var(--case-accent);font-family:var(--font-mono);font-size:.55rem}
.case-pagination strong{font-size:1rem;line-height:1.5}
.case-footer{display:grid;gap:1rem;padding-block:2rem;color:var(--muted);font-size:.66rem}
.case-footer p{margin:0}
.case-footer>a:last-child{display:inline-flex;align-items:center;min-height:2.75rem}
.case-footer>a:last-child:hover{color:var(--bone)}

@media (min-width:30rem){
  .case-actions{grid-template-columns:repeat(2,minmax(0,1fr))}
  .case-top-nav>a:first-child{display:inline-flex}
  .case-capture figcaption,.case-schematic figcaption{grid-template-columns:9rem minmax(0,1fr);align-items:center}
  .case-fact-ledger{grid-template-columns:repeat(2,minmax(0,1fr))}
  .case-fact-ledger>div{padding-inline:1rem;border-inline-start:1px solid var(--line)}
  .case-fact-ledger>div:nth-child(odd){border-inline-start:0}
  .case-fact-ledger>div:nth-last-child(-n+2){border-bottom:1px solid var(--line)}
  .capability-band li{flex-basis:33.333%}
}

@media (min-width:48rem){
  .case-hero-grid{grid-template-columns:minmax(0,1.35fr) minmax(18rem,.65fr);gap:clamp(2rem,6vw,6rem);align-items:end}
  .case-actions>:last-child:nth-child(3){grid-column:1/-1}
  .case-meta{grid-template-columns:repeat(4,minmax(0,1fr))}
  .case-meta>div,.case-meta>div:nth-child(odd),.case-meta>div:nth-last-child(-n+2){border-bottom:0;border-inline-start:1px solid var(--line)}
  .case-meta>div:first-child{border-inline-start:0}
  .case-meta>div{padding:1.1rem}
  .case-fact-ledger{grid-template-columns:repeat(4,minmax(0,1fr))}
  .case-fact-ledger>div,.case-fact-ledger>div:nth-child(odd){display:block;padding:1rem 1.2rem;border-inline-start:1px solid var(--line);border-bottom:1px solid var(--line)}
  .case-fact-ledger>div:first-child{border-inline-start:0}
  .case-fact-ledger span,.case-fact-ledger strong{display:block}
  .case-fact-ledger strong{margin-top:.55rem}
  .case-flow li{grid-template-columns:4.2rem minmax(0,1fr);padding:1.6rem 0}
  .case-chapter{grid-template-columns:3.5rem minmax(14rem,.78fr) minmax(0,1fr);gap:clamp(1.5rem,4vw,4rem)}
  .chapter-copy{grid-column:3}
  .case-chapter:nth-child(even) header{grid-column:3}.case-chapter:nth-child(even) .chapter-copy{grid-column:2;grid-row:1}.case-chapter:nth-child(even) .chapter-marker{grid-column:1;grid-row:1}
  .case-chapter:nth-child(even) .chapter-copy p:first-child::first-letter{color:var(--case-accent)}
  .deliverable-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
  .deliverable-list li:nth-child(even){padding-inline-start:1.2rem;border-inline-start:1px solid var(--line)}
  .capability-band li{flex-basis:20%}
  .case-pagination{grid-template-columns:repeat(2,minmax(0,1fr))}
  .case-pagination a{border-top:0;padding:1.5rem}
  .case-pagination a:last-child{border-inline-start:1px solid var(--line)}
  .case-footer{grid-template-columns:1fr auto auto;align-items:center;gap:2rem}
}

@media (min-width:48rem) and (max-width:63.99rem){
  .case-identity h1>span{font-size:clamp(3rem,8.4vw,4.5rem)}
  .case-identity .case-title--compact>span{font-size:clamp(2.75rem,6.2vw,3.5rem)}
}

@media (min-width:64rem){
  .case-identity .case-title--compact>span{font-size:clamp(3.2rem,6vw,4.25rem)}
  .system-grid{grid-template-columns:minmax(20rem,.68fr) minmax(0,1fr);gap:clamp(4rem,8vw,8rem);align-items:start}
  .system-grid>header{position:sticky;top:2rem}
  .case-flow{border-top:0}
  .case-flow li:first-child{border-top:0}
  .case-narrative{padding-inline:clamp(2rem,5vw,6rem)}
  .case-chapter{padding-block:5rem}
  .output-heading{grid-template-columns:minmax(0,1fr) minmax(18rem,.55fr);align-items:end}
  .output-heading .case-eyebrow{grid-column:1/-1}
  .output-heading p{justify-self:end}
}

@media (max-width:23.5rem){
  .case-identity h1>span{font-size:clamp(2.15rem,11vw,2.7rem)}
  .case-meta{grid-template-columns:minmax(0,1fr)}
  .case-meta>div,.case-meta>div:nth-child(odd),.case-meta>div:nth-last-child(-n+2){border-inline-start:0;border-bottom:1px solid var(--line)}
  .case-meta>div:last-child{border-bottom:0}
  .case-top-nav>a:first-child{display:none}
}

@media (prefers-reduced-motion:reduce){
  .schematic-live{stroke-dasharray:none}
  .case-button,.case-pagination a{transition:none}
}