@font-face{font-family:"BC";font-weight:300;font-display:swap;src:url(/assets/fonts/barlow-condensed-latin-300-normal.woff2) format("woff2")}
@font-face{font-family:"BC";font-weight:600;font-display:swap;src:url(/assets/fonts/barlow-condensed-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:"AN";font-display:swap;src:url(/assets/fonts/anton-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"SM";font-weight:400;font-display:swap;src:url(/assets/fonts/space-mono-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"SM";font-weight:700;font-display:swap;src:url(/assets/fonts/space-mono-latin-700-normal.woff2) format("woff2")}
:root{--bg:#000;--fg:#F2EFE8;--red:#E5301A;--mute:#8d8a82;--line:#2b2b2b;--pad:clamp(20px,4.9vw,70px)}
*{box-sizing:border-box;margin:0;padding:0}
html{background:var(--bg);-webkit-text-size-adjust:100%}
body{background:var(--bg);color:var(--fg);font:400 14px/1.8 SM,ui-monospace,monospace;overflow-x:hidden;min-height:100vh;position:relative}
a{color:inherit;text-decoration:none}
a:focus-visible{outline:2px solid var(--red);outline-offset:4px}
.mono{font-family:SM,monospace;text-transform:uppercase;letter-spacing:.06em;font-size:12px}
.dot{display:inline-block;width:10px;height:10px;border-radius:50%;background:var(--red);margin-right:8px}
/* nav */
nav.top{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:34px var(--pad);position:relative;z-index:5}
nav.top .l{display:flex;gap:28px}nav.top .r{text-align:right}
nav.top a:hover{color:var(--red)}
.seal{width:96px;height:96px;border-radius:50%;background:var(--fg);position:relative;display:block}
.seal svg{position:absolute;inset:-2px;width:calc(100% + 4px);height:calc(100% + 4px);animation:spin 28s linear infinite}
.seal img{position:absolute;left:50%;top:50%;width:74%;transform:translate(-50%,-50%)}
@keyframes spin{to{transform:rotate(360deg)}}
/* hero */
.hero{position:relative;height:min(52vw,760px);min-height:430px;overflow:hidden}
.tag{position:absolute;left:var(--pad);top:clamp(10px,4vw,70px);max-width:min(400px,46vw);z-index:3}
.tag h1{font:300 clamp(34px,4.4vw,62px)/.95 BC;margin-bottom:22px;letter-spacing:0}
.tag p{font-size:14px;line-height:1.8}
.tag .now{margin-top:18px;display:block}
.huge{position:absolute;left:-.6vw;bottom:-2.2vw;font:400 36.5vw/.78 AN;letter-spacing:-.015em;white-space:nowrap;color:var(--fg);animation:rise 1.1s cubic-bezier(.2,.8,.2,1) both;user-select:none}
@keyframes rise{from{transform:translateY(38%);opacity:0}to{transform:none;opacity:1}}
.ric{position:absolute;right:clamp(10px,8vw,140px);top:clamp(0px,1vw,40px);width:clamp(150px,25vw,360px);z-index:2;transition:transform .35s cubic-bezier(.3,1.6,.5,1)}
.ric:hover{transform:rotate(-6deg) scale(1.04)}
/* sections */
.sec{padding:clamp(56px,8vw,110px) var(--pad);border-top:1px solid var(--line)}
#works{border-top:0}
.sec .kick{color:var(--red);margin-bottom:14px;display:block}
.works{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,70px);align-items:center}
.works h2,.pagetitle{font:300 clamp(54px,8.4vw,128px)/.88 BC}
.works p.s{margin-top:24px;max-width:460px}
.btn{display:inline-block;margin-top:28px;border:1px solid var(--fg);padding:11px 26px;font:600 20px/1.2 BC;text-transform:uppercase;letter-spacing:.03em;transition:background .2s,color .2s}
.btn:hover{background:var(--fg);color:#000}
.btn.red{border-color:var(--red);background:var(--red);color:#fff}.btn.red:hover{background:#fff;color:#000;border-color:#fff}
.shots{display:flex;gap:clamp(10px,1.6vw,22px);align-items:flex-start}
.shots figure{flex:1;min-width:0}
.shots img{display:block;width:100%;height:auto;border-radius:14px;border:1px solid #3a3a3a}
.shots figure:nth-child(2){margin-top:clamp(20px,5vw,70px)}
.shots figcaption{margin-top:10px;color:var(--mute)}
/* meta list */
.meta{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid var(--line);margin-top:clamp(36px,5vw,70px)}
.meta div{padding:20px 18px 20px 0;border-bottom:1px solid var(--line)}
.meta b{display:block;font:300 clamp(34px,4vw,56px)/1 BC;margin-top:6px}
.meta span{color:var(--mute)}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,4vw,60px);margin-top:36px}
.steps div{border-top:1px solid var(--fg);padding-top:16px}
.steps b{display:block;font:300 clamp(30px,3.4vw,48px)/1 BC;margin:8px 0 12px}
.note{color:var(--mute);margin-top:30px;max-width:640px}
.cols{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,80px)}
.lead{font:300 clamp(30px,4vw,56px)/1.02 BC;max-width:780px}
.lead2{margin-top:26px;max-width:560px}
.list{margin-top:10px;border-top:1px solid var(--line)}
.list div{display:flex;justify-content:space-between;gap:20px;padding:14px 0;border-bottom:1px solid var(--line)}
/* footer */
footer{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;padding:26px var(--pad) 34px;border-top:1px solid var(--line);color:var(--mute);font-size:11px}
footer a:hover{color:var(--fg)}
.pagehead{padding:clamp(24px,4vw,60px) var(--pad) clamp(30px,5vw,70px)}
@media (max-width:760px){
 nav.top{padding:20px var(--pad)}nav.top .l{gap:16px}.seal{width:68px;height:68px}
 .hero{height:112vw;min-height:0}
 .tag{max-width:58vw;top:8px}.tag h1{font-size:9.2vw}.tag p{font-size:12px}
 .ric{width:38vw;right:6vw;top:34vw}
 .huge{bottom:-4vw}
 .works,.cols,.steps{grid-template-columns:1fr}
 .meta{grid-template-columns:1fr 1fr}
 .shots{flex-wrap:wrap;gap:14px}.shots figure{flex:1 1 calc(50% - 7px)}.shots figure:nth-child(2){margin-top:30px}
}
@media (prefers-reduced-motion:reduce){.seal svg{animation:none}.huge{animation:none}.ric{transition:none}}

.btn.disabled{border-color:var(--mute);color:var(--mute)}
.btn.disabled:hover{background:transparent;color:var(--mute)}
