.project-page { --case-bg:#050606; --case-text:#f2efe8; --case-muted:#a5aaa5; --case-line:rgba(242,239,232,.2); --case-gutter:clamp(20px,4vw,80px); color:var(--case-text); background:var(--case-bg); }
.project-page main { overflow:clip; }
.project-page a:focus-visible { outline:2px solid var(--case-text); outline-offset:6px; }
.project-page .skip-link { position:fixed; top:12px; left:12px; z-index:200; padding:14px 18px; color:var(--case-bg); background:var(--case-text); transform:translateY(-180%); }
.project-page .skip-link:focus { transform:translateY(0); }
.project-page .cryox-nav a[aria-current] { color:#ff6134; }
.case-text-link { display:inline-flex; align-items:center; gap:14px; min-height:44px; font-size:11px; font-weight:700; letter-spacing:.07em; }
.case-text-link:hover { text-decoration:underline; text-underline-offset:5px; }
.case-text-link span { font-size:22px; }
.case-hero { position:relative; padding:146px var(--case-gutter) 30px; isolation:isolate; }
.case-hero::before { content:""; position:absolute; inset:0; z-index:-1; pointer-events:none; opacity:.5; background:radial-gradient(ellipse at 75% 90%,rgba(107,124,117,.2),transparent 62%); }
.case-hero__topline { display:grid; grid-template-columns:1fr 1fr auto; align-items:center; gap:20px; padding-bottom:35px; font:600 11px/1.4 var(--sans); letter-spacing:.06em; text-transform:uppercase; }
.case-hero__topline > span:nth-child(2) { text-align:center; }
.case-hero__topline > span:last-child { color:var(--case-muted); }
.case-title { margin:0 0 36px -.055em; font:800 clamp(3.1rem,10.45vw,13rem)/.99 var(--display); letter-spacing:-.075em; }
.case-title__line { display:block; overflow:clip; padding-bottom:.04em; }
.case-title__line > span { display:block; }
.case-title__line:last-child { text-align:right; }
.case-hero__foot { display:flex; justify-content:space-between; align-items:center; gap:30px; border-top:1px solid var(--case-line); padding-top:14px; font:600 11px/1.5 var(--sans); text-transform:uppercase; letter-spacing:.055em; }
.case-cover { position:relative; height:78svh; min-height:420px; max-height:1000px; margin:0; overflow:hidden; background:#141816; }
.case-cover img { display:block; width:100%; height:100%; object-fit:cover; object-position:center 46%; filter:grayscale(1) contrast(1.03); }
.case-cover::after { content:""; position:absolute; inset:0; pointer-events:none; background:linear-gradient(transparent 65%,rgba(5,6,6,.65)); }
.case-cover figcaption { position:absolute; z-index:1; left:var(--case-gutter); right:var(--case-gutter); bottom:26px; display:flex; justify-content:space-between; gap:20px; font:700 10px/1.4 var(--sans); letter-spacing:.06em; text-transform:uppercase; }
.case-overview { display:grid; grid-template-columns:1fr 2fr; gap:9vw; padding:clamp(80px,10vw,180px) var(--case-gutter); scroll-margin-top:110px; }
.case-facts dl { margin:0; }
.case-facts dl > div { margin-bottom:32px; }
.case-facts dt,.case-facts h2 { color:var(--case-muted); font:600 10px/1.4 var(--sans); letter-spacing:.1em; margin:0 0 12px; }
.case-facts dd { margin:0; max-width:26ch; font:500 15px/1.55 var(--sans); }
.case-facts ul { margin:0; padding:0; list-style:none; }
.case-facts li { font:500 13px/1.6 var(--sans); padding:8px 0; border-bottom:1px solid var(--case-line); }
.case-story h2 { margin:-.12em 0 35px; max-width:17ch; font:600 clamp(2.25rem,4.3vw,5.7rem)/1.07 var(--display); letter-spacing:-.06em; }
.case-story p { margin:0 0 22px; max-width:55ch; font:400 clamp(16px,1.35vw,21px)/1.7 var(--sans); }
.case-story__approach { color:var(--case-muted); }
.case-gallery { padding:0 var(--case-gutter) clamp(80px,10vw,170px); }
.case-gallery__heading { border-top:1px solid var(--case-line); padding:20px 0 45px; display:flex; justify-content:space-between; align-items:center; gap:20px; }
.case-gallery__heading h2,.case-gallery__heading > span { font:600 10px/1.4 var(--sans); letter-spacing:.08em; margin:0; }
.case-gallery__heading > span { color:var(--case-muted); }
.case-gallery__grid { display:grid; grid-template-columns:.8fr 1fr; align-items:start; gap:9vw; }
.case-gallery__item { margin:0; min-width:0; }
.case-gallery__item--1 { margin-top:16vw; }
.case-gallery__frame { overflow:hidden; background:#141816; aspect-ratio:9 / 16; }
.case-gallery__frame img { display:block; width:100%; height:100%; object-fit:cover; }
.case-gallery__item figcaption { display:flex; gap:20px; padding-top:16px; font:500 10px/1.5 var(--sans); text-transform:uppercase; letter-spacing:.04em; }
.case-gallery__item figcaption span:first-child { color:var(--case-muted); }
.case-outro { padding:0 var(--case-gutter) clamp(90px,10vw,180px); }
.case-outro > p { margin:0 0 28px; color:var(--case-muted); font:600 10px/1.5 var(--sans); letter-spacing:.08em; }
.case-outro h2 { margin:0; font:800 clamp(2.45rem,6.9vw,9rem)/1.04 var(--display); letter-spacing:-.07em; }
.case-outro a { display:inline-block; text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:.13em; }
.case-outro a span { display:inline-block; padding-left:.15em; transition:transform .25s ease-out; }
.case-outro a:hover span { transform:translate(5px,-5px); }
.case-next { padding:0 var(--case-gutter) clamp(60px,8vw,120px); }
.case-next__top { display:flex; justify-content:space-between; gap:20px; padding:18px 0 26px; border-top:1px solid var(--case-line); }
.case-next__link { display:grid; grid-template-columns:1fr 1fr; gap:6vw; align-items:center; }
.case-next__image { overflow:hidden; aspect-ratio:4 / 3; background:#141816; }
.case-next__image img { display:block; width:100%; height:100%; object-fit:cover; filter:grayscale(1); transition:transform .45s cubic-bezier(.16,1,.3,1); }
.case-next__copy > span:first-child { font:600 11px/1.5 var(--sans); letter-spacing:.08em; color:var(--case-muted); }
.case-next__copy h2 { margin:24px 0; font:700 clamp(2.25rem,4.6vw,6rem)/1.06 var(--display); text-transform:uppercase; letter-spacing:-.06em; }
.case-next__arrow { font:400 5rem/1 var(--sans); display:inline-block; transition:transform .3s ease-out; }
.case-next__link:hover img,.case-next__link:focus-visible img { transform:scale(1.04); }
.case-next__link:hover .case-next__arrow { transform:translate(8px,-8px); }
@media (max-width:950px) {
  .case-hero { padding-top:124px; }
  .case-title { font-size:10.15vw; }
  .case-overview { grid-template-columns:1fr 1.7fr; gap:6vw; }
  .case-cover { height:62svh; }
}
@media (max-width:620px) {
  .case-hero { padding-top:108px; padding-bottom:22px; }
  .case-hero__topline { grid-template-columns:1fr auto; padding-bottom:30px; gap:10px; font-size:9px; }
  .case-hero__topline > span:nth-child(2) { display:none; }
  .case-title { margin-bottom:24px; font-size:10vw; line-height:1.12; letter-spacing:-.065em; }
  .case-hero__foot { align-items:flex-start; gap:15px; font-size:9px; }
  .case-hero__foot > span { max-width:23ch; padding-top:12px; }
  .case-text-link { font-size:10px; gap:9px; flex-shrink:0; }
  .case-cover { height:65svh; min-height:380px; }
  .case-cover figcaption { font-size:8px; bottom:20px; }
  .case-overview { display:flex; flex-direction:column; gap:48px; padding-block:65px; }
  .case-story { order:-1; }
  .case-story h2 { font-size:2.65rem; }
  .case-facts { display:grid; grid-template-columns:1fr 1fr; gap:0 24px; }
  .case-facts dl { grid-row:1 / 3; }
  .case-facts h2 { margin-top:0; }
  .case-facts li { font-size:12px; }
  .case-facts dd { font-size:13px; }
  .case-gallery__heading { padding-bottom:28px; }
  .case-gallery__heading h2,.case-gallery__heading > span { font-size:9px; }
  .case-gallery__grid { grid-template-columns:1fr; gap:38px; }
  .case-gallery__item--1 { width:86%; margin-top:0; }
  .case-gallery__item--2 { width:92%; justify-self:end; }
  .case-outro h2 { font-size:8.1vw; }
  .case-next__link { grid-template-columns:1fr; gap:26px; }
  .case-next__copy { position:relative; padding-right:50px; }
  .case-next__copy h2 { margin:16px 0 0; font-size:2.35rem; }
  .case-next__arrow { position:absolute; right:0; top:20px; font-size:3rem; }
}
@media (prefers-reduced-motion:reduce) {
  .project-page *, .project-page *::before, .project-page *::after { transition:none !important; }
  .case-next__link:hover img,.case-next__link:focus-visible img,.case-outro a:hover span,.case-next__link:hover .case-next__arrow { transform:none; }
}

@media (max-width:1180px) {
  .case-hero { padding-top:120px; }
  .case-hero__topline,.case-hero__foot { font-size:11px; line-height:1.5; }
  .case-text-link { font-size:12px; }
  .case-cover figcaption,.case-gallery__heading h2,.case-gallery__heading > span,.case-gallery__item figcaption { font-size:11px; line-height:1.5; }
  .case-facts dt,.case-facts h2 { font-size:11px; }
  .case-facts dd,.case-facts li { font-size:14px; }
  .case-story h2 { line-height:1.12; }
  .case-next__copy { min-width:0; }
  .case-next__copy h2 { overflow-wrap:anywhere; }
}
@media (max-width:700px) {
  .case-hero { padding-top:100px; }
  .case-hero__topline { grid-template-columns:1fr auto; padding-bottom:24px; }
  .case-hero__topline > span:nth-child(2) { display:none; }
  .case-title { font-size:10vw; line-height:1.14; margin-bottom:28px; }
  .case-hero__foot { align-items:flex-start; gap:12px; }
  .case-hero__foot > span { max-width:23ch; padding-top:10px; }
  .case-text-link { font-size:11px; gap:8px; }
  .case-cover { height:65svh; min-height:360px; }
  .case-overview { display:flex; flex-direction:column; gap:44px; padding-block:64px; }
  .case-story { order:-1; }
  .case-story h2 { font-size:clamp(32px,9.4vw,52px); }
  .case-facts { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:0 20px; }
  .case-facts dl { grid-row:1 / 3; }
  .case-gallery__grid { grid-template-columns:1fr; gap:36px; }
  .case-gallery__item--1 { width:86%; margin:0; }
  .case-gallery__item--2 { width:92%; justify-self:end; }
  .case-next__link { grid-template-columns:minmax(0,1fr); gap:26px; }
  .case-next__copy { position:relative; padding-right:42px; }
  .case-next__copy h2 { font-size:clamp(30px,8vw,46px); }
  .case-next__arrow { position:absolute; right:0; top:20px; font-size:40px; }
}