:root {
  --bg: #f5f5f2;
  --bg-strong: #efefeb;
  --ink: #111211;
  --muted: #6d706e;
  --line: rgba(17, 18, 17, 0.12);
  --line-light: rgba(255, 255, 255, 0.78);
  --glass: rgba(255, 255, 255, 0.44);
  --glass-strong: rgba(255, 255, 255, 0.72);
  --shadow: 0 24px 80px rgba(22, 23, 22, 0.09), inset 0 1px 0 rgba(255, 255, 255, 0.92);
  --radius: 28px;
  --page: clamp(20px, 4vw, 72px);
  --ease: cubic-bezier(.2,.8,.2,1);
  --header-h: 96px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--bg); }
body {
  margin: 0;
  min-width: 320px;
  color: var(--ink);
  background:
    radial-gradient(circle at 20% 15%, rgba(255,255,255,.96), transparent 34%),
    radial-gradient(circle at 85% 30%, rgba(255,255,255,.78), transparent 36%),
    var(--bg);
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  text-rendering: geometricPrecision;
  overflow-x: hidden;
}
body.is-locked { overflow: hidden; }
body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 99;
  opacity: .032;
  background-image:
    repeating-radial-gradient(circle at 17% 31%, rgba(0,0,0,.4) 0 .55px, transparent .7px 3.4px),
    repeating-radial-gradient(circle at 71% 68%, rgba(255,255,255,.9) 0 .65px, transparent .8px 4px);
  mix-blend-mode: multiply;
}

