/* Layout: one horizon. A live dawn rises over a city in the hero; sticky chapters on black; numbered builds; world tiles like a departures wall; big numerals; quiet ownership; final sunrise. */
:root{
  --bg:#FFF6E5; --panel:#FFFFFF; --panel-2:#F3E7D1; --ink:#0E1014; --muted:#5E5A52; --line:rgba(14,16,20,.12);
  --gold:#E9C46A; --gold-ink:#8A6416; --on-gold:#0E1014; --coral:#D9614F; --glow:rgba(233,196,106,.55);
  --night:#0E1014; --cream:#FFF6E5;
  --display:"Anton","Bebas Neue",Impact,"Arial Narrow",sans-serif;
  --serif:"Instrument Serif","Cormorant Garamond",Georgia,"Times New Roman",serif;
  --body:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --wrap:1240px; color-scheme:light;
}
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]){
  --bg:#0A0B0E; --panel:#15171B; --panel-2:#1C1F24; --ink:#FFF6E5; --muted:#A39F97; --line:rgba(255,246,229,.10);
  --gold:#E9C46A; --gold-ink:#E9C46A; --on-gold:#0E1014; --coral:#F2857A; --glow:rgba(233,196,106,.30); color-scheme:dark } }
:root[data-theme="dark"]{
  --bg:#0A0B0E; --panel:#15171B; --panel-2:#1C1F24; --ink:#FFF6E5; --muted:#A39F97; --line:rgba(255,246,229,.10);
  --gold:#E9C46A; --gold-ink:#E9C46A; --on-gold:#0E1014; --coral:#F2857A; --glow:rgba(233,196,106,.30); color-scheme:dark }
/* bands that stay on black in both themes */
.dk{--bg:#0A0B0E; --panel:#15171B; --panel-2:#1C1F24; --ink:#FFF6E5; --muted:#A39F97; --line:rgba(255,246,229,.10); --gold-ink:#E9C46A; --coral:#F2857A; --glow:rgba(233,196,106,.30); background:var(--bg); color:var(--ink)}

*{box-sizing:border-box}
body{background:var(--bg);color:var(--ink);font:400 16px/1.6 var(--body);-webkit-font-smoothing:antialiased;overflow-x:clip}
a{color:inherit}
h1,h2,h3{font-family:var(--display);font-weight:400;letter-spacing:.01em;line-height:.94;text-transform:uppercase;margin:0;text-wrap:balance}
p{margin:0}
em,.it{font-family:var(--display);font-style:normal;font-weight:400;letter-spacing:inherit;color:var(--gold-ink);text-transform:inherit}
.wrap{max-width:var(--wrap);margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
@media (min-width:760px){.wrap{padding-left:max(48px,env(safe-area-inset-left,0px));padding-right:max(48px,env(safe-area-inset-right,0px))}}
.mono{font:500 12px/1.4 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.mark .sun{fill:var(--gold)}

/* grain + cursor */
.grain{position:fixed;inset:0;pointer-events:none;z-index:60;opacity:.07;mix-blend-mode:overlay;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 .9 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>")}
.cursor-glow,.cursor-dot{position:fixed;left:0;top:0;pointer-events:none;z-index:59;display:none}
.cursor-glow{width:520px;height:520px;margin:-260px 0 0 -260px;border-radius:50%;background:radial-gradient(closest-side,rgba(233,196,106,.16),rgba(242,133,122,.06) 50%,transparent 72%);mix-blend-mode:screen}
.cursor-dot{width:8px;height:8px;margin:-4px 0 0 -4px;border-radius:50%;background:var(--gold);box-shadow:0 0 18px 4px rgba(233,196,106,.5)}
@media (hover:hover) and (pointer:fine){.cursor-glow,.cursor-dot{display:block;opacity:0;transition:opacity .6s ease}.moved .cursor-glow,.moved .cursor-dot{opacity:1}}

/* buttons */
.btn{position:relative;display:inline-flex;align-items:center;gap:12px;height:56px;padding:0 28px;border-radius:999px;background:var(--gold);color:var(--on-gold);font:600 16px/1 var(--body);text-decoration:none;white-space:nowrap;box-shadow:0 0 0 1px rgba(255,246,229,.18) inset,0 18px 60px -18px rgba(233,196,106,.7);transition:box-shadow .3s ease;will-change:transform}
.btn:hover{box-shadow:0 0 0 1px rgba(255,246,229,.3) inset,0 22px 80px -14px rgba(233,196,106,.9)}
.btn svg{width:18px;height:18px}
.btn.sm{height:40px;padding:0 18px;font-size:14px;box-shadow:none;gap:0}
.btn.sm .x{white-space:pre}
.ghost{display:inline-flex;align-items:center;height:56px;padding:0 24px;border-radius:999px;border:1px solid rgba(255,246,229,.22);color:var(--ink);text-decoration:none;font:500 15px/1 var(--body);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);background:rgba(14,16,20,.25)}
.ghost:hover{border-color:var(--gold)}
a:focus-visible,button:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
[data-state="in"] .when-out{display:none!important}
[data-state="out"] .when-in{display:none!important}

/* nav */
.nav{position:fixed;top:0;left:0;right:0;z-index:40;padding-top:env(safe-area-inset-top,0px);color:#FFF6E5;transition:background .4s ease,color .4s ease,border-color .4s ease;border-bottom:1px solid transparent}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;height:72px}
.nav.solid{background:color-mix(in srgb,var(--bg) 82%,transparent);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);color:var(--ink);border-color:var(--line)}
.lockup{display:flex;align-items:center;gap:10px;text-decoration:none}
.lockup svg{width:30px;height:auto}
.lockup .ln{fill:currentColor}
.lockup span{font:400 21px/1 var(--display);letter-spacing:.07em;padding-top:3px}
.links{display:flex;align-items:center;gap:30px}
.links a:not(.btn){text-decoration:none;font-size:14px;opacity:.72}
.links a:not(.btn):hover{opacity:1}
@media (max-width:759px){.links a:not(.btn){display:none}}
@media (max-width:479px){.btn.sm .x{display:none}}

/* hero */
.hero{position:relative;height:190svh}
.hero .stick{position:sticky;top:0;height:100svh;overflow:hidden;background:linear-gradient(180deg,#07081a 0%,#1c1840 55%,#3a2346 78%,#0A0B0E 100%)}
#sky{position:absolute;inset:0;width:100%;height:100%;display:block}
.bloom{position:absolute;left:0;top:0;width:min(1100px,120vw);aspect-ratio:1;margin:calc(min(1100px,120vw)/-2) 0 0 calc(min(1100px,120vw)/-2);border-radius:50%;background:radial-gradient(closest-side,rgba(255,236,190,.55),rgba(255,180,110,.22) 32%,rgba(242,133,122,.08) 60%,transparent 75%);mix-blend-mode:screen;pointer-events:none;opacity:.35;will-change:transform}
.hero .veil{position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,11,14,.45) 0%,transparent 18%,transparent 72%,rgba(10,11,14,.85) 100%);pointer-events:none}
.hero .copy{position:absolute;inset:0;display:grid;align-content:center;justify-items:center;text-align:center;gap:26px;padding:96px max(16px,env(safe-area-inset-right,0px)) 120px max(16px,env(safe-area-inset-left,0px));will-change:transform,opacity}
.hero h1{font-size:clamp(62px,13.5vw,214px);line-height:.86;color:#FFF6E5;text-shadow:0 10px 80px rgba(10,11,14,.5);display:flex;align-items:baseline;gap:.12em;flex-wrap:wrap;justify-content:center}
.hero h1 em{font-size:1em;line-height:.86;color:#F4CF76;text-shadow:0 0 60px rgba(244,207,118,.45);padding-right:.04em}
.hero .lead{margin-top:clamp(10px,1.6vw,22px);font-size:clamp(18px,2vw,22px);color:rgba(255,246,229,.86);max-width:36ch;text-wrap:balance;text-shadow:0 2px 28px rgba(10,11,14,.75),0 0 2px rgba(10,11,14,.5)}
.hero .ctas{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}
.hero .mono{color:rgba(255,246,229,.7)}
.hint{position:absolute;left:50%;bottom:calc(28px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);display:grid;justify-items:center;gap:10px;color:rgba(255,246,229,.6)}
.hint i{width:1px;height:44px;background:linear-gradient(#F4CF76,transparent);animation:drip 2.4s ease-in-out infinite}
@keyframes drip{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}51%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}

/* chapters */
.chap{position:relative;height:300svh}
.chap .stick{position:sticky;top:0;height:100svh;overflow:hidden;display:grid;place-items:center}
.chap .aur{position:absolute;inset:-20%;background:radial-gradient(40% 35% at 30% 60%,rgba(242,133,122,.18),transparent 70%),radial-gradient(45% 40% at 70% 40%,rgba(233,196,106,.16),transparent 70%),radial-gradient(60% 50% at 50% 100%,rgba(60,50,120,.35),transparent 70%);filter:blur(20px);animation:drift 18s ease-in-out infinite alternate}
@keyframes drift{to{transform:translate3d(4%,-3%,0) scale(1.08)}}
.chap .line{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;gap:22px;text-align:center;padding-inline:max(16px,env(safe-area-inset-left,0px));will-change:opacity,transform}
.chap h2{font-size:clamp(58px,11.5vw,184px);line-height:.88}
.chap h2 em{font-size:1.02em}
.chap .count{position:absolute;left:max(16px,env(safe-area-inset-left,0px));bottom:calc(32px + env(safe-area-inset-bottom,0px));display:flex;gap:14px;align-items:center}
.chap .count b{display:block;width:48px;height:2px;background:var(--line);position:relative;overflow:hidden}
.chap .count b i{position:absolute;inset:0;background:var(--gold);transform-origin:left;transform:scaleX(0)}
@media (min-width:760px){.chap .count{left:48px}}

/* sections */
section.band{padding-block:clamp(96px,14vw,180px)}
.head{display:grid;gap:18px;margin-bottom:clamp(40px,6vw,72px)}
.head.split{grid-template-columns:minmax(0,1fr) minmax(0,420px);align-items:end;gap:32px}
@media (max-width:860px){.head.split{grid-template-columns:1fr}}
.head h2{font-size:clamp(46px,7vw,108px)}
.head p.sub{color:var(--muted);font-size:18px;max-width:46ch}

/* what we build */
.builds{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.build{display:grid;grid-template-rows:auto auto 1fr;gap:20px;min-width:0}
.build .vis{position:relative;aspect-ratio:4/5;max-width:100%;border-radius:22px;overflow:hidden;background:#0A0B0E;border:1px solid rgba(255,246,229,.08)}
.build .vis canvas{position:absolute;inset:0;width:100%;height:100%;display:block;transition:transform 1.2s cubic-bezier(.2,.7,.1,1)}
.build:hover .vis canvas{transform:scale(1.04)}
.build .vis .tag{position:absolute;left:16px;top:16px;color:rgba(255,246,229,.75)}
.build .num{display:flex;align-items:baseline;justify-content:space-between;gap:12px;border-top:1px solid var(--line);padding-top:16px}
.build .num span:first-child{font:400 44px/1 var(--display);color:var(--gold-ink)}
.build h3{font-size:30px;line-height:1}
.build p{color:var(--muted);max-width:36ch}
@media (max-width:960px){.builds{grid-template-columns:1fr;gap:56px}.build .vis{aspect-ratio:5/4}}

/* worlds */
.worlds{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.tile{position:relative;border-radius:24px;overflow:hidden;min-width:0;isolation:isolate;background:#0A0B0E;color:#FFF6E5}
.tile canvas{position:absolute;inset:0;width:100%;height:100%;display:block;z-index:-2;transition:transform 1.4s cubic-bezier(.2,.7,.1,1)}
.tile:hover canvas{transform:scale(1.05)}
.tile::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(10,11,14,.45) 0%,transparent 35%,transparent 55%,rgba(10,11,14,.85) 100%)}
.tile.big{aspect-ratio:4/5;max-width:100%}
.tile .in{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:space-between;padding:24px}
.tile .top{display:flex;justify-content:space-between;align-items:center;gap:12px}
.tile h3{font-size:clamp(60px,7.6vw,120px);line-height:.88}
.tile .meta{display:flex;justify-content:space-between;align-items:end;gap:12px;border-top:1px solid rgba(255,246,229,.18);padding-top:16px;margin-top:14px}
.tile .clock{font:500 22px/1 var(--mono);font-variant-numeric:tabular-nums}
.tile .cur{font-size:14px;color:rgba(255,246,229,.72);text-align:right}
.tag{display:inline-flex;align-items:center;gap:8px;height:28px;padding:0 12px;border-radius:999px;font:500 11px/1 var(--mono);letter-spacing:.16em;text-transform:uppercase}
.tag.live{background:rgba(233,196,106,.92);color:#0E1014}
.tag.live i{width:7px;height:7px;border-radius:50%;background:#0E1014;animation:pulse 1.8s ease-in-out infinite}
.tag.soon{background:rgba(255,246,229,.1);color:rgba(255,246,229,.85);border:1px solid rgba(255,246,229,.2);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.flag{font-size:20px;line-height:1}
@keyframes pulse{50%{opacity:.25}}
.soonrow{grid-column:1/-1;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px}
.tile.small{aspect-ratio:3/4;max-width:100%}
.tile.small canvas{filter:saturate(.55) brightness(.85) blur(1px)}
.tile.small .frost{position:absolute;inset:0;z-index:-1;backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);background:linear-gradient(180deg,rgba(14,16,20,.35),rgba(14,16,20,.7))}
.tile.small h3{font-size:clamp(22px,2.1vw,30px);line-height:1;color:rgba(255,246,229,.85)}
.tile.small .in{padding:18px}
.tile.small .tag{white-space:nowrap;font-size:10px;letter-spacing:.1em;padding:0 9px;height:24px}
.tile.small .top{flex-wrap:nowrap}
@media (max-width:960px){.soonrow{grid-template-columns:repeat(2,minmax(0,1fr))}.soonrow .tile:last-child{grid-column:1/-1;aspect-ratio:16/9}}
@media (max-width:640px){.worlds{grid-template-columns:1fr}.tile.big{aspect-ratio:4/5}}

/* numerals */
.nums{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.nums div{padding:40px 24px 36px;border-left:1px solid var(--line);display:grid;gap:6px;min-width:0}
.nums div:first-child{border-left:0}
.nums b{font:400 clamp(92px,11vw,176px)/.86 var(--display);font-weight:400}
.nums span{font:400 clamp(20px,2vw,28px)/1.1 var(--display);letter-spacing:.02em;text-transform:uppercase;color:var(--gold-ink)}
@media (max-width:760px){.nums{grid-template-columns:repeat(2,minmax(0,1fr))}.nums div:nth-child(3){border-left:0}.nums div:nth-child(n+3){border-top:1px solid var(--line)}.nums div{padding:28px 16px}}

/* owner */
.owner{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:56px;align-items:end}
.owner h2{font-size:clamp(54px,8.6vw,138px)}
.owner .copy{display:grid;gap:18px;color:var(--muted);font-size:18px;max-width:44ch}
.owner .copy b{color:var(--ink);font-weight:500}
@media (max-width:860px){.owner{grid-template-columns:1fr;gap:28px}}

/* final */
.final{position:relative;overflow:hidden;isolation:isolate;text-align:center;padding-block:clamp(120px,18vw,220px)}
.final::before{content:"";position:absolute;left:50%;bottom:-420px;width:1100px;max-width:200vw;height:760px;transform:translateX(-50%);border-radius:50%;background:radial-gradient(closest-side,rgba(255,214,140,.55),rgba(242,133,122,.22) 45%,rgba(60,50,120,.15) 70%,transparent 80%);z-index:-1;animation:breathe 10s ease-in-out infinite}
.final::after{content:"";position:absolute;left:0;right:0;bottom:120px;height:1px;background:linear-gradient(90deg,transparent,rgba(244,207,118,.6),transparent);z-index:-1}
@keyframes breathe{50%{transform:translateX(-50%) scale(1.06)}}
.final .wrap{display:grid;justify-items:center;gap:28px}
.final h2{font-size:clamp(54px,10vw,160px)}
.final p{color:var(--muted);font-size:18px;max-width:40ch}

/* footer */
.foot{border-top:1px solid var(--line);padding-block:32px calc(40px + env(safe-area-inset-bottom,0px))}
.foot .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:20px}
.foot nav{display:flex;flex-wrap:wrap;gap:8px 24px}
.foot nav a{text-decoration:none;font-size:14px;color:var(--muted)}
.foot nav a:hover{color:var(--ink)}
.foot small{color:var(--muted);font-size:13px}

/* reveal */
.rv{transition:opacity 1.2s ease,transform 1.2s cubic-bezier(.2,.7,.1,1)}
.rv.pre{opacity:0;transform:translateY(40px)}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.rv.pre{opacity:1;transform:none}.hero{height:100svh}.chap{height:auto}.chap .stick{position:relative;height:auto;display:grid;gap:80px;padding-block:120px}.chap .line{position:relative;inset:auto;opacity:1!important;transform:none!important}.chap .count{display:none}}

/* legal pages (privacy, terms) */
.legal{padding:calc(72px + env(safe-area-inset-top,0px) + clamp(48px,8vw,104px)) 0 clamp(80px,10vw,140px)}
.legal .wrap{max-width:860px}
.legal header{display:grid;gap:18px;padding-bottom:clamp(32px,5vw,56px);border-bottom:1px solid var(--line);margin-bottom:clamp(32px,5vw,56px)}
.legal h1{font-size:clamp(54px,9vw,120px);line-height:.9}
.legal header p:not(.mono){color:var(--muted);font-size:18px;max-width:52ch}
.legal .toc{display:grid;gap:10px;margin:0 0 clamp(40px,6vw,64px);padding:24px;border:1px solid var(--line);border-radius:18px;background:var(--panel)}
.legal .toc ol{margin:0;padding-left:1.4em;columns:2 240px;column-gap:32px}
.legal .toc li{margin-bottom:6px;break-inside:avoid}
.legal .toc a{text-decoration:none;color:var(--muted);font-size:15px}
.legal .toc a:hover{color:var(--ink)}
.legal article section{scroll-margin-top:96px;display:grid;gap:14px;margin-bottom:clamp(36px,5vw,52px)}
.legal h2{font-size:clamp(28px,3.4vw,40px);line-height:1}
.legal h2 span{color:var(--gold-ink);margin-right:.35em}
.legal article p,.legal article li{color:var(--muted);font-size:17px;max-width:68ch}
.legal article b{color:var(--ink);font-weight:600}
.legal article ul{margin:0;padding-left:1.2em;display:grid;gap:8px}
.legal article a{color:var(--gold-ink);text-underline-offset:3px}
.foot nav a[aria-current="page"]{color:var(--ink)}
