.case{position:fixed;inset:0;z-index:40;background:var(--ink);color:var(--paper);display:flex;flex-direction:column;--case:#c1d4dc}
.case[hidden]{display:none}
.case-bar{position:absolute;z-index:5;top:0;left:0;right:0;height:72px;padding:0 var(--gutter);display:flex;align-items:center;gap:24px;font-size:12px;letter-spacing:1.3px;color:var(--ink);transition:background .3s,color .3s}
.case-bar.is-solid{background:#071923f2;color:var(--paper);border-bottom:1px solid var(--line)}
.case-close{display:inline-flex;gap:14px;align-items:center;background:transparent;color:inherit;font-size:12px;letter-spacing:1.3px;padding:10px 0}
.case-close span{font:22px Arial,sans-serif;line-height:1;transition:transform .3s}.case-close:hover span{transform:translateX(-5px)}
.case-count{margin-left:auto}
.case-nav{display:flex;gap:8px}.case-nav button{width:40px;height:40px;border:1px solid currentColor;border-radius:50%;background:transparent;color:inherit;font:20px Arial,sans-serif;line-height:1;transition:background .25s,color .25s}
.case-nav button:hover{background:var(--paper);color:var(--ink);border-color:var(--paper)}
.case-progress{position:absolute;left:0;right:0;bottom:0;height:2px;background:transparent}.case-progress i{display:block;height:100%;background:var(--case);transform:scaleX(0);transform-origin:left}
.case-bar:not(.is-solid) .case-progress i{background:var(--ink)}
.case-scroll{flex:1;overflow-y:auto;overscroll-behavior:contain;scroll-behavior:auto;outline:0}
.case :focus-visible{outline:2px solid var(--accent);outline-offset:6px}

.c-hero{position:relative;min-height:100svh;background:var(--case);color:var(--ink);padding:132px var(--gutter) 0;overflow:hidden;display:flex;flex-direction:column}
.c-hero .eyebrow{color:#07192399}
.c-hero h2{font-size:clamp(54px,9.4vw,168px);letter-spacing:-.055em;line-height:.88;margin:22px 0 0;max-width:15ch;font-weight:800}
.c-tag{font-family:FuturaLight,Arial,sans-serif;font-size:clamp(20px,2.2vw,32px);margin-top:26px;max-width:30ch;line-height:1.2}
.c-facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;margin:44px 0 0;padding-top:20px;border-top:1px solid #07192330}
.c-facts dt{font-size:10px;letter-spacing:1.4px;color:#07192388}.c-facts dd{margin:7px 0 0;font-size:15px;line-height:1.3}
.c-hero-img{margin:48px auto 0;width:min(1100px,100%);flex:1;min-height:260px;position:relative;overflow:hidden;border-radius:10px 10px 0 0;box-shadow:0 -10px 60px #07192326}
.c-hero-img img{width:100%;height:100%;min-height:260px;object-fit:cover;object-position:top;will-change:transform}
.c-scroll{position:absolute;right:var(--gutter);top:132px;font-size:10px;letter-spacing:1.4px;color:#07192399;writing-mode:vertical-rl}

.c-story{padding:clamp(90px,14vw,200px) var(--gutter) clamp(70px,10vw,140px)}
.c-lead{font-size:clamp(34px,5.4vw,86px);line-height:1.04;letter-spacing:-.04em;max-width:17ch;font-weight:500}
.c-w{opacity:.2;transition:opacity .35s}.c-w.is-lit{opacity:1}
.c-story-p{font-family:FuturaLight,Arial,sans-serif;font-size:clamp(18px,1.6vw,23px);line-height:1.55;color:#bbc9cd;max-width:44ch;margin:56px 0 0 auto}

.c-points{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(24px,5vw,90px);padding:0 var(--gutter);align-items:start}
.c-stage{position:sticky;top:96px;height:calc(100svh - 128px);display:flex;flex-direction:column;justify-content:center;gap:16px}
.c-device{position:relative;flex:none;width:100%;aspect-ratio:16/10;max-height:calc(100svh - 190px);background:var(--case);border-radius:18px;overflow:hidden;box-shadow:0 30px 80px #0006}
.c-device img{position:absolute;inset:4%;width:92%;height:92%;object-fit:contain;opacity:0;transform:scale(.96) translateY(14px);transition:opacity .55s,transform .7s cubic-bezier(.2,.7,.2,1);border-radius:6px}
.c-device img.is-on{opacity:1;transform:none}
.c-step-label{font-size:11px;letter-spacing:1.4px;color:var(--muted)}
.c-steps{list-style:none;margin:0;padding:0}
.c-steps li{min-height:88svh;display:flex;flex-direction:column;justify-content:center;padding:40px 0;opacity:.28;transition:opacity .5s}
.c-steps li.is-active{opacity:1}
.c-num{font-size:clamp(70px,9vw,150px);font-weight:800;letter-spacing:-.06em;line-height:.8;color:var(--case)}
.c-k{font-size:11px;letter-spacing:1.6px;color:var(--muted);margin-top:26px}
.c-steps h3{font-size:clamp(28px,3vw,46px);letter-spacing:-.03em;line-height:1.08;margin:14px 0 18px;font-weight:500}
.c-steps p{font-family:FuturaLight,Arial,sans-serif;font-size:clamp(17px,1.4vw,21px);line-height:1.55;color:#bbc9cd;max-width:36ch}
.c-inline{display:none}

.c-metrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:0;margin:clamp(70px,10vw,150px) var(--gutter) 0;border-top:1px solid var(--line)}
.c-metrics>div{padding:34px 24px 34px 0;border-right:1px solid var(--line)}.c-metrics>div:last-child{border-right:0}.c-metrics>div+div{padding-left:24px}
.c-metrics b{display:block;font-size:clamp(60px,8vw,130px);font-weight:800;letter-spacing:-.06em;line-height:.9;color:var(--case);font-variant-numeric:tabular-nums}
.c-metrics span{display:block;margin-top:14px;font-size:13px;letter-spacing:.4px;color:var(--muted);max-width:24ch;line-height:1.4}

.c-meta{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,6vw,90px);padding:clamp(70px,9vw,130px) var(--gutter) 0}
.c-meta .eyebrow{color:var(--muted);margin-bottom:14px}.c-meta p:not(.eyebrow){font-family:FuturaLight,Arial,sans-serif;font-size:19px;line-height:1.55;max-width:44ch}

.c-gallery{padding:clamp(70px,9vw,130px) 0 0}
.c-gallery-head{display:flex;justify-content:space-between;align-items:baseline;padding:0 var(--gutter) 24px;font-size:10px;letter-spacing:1.4px;color:var(--muted)}.c-gallery-head h3{font-size:clamp(28px,3vw,44px);letter-spacing:-.03em;color:var(--paper);font-weight:500}
.c-strip{display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x proximity;padding:0 var(--gutter) 18px;scrollbar-width:thin;scrollbar-color:#8aa6b0 #122a33;overscroll-behavior-x:contain}
.c-strip figure{flex:0 0 min(70vw,760px);margin:0;scroll-snap-align:start}
.c-strip img{width:100%;aspect-ratio:16/10;object-fit:contain;background:var(--case);border-radius:8px}
.c-strip figcaption{margin-top:12px;font-size:10px;letter-spacing:1.2px;color:var(--muted)}

.c-end{margin-top:clamp(80px,10vw,150px);padding:60px var(--gutter) 70px;background:var(--case);color:var(--ink);display:grid;gap:30px}
.c-end>a,.c-end>button{color:inherit}
.c-cta,.c-talk{font-size:12px;letter-spacing:1.3px;border-bottom:1px solid #07192380;padding-bottom:8px;justify-self:start;display:inline-flex;gap:26px;align-items:center}
.c-cta span,.c-talk span{font:24px Arial,sans-serif}
.c-next{display:grid;grid-template-columns:1fr auto;align-items:end;background:transparent;text-align:left;border-top:1px solid #07192330;padding:30px 0 0}
.c-next small{grid-column:1/-1;font-size:10px;letter-spacing:1.5px;color:#07192399}
.c-next strong{font-size:clamp(34px,6vw,96px);font-weight:700;letter-spacing:-.05em;line-height:1;transition:transform .4s cubic-bezier(.2,.7,.2,1)}
.c-next span{font:clamp(40px,6vw,90px) Arial,sans-serif;transition:transform .4s cubic-bezier(.2,.7,.2,1)}
.c-next:hover strong{transform:translateX(12px)}.c-next:hover span{transform:translateX(10px)}

@media(max-width:900px){
  .c-hero{padding-top:110px}.c-scroll{display:none}
  .c-facts{grid-template-columns:1fr 1fr}
  .c-points{display:block}.c-stage{display:none}
  .c-steps li{min-height:0;opacity:1;padding:56px 0 0}.c-inline{display:block;width:100%;margin-top:26px;border-radius:8px;background:var(--case);aspect-ratio:16/10;object-fit:contain}
  .c-steps p{max-width:none}
  .c-metrics{grid-template-columns:1fr 1fr}.c-metrics>div,.c-metrics>div+div{padding:26px 12px 26px 0;border-right:0;border-bottom:1px solid var(--line)}
  .c-meta{grid-template-columns:1fr}
  .c-story-p{margin-left:0}
  .case-count{display:none}.case-nav{margin-left:auto}
}
@media(max-height:600px){.c-hero{min-height:0;padding-bottom:40px}.c-stage{position:static;height:auto}}
@media(prefers-reduced-motion:reduce){.c-w{opacity:1;transition:none}.c-device img,.c-steps li{transition:none}.c-hero-img img{transform:none!important}}

body.case-open .reading-progress,body.case-open .cursor-dot{display:none}