img, svg { display: block; }
img { max-width: 100%; }
button, a { font: inherit; }
a { color: inherit; text-decoration: none; }
button { color: inherit; }
button:focus-visible, a:focus-visible, summary:focus-visible { outline: 2px solid #111; outline-offset: 4px; }
::selection { background: #171817; color: #fff; }

.site-shell { position: relative; overflow: clip; }

.preloader {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: grid;
  place-items: center;
  background: #f5f5f2;
  transition: opacity .5s var(--ease), visibility .5s;
}
.preloader.is-done { opacity: 0; visibility: hidden; }
.preloader__inner { width: min(320px, 76vw); text-align: center; }
.preloader__mark { width: 70px; margin: 0 auto 18px; filter: drop-shadow(0 10px 25px rgba(0,0,0,.12)); }
.preloader__word { font-size: 13px; font-weight: 650; letter-spacing: .16em; }
.preloader__track { height: 1px; margin-top: 22px; background: rgba(0,0,0,.11); overflow: hidden; }
.preloader__track span { display: block; height: 100%; width: 0; background: #141514; }
.preloader__count { margin-top: 10px; color: var(--muted); font-size: 11px; letter-spacing: .16em; font-variant-numeric: tabular-nums; }

.cursor { position: fixed; inset: 0; pointer-events: none; z-index: 1200; display: none; }
.cursor__dot, .cursor__ring { position: absolute; top: 0; left: 0; border-radius: 50%; transform: translate(-50%,-50%); }
.cursor__dot { width: 5px; height: 5px; background: #111; }
.cursor__ring { width: 34px; height: 34px; border: 1px solid rgba(17,17,17,.34); transition: width .22s, height .22s, background .22s; }
.cursor.is-active .cursor__ring { width: 54px; height: 54px; background: rgba(255,255,255,.42); backdrop-filter: blur(8px); }
@media (pointer: fine) and (min-width: 900px) { .cursor { display: block; } }

.site-header {
  position: fixed;
  z-index: 200;
  top: 16px;
  left: var(--page);
  right: var(--page);
  height: 68px;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  padding: 0 12px 0 10px;
  border: 1px solid transparent;
  border-radius: 22px;
  transition: background .35s, border-color .35s, box-shadow .35s, transform .35s;
}
.site-header.is-scrolled {
  background: rgba(247,247,244,.64);
  border-color: rgba(255,255,255,.78);
  box-shadow: 0 14px 42px rgba(29,31,29,.08), inset 0 1px 0 rgba(255,255,255,.9);
  backdrop-filter: blur(22px) saturate(140%);
}
.brand { display: inline-flex; align-items: center; gap: 10px; width: fit-content; }
.brand__mark {
  width: 40px;
  height: 40px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: rgba(255,255,255,.62);
  border: 1px solid rgba(255,255,255,.88);
  box-shadow: 0 8px 22px rgba(0,0,0,.07), inset 0 1px 0 #fff;
}
.brand__mark img { width: 34px; height: 34px; object-fit: contain; }
.brand__word { font-size: 16px; letter-spacing: -.025em; }
.brand__word strong { font-weight: 720; }
.desktop-nav { display: flex; align-items: center; gap: clamp(26px, 3.4vw, 58px); }
.desktop-nav a { position: relative; font-size: 13px; color: #2b2d2b; }
.desktop-nav a::after { content: ""; position: absolute; left: 0; right: 100%; bottom: -8px; height: 1px; background: #111; transition: right .3s var(--ease); }
.desktop-nav a:hover::after { right: 0; }
.header-actions { justify-self: end; display: flex; align-items: center; gap: 10px; }
.wallet-button {
  position: relative;
  height: 46px;
  padding: 0 17px 0 20px;
  display: inline-flex;
  align-items: center;
  gap: 14px;
  border: 1px solid rgba(255,255,255,.88);
  border-radius: 15px;
  background: rgba(255,255,255,.5);
  box-shadow: 0 10px 28px rgba(0,0,0,.07), inset 0 1px 0 #fff, inset 0 -1px 0 rgba(0,0,0,.04);
  backdrop-filter: blur(18px);
  cursor: pointer;
  transition: transform .25s, background .25s;
}
.wallet-button:hover { background: rgba(255,255,255,.78); }
.wallet-button__label { font-size: 13px; white-space: nowrap; }
.wallet-button__status { width: 8px; height: 8px; border-radius: 50%; background: #171817; box-shadow: 0 0 0 4px rgba(0,0,0,.05); }
.wallet-button.is-connected .wallet-button__status { background: #46a36c; box-shadow: 0 0 0 4px rgba(70,163,108,.13); }
.menu-button { display: none; width: 46px; height: 46px; padding: 0; border: 1px solid rgba(255,255,255,.88); border-radius: 15px; background: rgba(255,255,255,.54); box-shadow: inset 0 1px 0 #fff; cursor: pointer; }
.menu-button span { display: block; width: 18px; height: 1px; margin: 5px auto; background: #111; transition: transform .3s, opacity .3s; }
.menu-button.is-open span:first-child { transform: translateY(3px) rotate(45deg); }
.menu-button.is-open span:last-child { transform: translateY(-3px) rotate(-45deg); }

.mobile-menu { position: fixed; z-index: 190; inset: 0; display: none; padding: 120px var(--page) 34px; background: rgba(245,245,242,.92); backdrop-filter: blur(30px); opacity: 0; visibility: hidden; transition: opacity .35s, visibility .35s; }
.mobile-menu.is-open { opacity: 1; visibility: visible; }
.mobile-menu__glow { position: absolute; width: 70vw; aspect-ratio: 1; right: -30vw; top: 8vh; border-radius: 50%; background: radial-gradient(circle, rgba(255,255,255,.96), transparent 68%); }
.mobile-menu nav { position: relative; display: grid; border-top: 1px solid var(--line); }
.mobile-menu nav a { display: flex; align-items: baseline; gap: 18px; padding: 20px 0; font-size: clamp(32px, 10vw, 54px); letter-spacing: -.06em; border-bottom: 1px solid var(--line); }
.mobile-menu nav a span { font-size: 10px; color: var(--muted); letter-spacing: .08em; }
.mobile-menu__wallet { position: relative; width: 100%; margin-top: auto; }

.hero {
  position: relative;
  min-height: 100svh;
  height: max(760px, 100svh);
  overflow: hidden;
  background: #f7f7f4;
}
.hero__scene { position: absolute; inset: 0; z-index: 0; overflow: hidden; }
.hero__scene picture, .hero__scene img { width: 100%; height: 100%; }
.hero__scene img { object-fit: cover; object-position: center bottom; filter: saturate(.72) contrast(.96) brightness(1.02); transform: scale(1.02); }
.hero__wash { position: absolute; inset: 0; z-index: 1; background: linear-gradient(180deg, rgba(248,248,246,.35) 0%, rgba(248,248,246,.06) 48%, rgba(246,246,243,.08) 100%); }
.hero__grid { position: absolute; inset: 0; z-index: 1; opacity: .16; background-image: linear-gradient(to right, rgba(16,17,16,.08) 1px, transparent 1px), linear-gradient(to bottom, rgba(16,17,16,.06) 1px, transparent 1px); background-size: 7.142vw 7.142vw; mask-image: linear-gradient(to bottom, black, transparent 65%); }

.hero__headline { position: absolute; z-index: 5; top: clamp(104px, 12vh, 132px); left: 50%; width: min(880px, 84vw); transform: translateX(-50%); text-align: center; pointer-events: none; }
.eyebrow { display: inline-flex; align-items: center; justify-content: center; gap: 14px; color: #606360; font-size: 9px; line-height: 1; letter-spacing: .13em; text-transform: uppercase; white-space: nowrap; }
.eyebrow span { padding: 10px 15px; border: 1px solid rgba(0,0,0,.12); border-radius: 999px; background: rgba(255,255,255,.36); box-shadow: inset 0 1px 0 #fff; backdrop-filter: blur(10px); color: #222; }
.eyebrow i { width: 4px; height: 4px; border-radius: 50%; background: #9a9d99; }
.eyebrow em { font-style: normal; }
.hero-title { margin: 22px 0 0; font-weight: 300; line-height: .78; letter-spacing: -.075em; text-transform: uppercase; }
.hero-title__line { display: block; overflow: hidden; }
.hero-title__line--ink { font-size: clamp(76px, 8.15vw, 148px); color: #171817; }
.hero-title__line--chrome { font-size: clamp(72px, 7.6vw, 138px); padding-bottom: .08em; color: transparent; background: linear-gradient(180deg, #ffffff 0%, #5d625f 18%, #f8f8f6 40%, #555a57 62%, #fdfdfc 80%, #424744 100%); -webkit-background-clip: text; background-clip: text; -webkit-text-stroke: 1px rgba(24,27,25,.28); filter: drop-shadow(0 6px 9px rgba(0,0,0,.14)); }
.hero-title__char { display: inline-block; will-change: transform; }
.hero__subcopy { margin: 16px auto 0; color: #565a57; font-size: clamp(12px, 1vw, 15px); line-height: 1.52; letter-spacing: -.01em; }

.coin-stage { position: absolute; z-index: 4; left: 50%; top: 64%; width: clamp(330px, 31vw, 535px); aspect-ratio: 1; transform: translate(-50%,-50%); perspective: 1000px; will-change: transform; }
.coin-stage__coin { position: absolute; inset: 0; z-index: 3; filter: drop-shadow(0 38px 40px rgba(55,51,43,.13)) drop-shadow(0 5px 7px rgba(255,255,255,.9)); transform-style: preserve-3d; will-change: transform; }
.coin-stage__coin img { width: 100%; height: 100%; object-fit: contain; }
.coin-stage__aura { position: absolute; z-index: 0; inset: 9%; border-radius: 50%; background: radial-gradient(circle at 50% 45%, rgba(255,255,255,.98), rgba(255,249,234,.72) 40%, rgba(255,255,255,0) 72%); filter: blur(22px); transform: scale(1.24); }
.coin-stage__orbit { position: absolute; z-index: 1; inset: 1%; border: 1px solid rgba(255,255,255,.9); border-radius: 50%; box-shadow: 0 0 35px rgba(255,255,255,.75), inset 0 0 20px rgba(255,255,255,.8); }
.coin-stage__orbit--one { transform: rotateX(65deg) rotateZ(-12deg) scale(1.15); opacity: .72; }
.coin-stage__orbit--two { transform: rotateY(71deg) rotateZ(18deg) scale(1.08); opacity: .45; }
.coin-stage__shadow { position: absolute; z-index: 0; left: 17%; right: 17%; bottom: -3%; height: 11%; border-radius: 50%; background: rgba(53,50,44,.16); filter: blur(18px); transform: scaleX(1.2); }

.glass-card { background: linear-gradient(145deg, rgba(255,255,255,.58), rgba(255,255,255,.23)); border: 1px solid rgba(255,255,255,.83); box-shadow: var(--shadow); backdrop-filter: blur(22px) saturate(130%); }
.hero-stats { position: absolute; z-index: 6; left: var(--page); bottom: clamp(118px, 14vh, 150px); width: clamp(228px, 18.5vw, 300px); border-radius: 24px; overflow: hidden; }
.stat-row { padding: 16px 18px; border-bottom: 1px solid rgba(30,31,30,.1); }
.stat-row span, .contract-row small { display: block; margin-bottom: 7px; color: #777b78; font-size: 8px; letter-spacing: .1em; text-transform: uppercase; }
.stat-row strong { display: block; font-size: clamp(15px, 1.2vw, 20px); font-weight: 430; letter-spacing: -.035em; text-transform: uppercase; }
.contract-row { width: 100%; min-height: 66px; padding: 14px 17px; display: flex; align-items: center; justify-content: space-between; gap: 12px; border: 0; background: transparent; text-align: left; cursor: pointer; }
.contract-row small { margin-bottom: 5px; }
.contract-row strong { font-size: 10px; font-weight: 580; letter-spacing: .02em; }
.contract-row svg { width: 17px; fill: none; stroke: currentColor; stroke-width: 1.4; }

.hero-cta { position: absolute; z-index: 6; right: var(--page); bottom: clamp(190px, 22vh, 230px); width: clamp(225px, 18vw, 280px); }
.hero-cta__kicker { display: block; margin: 0 0 10px 4px; color: #707471; font-size: 8px; letter-spacing: .13em; }
.button { min-height: 58px; padding: 0 22px; display: inline-flex; align-items: center; justify-content: space-between; gap: 22px; border: 1px solid rgba(255,255,255,.86); border-radius: 18px; cursor: pointer; transition: transform .26s var(--ease), background .26s, box-shadow .26s; }
.button svg { width: 20px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.button--glass { width: 100%; background: rgba(255,255,255,.46); box-shadow: 0 16px 35px rgba(34,35,34,.08), inset 0 1px 0 #fff; backdrop-filter: blur(18px); }
.button--glass:hover { background: rgba(255,255,255,.78); box-shadow: 0 20px 46px rgba(34,35,34,.11), inset 0 1px 0 #fff; }
.button--dark { color: #fff; background: #171817; border-color: #171817; box-shadow: 0 18px 35px rgba(17,18,17,.16); }
.button--dark:hover { background: #2a2b2a; transform: translateY(-2px); }
.button--soft { background: rgba(255,255,255,.62); }
.text-link { margin: 12px 3px 0; padding: 0; display: inline-flex; align-items: center; gap: 8px; border: 0; background: transparent; color: #3e413f; cursor: pointer; font-size: 11px; }
.text-link svg { width: 14px; fill: none; stroke: currentColor; stroke-width: 1.5; }

.community-orb { position: absolute; z-index: 6; right: clamp(32px, 5vw, 92px); top: 43%; width: 112px; aspect-ratio: 1; display: grid; place-items: center; border-radius: 50%; background: radial-gradient(circle at 31% 28%, rgba(255,255,255,.98), rgba(219,222,255,.52) 39%, rgba(255,234,219,.54) 64%, rgba(255,255,255,.82)); border: 1px solid rgba(255,255,255,.9); box-shadow: 0 20px 42px rgba(59,57,76,.12), inset 0 0 0 7px rgba(255,255,255,.24); backdrop-filter: blur(14px); }
.community-orb::after { content: ""; position: absolute; inset: -2px; border-radius: inherit; padding: 1px; background: conic-gradient(from 20deg, #fff, #aee8ff, #dfbdff, #ffd8b7, #fff); -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude; opacity: .85; }
.community-orb span { position: absolute; inset: 8px; animation: orb-spin 13s linear infinite; border-radius: 50%; font-size: 0; }
.community-orb span::before { content: "COMMUNITY FIRST · COMMUNITY FIRST ·"; position: absolute; inset: 0; display: grid; place-items: center; font-size: 7px; letter-spacing: .115em; color: #5b5b68; transform: rotate(-23deg); }
.community-orb svg { width: 25px; fill: none; stroke: #151615; stroke-width: 1.35; }
@keyframes orb-spin { to { transform: rotate(360deg); } }

.hero-features { position: absolute; z-index: 6; left: 50%; bottom: 26px; width: min(1040px, calc(100% - (var(--page) * 2))); min-height: 76px; transform: translateX(-50%); display: grid; grid-template-columns: repeat(4,1fr); border-radius: 22px; overflow: hidden; }
.hero-features > div { display: flex; align-items: center; justify-content: center; gap: 14px; padding: 13px 18px; border-right: 1px solid rgba(0,0,0,.08); }
.hero-features > div:last-child { border-right: 0; }
.feature-icon { width: 28px; height: 28px; display: grid; place-items: center; color: #8b8e8b; font-size: 20px; }
.hero-features p { margin: 0; }
.hero-features strong, .hero-features small { display: block; }
.hero-features strong { font-size: 11px; font-weight: 540; }
.hero-features small { margin-top: 4px; color: #7b7e7b; font-size: 9px; }
.scroll-cue { position: absolute; z-index: 6; left: 50%; bottom: 116px; transform: translateX(-50%); display: none; align-items: center; gap: 10px; color: #707370; font-size: 8px; letter-spacing: .13em; writing-mode: vertical-rl; }
.scroll-cue i { display: block; width: 1px; height: 40px; overflow: hidden; background: linear-gradient(to bottom, #111 0 35%, rgba(0,0,0,.1) 35%); animation: scroll-line 1.8s ease-in-out infinite; }
@keyframes scroll-line { 0%,100%{background-position:0 -30px} 50%{background-position:0 15px} }

.ticker { overflow: hidden; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); background: rgba(255,255,255,.45); }
.ticker__track { width: max-content; height: 58px; display: flex; align-items: center; gap: 28px; animation: ticker 24s linear infinite; }
.ticker span { font-size: 12px; letter-spacing: .14em; }
.ticker i { color: #9a9d99; font-style: normal; }
@keyframes ticker { to { transform: translateX(-50%); } }

.section { position: relative; padding: clamp(100px, 12vw, 190px) var(--page); }
.section__label { color: #686c69; font-size: 9px; letter-spacing: .16em; text-transform: uppercase; }
.section-heading { margin-top: clamp(38px, 5vw, 72px); display: grid; grid-template-columns: minmax(0,1.2fr) minmax(250px,.55fr); gap: 9vw; align-items: end; }
.section-heading--center { display: block; text-align: center; }
.section-heading h2, .faq-intro h2, .community h2 { margin: 0; font-size: clamp(64px, 8.2vw, 154px); line-height: .86; font-weight: 330; letter-spacing: -.075em; text-transform: uppercase; }
.section-heading p, .statement-copy, .faq-intro p, .community__content > p { margin: 0; color: #666a67; font-size: clamp(14px, 1.2vw, 18px); line-height: 1.65; letter-spacing: -.015em; }
.section-heading--center p { margin-top: 22px; }
.word-reveal { display: inline-block; opacity: .13; transition: opacity .25s; }

.philosophy { background: linear-gradient(180deg, #f4f4f1, #ededE9 72%, #f4f4f1); }
.philosophy__statement { margin-top: clamp(42px, 6vw, 92px); display: grid; grid-template-columns: minmax(0,1.4fr) minmax(260px,.52fr); gap: 8vw; align-items: end; }
.statement-title { margin: 0; font-size: clamp(68px, 9vw, 168px); line-height: .84; font-weight: 320; letter-spacing: -.08em; text-transform: uppercase; }
.philosophy-grid { margin-top: clamp(72px, 9vw, 140px); display: grid; grid-template-columns: 1.35fr .75fr; grid-template-rows: minmax(300px, 31vw) minmax(240px, 23vw); gap: 18px; }
.story-card { position: relative; min-height: 300px; padding: clamp(24px, 3vw, 46px); border-radius: 30px; overflow: hidden; background: rgba(255,255,255,.54); border: 1px solid rgba(255,255,255,.88); box-shadow: var(--shadow); }
.story-card--wide { grid-row: 1 / span 2; display: flex; flex-direction: column; justify-content: space-between; background: radial-gradient(circle at 78% 22%, rgba(255,255,255,.98), transparent 40%), linear-gradient(145deg, rgba(255,255,255,.76), rgba(255,255,255,.28)); }
.story-card--image { display: flex; flex-direction: column; justify-content: flex-end; background: #171817; color: #fff; }
.story-card__number { font-size: 11px; letter-spacing: .12em; color: #747774; }
.story-card small { display: block; margin-bottom: 16px; color: #7a7e7a; font-size: 9px; letter-spacing: .15em; }
.story-card--image small { color: rgba(255,255,255,.52); }
.story-card h3 { margin: 0; max-width: 750px; font-size: clamp(28px, 4.3vw, 76px); line-height: .98; font-weight: 360; letter-spacing: -.055em; }
.story-card p { max-width: 590px; margin: 24px 0 0; color: #686b68; font-size: clamp(13px, 1.2vw, 17px); line-height: 1.65; }
.story-card__coin-mini { position: absolute; top: 50%; left: 50%; width: 70%; aspect-ratio: 1; transform: translate(-50%,-54%); border-radius: 50%; background: radial-gradient(circle, rgba(255,255,255,.18), transparent 68%); }
.story-card__coin-mini img { width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 25px 35px rgba(0,0,0,.35)); animation: float-small 4.4s ease-in-out infinite; }
@keyframes float-small { 50% { transform: translateY(-10px) rotate(4deg); } }
.story-card__steam { position: absolute; width: 220px; height: 320px; right: 5%; top: 10%; opacity: .4; }
.story-card__steam i { position: absolute; bottom: 0; width: 1px; height: 100%; background: linear-gradient(to top, transparent, rgba(255,255,255,.96), transparent); filter: blur(4px); animation: steam 4s ease-in-out infinite; }
.story-card__steam i:nth-child(1){left:25%; animation-delay:-1s}.story-card__steam i:nth-child(2){left:52%; animation-delay:-2.3s}.story-card__steam i:nth-child(3){left:76%; animation-delay:-.3s}
@keyframes steam { 0%{transform:translateY(80px) rotate(-8deg);opacity:0}50%{opacity:1}100%{transform:translateY(-100px) rotate(12deg);opacity:0} }

.tokenomics { background: #f5f5f2; }
.metrics-grid { margin-top: clamp(70px, 8vw, 125px); display: grid; grid-template-columns: repeat(2,1fr); gap: 18px; }
.metric-card { position: relative; min-height: clamp(300px, 28vw, 510px); padding: clamp(26px, 3vw, 48px); display: flex; flex-direction: column; justify-content: flex-end; border: 1px solid rgba(255,255,255,.9); border-radius: 32px; overflow: hidden; background: linear-gradient(145deg, rgba(255,255,255,.72), rgba(236,236,232,.56)); box-shadow: 0 30px 70px rgba(29,30,29,.08), inset 0 1px 0 rgba(255,255,255,.95); }
.metric-card--hero { grid-row: span 2; min-height: calc(clamp(300px, 28vw, 510px) * 2 + 18px); background: radial-gradient(circle at 50% 38%, rgba(255,255,255,1), transparent 45%), linear-gradient(160deg,#ededeb,#fafaf8); }
.metric-card--accent { background: linear-gradient(145deg, #1b1c1b, #0d0e0d); color: #fff; }
.metric-card__top { position: absolute; top: clamp(24px, 2.4vw, 38px); left: clamp(26px, 3vw, 48px); right: clamp(26px, 3vw, 48px); display: flex; justify-content: space-between; color: #747774; font-size: 9px; letter-spacing: .14em; }
.metric-card--accent .metric-card__top { color: rgba(255,255,255,.52); }
.metric-card strong { position: relative; z-index: 2; font-size: clamp(60px, 7.2vw, 132px); line-height: .8; font-weight: 330; letter-spacing: -.075em; }
.metric-card small { position: relative; z-index: 2; margin-top: 20px; color: #6e726f; font-size: 12px; letter-spacing: .04em; }
.metric-card--accent small { color: rgba(255,255,255,.56); }
.metric-card--accent img { position: absolute; right: -6%; top: 8%; width: 58%; opacity: .8; filter: drop-shadow(0 20px 45px rgba(0,0,0,.45)); transform: rotate(9deg); }
.metric-card__rings { position: absolute; left: 50%; top: 42%; width: min(34vw, 520px); aspect-ratio: 1; transform: translate(-50%,-50%); }
.metric-card__rings i { position: absolute; inset: 0; border: 1px solid rgba(143,147,143,.18); border-radius: 50%; }
.metric-card__rings i:nth-child(2){inset:13%}.metric-card__rings i:nth-child(3){inset:27%}
.contract-panel { margin-top: 18px; padding: 24px 26px; display: flex; align-items: center; justify-content: space-between; gap: 24px; border-radius: 26px; }
.contract-panel > div span, .ritual-cta small { display: block; margin-bottom: 9px; color: #747774; font-size: 8px; letter-spacing: .15em; }
.contract-panel > div strong { font-size: clamp(14px, 1.4vw, 20px); font-weight: 430; overflow-wrap: anywhere; }
.contract-actions { display: flex; align-items: center; gap: 10px; flex: 0 0 auto; }
.contract-actions .button { white-space: nowrap; }

.ritual { background: linear-gradient(180deg,#ecece8 0%,#f8f8f6 38%,#f0f0ed 100%); }
.ritual-stage { position: relative; margin-top: clamp(70px, 8vw, 130px); display: grid; grid-template-columns: repeat(3,1fr); gap: 18px; }
.ritual-line { position: absolute; z-index: 0; top: 46%; left: 16.66%; right: 16.66%; height: 1px; background: rgba(17,18,17,.14); }
.ritual-line span { display: block; height: 100%; width: 0; background: #111; }
.ritual-step { position: relative; z-index: 1; min-height: 510px; padding: 28px; display: flex; flex-direction: column; border-radius: 30px; background: rgba(255,255,255,.56); border: 1px solid rgba(255,255,255,.9); box-shadow: var(--shadow); }
.ritual-step__index { color: #797c79; font-size: 9px; letter-spacing: .15em; }
.ritual-step__visual { flex: 1; display: grid; place-items: center; }
.ritual-step__visual img { width: 58%; filter: drop-shadow(0 28px 32px rgba(0,0,0,.12)); }
.ritual-step h3 { margin: 0; font-size: clamp(34px, 3vw, 52px); font-weight: 360; letter-spacing: -.055em; }
.ritual-step p { margin: 14px 0 0; color: #696d69; font-size: 13px; line-height: 1.6; }
.mini-wallet { position: relative; width: 58%; aspect-ratio: 1.4; border: 1px solid rgba(0,0,0,.13); border-radius: 24px; background: linear-gradient(145deg,rgba(255,255,255,.95),rgba(221,222,219,.58)); box-shadow: 0 20px 44px rgba(0,0,0,.09), inset 0 1px 0 white; transform: rotate(-5deg); }
.mini-wallet i { position: absolute; right: -4%; top: 31%; width: 38%; height: 37%; border-radius: 14px; background: rgba(255,255,255,.85); border: 1px solid rgba(0,0,0,.12); box-shadow: 0 8px 20px rgba(0,0,0,.08); }
.mini-wallet i::after { content:""; position:absolute; width:9px;height:9px;border-radius:50%;background:#171817;left:22%;top:50%;transform:translateY(-50%); }
.mini-wallet span { position:absolute; left:13%;top:17%;width:27%;height:8%;border-radius:999px;background:#c9cbc7; }
.bowl { position: relative; width: 65%; height: 44%; border-radius: 14px 14px 50% 50% / 12% 12% 88% 88%; background: linear-gradient(180deg,#fff,#dedfdb); box-shadow: 0 25px 36px rgba(0,0,0,.12), inset 0 1px 0 white; }
.bowl span { position:absolute; left:-4%;right:-4%;top:-6%;height:19%;border-radius:50%;background:linear-gradient(180deg,#fff,#d8dad6);border:1px solid rgba(0,0,0,.08); }
.bowl i { position:absolute; bottom:80%; width:2px; height:95%; background:linear-gradient(to top,rgba(255,255,255,0),rgba(255,255,255,.96),rgba(255,255,255,0));filter:blur(3px);animation:steam 3.7s ease-in-out infinite; }
.bowl i:nth-child(1){left:27%}.bowl i:nth-child(2){left:49%;animation-delay:-1.4s}.bowl i:nth-child(3){left:72%;animation-delay:-2.4s}
.ritual-cta { margin-top: 18px; min-height: 160px; padding: 30px 32px; display: flex; align-items: center; justify-content: space-between; gap: 30px; border-radius: 30px; color: #fff; background: radial-gradient(circle at 70% 0%,rgba(255,255,255,.12),transparent 35%), #171817; }
.ritual-cta small { color: rgba(255,255,255,.5); }
.ritual-cta h3 { margin: 0; font-size: clamp(26px, 3vw, 48px); font-weight: 360; letter-spacing: -.05em; }
.ritual-cta .button--dark { background: #fff; color: #111; border-color: #fff; box-shadow: none; min-width: 235px; }

.roadmap { background: #f5f5f2; }
.roadmap-list { margin-top: clamp(70px, 8vw, 120px); border-top: 1px solid var(--line); }
.roadmap-item { position: relative; min-height: 190px; display: grid; grid-template-columns: .55fr 1.6fr .5fr; gap: 30px; align-items: center; border-bottom: 1px solid var(--line); transition: padding .35s var(--ease), background .35s; }
.roadmap-item:hover { padding: 0 24px; background: rgba(255,255,255,.48); }
.roadmap-item__phase, .roadmap-item__status { color: #707471; font-size: 9px; letter-spacing: .14em; }
.roadmap-item__status { justify-self: end; padding: 8px 12px; border: 1px solid var(--line); border-radius: 999px; }
.roadmap-item__body h3 { margin: 0; font-size: clamp(34px, 4vw, 68px); font-weight: 350; letter-spacing: -.055em; }
.roadmap-item__body p { max-width: 690px; margin: 13px 0 0; color: #6a6e6b; font-size: 13px; line-height: 1.55; }

.community { min-height: 100svh; display: grid; place-items: center; overflow: hidden; color: #fff; background: #141514; }
.community::before { content:""; position:absolute; inset:0; background: radial-gradient(circle at 50% 40%,rgba(255,255,255,.1),transparent 26%), linear-gradient(to bottom,rgba(255,255,255,.02),transparent); }
.community__halo { position:absolute; left:50%;top:46%;width:min(86vw,1200px);aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;border:1px solid rgba(255,255,255,.11);box-shadow:0 0 0 7vw rgba(255,255,255,.015),0 0 0 14vw rgba(255,255,255,.012); }
.community__coin { position:absolute; right:-7vw; bottom:-13vw; width:min(49vw,760px); opacity:.16; filter:grayscale(1); transform:rotate(18deg); }
.community__content { position:relative; z-index:2; width:min(1000px,88vw); text-align:center; }
.community .section__label { color:rgba(255,255,255,.48); }
.community h2 { margin-top:42px; font-size:clamp(64px,9vw,165px); }
.community__content > p { max-width:650px; margin:32px auto 0; color:rgba(255,255,255,.58); }
.community__actions { margin-top:42px; display:flex; justify-content:center; gap:12px; }
.community .button { min-width:200px; }
.community .button--dark { background:#fff;color:#111;border-color:#fff;box-shadow:none; }
.community .button--glass { width:auto;color:#fff;background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.18);box-shadow:none; }

.faq { background: linear-gradient(180deg,#efefec,#f7f7f4); }
.faq-layout { margin-top: clamp(50px, 7vw, 100px); display: grid; grid-template-columns: .7fr 1fr; gap: 9vw; }
.faq-intro { position: sticky; top: 128px; align-self: start; }
.faq-intro h2 { font-size: clamp(58px, 6.8vw, 122px); }
.faq-intro p { margin-top: 30px; max-width: 520px; }
.faq-list { border-top: 1px solid var(--line); }
.faq-item { border-bottom: 1px solid var(--line); }
.faq-item summary { min-height: 100px; display: flex; align-items: center; justify-content: space-between; gap: 24px; list-style: none; cursor: pointer; font-size: clamp(18px, 1.7vw, 26px); letter-spacing: -.035em; }
.faq-item summary::-webkit-details-marker { display:none; }
.faq-item summary i { position: relative; flex: 0 0 22px; height: 22px; }
.faq-item summary i::before, .faq-item summary i::after { content:"";position:absolute;left:50%;top:50%;width:16px;height:1px;background:#111;transform:translate(-50%,-50%);transition:transform .3s; }
.faq-item summary i::after { transform:translate(-50%,-50%) rotate(90deg); }
.faq-item[open] summary i::after { transform:translate(-50%,-50%) rotate(0); }
.faq-item p { max-width:760px; margin: -10px 60px 32px 0; color:#696d69; font-size:14px; line-height:1.7; }

.site-footer { padding: 66px var(--page) 26px; overflow: hidden; background: #f7f7f4; border-top: 1px solid var(--line); }
.site-footer__top { display: flex; justify-content: space-between; align-items: flex-start; }
.site-footer__top p { margin: 0; font-size: 18px; line-height: 1.25; text-align: right; }
.site-footer__word { margin: 90px 0 40px; color: #171817; font-size: clamp(70px, 13.3vw, 250px); line-height: .74; letter-spacing: -.09em; white-space: nowrap; }
.site-footer__bottom { padding-top: 22px; display: flex; justify-content: space-between; gap: 20px; border-top: 1px solid var(--line); color: #717572; font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }
.site-footer__bottom a { color: #222; }

.modal { position: fixed; z-index: 500; inset: 0; display: grid; place-items: center; padding: 20px; opacity: 0; visibility: hidden; transition: opacity .3s, visibility .3s; }
.modal.is-open { opacity: 1; visibility: visible; }
.modal__backdrop { position: absolute; inset: 0; background: rgba(20,21,20,.22); backdrop-filter: blur(15px); }
.modal__panel { position: relative; z-index: 1; width: min(480px,100%); max-height: calc(100svh - 40px); overflow: auto; padding: 36px; border-radius: 30px; background: rgba(248,248,245,.84); transform: translateY(18px) scale(.98); transition: transform .35s var(--ease); }
.modal.is-open .modal__panel { transform: translateY(0) scale(1); }
.modal__panel > img { width: 84px; margin-bottom: 20px; filter: drop-shadow(0 14px 22px rgba(0,0,0,.12)); }
.modal__close { position: absolute; right: 18px; top: 18px; width: 38px; height: 38px; border: 1px solid rgba(0,0,0,.09); border-radius: 50%; background: rgba(255,255,255,.5); cursor: pointer; font-size: 23px; font-weight: 300; }
.modal__kicker { display:block;color:#747774;font-size:8px;letter-spacing:.15em; }
.modal h2 { margin: 14px 0 10px; font-size: 42px; line-height: .98; font-weight: 360; letter-spacing: -.055em; }
.modal__panel > p { margin: 0 0 24px; color: #676b68; font-size: 13px; line-height: 1.6; }
.wallet-option { width:100%; min-height:78px; margin-top:10px; padding:12px 16px; display:grid; grid-template-columns:42px 1fr auto; gap:12px; align-items:center; text-align:left; border:1px solid rgba(0,0,0,.09); border-radius:18px; background:rgba(255,255,255,.58); cursor:pointer; }
.wallet-option:hover:not(:disabled){background:#fff}.wallet-option--disabled{opacity:.46;cursor:not-allowed}.wallet-option__icon{width:42px;height:42px;display:grid;place-items:center;border-radius:13px;background:#171817;color:#fff}.wallet-option strong,.wallet-option small{display:block}.wallet-option strong{font-size:14px}.wallet-option small{margin-top:5px;color:#757875;font-size:10px}.wallet-option i{font-style:normal;font-size:10px;letter-spacing:.1em}
.modal__legal { display:block;margin-top:20px;color:#858885;font-size:9px;line-height:1.5; }
.modal__panel--redeem { width:min(600px,100%); }
.redeem-visual { position:relative;width:120px;height:100px;margin-bottom:16px; }.redeem-visual img{position:relative;z-index:1;width:88px;filter:drop-shadow(0 15px 22px rgba(0,0,0,.14));}.redeem-visual span{position:absolute;left:2px;right:2px;bottom:3px;height:20px;border-radius:50%;background:rgba(0,0,0,.12);filter:blur(9px)}
.modal__panel ol{list-style:none;padding:0;margin:28px 0}.modal__panel li{display:grid;grid-template-columns:35px 1fr;gap:14px;padding:16px 0;border-top:1px solid var(--line)}.modal__panel li:last-child{border-bottom:1px solid var(--line)}.modal__panel li>span{color:#7a7d7a;font-size:9px;letter-spacing:.12em}.modal__panel li p{margin:0}.modal__panel li strong,.modal__panel li small{display:block}.modal__panel li strong{font-size:14px}.modal__panel li small{margin-top:5px;color:#747774;font-size:10px;line-height:1.45}.modal__panel--redeem .button{width:100%}
.toast { position: fixed; z-index: 800; left: 50%; bottom: 28px; max-width: calc(100% - 40px); padding: 13px 18px; border-radius: 999px; color: #fff; background: rgba(17,18,17,.92); box-shadow: 0 16px 36px rgba(0,0,0,.2); font-size: 11px; letter-spacing: .02em; transform: translate(-50%,20px); opacity: 0; visibility: hidden; transition: opacity .25s, transform .25s, visibility .25s; }
.toast.is-visible { opacity: 1; visibility: visible; transform: translate(-50%,0); }

.reveal, .reveal-card { opacity: 0; transform: translateY(28px); }
.hero .reveal-card { opacity: 1; transform: none; }
.is-revealed { opacity: 1; transform: translateY(0); transition: opacity .9s var(--ease), transform .9s var(--ease); }

@media (max-width: 1180px) {
  .desktop-nav { gap: 24px; }
  .community-orb { display: none; }
  .hero-cta { right: 28px; }
  .hero-stats { left: 28px; }
}

@media (max-width: 900px) {
  :root { --page: 20px; --header-h: 80px; }
  .site-header { top: 10px; height: 60px; grid-template-columns: 1fr auto; }
  .desktop-nav, .wallet-button { display: none; }
  .menu-button, .mobile-menu { display: block; }
  .mobile-menu { display: flex; flex-direction: column; }
  .hero { height: auto; min-height: 960px; padding-bottom: 190px; }
  .hero__scene img { object-position: center bottom; }
  .hero__grid { background-size: 20vw 20vw; opacity: .08; }
  .hero__headline { top: 102px; width: calc(100% - 28px); }
  .hero__eyebrow em, .hero__eyebrow i { display: none; }
  .hero-title { margin-top: 17px; }
  .hero-title__line--ink { font-size: clamp(58px, 18vw, 96px); }
  .hero-title__line--chrome { font-size: clamp(56px, 17vw, 92px); }
  .hero__subcopy { margin-top: 14px; font-size: 12px; }
  .coin-stage { top: 56%; width: min(82vw, 470px); }
  .hero-stats { left: 20px; right: 20px; bottom: 110px; width: auto; display: grid; grid-template-columns: repeat(2,1fr); }
  .stat-row { min-height: 72px; }
  .contract-row { border-left: 1px solid rgba(0,0,0,.08); }
  .hero-cta, .hero-features { display: none; }
  .scroll-cue { display: none; }
  .section { padding-top: 100px; padding-bottom: 100px; }
  .section-heading, .philosophy__statement, .faq-layout { grid-template-columns: 1fr; gap: 32px; }
  .section-heading h2, .faq-intro h2, .community h2 { font-size: clamp(56px, 15vw, 96px); }
  .statement-title { font-size: clamp(58px, 15vw, 100px); }
  .philosophy-grid { grid-template-columns: 1fr; grid-template-rows: auto; }
  .story-card--wide { grid-row: auto; min-height: 520px; }
  .story-card { min-height: 400px; }
  .metrics-grid { grid-template-columns: 1fr; }
  .metric-card--hero { grid-row: auto; min-height: 520px; }
  .metric-card { min-height: 380px; }
  .contract-panel, .ritual-cta { align-items: flex-start; flex-direction: column; }
  .contract-actions { width: 100%; flex-direction: column; }
  .contract-panel .button, .ritual-cta .button { width: 100%; }
  .ritual-stage { grid-template-columns: 1fr; }
  .ritual-line { display: none; }
  .ritual-step { min-height: 480px; }
  .roadmap-item { grid-template-columns: 1fr auto; min-height: 0; padding: 30px 0; }
  .roadmap-item__body { grid-column: 1 / -1; grid-row: 2; }
  .roadmap-item__status { grid-column: 2; grid-row: 1; }
  .faq-intro { position: static; }
  .community { min-height: 820px; }
  .community__coin { width: 90vw; right: -30vw; bottom: -15vw; }
  .site-footer__word { margin-top: 70px; }
}

@media (max-width: 560px) {
  .brand__word { font-size: 14px; }
  .brand__mark { width: 37px; height: 37px; }
  .brand__mark img { width: 31px; height: 31px; }
  .hero { min-height: 900px; }
  .hero__scene img { object-fit: cover; }
  .hero__headline { top: 92px; }
  .eyebrow span { padding: 9px 12px; font-size: 8px; }
  .hero__subcopy br { display: none; }
  .coin-stage { top: 56%; width: 88vw; }
  .hero-stats { bottom: 96px; border-radius: 21px; }
  .stat-row { padding: 13px 14px; }
  .stat-row strong { font-size: 13px; }
  .contract-row { padding: 12px 14px; }
  .ticker__track { height: 52px; }
  .section { padding-left: 18px; padding-right: 18px; }
  .story-card, .metric-card, .ritual-step { border-radius: 24px; }
  .story-card--wide { min-height: 470px; }
  .story-card { min-height: 360px; }
  .metric-card--hero { min-height: 470px; }
  .metric-card { min-height: 330px; }
  .metric-card strong { font-size: clamp(54px, 18vw, 82px); }
  .ritual-step { min-height: 430px; }
  .community__actions { flex-direction: column; }
  .community .button { width: 100%; }
  .faq-item summary { min-height: 84px; font-size: 18px; }
  .faq-item p { margin-right: 0; }
  .site-footer__top, .site-footer__bottom { flex-direction: column; align-items: flex-start; }
  .site-footer__top p { text-align: left; margin-top: 24px; }
  .site-footer__bottom { display: flex; }
  .modal__panel { padding: 28px 20px 22px; border-radius: 24px; }
  .modal h2 { font-size: 35px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
  .reveal, .reveal-card { opacity: 1; transform: none; }
  .preloader { display: none; }
}