@font-face{font-family:"Clash Display";src:url("../assets/fonts/ClashDisplay-Variable.woff2") format("woff2");font-display:swap;font-weight:200 700}
@font-face{font-family:"Satoshi";src:url("../assets/fonts/Satoshi-Variable.woff2") format("woff2");font-display:swap;font-weight:300 900}
:root{--bg:#08080a;--surface:#101012;--ink:#f2f1ec;--muted:#aaa79f;--faint:#696761;--champagne:#c9a06c;--red:#e0443c;--line:rgba(201,160,108,.22)}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--bg)}
body{margin:0;background:var(--bg);color:var(--ink);font-family:"Satoshi",sans-serif;font-size:16px;overflow-x:hidden}
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:20;opacity:.05;background-image:url("../assets/poster.jpg");background-size:cover;mix-blend-mode:screen}
a{color:inherit;text-decoration:none}
img,video{display:block;max-width:100%}
button,a{outline-offset:5px}
:focus-visible{outline:2px solid var(--champagne)}
.case-nav{position:absolute;z-index:10;inset:0 0 auto;display:flex;align-items:center;justify-content:space-between;padding:1.4rem clamp(1.1rem,4vw,4.5rem);border-bottom:1px solid rgba(255,255,255,.12)}
.case-nav__brand{width:clamp(118px,10vw,170px)}
.case-nav__brand img{width:100%;height:auto}
.case-nav nav{display:flex;align-items:center;gap:clamp(1rem,3vw,2.8rem);font-size:.72rem;font-weight:750;letter-spacing:.045em}
.case-nav nav a:last-child{padding:.7rem 1rem;border:1px solid rgba(242,241,236,.32);transition:background .25s,color .25s,border-color .25s}
.case-nav nav a:last-child:hover{border-color:var(--champagne);background:var(--champagne);color:#08080a}
.case-hero{min-height:100svh;display:grid;grid-template-columns:minmax(0,1.28fr) minmax(340px,.72fr);border-bottom:1px solid var(--line)}
.case-hero__visual{position:relative;min-height:100svh;display:grid;place-items:center;overflow:hidden;background:#050506}
.case-hero__visual::after{content:"";position:absolute;inset:0;pointer-events:none;box-shadow:inset -80px 0 120px rgba(0,0,0,.38)}
.case-hero__visual img,.case-hero__visual video{width:100%;height:100svh;object-fit:cover}
.case--reel .case-hero__visual{padding:clamp(6.5rem,10vh,8rem) clamp(1rem,7vw,8rem) clamp(2rem,5vh,4rem)}
.case--reel .case-hero__visual img,.case--reel .case-hero__visual video{width:auto;height:min(82svh,900px);max-width:100%;aspect-ratio:9/16;object-fit:cover;background:#030304}
.case-hero__copy{min-width:0;display:flex;flex-direction:column;justify-content:flex-end;padding:clamp(7rem,15vh,10rem) clamp(1.5rem,5vw,5rem) clamp(2rem,6vh,5rem);background:var(--surface)}
.case-identity{margin:1.35rem 0 0;color:var(--champagne);font-size:.68rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase}
.case-hero h1{max-width:10ch;margin:0;font:620 clamp(3rem,4.5vw,4rem)/.88 "Clash Display",sans-serif;letter-spacing:-.04em;overflow-wrap:anywhere;text-wrap:balance}
.case-lead{max-width:65ch;margin:2rem 0 0;color:var(--muted);font-size:clamp(1rem,1.3vw,1.2rem);line-height:1.65}
.case-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0;margin:clamp(2rem,5vh,4rem) 0 0;border-top:1px solid var(--line)}
.case-facts>div{padding:1rem 0;border-bottom:1px solid var(--line)}
.case-facts>div:nth-child(odd){padding-right:1rem}
.case-facts dt{color:var(--faint);font-size:.6rem;font-weight:750;letter-spacing:.1em;text-transform:uppercase}
.case-facts dd{margin:.35rem 0 0;font-size:.85rem}
.case-visit{align-self:flex-start;margin-top:1.8rem;padding-bottom:.3rem;border-bottom:1px solid var(--champagne);color:var(--champagne);font-size:.8rem;font-weight:750}
.case-story{display:grid;grid-template-columns:minmax(260px,.8fr) minmax(0,1.2fr);gap:clamp(2rem,10vw,10rem);padding:clamp(5rem,11vw,11rem) clamp(1.2rem,7vw,7rem);border-bottom:1px solid var(--line)}
.case-story h2{max-width:8ch;margin:0;font:580 clamp(3rem,6vw,6rem)/.92 "Clash Display",sans-serif;letter-spacing:-.04em;text-wrap:balance}
.case-story>div{align-self:end;max-width:70ch}
.case-story p{margin:0;color:var(--muted);font-size:clamp(1.05rem,1.6vw,1.35rem);line-height:1.75}
.case-services{display:flex;flex-wrap:wrap;gap:.55rem;margin:2rem 0 0;padding:0;list-style:none}
.case-services li{padding:.55rem .75rem;border:1px solid var(--line);color:var(--ink);font-size:.72rem}
.case-gallery{padding:clamp(4rem,8vw,8rem) clamp(1rem,4vw,4rem)}
.case-gallery h2{margin:0 0 clamp(2rem,5vw,5rem);font:580 clamp(2.8rem,6vw,6rem)/.92 "Clash Display",sans-serif;letter-spacing:-.04em}
.case-contact-sheet{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(.7rem,1.5vw,1.5rem);align-items:start}
.case-frame{grid-column:span 7;margin:0;background:#030304;overflow:hidden}
.case-frame:nth-child(3n+2){grid-column:6/span 7}
.case-frame:nth-child(3n){grid-column:3/span 8}
.case-frame img,.case-frame video{width:100%;max-height:88svh;object-fit:cover;background:#030304}
.case-frame--reel{grid-column:span 4}
.case-frame--reel:nth-child(3n+2){grid-column:5/span 4}
.case-frame--reel:nth-child(3n){grid-column:9/span 4}
.case-frame--reel img,.case-frame--reel video{aspect-ratio:9/16;object-fit:cover}
.case-frame figcaption{display:flex;justify-content:space-between;gap:1rem;padding:.75rem 0;color:var(--faint);font-size:.62rem;letter-spacing:.08em;text-transform:uppercase}
.case-close{min-height:78svh;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;padding:clamp(5rem,10vw,10rem) clamp(1.2rem,8vw,8rem);border-top:1px solid var(--line);background:#0b0b0d}
.case-close p{margin:0 0 1rem;color:var(--champagne);font-size:.75rem;font-weight:750}
.case-close h2{max-width:12ch;margin:0;font:610 clamp(3.5rem,8vw,6rem)/.88 "Clash Display",sans-serif;letter-spacing:-.04em;text-wrap:balance}
.case-close a{margin-top:2.2rem;padding:.85rem 1rem;background:var(--red);color:#08080a;font-weight:850}
.case-footer{display:grid;grid-template-columns:auto 1fr auto;align-items:end;gap:2rem;padding:2rem clamp(1.2rem,4vw,4rem);border-top:1px solid var(--line);color:var(--muted);font-size:.68rem}
.case-footer>img{width:130px}.case-footer p{margin:0}.case-footer nav{display:flex;gap:1rem}
@keyframes frame-in{from{clip-path:inset(0 0 100% 0)}to{clip-path:inset(0)}}
.case-hero__visual>*{animation:frame-in 1.05s cubic-bezier(.16,1,.3,1) both}
@media(max-width:900px){.case-hero{grid-template-columns:1fr}.case-hero__visual{min-height:72svh}.case-hero__visual img,.case-hero__visual video{height:72svh}.case--reel .case-hero__visual{min-height:86svh;padding-top:6rem}.case--reel .case-hero__visual img,.case--reel .case-hero__visual video{height:76svh}.case-hero__copy{padding-top:4rem}.case-story{grid-template-columns:1fr}.case-story h2{max-width:11ch}.case-frame,.case-frame:nth-child(n){grid-column:span 12}.case-frame--reel,.case-frame--reel:nth-child(n){grid-column:3/span 8}}
@media(max-width:600px){.case-nav{padding:.9rem 1rem}.case-nav__brand{width:105px}.case-nav nav{font-size:.64rem}.case-nav nav a:first-child{display:none}.case-hero__visual{min-height:62svh}.case-hero__visual img,.case-hero__visual video{height:62svh}.case--reel .case-hero__visual{min-height:82svh;padding:5.25rem .75rem 1.25rem}.case--reel .case-hero__visual img,.case--reel .case-hero__visual video{height:74svh}.case-hero__copy{padding:3.2rem 1.1rem}.case-hero h1{max-width:100%;font-size:clamp(2.4rem,10vw,2.85rem)}.case-facts{grid-template-columns:1fr}.case-facts>div:nth-child(odd){padding-right:0}.case-story{padding:5rem 1.1rem}.case-gallery{padding:4rem .75rem}.case-frame--reel,.case-frame--reel:nth-child(n){grid-column:2/span 10}.case-footer{grid-template-columns:1fr;align-items:start}.case-footer nav{flex-wrap:wrap}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.case-hero__visual>*{animation:none}}
