
:root{--noir:#0c0c0e;--noir-2:#131316;--noir-3:#1c1c20;--bone:#ece4d2;--soft:rgba(236,228,210,.78);--mute:rgba(236,228,210,.58);
--rule:rgba(236,228,210,.14);--rule-2:rgba(236,228,210,.3);--crimson:#b03325;--crimson-2:#d2513f;
--sans:"Inter Tight",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;--serif:"Instrument Serif","Times New Roman",Georgia,serif}
*{box-sizing:border-box;min-width:0}
html{background:var(--noir);-webkit-text-size-adjust:100%}
body{margin:0;background:var(--noir);color:var(--bone);font:400 17px/1.6 var(--sans);-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
img,video,iframe{display:block;max-width:100%}
.wrap{max-width:1360px;margin:0 auto;padding:0 40px}
@media (max-width:640px){.wrap{padding:0 20px}}
.skip{position:absolute;left:-9999px;top:0;background:var(--bone);color:var(--noir);padding:10px 14px;z-index:9}
.skip:focus{left:12px;top:12px}
a:focus-visible,video:focus-visible,button:focus-visible{outline:2px solid var(--crimson-2);outline-offset:3px}

.top{position:sticky;top:0;z-index:5;background:rgba(12,12,14,.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--rule)}
.top .wrap{display:flex;align-items:center;gap:28px;height:64px}
.mark{font:400 25px/1 var(--serif);letter-spacing:-.01em}
.mark i{color:var(--crimson-2);padding:0 3px}
.top nav{margin-left:auto;display:flex;gap:26px;font:500 14px/1 var(--sans);color:var(--mute)}
.top nav a:hover,.top nav a[aria-current]{color:var(--bone)}
@media (max-width:760px){.top nav .opt{display:none}.top nav{gap:20px}}

.hero{padding:26px 0 0}
.trail{font-size:14px;color:var(--mute);margin:0 0 18px}
.trail a{color:var(--soft);border-bottom:1px solid var(--rule-2)}
.trail a:hover{color:var(--bone);border-color:var(--bone)}
.trail span{margin:0 9px;color:var(--rule-2)}
.stage{margin:0;background:radial-gradient(120% 95% at 50% 30%,#1c1c20 0%,#141417 48%,#0b0b0d 100%);position:relative;overflow:hidden;box-shadow:inset 0 0 0 1px rgba(236,228,210,.06)}
.stage video,.stage img{width:100%;height:auto;background:#000}
.stage.tall{display:flex;justify-content:center;padding:clamp(18px,4vw,56px) 0}
.stage.tall .player{position:relative}
.stage.tall video{position:relative;width:auto;height:min(76vh,780px);max-height:none;box-shadow:0 30px 80px rgba(0,0,0,.55)}
@media (max-width:640px){.stage.tall video{width:100%;height:auto}}
.head{padding:38px 0 0}
.client{font:500 16px/1.4 var(--sans);margin:0 0 12px;color:var(--bone)}
.client span{color:var(--crimson-2);font-weight:400;margin-left:10px}
h1{font:400 clamp(44px,6.6vw,104px)/.98 var(--serif);letter-spacing:-.012em;margin:0;max-width:17ch;text-wrap:balance}

.story{padding:56px 0 8px}
.story .grid{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(0,1fr);gap:72px;border-top:1px solid var(--rule);padding-top:40px}
@media (max-width:880px){.story .grid{grid-template-columns:1fr;gap:36px}}
.text p{max-width:60ch;margin:0 0 18px;color:var(--soft)}
.text .lede{font-size:clamp(21px,1.9vw,25px);line-height:1.45;color:var(--bone)}
.text h2{font:500 13px/1.4 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--crimson-2);margin:30px 0 8px}
.facts{margin:0;display:grid;gap:22px;align-content:start}
.facts dt{font-size:13px;color:var(--mute);margin-bottom:3px}
.facts dd{margin:0;color:var(--bone)}
.facts ul{list-style:none;margin:0;padding:0}

.wall{padding:64px 0 8px}
.wall h2{font:400 clamp(30px,3.2vw,46px)/1.05 var(--serif);margin:0 0 28px}
.row{display:flex;gap:20px;align-items:flex-start;margin-bottom:26px}
.row figure{margin:0;flex:var(--g) 1 0}
.row .sp{flex:var(--g) 1 0}
.row figure video,.row figure img{width:100%;aspect-ratio:var(--ar);height:auto;object-fit:cover;background:var(--noir-3)}
.row figure a{display:block;cursor:zoom-in}
@media (max-width:640px){.row{flex-wrap:wrap;gap:22px 14px}.row figure{flex:1 1 100%}.row figure.tall{flex:1 1 calc(50% - 7px)}.row .sp{display:none}}
.player{position:relative}
.play{display:none}
.player.js .play{display:grid;place-items:center;position:absolute;left:50%;top:50%;width:84px;height:84px;margin:-42px 0 0 -42px;border:0;border-radius:50%;
background:rgba(236,228,210,.94);cursor:pointer;transition:background .2s ease,transform .2s ease;box-shadow:0 10px 40px rgba(0,0,0,.35)}
.player.js .play span{width:0;height:0;border-left:24px solid var(--noir);border-top:14px solid transparent;border-bottom:14px solid transparent;margin-left:7px}
.player.js .play:hover{background:var(--crimson);transform:scale(1.06)}
.player.js .play:hover span{border-left-color:var(--bone)}
.row .player.js .play{width:60px;height:60px;margin:-30px 0 0 -30px}
.row .player.js .play span{border-left-width:17px;border-top-width:10px;border-bottom-width:10px;margin-left:5px}
.player.on .play{display:none}
@media (max-width:640px){.player.js .play{width:62px;height:62px;margin:-31px 0 0 -31px}.player.js .play span{border-left-width:18px;border-top-width:11px;border-bottom-width:11px;margin-left:5px}}
.cap{font-size:14px;color:var(--mute);margin:12px 0 0}
figcaption{font-size:14px;line-height:1.4;color:var(--mute);margin-top:10px}
.unitset{display:grid;gap:40px}
.units{display:flex;flex-wrap:wrap;gap:36px 28px;align-items:flex-end}
.stage.live{padding:clamp(22px,4.4vw,64px) clamp(14px,3vw,48px)}
.stage.live .unitset{position:relative}
.stage.live .units{justify-content:center;gap:26px 22px}
.stage.live figcaption{color:var(--soft)}
.unit{margin:0;max-width:100%}
.unit .box{width:calc(var(--w) * var(--s,1) * 1px);height:calc(var(--h) * var(--s,1) * 1px);overflow:hidden;background:#000;box-shadow:0 0 0 1px var(--rule)}
.unit iframe{max-width:none;width:calc(var(--w) * 1px);height:calc(var(--h) * 1px);border:0;transform:scale(var(--s,1));transform-origin:0 0}

.rights{font-size:13px;color:var(--mute);margin:0 auto;padding-top:36px}
.next{padding-top:64px;padding-bottom:72px}
.next a{display:grid;grid-template-columns:minmax(0,420px) minmax(0,1fr);gap:36px;align-items:center;border-top:1px solid var(--rule);padding-top:40px}
.next img{width:100%;aspect-ratio:16/9;object-fit:cover;background:var(--noir-3)}
.next .lbl{display:block;font-size:14px;color:var(--mute);margin-bottom:8px}
.next .nc{display:block;font-weight:500;margin-bottom:6px}
.next .nt{display:block;font:400 clamp(28px,3.2vw,48px)/1.05 var(--serif);transition:color .2s ease}
.next a:hover .nt{color:var(--crimson-2)}
@media (max-width:760px){.next a{grid-template-columns:1fr;gap:20px}}

.contact{background:var(--bone);color:var(--noir);padding:84px 0}
.contact h2{font:400 clamp(38px,5vw,76px)/1 var(--serif);margin:0 0 22px;max-width:15ch}
.contact p{max-width:58ch;margin:0 0 26px;color:rgba(12,12,14,.74)}
.contact .lines{display:flex;flex-wrap:wrap;gap:14px 34px;font:500 clamp(18px,1.6vw,22px)/1.3 var(--sans);margin:0}
.contact .lines a{border-bottom:1px solid rgba(12,12,14,.4)}
.contact .lines a:hover{color:var(--crimson);border-color:var(--crimson)}
.contact a:focus-visible{outline-color:var(--crimson)}
footer{padding:26px 0 40px;font-size:13px;color:var(--mute)}
footer .wrap{display:flex;flex-wrap:wrap;gap:10px 24px;justify-content:space-between}
footer nav{display:flex;gap:20px}
footer a:hover{color:var(--bone)}

.intro{padding-top:72px;padding-bottom:24px}
.intro h1{max-width:12ch}
.intro p{max-width:62ch;font-size:clamp(19px,1.7vw,23px);line-height:1.5;color:var(--soft);margin:26px 0 0}
.sec{padding:56px 0 8px}
.sec .sh{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px;align-items:end;border-top:1px solid var(--rule);padding-top:30px;margin-bottom:34px}
.sec h2{font:400 clamp(34px,3.6vw,54px)/1 var(--serif);margin:0}
.sec .sh p{margin:0;color:var(--soft);max-width:52ch}
@media (max-width:760px){.sec .sh{grid-template-columns:1fr;gap:12px}}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,400px),1fr));gap:40px 28px}
.card img{width:100%;aspect-ratio:16/9;object-fit:cover;background:var(--noir-3);transition:opacity .2s ease}
.card:hover img{opacity:.86}
.card .c{display:block;font-size:14px;color:var(--mute);margin-top:14px}
.card .c b{font-weight:500;color:var(--bone)}
.card .t{display:block;font:400 26px/1.12 var(--serif);margin-top:4px}
.card:hover .t{color:var(--crimson-2)}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}
