:root {
  --bg: #080808;
  --ink: #f2eee7;
  --muted: #9b978f;
  --line: rgba(255,255,255,.13);
  --gold: #d2ad71;
  --gold-pale: #f1d29f;
  --ease: cubic-bezier(.16,1,.3,1);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--bg); overflow-x: clip; max-width: 100%; }
body { margin: 0; overflow-x: clip; max-width: 100%; color: var(--ink); background: var(--bg); font-family: Arial, Helvetica, sans-serif; -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; }
::selection { background: var(--gold); color: #080808; }

.noise { position: fixed; inset: 0; z-index: 100; pointer-events: none; opacity: .055; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E"); mix-blend-mode: soft-light; }
.cursor-aura { position: fixed; width: 420px; height: 420px; border-radius: 50%; pointer-events: none; z-index: 0; background: radial-gradient(circle, rgba(207,166,104,.12), transparent 68%); transform: translate(-50%,-50%); transition: opacity .3s; }
.scroll-progress { position: fixed; top: 0; left: 0; right: 0; height: 2px; z-index: 200; background: rgba(255,255,255,.05); }
.scroll-progress span { display: block; width: 100%; height: 100%; transform: scaleX(0); transform-origin: left; background: linear-gradient(90deg,#967042,#f0d09c); }

.site-header { position: fixed; z-index: 90; inset: 0 0 auto; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; padding: 18px 34px; border-bottom: 1px solid rgba(255,255,255,.08); background: linear-gradient(180deg,rgba(8,8,8,.9),rgba(8,8,8,.35),transparent); backdrop-filter: blur(12px); }
.brand { justify-self: start; }
.brand-plate { display: flex; align-items: center; width: 132px; height: 32px; overflow: hidden; border-radius: 2px; box-shadow: 0 0 22px rgba(218,178,114,.08); }
.brand img { width: 100%; height: 100%; object-fit: cover; filter: contrast(1.05) saturate(.62) brightness(.88); }
.site-header nav { display: flex; gap: 34px; font-size: 10px; letter-spacing: .18em; text-transform: uppercase; }
.site-header nav a { color: #bcb8b0; transition: color .25s; }
.site-header nav a:hover { color: #fff; }
.nav-cta { justify-self: end; font-size: 10px; letter-spacing: .16em; text-transform: uppercase; border-bottom: 1px solid rgba(255,255,255,.4); padding-bottom: 7px; }
.nav-cta span { color: var(--gold); margin-left: 8px; }

.hero { position: relative; min-height: 100svh; display: grid; grid-template-columns: 1fr 1fr; overflow: hidden; padding: 110px 6vw 80px; isolation: isolate; }
.hero::before { content:""; position:absolute; inset:-15%; z-index:-3; background: radial-gradient(circle at 77% 44%,rgba(191,144,76,.19),transparent 31%), radial-gradient(circle at 20% 75%,rgba(255,255,255,.035),transparent 28%), linear-gradient(125deg,#080808 30%,#0b0a09 62%,#030303); }
.hero::after { content:""; position:absolute; left:50%; top:0; bottom:0; width:1px; background: linear-gradient(transparent,rgba(255,255,255,.14),transparent); opacity:.5; }
.hero-grid { position:absolute; inset:0; z-index:-2; opacity:.16; background-image: linear-gradient(rgba(255,255,255,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.08) 1px,transparent 1px); background-size: 9vw 9vw; mask-image: linear-gradient(to bottom,transparent 0,#000 30%,#000 72%,transparent); }
.hero-copy { align-self:center; position:relative; z-index:2; padding-top:5vh; }
.eyebrow,.section-number { font-size: 10px; letter-spacing:.25em; color:var(--gold); text-transform:uppercase; }
.display { margin:28px 0 30px; font-size:clamp(68px,9.25vw,170px); line-height:.78; letter-spacing:-.072em; font-weight:700; }
.display span { display:block; white-space:nowrap; }
.display .outline { color:transparent; -webkit-text-stroke:1px rgba(244,235,221,.78); margin-left:8vw; }
.hero-intro { margin-left:8vw; max-width:370px; color:#bdb8b0; line-height:1.6; font-size:14px; }
.hero-link { display:inline-flex; align-items:center; gap:38px; margin:45px 0 0 8vw; font-size:10px; letter-spacing:.22em; text-transform:uppercase; }
.hero-link i { display:grid; place-items:center; width:40px; height:40px; border:1px solid rgba(255,255,255,.25); border-radius:50%; font-style:normal; transition:.35s var(--ease); }
.hero-link:hover i { background:var(--gold); color:#080808; border-color:var(--gold); transform:translateY(5px); }
.reveal { opacity:0; transform:translateY(24px); animation:enter 1.2s var(--ease) forwards; }
.reveal:nth-child(2){animation-delay:.1s}.reveal:nth-child(3){animation-delay:.25s}.reveal:nth-child(4){animation-delay:.4s}
@keyframes enter { to{opacity:1;transform:none} }

.hero-wheel-wrap { position:relative; z-index:1; display:grid; place-items:center; perspective:1200px; }
.wheel-halo { position:absolute; width:min(54vw,740px); aspect-ratio:1; border-radius:50%; background:radial-gradient(circle,rgba(218,177,111,.17) 0,rgba(156,111,58,.06) 40%,transparent 67%); filter:blur(12px); }
.hero-wheel { width:min(48vw,680px); transform:rotate(-8deg) rotateY(-8deg); transform-style:preserve-3d; will-change:transform; transition:filter .4s; }
.hero-wheel .spokes { transform-origin:300px 300px; }
.wheel-tag { position:absolute; left:10%; bottom:17%; display:flex; gap:14px; align-items:center; padding:9px 12px; background:rgba(8,8,8,.58); border:1px solid rgba(255,255,255,.12); backdrop-filter:blur(12px); font-size:9px; letter-spacing:.18em; }
.wheel-tag span { color:var(--gold); }
.drag-hint { position:absolute; right:2%; top:22%; writing-mode:vertical-rl; font-size:8px; letter-spacing:.25em; color:#77736d; }
.hero-meta { position:absolute; left:6vw; right:6vw; bottom:26px; display:flex; justify-content:space-between; font-size:8px; letter-spacing:.2em; color:#6f6b65; }

.manifesto { min-height:92vh; padding:14vw 10vw 10vw; background:#ece8df; color:#111; position:relative; overflow:hidden; }
.manifesto::before { content:"V"; position:absolute; right:-1vw; bottom:-15vw; font-size:62vw; font-weight:700; line-height:.8; color:rgba(17,17,17,.025); }
.manifesto .section-number { color:#8d6a3a; }
.manifesto h2 { max-width:1200px; margin:10vh 0 5vh; font-size:clamp(50px,7.5vw,132px); line-height:.9; letter-spacing:-.06em; position:relative; }
.manifesto h2 em { font-family:Georgia,serif; font-weight:400; color:#80623b; }
.manifesto-copy { width:min(540px,100%); margin-left:auto; font-size:clamp(18px,2vw,30px); line-height:1.45; color:#49453f; position:relative; }

.story { background:#080808; position:relative; height:400svh; }
.story-stage { position:sticky; top:0; height:100svh; display:grid; grid-template-columns:56% 44%; overflow:hidden; border-top:1px solid var(--line); }
.story-visual { position:relative; display:grid; place-items:center; overflow:hidden; border-right:1px solid var(--line); }
.story-visual::before { content:""; position:absolute; width:75%; height:75%; border:1px solid rgba(255,255,255,.07); border-radius:50%; }
.story-wheel { width:min(44vw,650px); z-index:2; filter:drop-shadow(0 30px 35px #000); transition:1s var(--ease); }
.story-wheel .symbol-spokes { transform-origin:300px 300px; transition:1.2s var(--ease); }
.orbit { position:absolute; border:1px solid rgba(213,173,110,.26); border-radius:50%; transition:1s var(--ease); }
.orbit-a { width:88%; aspect-ratio:1; transform:rotateX(72deg) rotateZ(-18deg); }
.orbit-b { width:62%; aspect-ratio:1; transform:rotateY(72deg) rotateZ(18deg); }
.story-line { position:absolute; background:linear-gradient(90deg,transparent,rgba(205,163,100,.75),transparent); height:1px; width:85%; transition:1s var(--ease); }
.line-a { transform:rotate(18deg); }.line-b{transform:rotate(-56deg)}
.story-index { position:absolute; left:34px; bottom:30px; display:flex; align-items:baseline; gap:6px; font-size:54px; font-weight:600; letter-spacing:-.06em; }
.story-index small { font-size:11px; color:#5f5b55; }
.story-panel { align-self:center; padding:8vw; }
.story-kicker { font-size:9px; letter-spacing:.24em; color:var(--gold); margin-bottom:28px; }
.story-panel h3 { font-size:clamp(44px,5.2vw,88px); line-height:.94; letter-spacing:-.055em; margin:0; max-width:690px; }
.story-panel p { color:#9f9b94; font-size:16px; line-height:1.6; max-width:500px; margin:38px 0 56px; }
.story-spec { border-top:1px solid var(--line); padding-top:20px; color:#8f8a82; font-size:10px; letter-spacing:.14em; text-transform:uppercase; }
.story-spec span { display:inline-block; color:#fff; font-size:31px; letter-spacing:-.04em; margin-right:16px; }
.story-steps { position:absolute; inset:0; pointer-events:none; }
.story-step { height:100svh; position:relative; }.story-step span{position:absolute;left:-100vw}
.story[data-mode="mass"] .story-wheel { transform:scale(.82) rotate(12deg); }
.story[data-mode="mass"] .story-wheel .symbol-spokes { transform:rotate(15deg); }
.story[data-mode="mass"] .orbit-a { width:72%; }
.story[data-mode="finish"] .story-wheel { transform:scale(1.08) rotate(-16deg); filter:drop-shadow(0 34px 42px #000) brightness(1.18); }
.story[data-mode="finish"] .line-a { transform:rotate(42deg); }
.story[data-mode="finish"] .line-b { transform:rotate(-22deg); }
.story[data-mode="presence"] .story-wheel { transform:scale(1.22); }
.story[data-mode="presence"] .orbit-a { width:105%; border-color:rgba(213,173,110,.45); }
.story[data-mode="presence"] .orbit-b { width:84%; }

.collection { padding:12vw 4vw 9vw; background:#d6d0c5; color:#111; }
.collection-head { display:grid; grid-template-columns:1.4fr .6fr; gap:8vw; align-items:end; padding:0 4vw 7vw; }
.collection .section-number { color:#77562f; }
.collection-head h2,.craft-copy h2,.finish-head h2 { font-size:clamp(52px,7vw,116px); line-height:.88; letter-spacing:-.06em; margin:30px 0 0; }
.collection-head>p { color:#55504a; line-height:1.6; font-size:15px; max-width:430px; }
.wheel-cards { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid rgba(0,0,0,.22); border-left:1px solid rgba(0,0,0,.22); }
.wheel-card { min-height:690px; padding:22px; border-right:1px solid rgba(0,0,0,.22); border-bottom:1px solid rgba(0,0,0,.22); display:flex; flex-direction:column; position:relative; overflow:hidden; transition:background .5s,color .5s; }
.wheel-card:hover { background:#111; color:#eee; }
.card-top,.card-bottom { display:flex; justify-content:space-between; font-size:9px; letter-spacing:.17em; }
.card-bottom { margin-top:auto; color:#69645e; }.wheel-card:hover .card-bottom{color:#9b968e}
.mini-wheel { width:75%; aspect-ratio:1; margin:4vh auto 3vh; border-radius:50%; background:radial-gradient(circle at 35% 26%,#3a3937 0 7%,#111 42%,#010101 73%); border:14px solid #111; box-shadow:inset 0 0 0 8px #7b6547,inset 0 0 0 18px #151515,0 28px 35px rgba(0,0,0,.18); position:relative; transition:transform 1s var(--ease); }
.wheel-card:hover .mini-wheel { transform:rotate(18deg) scale(1.04); }
.mini-wheel::before { content:""; position:absolute; inset:18%; border-radius:50%; background:repeating-conic-gradient(from 8deg,#d1b384 0 5deg,#604c31 5deg 8deg,#1b1916 8deg 18deg); -webkit-mask:radial-gradient(circle,transparent 0 22%,#000 23% 64%,transparent 65%); mask:radial-gradient(circle,transparent 0 22%,#000 23% 64%,transparent 65%); }
.mini-wheel::after { content:"V"; position:absolute; inset:39%; display:grid; place-items:center; border-radius:50%; color:#c9a66e; background:#090909; border:4px solid #a58657; font-size:18px; font-weight:700; }
.mini-wheel.velocity::before { background:repeating-conic-gradient(from 5deg,#d8d8d4 0 3deg,#373737 3deg 7deg,#141414 7deg 24deg); transform:rotate(8deg); }
.mini-wheel.apex::before { background:repeating-conic-gradient(from 0deg,#c39a62 0 8deg,#1a1713 8deg 13deg,#856235 13deg 18deg,#171717 18deg 36deg); }
.card-copy h3 { font-size:30px; letter-spacing:-.04em; margin:0 0 12px; }.card-copy p{color:#716c65;line-height:1.5;font-size:13px;max-width:320px}.wheel-card:hover .card-copy p{color:#99948c}

.craft { min-height:100svh; display:grid; grid-template-columns:1fr 1fr; background:#0a0a0a; }
.craft-media { position:relative; overflow:hidden; display:grid; place-items:center; background:radial-gradient(circle at 50% 46%,#25221d,transparent 43%),#060606; border-right:1px solid var(--line); }
.craft-media::before { content:""; position:absolute; inset:7%; border:1px solid rgba(255,255,255,.1); }
.metal-slab { width:62%; aspect-ratio:1; border-radius:50%; background:radial-gradient(circle at 35% 25%,#cab995,#5f5647 29%,#1d1a16 64%,#080706); box-shadow:0 50px 80px #000,inset 0 0 0 1px rgba(255,255,255,.24),inset -45px -50px 80px rgba(0,0,0,.8); position:relative; transform:rotateX(65deg) rotateZ(-12deg); }
.cut-ring { position:absolute; inset:17%; border:2px dashed rgba(235,211,167,.43); border-radius:50%; }
.cut-lines { position:absolute; inset:28%; background:repeating-conic-gradient(rgba(240,215,168,.32) 0 1deg,transparent 1deg 24deg); border-radius:50%; }
.metal-slab>span { position:absolute; bottom:11%; left:50%; transform:translateX(-50%) rotateZ(12deg); font-size:10px; letter-spacing:.2em; color:#d9c7a4; white-space:nowrap; }
.craft-copy { padding:10vw 8vw; align-self:center; }
.craft-copy p:not(.section-number) { max-width:600px; color:#9d9890; line-height:1.7; font-size:16px; margin:42px 0 65px; }
.metrics { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--line); }
.metrics div { padding:22px 12px 0 0; border-right:1px solid var(--line); }.metrics div+div{padding-left:18px}
.metrics strong { display:block; font-size:34px; letter-spacing:-.04em; }.metrics span{display:block;color:#77726b;font-size:8px;letter-spacing:.16em;margin-top:9px}

.finish-lab { min-height:110svh; padding:10vw 6vw; background:#eae6de; color:#111; position:relative; }
.finish-lab .section-number { color:#7d5e34; }
.finish-head { display:flex; justify-content:space-between; align-items:flex-start; }.finish-head h2{margin-top:0;text-align:right}
.finish-selector { width:42%; margin-top:8vw; border-top:1px solid rgba(0,0,0,.2); }
.finish { width:100%; border:0; border-bottom:1px solid rgba(0,0,0,.2); background:none; display:grid; grid-template-columns:40px 1fr auto; align-items:center; gap:18px; padding:18px 0; text-align:left; cursor:pointer; opacity:.46; transition:.3s; }
.finish:hover,.finish.active{opacity:1}.finish b{font-size:12px;letter-spacing:.08em;text-transform:uppercase}.finish small{font-size:9px;letter-spacing:.12em;color:#6a665f;text-transform:uppercase}
.swatch { width:24px;height:24px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(0,0,0,.25),0 4px 8px rgba(0,0,0,.14)}
.swatch.champagne{background:linear-gradient(135deg,#f1d5a3,#826641)}.swatch.graphite{background:linear-gradient(135deg,#a2a29f,#1d1d1d)}.swatch.silver{background:linear-gradient(135deg,#fff,#727272)}.swatch.obsidian{background:linear-gradient(135deg,#3d3d3d,#020202)}
.finish-preview { position:absolute; right:-8vw; bottom:-4vw; width:63vw; aspect-ratio:1; display:grid; place-items:center; }
.preview-wheel { width:76%; aspect-ratio:1; border-radius:50%; background:radial-gradient(circle at 35% 25%,#353432,#111 44%,#030303 76%); box-shadow:0 50px 60px rgba(0,0,0,.28),inset 0 0 0 16px #131313,inset 0 0 0 23px #b7945d; position:relative; transition:.7s var(--ease); }
.preview-wheel::before { content:"";position:absolute;inset:15%;border-radius:50%;background:repeating-conic-gradient(from 7deg,#d0ab70 0 5deg,#5f482d 5deg 9deg,#121212 9deg 18deg);-webkit-mask:radial-gradient(circle,transparent 0 20%,#000 21% 68%,transparent 69%);mask:radial-gradient(circle,transparent 0 20%,#000 21% 68%,transparent 69%); }
.preview-core { position:absolute;inset:40%;border-radius:50%;background:#080808;color:#d4ae71;border:5px solid #af8b55;display:grid;place-items:center;font-size:30px;font-weight:700; }
.preview-label { position:absolute; left:5%; bottom:14%; display:flex;flex-direction:column;gap:8px;font-size:11px;letter-spacing:.17em; }.preview-label small{color:#736e66;font-size:8px}
.finish-preview[data-finish="graphite"] .preview-wheel::before{background:repeating-conic-gradient(from 7deg,#9b9a96 0 5deg,#242424 5deg 9deg,#090909 9deg 18deg)}
.finish-preview[data-finish="silver"] .preview-wheel::before{background:repeating-conic-gradient(from 7deg,#f5f4f0 0 5deg,#777 5deg 9deg,#171717 9deg 18deg)}
.finish-preview[data-finish="obsidian"] .preview-wheel::before{background:repeating-conic-gradient(from 7deg,#3e3e3e 0 5deg,#050505 5deg 9deg,#101010 9deg 18deg)}

.contact { min-height:100svh; padding:12vw 7vw 3vw; background:#080808; display:flex; flex-direction:column; justify-content:center; align-items:flex-start; position:relative; overflow:hidden; }
.contact-wheel { position:absolute; width:70vw; aspect-ratio:1; border:1px solid rgba(210,173,113,.15); border-radius:50%; right:-25vw; top:50%; transform:translateY(-50%); box-shadow:inset 0 0 0 7vw rgba(255,255,255,.015),inset 0 0 0 7.1vw rgba(210,173,113,.12),inset 0 0 0 14vw rgba(255,255,255,.012); }
.contact-wheel::before { content:"";position:absolute;inset:26%;border-radius:50%;background:repeating-conic-gradient(rgba(210,173,113,.12) 0 3deg,transparent 3deg 18deg); }
.contact>p { font-size:10px;letter-spacing:.25em;color:var(--gold);z-index:1}.contact h2{font-size:clamp(57px,8vw,142px);line-height:.84;letter-spacing:-.065em;margin:35px 0 58px;z-index:1}.contact h2 em{font-family:Georgia,serif;color:#d4b47e;font-weight:400}
.contact>a { z-index:1; font-size:10px; letter-spacing:.18em; border:1px solid rgba(255,255,255,.25); padding:20px 24px; transition:.35s; }.contact>a:hover{background:#d2ad71;color:#080808;border-color:#d2ad71}.contact>a span{margin-left:35px}
.contact-foot { position:absolute;left:7vw;right:7vw;bottom:28px;display:flex;justify-content:space-between;color:#625e58;font-size:8px;letter-spacing:.18em;z-index:1}.contact-foot a{color:#99948d}

@media (max-width: 900px) {
  .cursor-aura { display:none; }
  .site-header { grid-template-columns:1fr auto; padding:16px 18px; }.site-header nav{display:none}.brand-plate{width:112px}.nav-cta{font-size:8px}
  .hero { grid-template-columns:1fr; padding:100px 20px 65px; min-height:105svh; }.hero::after{display:none}.hero-copy{align-self:start}.display{font-size:clamp(56px,16vw,92px);margin-top:18px}.display .outline{margin-left:0}.hero-intro,.hero-link{margin-left:0}.hero-wheel-wrap{position:absolute;right:-32vw;bottom:6vh;width:108vw;opacity:.78}.hero-wheel{width:100%}.wheel-tag{left:14%;bottom:6%}.drag-hint{display:none}.hero-meta{left:20px;right:20px;gap:10px}.hero-meta span:nth-child(2){display:none}
  .manifesto{padding:24vw 22px 20vw}.manifesto h2{margin-top:10vh;font-size:15vw}.manifesto-copy{font-size:18px;margin-top:15vh}
  .story-stage{grid-template-columns:1fr;}.story-visual{height:57svh;border-right:0;border-bottom:1px solid var(--line)}.story-panel{height:43svh;padding:30px 22px;align-self:auto}.story-panel h3{font-size:10vw}.story-panel p{font-size:13px;margin:18px 0 20px}.story-spec{padding-top:12px}.story-wheel{width:72vw}.story-index{left:18px;bottom:14px;font-size:38px}.story-kicker{margin-bottom:14px}
  .collection{padding:22vw 14px 18vw}.collection-head{grid-template-columns:1fr;padding:0 8px 14vw}.collection-head h2{font-size:15vw}.wheel-cards{grid-template-columns:1fr}.wheel-card{min-height:590px}.mini-wheel{width:66%}
  .craft{grid-template-columns:1fr}.craft-media{height:58svh;border-right:0;border-bottom:1px solid var(--line)}.metal-slab{width:68%}.craft-copy{padding:18vw 22px}.craft-copy h2{font-size:14vw}.metrics{grid-template-columns:1fr}.metrics div{border-right:0;border-bottom:1px solid var(--line);padding:18px 0}.metrics div+div{padding-left:0}
  .finish-lab{min-height:125svh;padding:20vw 20px}.finish-head{display:block}.finish-head h2{text-align:left;font-size:14vw;margin-top:28px}.finish-selector{width:100%;margin-top:12vw}.finish small{display:none}.finish-preview{width:105vw;right:-30vw;bottom:1vw}.preview-label{left:16%;bottom:10%}
  .contact{padding:22vw 22px 80px}.contact h2{font-size:15vw}.contact-wheel{width:120vw;right:-73vw}.contact-foot{left:22px;right:22px;gap:15px}.contact-foot span:nth-child(2){display:none}
}

@media (prefers-reduced-motion: reduce) {
  html{scroll-behavior:auto}.reveal{animation:none;opacity:1;transform:none}.hero-wheel,.story-wheel,.symbol-spokes,.mini-wheel,.preview-wheel{transition:none!important}.cursor-aura{display:none}
}