:root{color-scheme:dark;
  --bg:#050505; --fg:#f2f0ec; --dim:#8a8782; --line:#222; --accent:#009970;
  --pad:clamp(16px,2vw,28px);
  --mono:'JetBrains Mono',ui-monospace,monospace;
  --sans:'Inter Tight',system-ui,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;background:var(--bg)}
body{background:var(--bg);color:var(--fg);font-family:var(--sans);-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}
.mono{font-family:var(--mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase}
.dim{color:var(--dim)}

/* progress + nav */
.progress{position:fixed;top:0;left:0;right:0;height:3px;z-index:60;background:rgba(255,255,255,.12)}
.progress i{display:block;height:100%;width:100%;background:var(--accent);transform:scaleX(0);transform-origin:left}
nav{position:fixed;inset:0 0 auto 0;z-index:50;display:flex;justify-content:space-between;align-items:center;padding:var(--pad);color:#fff}
nav::before{content:"";position:absolute;inset:0 0 -30px;background:linear-gradient(rgba(0,0,0,.7),transparent);z-index:-1;pointer-events:none}
.logo{font-weight:600;font-size:22px;letter-spacing:-.03em}
.links{flex-wrap:wrap;justify-content:center;position:absolute;left:50%;transform:translateX(-50%);display:flex;gap:clamp(10px,2vw,28px)}
.links a{color:#fff;font-weight:500;transition:opacity .2s}
.links a:hover{opacity:.55}
.links a.active{color:var(--accent)}

/* hero */
.p-hero{padding:clamp(120px,16vw,220px) var(--pad) 40px;display:grid;gap:40px}
.back{display:inline-block;width:max-content;transition:opacity .2s}
.back:hover{opacity:.55}
.p-hero h1{font-weight:500;font-size:clamp(48px,11vw,200px);letter-spacing:-.065em;line-height:.88;margin-left:-.03em}
.p-hero h1 .g{color:var(--accent)}
.facts{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--pad);border-top:1px solid var(--line);padding-top:18px}
.facts div{display:grid;gap:8px}
.facts strong{font-weight:500;font-size:clamp(16px,1.5vw,22px);letter-spacing:-.02em}

/* media */
.p-media{margin:0 var(--pad);aspect-ratio:16/8.5;border-radius:6px;position:relative;overflow:hidden;background:#000}
.p-media i{position:absolute;inset:0}
.p-media b{position:absolute;inset:0;display:grid;place-items:center;font-weight:500;font-size:clamp(28px,5vw,90px);letter-spacing:-.05em;mix-blend-mode:overlay;color:#fff;text-align:center;padding:0 var(--pad)}
.p-media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.t1{background:radial-gradient(60% 80% at 30% 40%,#f2a25c,#8a2c0c 50%,#1a0a04)}
.t2{background:conic-gradient(from 210deg at 60% 50%,#0b2a3a,#2d7a8a,#e8e0c8,#0b2a3a)}
.t3{background:linear-gradient(120deg,#1a1033,#6a2cff 45%,#ff6ad5)}

/* text */
.bar{display:flex;justify-content:space-between;align-items:center;padding:14px var(--pad);border-top:1px solid var(--line);margin-top:60px}
.cols{display:grid;grid-template-columns:1fr 1fr;gap:var(--pad);padding:40px var(--pad) 60px}
.cols .row{display:grid;gap:12px;padding-top:24px;border-top:1px solid var(--line)}
.cols p{font-size:clamp(16px,1.4vw,20px);color:#b8b5b0;letter-spacing:-.01em;line-height:1.35;max-width:560px}

/* gallery */
.gallery{display:grid;grid-template-columns:1fr 1fr;gap:var(--pad);padding:0 var(--pad) 60px}
.gallery div{aspect-ratio:4/3;border-radius:6px;position:relative;overflow:hidden}
.gallery div::after{content:"";position:absolute;inset:0;background:linear-gradient(rgba(0,0,0,.25),transparent 40%,rgba(0,0,0,.35))}
.gallery div:nth-child(2){filter:hue-rotate(25deg) brightness(.85)}
.gallery div:nth-child(3){filter:hue-rotate(-20deg) brightness(.9)}
.gallery div:nth-child(4){filter:hue-rotate(50deg) brightness(.8)}

/* next */
.next{display:grid;gap:14px;padding:clamp(50px,8vw,120px) var(--pad);border-top:1px solid var(--line);transition:background .3s}
.next:hover{background:#0e0e0e}
.next strong{font-weight:500;font-size:clamp(40px,8vw,140px);letter-spacing:-.06em;line-height:.9;transition:color .3s}
.next:hover strong{color:var(--accent)}

/* footer */
footer{padding:clamp(60px,10vw,160px) var(--pad) var(--pad);border-top:1px solid var(--line)}
.cta{display:block;font-size:clamp(46px,12vw,220px);letter-spacing:-.07em;line-height:.88;font-weight:500;transition:color .3s}
.cta:hover{color:var(--accent)}
.foot-links{display:flex;justify-content:space-between;flex-wrap:wrap;gap:30px;margin-top:100px}
.foot-links ul{list-style:none;display:flex;gap:40px;flex-wrap:wrap}
.foot-links a{transition:opacity .2s}.foot-links a:hover{opacity:.55}

/* motion */
.rise{opacity:0;filter:blur(12px);transform:translateY(.5em);transition:opacity 1s cubic-bezier(.2,.7,.2,1),filter 1s cubic-bezier(.2,.7,.2,1),transform 1.1s cubic-bezier(.2,.7,.2,1);transition-delay:var(--d,0ms)}
.go .rise,.rise.in{opacity:1;filter:none;transform:none}
.reveal{opacity:0;transform:translateY(40px);transition:opacity 1s,transform 1s cubic-bezier(.2,.7,.2,1)}
.reveal.in{opacity:1;transform:none}

@media(max-width:800px){
  .facts,.cols,.gallery{grid-template-columns:1fr}
  .logo{font-size:16px}.links{font-size:9px;position:static;transform:none}
  nav{flex-direction:column;gap:8px;align-items:flex-start}
}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.rise,.reveal{opacity:1;filter:none;transform:none}}