/* bHiggs — base system
   Concept: liquid black and lemon yellow, taken from the logo. Surfaces are glossy "gel"
   objects (buttons, cards) on a yellow-tinted black ground; one full-bleed yellow section
   per page flips the palette. Left-aligned, oversized wide type. */

@font-face{font-family:"Unbounded";src:url(../fonts/unbounded-latin-wght-normal.woff2) format("woff2");font-weight:200 900;font-display:swap}
@font-face{font-family:"Instrument Sans";src:url(../fonts/instrument-sans-latin-wght-normal.woff2) format("woff2");font-weight:400 700;font-display:swap}
@font-face{font-family:"Geist Mono";src:url(../fonts/geist-mono-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Geist Mono";src:url(../fonts/geist-mono-latin-500-normal.woff2) format("woff2");font-weight:500;font-display:swap}

:root{
  /* colour: 4 core + support */
  --ink:#0b0b07;        /* ground, yellow-tinted black */
  --ink-2:#12120b;      /* raised surface */
  --ink-3:#1b1b10;      /* gel surface */
  --line:#2a2a19;
  --line-2:#3b3b24;
  --text:#f7f4dc;
  --muted:#a9a68b;
  --dim:#77755f;
  --y:#fde502;          /* logo yellow */
  --y-hi:#fff59a;
  --y-lo:#d4b400;
  --y-ink:#1a1700;      /* text on yellow */
  --ok:#7ef0a8;
  --bad:#ff8a78;

  /* type */
  --f-display:"Unbounded","Arial Black",system-ui,sans-serif;
  --f-body:"Instrument Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --f-mono:"Geist Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;

  /* layout */
  --gutter:clamp(16px,4vw,48px);
  --maxw:1320px;
  --r-pebble:30px;
  --r-pill:999px;
  --ease:cubic-bezier(.2,.8,.2,1);
  --ease-io:cubic-bezier(.76,0,.24,1);
  --nav-h:72px;
  color-scheme:dark;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:auto}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-stopped{overflow:hidden}
body{margin:0;background:var(--ink);color:var(--text);font:400 1.0625rem/1.55 var(--f-body);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden;min-height:100vh}
img,video,canvas,svg{display:block;max-width:100%}
a{color:inherit}
button,input,textarea,select{font:inherit;color:inherit}
::selection{background:var(--y);color:var(--y-ink)}
:focus-visible{outline:3px solid var(--y);outline-offset:3px;border-radius:6px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- type ---------- */
h1,h2,h3,h4{font-family:var(--f-display);font-weight:700;letter-spacing:-.035em;line-height:1;margin:0;text-wrap:balance}
p{margin:0}
.t-hero{font-size:clamp(2.25rem,5.4vw,5.6rem);font-weight:800;line-height:.96;letter-spacing:-.05em}
.t-xl{font-size:clamp(1.9rem,4.2vw,4rem);line-height:1;letter-spacing:-.045em}
.t-lg{font-size:clamp(1.4rem,2.3vw,2.1rem);letter-spacing:-.04em}
.t-md{font-size:1.15rem;letter-spacing:-.025em}
.lead{font-size:clamp(1.05rem,1.35vw,1.25rem);color:var(--muted);max-width:50ch;text-wrap:pretty}
.mono{font-family:var(--f-mono);font-weight:500;letter-spacing:-.01em}
.muted{color:var(--muted)}
.ticker{font-family:var(--f-mono);font-weight:500;color:var(--y)}

/* split-text lines (hero + section titles) */
.ln{display:block;overflow:hidden;padding-bottom:.08em;margin-bottom:-.08em}
.ln>span{display:block;will-change:transform}

/* ---------- layout ---------- */
.wrap{width:min(var(--maxw),100% - 2*var(--gutter));margin-inline:auto}
.sec{padding-block:clamp(72px,10vw,150px)}
.sec-tight{padding-block:clamp(48px,6vw,96px)}
.on-y{background:var(--y);color:var(--y-ink);--muted:#4b4400;--line:rgba(26,23,0,.22);--line-2:rgba(26,23,0,.4);--text:#1a1700}
.on-y ::selection{background:var(--y-ink);color:var(--y)}
.on-y :focus-visible{outline-color:var(--y-ink)}

/* ---------- buttons (gel) ---------- */
.btn{--h:54px;position:relative;isolation:isolate;display:inline-flex;align-items:center;justify-content:center;gap:.65em;height:var(--h);padding:0 1.55em;border:0;border-radius:var(--r-pill);font:600 .98rem/1 var(--f-body);letter-spacing:-.01em;text-decoration:none;white-space:nowrap;cursor:pointer;transition:transform .4s var(--ease),box-shadow .4s var(--ease),filter .3s}
.btn:active{transform:translateY(1px) scale(.985)}
.btn-y{background:linear-gradient(180deg,var(--y-hi) 0%,var(--y) 40%,var(--y-lo) 100%);color:var(--y-ink);box-shadow:inset 0 2px 0 rgba(255,255,255,.7),inset 0 -4px 0 rgba(0,0,0,.16),0 14px 34px -14px rgba(253,229,2,.6)}
.btn-y:hover{box-shadow:inset 0 2px 0 rgba(255,255,255,.8),inset 0 -4px 0 rgba(0,0,0,.16),0 18px 44px -12px rgba(253,229,2,.8);filter:saturate(1.1)}
.btn-k{background:linear-gradient(180deg,#2a2a1b,#0e0e08);color:var(--text);box-shadow:inset 0 1.5px 0 rgba(255,255,255,.22),inset 0 -3px 0 rgba(0,0,0,.55),0 0 0 1.5px var(--line-2)}
.btn-k:hover{box-shadow:inset 0 1.5px 0 rgba(255,255,255,.3),inset 0 -3px 0 rgba(0,0,0,.55),0 0 0 1.5px var(--y)}
.on-y .btn-k{background:linear-gradient(180deg,#2c2c1c,#050503);color:var(--y);box-shadow:inset 0 1.5px 0 rgba(255,255,255,.28),inset 0 -3px 0 rgba(0,0,0,.6),0 14px 30px -14px rgba(0,0,0,.6)}
.btn-lg{--h:64px;font-size:1.1rem;padding:0 2.1em}
.btn-sm{--h:42px;font-size:.9rem;padding:0 1.2em}
.btn[disabled]{opacity:.5;cursor:not-allowed;filter:grayscale(.4)}
.btn svg{width:1.1em;height:1.1em;flex:none}
.link{display:inline-flex;gap:.5em;align-items:center;font-weight:600;text-decoration:none;border-bottom:2px solid currentColor;padding-bottom:2px}
.link:hover{color:var(--y)}
.on-y .link:hover{color:var(--y-ink);border-color:transparent;background:var(--y-ink);color:var(--y)}

/* ---------- pills ---------- */
.pill{display:inline-flex;align-items:center;gap:.5em;height:28px;padding:0 .8em;border-radius:var(--r-pill);font:500 .78rem/1 var(--f-mono);background:rgba(255,255,255,.07);box-shadow:inset 0 0 0 1px rgba(255,255,255,.1);white-space:nowrap}
.pill-y{background:var(--y);color:var(--y-ink);box-shadow:none}
.pill i{width:7px;height:7px;border-radius:50%;background:var(--y);box-shadow:0 0 0 3px rgba(253,229,2,.22)}
.pill-live i{animation:blink 1.6s ease-in-out infinite}
@keyframes blink{50%{opacity:.35}}

/* ---------- navigation ---------- */
.nav{position:fixed;z-index:60;top:14px;left:var(--gutter);right:var(--gutter);max-width:var(--maxw);margin-inline:auto;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 8px 8px 10px;border-radius:var(--r-pill);background:rgba(11,11,7,.6);-webkit-backdrop-filter:blur(18px) saturate(1.3);backdrop-filter:blur(18px) saturate(1.3);box-shadow:inset 0 1px 0 rgba(255,255,255,.09),0 0 0 1px rgba(255,255,255,.07),0 18px 40px -20px rgba(0,0,0,.8);transition:transform .6s var(--ease)}
.nav.is-hidden{transform:translateY(-130%)}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;font:700 1.1rem/1 var(--f-display);letter-spacing:-.04em;padding-right:6px}
.brand img{width:40px;height:40px;filter:drop-shadow(0 6px 10px rgba(0,0,0,.45))}
.nav-links{display:flex;gap:2px;list-style:none;margin:0;padding:0}
.nav-links a{display:block;padding:10px 16px;border-radius:var(--r-pill);text-decoration:none;font-weight:500;font-size:.95rem;color:var(--muted);transition:color .25s,background .25s;position:relative}
.nav-links a:hover{color:var(--text);background:rgba(255,255,255,.06)}
.nav-links a[aria-current="page"]{color:var(--text)}
.nav-links a[aria-current="page"]::after{content:"";position:absolute;left:50%;bottom:3px;width:5px;height:5px;margin-left:-2.5px;border-radius:50%;background:var(--y)}
.nav-links .new{margin-left:6px;font:500 .62rem/1 var(--f-mono);background:var(--y);color:var(--y-ink);padding:3px 6px;border-radius:6px;vertical-align:2px}
.nav-right{display:flex;gap:8px;align-items:center}
.chain{display:none;align-items:center;gap:7px;font:500 .78rem/1 var(--f-mono);color:var(--muted);padding:0 10px}
.chain::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--ok)}
.nav-x{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.07);color:var(--text);transition:background .3s var(--ease),color .3s var(--ease),transform .3s var(--ease)}
.nav-x:hover{background:var(--y);color:var(--y-ink);transform:translateY(-1px)}
.burger{display:none;width:44px;height:44px;border-radius:50%;border:0;background:rgba(255,255,255,.07);cursor:pointer;position:relative}
.burger span{position:absolute;left:13px;right:13px;height:2px;background:var(--text);border-radius:2px;transition:transform .45s var(--ease),top .45s var(--ease)}
.burger span:nth-child(1){top:18px}.burger span:nth-child(2){top:25px}
.menu-open .burger span:nth-child(1){top:21px;transform:rotate(45deg)}
.menu-open .burger span:nth-child(2){top:21px;transform:rotate(-45deg)}
.menu{position:fixed;inset:0;z-index:55;background:var(--ink);padding:calc(var(--nav-h) + 40px) var(--gutter) 40px;display:flex;flex-direction:column;justify-content:space-between;clip-path:inset(0 0 100% 0);visibility:hidden;transition:clip-path .7s var(--ease-io),visibility 0s .7s}
.menu-open .menu{clip-path:inset(0);visibility:visible;transition:clip-path .7s var(--ease-io)}
.menu ul{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.menu a{font:700 clamp(2rem,9vw,3.2rem)/1.1 var(--f-display);letter-spacing:-.045em;text-decoration:none;display:block;padding:6px 0}
.menu a[aria-current="page"]{color:var(--y)}
.menu small{color:var(--muted);font-size:.9rem;max-width:36ch}
@media (min-width:1180px){.chain.is-on{display:inline-flex}}
@media (max-width:980px){.nav-links,.nav-right .btn-y,.nav-right .btn-k,.nav-x-w{display:none}.burger{display:block}.nav-right .btn-wallet{display:inline-flex}}
@media (max-width:980px){.nav-right .btn-wallet{--h:42px;font-size:.85rem;padding:0 1em}}

/* ---------- wipe + preloader ---------- */
.wipe{position:fixed;inset:0;z-index:300;pointer-events:none;background:var(--y);color:var(--y-ink);display:grid;place-items:center;clip-path:inset(100% 0 0 0)}
.wipe-in .wipe{clip-path:inset(0)}
.wipe-logo{width:min(150px,32vw);height:auto;filter:drop-shadow(0 20px 24px rgba(0,0,0,.25))}
.wipe-count{position:absolute;left:var(--gutter);bottom:calc(var(--gutter) - 6px);font:800 clamp(4rem,16vw,13rem)/.8 var(--f-display);letter-spacing:-.07em;font-variant-numeric:tabular-nums;display:none}
.wipe-first .wipe-count{display:block}
.wipe-first .wipe-logo{width:min(240px,46vw)}
.wipe-line{position:absolute;left:var(--gutter);right:var(--gutter);bottom:calc(var(--gutter) + clamp(4rem,16vw,13rem)*.9);height:2px;background:rgba(26,23,0,.18);display:none}
.wipe-first .wipe-line{display:block}
.wipe-line i{display:block;height:100%;width:100%;background:var(--y-ink);transform-origin:left;transform:scaleX(0)}

/* ---------- cursor ---------- */
.cur,.cur-dot{position:fixed;left:0;top:0;z-index:250;pointer-events:none;opacity:0;will-change:transform}
.cur{width:44px;height:44px;margin:-22px 0 0 -22px;border-radius:50%;border:1.5px solid var(--y);display:grid;place-items:center;font:600 .72rem/1 var(--f-mono);color:var(--y-ink);transition:width .35s var(--ease),height .35s var(--ease),margin .35s var(--ease),background .3s,border-color .3s,opacity .3s}
.cur-dot{width:6px;height:6px;margin:-3px 0 0 -3px;border-radius:50%;background:var(--y)}
.has-cursor .cur,.has-cursor .cur-dot{opacity:1}
.cur.is-hover{width:70px;height:70px;margin:-35px 0 0 -35px;background:rgba(253,229,2,.14)}
.cur.is-label{width:96px;height:96px;margin:-48px 0 0 -48px;background:var(--y);border-color:var(--y)}
.cur.is-hidden,.cur-dot.is-hidden{opacity:0!important}
@media (hover:none),(pointer:coarse){.cur,.cur-dot{display:none}}

/* ---------- gloss / tilt helpers ---------- */
.gloss{position:relative;overflow:hidden}
.gloss::after{content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;background:radial-gradient(260px circle at var(--mx,50%) var(--my,-30%),rgba(255,255,255,.2),transparent 62%);opacity:0;transition:opacity .4s}
.gloss:hover::after{opacity:1}
[data-tilt]{transform-style:preserve-3d;will-change:transform}

/* ---------- marquee ---------- */
.marquee{display:flex;overflow:hidden;user-select:none;--gap:clamp(24px,3vw,44px);gap:var(--gap)}
.marquee-track{flex:none;display:flex;align-items:center;gap:var(--gap);min-width:100%;justify-content:space-around;animation:mq var(--dur,48s) linear infinite}
.marquee.rev .marquee-track{animation-direction:reverse}
.marquee:hover .marquee-track{animation-play-state:paused}
@keyframes mq{to{transform:translateX(calc(-100% - var(--gap)))}}

/* ---------- modal ---------- */
dialog.modal{border:0;padding:0;background:transparent;color:var(--text);max-width:min(960px,100% - 2*var(--gutter));width:100%;margin:auto;overflow:visible}
dialog.modal::backdrop{background:rgba(4,4,2,.82);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.modal-body{position:relative;border-radius:var(--r-pebble);background:var(--ink-2);box-shadow:0 0 0 1px var(--line-2),0 50px 100px -30px #000;overflow:hidden}
.modal-x{position:absolute;top:14px;right:14px;z-index:3;width:44px;height:44px;border-radius:50%;border:0;background:rgba(0,0,0,.55);color:var(--text);cursor:pointer;display:grid;place-items:center;box-shadow:0 0 0 1px rgba(255,255,255,.15)}
.modal-x:hover{background:var(--y);color:var(--y-ink)}
dialog.modal[open] .modal-body{animation:pop .5s var(--ease)}
@keyframes pop{from{opacity:0;transform:translateY(24px) scale(.97)}}

/* ---------- footer ---------- */
.foot{position:relative;padding-top:clamp(56px,8vw,110px);overflow:hidden;border-top:1px solid var(--line)}
.foot-grid{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:40px}
.foot h4{font:600 .95rem/1 var(--f-body);letter-spacing:0;color:var(--muted);margin-bottom:18px}
.foot ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.foot li a{text-decoration:none;font-weight:500}
.foot li a:hover{color:var(--y)}
.foot-blurb{max-width:34ch;color:var(--muted);margin-top:16px}
.foot-fine{margin-top:56px;padding-block:22px;border-top:1px solid var(--line);display:flex;gap:20px 40px;justify-content:space-between;flex-wrap:wrap;color:var(--dim);font-size:.88rem}
.foot-fine p{max-width:78ch}
.foot-mark{font:800 clamp(4rem,19.5vw,18rem)/.74 var(--f-display);letter-spacing:-.045em;color:var(--ink-3);white-space:nowrap;margin:24px 0 .12em;user-select:none;text-align:center}
@media (max-width:820px){.foot-grid{grid-template-columns:1fr 1fr}.foot-grid>div:first-child{grid-column:1/-1}}

/* ---------- forms ---------- */
.field{display:grid;gap:8px}
.field>label,.label{font-weight:600;font-size:.95rem}
.field small{color:var(--muted);font-size:.85rem}
.in{width:100%;padding:16px 18px;border-radius:18px;border:0;background:var(--ink-3);color:var(--text);box-shadow:inset 0 0 0 1.5px var(--line-2),inset 0 3px 8px rgba(0,0,0,.35);outline:none;transition:box-shadow .25s}
.in::placeholder{color:var(--dim)}
.in:focus{box-shadow:inset 0 0 0 2px var(--y),0 0 0 5px rgba(253,229,2,.14)}
textarea.in{min-height:116px;resize:vertical;line-height:1.5}


/* ---------- word-mask reveal ---------- */
.wm{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.14em;margin-bottom:-.14em;padding-right:.04em;margin-right:-.04em}
.wi{display:inline-block;will-change:transform}

/* ---------- toast ---------- */
.toast{position:fixed;left:50%;bottom:max(24px,env(safe-area-inset-bottom));z-index:400;transform:translate(-50%,24px);opacity:0;pointer-events:none;max-width:min(92vw,460px);padding:14px 20px;border-radius:18px;background:var(--text);color:var(--ink);font-weight:600;font-size:.95rem;box-shadow:0 20px 50px -10px rgba(0,0,0,.7);transition:transform .5s var(--ease),opacity .3s}
.toast.show{transform:translate(-50%,0);opacity:1}

/* ---------- accordion ---------- */
.acc{border-top:1px solid var(--line)}
.acc-item{border-bottom:1px solid var(--line)}
.acc-q{all:unset;box-sizing:border-box;width:100%;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:26px 0;cursor:pointer;font:600 clamp(1.05rem,1.5vw,1.3rem)/1.3 var(--f-display);letter-spacing:-.03em}
.acc-q:focus-visible{outline:3px solid var(--y);outline-offset:2px;border-radius:8px}
.acc-q i{flex:none;position:relative;width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.07);box-shadow:inset 0 0 0 1px rgba(255,255,255,.1);transition:background .3s,transform .5s var(--ease)}
.acc-q i::before,.acc-q i::after{content:"";position:absolute;left:50%;top:50%;width:14px;height:2px;margin:-1px 0 0 -7px;background:currentColor;border-radius:2px;transition:transform .45s var(--ease)}
.acc-q i::after{transform:rotate(90deg)}
.acc-item.open .acc-q i{background:var(--y);color:var(--y-ink);transform:rotate(180deg)}
.acc-item.open .acc-q i::after{transform:rotate(0)}
.acc-a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .55s var(--ease)}
.acc-item.open .acc-a{grid-template-rows:1fr}
.acc-a>div{overflow:hidden}
.acc-a p{padding:0 70px 28px 0;color:var(--muted);max-width:68ch}
.acc-a p+p{margin-top:-12px}

/* ---------- reduced motion ---------- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
  .marquee-track{animation:none!important}
}
