/* ==========================================================
   Loaf — clean modern, flat, zero shadows
   ========================================================== */

:root{
  /* ---- light theme (default) ---- */
  --ink:        #0d1410;
  --ink-2:      #384437;
  --muted:      #6b7a6e;
  --line:       #e3e9e2;
  --line-2:     #eef2ed;
  --line-hover: #c9d6c6;
  --bg:         #ffffff;
  --bg-alt:     #f5f8f4;
  --surface:    #ffffff;
  --glow:       #f0f8ec;
  --nav-bg:     #ffffffe6;
  --nav-bg-2:   #fffffff2;
  --tint:       #f1f9ee;
  --tint-line:  #d3ead0;
  --on-solid:   #ffffff;
  --warn:       #8a5a00;
  --warn-bg:    #fdf5e6;
  --warn-line:  #f0e0bd;
  --green:      #3fa62f;
  --green-2:    #2f8a22;
  --lime:       #8fe04d;
  --deep:       #10251a;
  --up:         #1f9d3a;
  --dn:         #cf4b3a;

  --r:        14px;
  --r-sm:     10px;
  --wrap:     1200px;
  --ease:     cubic-bezier(.22,.61,.36,1);

  --f-sans:   "Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --f-mono:   "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  color-scheme: light;
}

/* ---- dark theme ---- */
:root[data-theme="dark"]{
  --ink:        #e9f1ea;
  --ink-2:      #bccbbe;
  --muted:      #8b9c8e;
  --line:       #202b23;
  --line-2:     #1a231c;
  --line-hover: #34473a;
  --bg:         #0a0f0c;
  --bg-alt:     #0e1512;
  --surface:    #101713;
  --glow:       #13251a;
  --nav-bg:     #0a0f0ce6;
  --nav-bg-2:   #0a0f0cf5;
  --tint:       #13251a;
  --tint-line:  #24422c;
  --on-solid:   #0a0f0c;
  --warn:       #e0b45f;
  --warn-bg:    #241d0f;
  --warn-line:  #3d3116;
  --green:      #62cf4e;
  --green-2:    #8be070;
  --deep:       #0c1a12;
  --up:         #4fc266;
  --dn:         #e2705f;

  color-scheme: dark;
}

/* theme swap should not animate every element on the page */
:root[data-theme] body{ transition:background-color .25s var(--ease), color .25s var(--ease); }

*,*::before,*::after{ box-sizing:border-box; }

html{ scroll-behavior:smooth; scroll-padding-top:96px; }

body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:var(--f-sans);
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
h1,h2,h3,h4{ margin:0; line-height:1.14; letter-spacing:-.022em; font-weight:800; }
p{ margin:0; }
ul,ol,dl,dd{ margin:0; padding:0; list-style:none; }

.wrap{ width:100%; max-width:var(--wrap); margin-inline:auto; padding-inline:24px; }
.sr-only{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.accent{ color:var(--green); }
.up{ color:var(--up); }
.dn{ color:var(--dn); }

/* ── buttons ─────────────────────────────────────────────── */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  height:44px; padding:0 20px;
  border:1px solid transparent; border-radius:999px;
  font-size:14.5px; font-weight:700; letter-spacing:-.01em;
  cursor:pointer; white-space:nowrap;
  transition:background .18s var(--ease), color .18s var(--ease),
             border-color .18s var(--ease), transform .18s var(--ease);
}
.btn--lg{ height:52px; padding:0 28px; font-size:15.5px; }
.btn--solid{ background:var(--ink); color:var(--on-solid); }
.btn--solid:hover{ background:var(--green); transform:translateY(-1px); }
.btn--line{ background:var(--surface); color:var(--ink); border-color:var(--line); }
.btn--line:hover{ border-color:var(--ink); transform:translateY(-1px); }
.btn--ghost{ background:transparent; color:var(--ink-2); }
.btn--ghost:hover{ color:var(--ink); }

.link{ font-weight:700; font-size:14.5px; color:var(--green); }
.link:hover{ color:var(--green-2); }

/* ── ticker ──────────────────────────────────────────────── */
.ticker{
  background:var(--deep); color:#dbe7dc;
  border-bottom:1px solid #16362459;
  overflow:hidden;
}
.ticker__track{ display:flex; width:max-content; animation:slide 42s linear infinite; }
.ticker__group{ display:flex; }
.tick{
  display:inline-flex; align-items:center; gap:8px;
  padding:9px 26px; font-family:var(--f-mono); font-size:12.5px; letter-spacing:-.01em;
  border-right:1px solid #ffffff14; white-space:nowrap;
}
.tick b{ color:#fff; font-weight:500; }
.tick u{ text-decoration:none; font-variant-numeric:tabular-nums; }
.tick i{ font-style:normal; }
.tick .up{ color:var(--lime); }
.tick .dn{ color:#ff8f7d; }
/* runs left -> right */
@keyframes slide{ from{ transform:translate3d(-50%,0,0); } to{ transform:translate3d(0,0,0); } }
.ticker:hover .ticker__track{ animation-play-state:paused; }

/* ── nav ─────────────────────────────────────────────────── */
.nav{
  position:sticky; top:0; z-index:60;
  background:var(--nav-bg); backdrop-filter:saturate(1.4) blur(12px);
  border-bottom:1px solid transparent;
  transition:border-color .2s var(--ease), background .2s var(--ease);
}
.nav.is-stuck{ border-bottom-color:var(--line); background:var(--nav-bg-2); }
.nav__inner{ display:flex; align-items:center; gap:28px; height:72px; }

.brand{ display:inline-flex; align-items:center; gap:10px; }
.brand__mark{ width:26px; height:auto; }
.brand__name{ font-size:20px; font-weight:800; letter-spacing:-.03em; }

.nav__links{ display:flex; gap:26px; margin-left:8px; }
.nav__links a{
  font-size:14.5px; font-weight:600; color:var(--ink-2);
  padding:6px 0; position:relative;
  transition:color .16s var(--ease);
}
.nav__links a::after{
  content:""; position:absolute; left:0; bottom:0; height:2px; width:0;
  background:var(--green); transition:width .22s var(--ease);
}
.nav__links a:hover{ color:var(--ink); }
.nav__links a:hover::after{ width:100%; }

.nav__cta{ display:flex; align-items:center; gap:8px; margin-left:auto; }

.nav__burger{
  display:none; margin-left:auto;
  width:42px; height:42px; padding:0;
  background:var(--surface); border:1px solid var(--line); border-radius:var(--r-sm);
  flex-direction:column; align-items:center; justify-content:center; gap:4px; cursor:pointer;
}
.nav__burger span{ width:16px; height:1.5px; background:var(--ink); transition:transform .2s var(--ease), opacity .2s var(--ease); }
.nav__burger[aria-expanded="true"] span:nth-child(1){ transform:translateY(5.5px) rotate(45deg); }
.nav__burger[aria-expanded="true"] span:nth-child(2){ opacity:0; }
.nav__burger[aria-expanded="true"] span:nth-child(3){ transform:translateY(-5.5px) rotate(-45deg); }

/* ── theme toggle ────────────────────────────────────────── */
.theme-btn{
  width:42px; height:42px; padding:0; flex:0 0 auto;
  display:inline-flex; align-items:center; justify-content:center;
  background:var(--surface); color:var(--ink-2);
  border:1px solid var(--line); border-radius:999px; cursor:pointer;
  transition:border-color .18s var(--ease), color .18s var(--ease), background .18s var(--ease);
}
.theme-btn:hover{ border-color:var(--line-hover); color:var(--green); }
.theme-btn:focus-visible{ outline:2px solid var(--green); outline-offset:2px; }
.theme-btn svg{
  width:18px; height:18px; fill:none;
  stroke:currentColor; stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round;
}
.theme-btn__sun{ display:none; }
:root[data-theme="dark"] .theme-btn__sun{ display:block; }
:root[data-theme="dark"] .theme-btn__moon{ display:none; }

/* ── hero ────────────────────────────────────────────────── */
.hero{
  position:relative; overflow:hidden;
  padding:104px 0 96px;
  background:
    radial-gradient(1100px 460px at 50% -8%, var(--glow) 0%, var(--bg) 70%),
    var(--bg);
  border-bottom:1px solid var(--line);
}
.hero__inner{ position:relative; z-index:2; text-align:center; }

.hero__art{ position:absolute; bottom:0; z-index:1; pointer-events:none; }
.hero__art__inner{ will-change:transform; }
.hero__art img{ width:100%; height:auto; }
.hero__art--left{ left:-10px;  width:clamp(240px, 26vw, 430px); }
.hero__art--right{ right:-10px; width:clamp(190px, 20vw, 330px); }

/* wide screens: art leaves the hero, sits centred in the side gutters and
   rides the whole page — bobbing as you scroll, stopping at the footer */
@media (min-width:1440px){
  .hero__art{
    position:fixed; top:0; bottom:0; height:100vh; z-index:5;
    display:flex; align-items:center;
  }
  .hero__art--left{ left:0;  width:clamp(180px, calc((100vw - 1160px) / 2), 400px); }
  .hero__art--right{ right:0; width:clamp(150px, calc((100vw - 1300px) / 2), 320px); }
  .hero__art__inner{ width:100%; }
}

.pill{
  display:inline-flex; align-items:center; gap:8px;
  height:32px; padding:0 14px; border-radius:999px;
  background:var(--surface); border:1px solid var(--line);
  font-size:13px; font-weight:600; color:var(--ink-2);
}
.pill .dot{
  width:7px; height:7px; border-radius:50%; background:var(--green);
  animation:pulse 2.4s ease-in-out infinite;
}
@keyframes pulse{ 0%,100%{ opacity:1; transform:scale(1); } 50%{ opacity:.45; transform:scale(.8); } }

.hero__title{
  margin:22px auto 0; max-width:15ch;
  font-size:clamp(38px, 5.6vw, 68px); letter-spacing:-.035em;
}
.hero__sub{
  margin:20px auto 0; max-width:56ch;
  font-size:clamp(15.5px, 1.5vw, 18px); color:var(--muted);
}
.hero__actions{ display:flex; gap:12px; justify-content:center; flex-wrap:wrap; margin-top:32px; }

.hero__trust{
  display:grid; grid-template-columns:repeat(4,1fr); gap:1px;
  margin:64px auto 0; max-width:820px;
  background:var(--line); border:1px solid var(--line); border-radius:var(--r);
  overflow:hidden;
}
.hero__trust li{ background:var(--surface); padding:20px 16px; text-align:center; }
.hero__trust b{ display:block; font-size:26px; font-weight:800; letter-spacing:-.03em; font-variant-numeric:tabular-nums; }
.hero__trust span{ display:block; margin-top:4px; font-size:12.5px; color:var(--muted); }

/* ── logo strip ──────────────────────────────────────────── */
.strip{ border-bottom:1px solid var(--line); background:var(--surface); }
.strip__inner{ display:flex; align-items:center; gap:36px; padding-block:22px; flex-wrap:wrap; }
.strip__label{ font-size:12.5px; font-weight:700; text-transform:uppercase; letter-spacing:.1em; color:var(--muted); }
.strip__logos{ display:flex; gap:34px; flex-wrap:wrap; }
.strip__logos span{
  font-size:15px; font-weight:700; letter-spacing:-.02em; color:var(--muted);
  transition:color .18s var(--ease);
}
.strip__logos span:hover{ color:var(--ink); }

/* ── sections ────────────────────────────────────────────── */
.section{ padding:104px 0; }
.section--alt{ background:var(--bg-alt); border-block:1px solid var(--line); }

.head{ max-width:640px; margin:0 auto 52px; text-align:center; }
.head--left{ margin-inline:0; text-align:left; }
.eyebrow{
  display:inline-block; margin-bottom:14px;
  font-size:12.5px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; color:var(--green);
}
.head h2{ font-size:clamp(28px, 3.4vw, 42px); }
.head p{ margin-top:14px; color:var(--muted); font-size:16.5px; }

/* ── grids & cards ───────────────────────────────────────── */
.grid{ display:grid; gap:20px; }
.grid--3{ grid-template-columns:repeat(3,1fr); }
.grid--4{ grid-template-columns:repeat(4,1fr); }

.card{
  background:var(--surface); border:1px solid var(--line); border-radius:var(--r);
  padding:28px 26px 26px;
  transition:border-color .2s var(--ease), transform .2s var(--ease), background .2s var(--ease);
}
.card:hover{ border-color:var(--line-hover); transform:translateY(-3px); }
.card__icon{ height:64px; width:auto; margin-bottom:20px; transition:transform .3s var(--ease); }
.card:hover .card__icon{ transform:translateY(-3px) scale(1.04); }
.card h3{ font-size:19px; }
.card p{ margin:10px 0 16px; color:var(--muted); font-size:14.8px; }

.mini{
  background:var(--surface); border:1px solid var(--line); border-radius:var(--r);
  padding:24px 22px;
}
.mini b{ display:block; font-size:20px; letter-spacing:-.03em; }
.mini span{ display:block; margin-top:6px; font-size:14px; color:var(--muted); }

/* ── showcase ────────────────────────────────────────────── */
.showcase{ padding:104px 0; background:var(--bg-alt); border-block:1px solid var(--line); }
.showcase__inner{ display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:center; }
.showcase__copy h2{ font-size:clamp(28px, 3.2vw, 40px); }
.showcase__copy > p{ margin-top:16px; color:var(--muted); font-size:16.5px; }

.checks{ margin:26px 0 30px; display:grid; gap:12px; }
.checks li{ position:relative; padding-left:30px; font-size:15px; color:var(--ink-2); }
.checks li::before{
  content:""; position:absolute; left:0; top:6px;
  width:18px; height:18px; border-radius:50%;
  background:var(--green);
  -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M20 6L9 17l-5-5' fill='none' stroke='black' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'/></svg>") center/13px no-repeat,
          linear-gradient(#000,#000);
  -webkit-mask-composite:xor; mask-composite:exclude;
  mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M20 6L9 17l-5-5' fill='none' stroke='black' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'/></svg>") center/13px no-repeat,
       linear-gradient(#000,#000);
  mask-composite:exclude;
}

.showcase__panel{ position:relative; }
.panel{
  position:relative; z-index:1;
  background:var(--surface); border:1px solid var(--line); border-radius:18px;
  padding:26px 26px 22px;
}
.panel__head{ display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.panel__label{ display:block; font-size:17px; font-weight:800; letter-spacing:-.02em; }
.panel__meta{ display:block; margin-top:3px; font-size:13px; color:var(--muted); }
.badge{
  font-size:11.5px; font-weight:800; letter-spacing:.06em; text-transform:uppercase;
  color:var(--green-2); background:var(--tint); border:1px solid var(--tint-line);
  border-radius:999px; padding:4px 10px;
}
.panel__apy{ margin-top:22px; }
.panel__apy b{ font-size:46px; font-weight:800; letter-spacing:-.04em; font-variant-numeric:tabular-nums; }
.panel__apy span{ display:block; font-size:13px; color:var(--muted); }

.spark{ width:100%; height:88px; margin-top:14px; display:block; }
.spark__line{
  fill:none; stroke:var(--green); stroke-width:2.4;
  stroke-linecap:round; stroke-linejoin:round;
  stroke-dasharray:1000; stroke-dashoffset:1000;
}
.is-in .spark__line{ animation:draw 1.5s var(--ease) forwards .15s; }
@keyframes draw{ to{ stroke-dashoffset:0; } }

.panel__stats{
  display:grid; grid-template-columns:repeat(2,1fr); gap:14px 20px;
  margin-top:20px; padding-top:20px; border-top:1px solid var(--line-2);
}
.panel__stats dt{ font-size:12.5px; color:var(--muted); }
.panel__stats dd{ font-size:15.5px; font-weight:700; font-variant-numeric:tabular-nums; }

.panel__rows{ margin-top:20px; padding-top:16px; border-top:1px solid var(--line-2); display:grid; gap:2px; }
.row{
  display:flex; justify-content:space-between; align-items:center;
  padding:9px 0; font-size:14.5px; border-bottom:1px solid var(--line-2);
}
.row:last-child{ border-bottom:0; }
.row b{ font-variant-numeric:tabular-nums; }


/* ── steps ───────────────────────────────────────────────── */
.steps{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.step{
  background:var(--surface); border:1px solid var(--line); border-radius:var(--r);
  padding:30px 26px;
  transition:border-color .2s var(--ease), transform .2s var(--ease);
}
.step:hover{ border-color:var(--line-hover); transform:translateY(-3px); }
.step__num{
  display:inline-block; margin-bottom:18px;
  font-family:var(--f-mono); font-size:13px; font-weight:500; color:var(--green);
  border:1px solid var(--tint-line); background:var(--tint); border-radius:8px; padding:3px 9px;
}
.step h3{ font-size:19px; }
.step p{ margin-top:10px; color:var(--muted); font-size:14.8px; }

/* ── token ───────────────────────────────────────────────── */
.token{ display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:center; }
.token__copy h2{ font-size:clamp(27px, 3.1vw, 38px); }
.token__copy > p{ margin-top:16px; color:var(--muted); font-size:16.5px; }
.token__facts{ display:grid; gap:1px; margin-top:28px; background:var(--line); border:1px solid var(--line); border-radius:var(--r); overflow:hidden; }
.token__facts div{ background:var(--surface); padding:16px 20px; display:flex; justify-content:space-between; align-items:baseline; gap:16px; }
.token__facts b{ font-size:17px; letter-spacing:-.02em; font-variant-numeric:tabular-nums; }
.token__facts span{ font-size:13.5px; color:var(--muted); text-align:right; }

.token__chart{ position:relative; }
.alloc{
  position:relative; z-index:1;
  background:var(--surface); border:1px solid var(--line); border-radius:18px; padding:28px 26px;
  display:grid; gap:22px;
}
.alloc__row{ display:grid; grid-template-columns:1fr auto; gap:4px 12px; }
.alloc__name{ font-size:14.5px; font-weight:600; }
.alloc__val{ font-size:14.5px; font-weight:800; font-variant-numeric:tabular-nums; }
.alloc__bar{ grid-column:1/-1; height:8px; border-radius:999px; background:var(--line-2); overflow:hidden; }
.alloc__bar i{
  display:block; height:100%; width:0; border-radius:999px;
  background:linear-gradient(90deg, var(--green), var(--lime));
  transition:width 1.1s var(--ease);
}
.is-in .alloc__bar i{ width:var(--v); }


/* ── security ────────────────────────────────────────────── */
.security{ padding:96px 0; background:var(--surface); }
.security__inner .head{ margin-bottom:40px; }

/* ── timeline ────────────────────────────────────────────── */
.timeline{ display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.tl{
  background:var(--surface); border:1px solid var(--line); border-radius:var(--r);
  padding:26px 22px; position:relative;
}
.tl::before{
  content:""; position:absolute; left:22px; right:22px; top:-1px; height:2px;
  background:var(--line);
}
.tl__tag{
  display:inline-block; margin-bottom:14px;
  font-size:11.5px; font-weight:800; letter-spacing:.08em; text-transform:uppercase;
  border-radius:999px; padding:4px 10px; border:1px solid;
}
.tl__tag.done{ color:var(--green-2); background:var(--tint); border-color:var(--tint-line); }
.tl__tag.live{ color:var(--warn); background:var(--warn-bg); border-color:var(--warn-line); }
.tl__tag.next{ color:var(--muted);  background:var(--bg-alt); border-color:var(--line); }
.tl h3{ font-size:17.5px; }
.tl p{ margin-top:9px; font-size:14.3px; color:var(--muted); }

/* ── faq ─────────────────────────────────────────────────── */
.faq{ display:grid; grid-template-columns:340px 1fr; gap:56px; align-items:start; }
.faq .head{ margin-bottom:0; }
.acc{ border:1px solid var(--line); border-radius:var(--r); overflow:hidden; background:var(--surface); }
.acc details{ border-bottom:1px solid var(--line-2); }
.acc details:last-child{ border-bottom:0; }
.acc summary{
  cursor:pointer; list-style:none; padding:20px 54px 20px 24px;
  font-size:16px; font-weight:700; letter-spacing:-.015em; position:relative;
  transition:color .16s var(--ease);
}
.acc summary::-webkit-details-marker{ display:none; }
.acc summary:hover{ color:var(--green); }
.acc summary::after{
  content:""; position:absolute; right:24px; top:50%; width:11px; height:11px;
  margin-top:-6px;
  border-right:2px solid var(--muted); border-bottom:2px solid var(--muted);
  transform:rotate(45deg); transition:transform .22s var(--ease);
}
.acc details[open] summary::after{ transform:rotate(-135deg); margin-top:-2px; }
.acc details p{ padding:0 24px 22px; color:var(--muted); font-size:15px; max-width:70ch; }

/* ── cta ─────────────────────────────────────────────────── */
.cta{ background:var(--deep); color:#fff; overflow:hidden; }
.cta__inner{ position:relative; padding:88px 24px; }
.cta__copy{ max-width:600px; position:relative; z-index:2; }
.cta h2{ font-size:clamp(28px, 3.4vw, 42px); }
.cta p{ margin-top:14px; color:#a8bdab; font-size:16.5px; }
.cta__form{ display:flex; gap:10px; margin-top:28px; flex-wrap:wrap; }
.cta__form input{
  flex:1 1 260px; height:52px; padding:0 18px;
  background:#ffffff0f; border:1px solid #ffffff26; border-radius:999px;
  color:#fff; font-family:inherit; font-size:15px; outline:none;
  transition:border-color .18s var(--ease), background .18s var(--ease);
}
.cta__form input::placeholder{ color:#7d9481; }
.cta__form input:focus{ border-color:var(--lime); background:#ffffff17; }
.cta__form .btn--solid{ background:var(--lime); color:var(--deep); height:52px; padding:0 26px; }
.cta__form .btn--solid:hover{ background:var(--surface); }
.cta__note{ display:block; margin-top:16px; font-size:12.5px; color:#7d9481; }
.cta__leaves{ position:absolute; left:-70px; bottom:-40px; width:220px; opacity:.5; z-index:1; pointer-events:none; }

/* ── footer ──────────────────────────────────────────────── */
.foot{ background:var(--surface); border-top:1px solid var(--line); }
.foot__inner{ display:grid; grid-template-columns:1.2fr 2.6fr; gap:56px; padding-block:56px; }
.foot__brand p{ margin-top:14px; color:var(--muted); font-size:14.5px; max-width:34ch; }
.foot__cols{ display:grid; grid-template-columns:repeat(4,1fr); gap:24px; }
.foot__cols h4{ font-size:13px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:var(--ink); margin-bottom:14px; }
.foot__cols a{ display:block; padding:5px 0; font-size:14.5px; color:var(--muted); transition:color .16s var(--ease); }
.foot__cols a:hover{ color:var(--green); }
.foot__base{
  display:flex; justify-content:space-between; gap:24px; flex-wrap:wrap;
  padding-block:22px; border-top:1px solid var(--line-2);
  font-size:12.5px; color:var(--muted);
}
.foot__disc{ max-width:62ch; }

/* ── error pages ─────────────────────────────────────────── */
.err{
  min-height:calc(100vh - 72px - 34px);
  display:flex; align-items:center;
  background:radial-gradient(900px 420px at 50% 0%, var(--glow) 0%, var(--bg) 68%), var(--bg);
  border-bottom:1px solid var(--line);
  padding:72px 0;
}
.err__inner{ display:grid; grid-template-columns:1.1fr .9fr; gap:56px; align-items:center; }
.err__code{
  display:inline-flex; align-items:center; gap:10px;
  font-family:var(--f-mono); font-size:13px; font-weight:500; letter-spacing:.06em;
  color:var(--green-2); background:var(--tint); border:1px solid var(--tint-line);
  border-radius:999px; padding:5px 12px; margin-bottom:20px;
}
.err h1{ font-size:clamp(32px, 4.4vw, 54px); letter-spacing:-.035em; }
.err__lead{ margin-top:16px; max-width:52ch; color:var(--muted); font-size:16.5px; }
.err__actions{ display:flex; gap:12px; flex-wrap:wrap; margin-top:30px; }

.err__links{
  margin-top:40px; padding-top:26px; border-top:1px solid var(--line);
}
.err__links h2{ font-size:12.5px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; color:var(--muted); }
.err__links ul{ display:grid; grid-template-columns:repeat(2,minmax(0,220px)); gap:8px 24px; margin-top:14px; }
.err__links a{
  display:block; padding:7px 0; font-size:14.8px; font-weight:600;
  border-bottom:1px solid var(--line-2); transition:color .16s var(--ease);
}
.err__links a:hover{ color:var(--green); }

.err__art{ position:relative; display:flex; justify-content:center; }
.err__art img{ width:min(360px, 100%); }
.err__art img.err__leaves{
  position:absolute; left:-6px; bottom:-18px; width:118px; opacity:.25;
}

.err__ref{
  margin-top:26px; font-family:var(--f-mono); font-size:12px; color:var(--muted);
  word-break:break-all;
}

@media (max-width:900px){
  .err{ padding:56px 0; }
  .err__inner{ grid-template-columns:1fr; gap:36px; }
  .err__art{ order:-1; justify-content:flex-start; }
  .err__art img{ width:min(240px, 60%); }
  .err__links ul{ grid-template-columns:1fr; }
}

/* ── inner page header ───────────────────────────────────── */
.phead{
  padding:60px 0 46px;
  background:radial-gradient(900px 380px at 50% -30%, var(--glow) 0%, var(--bg) 72%), var(--bg);
  border-bottom:1px solid var(--line);
}
.phead h1{ margin-top:12px; font-size:clamp(31px, 4.2vw, 50px); letter-spacing:-.035em; }
.phead p{ margin-top:16px; max-width:64ch; color:var(--muted); font-size:17px; }

.page{ padding:64px 0 96px; }
.page section + section{ margin-top:60px; }
.page h2{ font-size:clamp(22px, 2.6vw, 30px); }
.page h2 + p{ margin-top:14px; color:var(--muted); font-size:16px; max-width:70ch; }

/* ── status board ────────────────────────────────────────── */
.status__bar{
  display:flex; align-items:center; gap:12px;
  padding:18px 22px; border-radius:var(--r);
  border:1px solid var(--tint-line); background:var(--tint);
  font-weight:700; font-size:16px;
}
.status__dot{
  width:10px; height:10px; border-radius:50%; background:var(--green);
  animation:pulse 2.4s ease-in-out infinite;
}
.status__list{ margin-top:20px; border:1px solid var(--line); border-radius:var(--r); overflow:hidden; }
.status__row{
  display:flex; justify-content:space-between; align-items:center; gap:18px;
  padding:15px 22px; background:var(--surface); border-bottom:1px solid var(--line-2);
}
.status__row:last-child{ border-bottom:0; }
.status__row b{ font-size:15px; }
.status__row em{ display:block; margin-top:3px; font-style:normal; font-size:13px; color:var(--muted); }
.status__ok{ font-size:12.5px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:var(--up); white-space:nowrap; }

/* ── careers ─────────────────────────────────────────────── */
.job{
  display:flex; justify-content:space-between; align-items:center; gap:20px;
  padding:20px 24px; background:var(--surface);
  border:1px solid var(--line); border-radius:var(--r);
  transition:border-color .18s var(--ease), transform .18s var(--ease);
}
.job + .job{ margin-top:12px; }
.job:hover{ border-color:var(--line-hover); transform:translateY(-2px); }
.job h3{ font-size:17px; }
.job em{ display:block; margin-top:5px; font-style:normal; font-size:13.5px; color:var(--muted); }

/* ── press kit ───────────────────────────────────────────── */
.swatches{ display:grid; grid-template-columns:repeat(auto-fit,minmax(158px,1fr)); gap:14px; margin-top:18px; }
.swatch{ border:1px solid var(--line); border-radius:var(--r-sm); overflow:hidden; background:var(--surface); }
.swatch i{ display:block; height:62px; }
.swatch b{ display:block; padding:11px 14px 3px; font-size:14px; }
.swatch code{ margin:0 14px 13px; display:inline-block; }

.assetgrid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(168px,1fr)); gap:14px; margin-top:18px; }
.assetgrid figure{
  margin:0; padding:20px; text-align:center;
  background:var(--bg-alt); border:1px solid var(--line); border-radius:var(--r-sm);
}
.assetgrid img{ height:78px; width:auto; margin:0 auto; }
.assetgrid figcaption{ margin-top:13px; font-size:13px; color:var(--muted); }

/* ── article list ────────────────────────────────────────── */
.post{
  display:block; padding:22px 24px; background:var(--surface);
  border:1px solid var(--line); border-radius:var(--r);
  transition:border-color .18s var(--ease), transform .18s var(--ease);
}
.post + .post{ margin-top:12px; }
.post:hover{ border-color:var(--line-hover); transform:translateY(-2px); }
.post time{ font-family:var(--f-mono); font-size:12px; color:var(--muted); }
.post h3{ margin-top:8px; font-size:18px; }
.post p{ margin-top:8px; font-size:14.8px; color:var(--muted); }

@media (max-width:620px){
  .job{ flex-direction:column; align-items:flex-start; }
  .status__row{ flex-direction:column; align-items:flex-start; gap:8px; }
}

/* ── waiting-list modal ──────────────────────────────────── */
.modal{
  position:fixed; inset:0; z-index:200;
  display:none; align-items:center; justify-content:center;
  padding:24px;
}
.modal.is-open{ display:flex; }
.modal__backdrop{
  position:absolute; inset:0;
  background:#06100a; opacity:.55;
  animation:fadeIn .22s var(--ease);
}
:root[data-theme="dark"] .modal__backdrop{ opacity:.7; }
.modal__panel{
  position:relative; width:100%; max-width:540px;
  background:var(--surface); border:1px solid var(--line); border-radius:18px;
  padding:34px 34px 30px;
  animation:popIn .26s var(--ease);
  max-height:calc(100vh - 48px); overflow-y:auto;
}
@keyframes fadeIn{ from{ opacity:0; } }
@keyframes popIn{ from{ opacity:0; transform:translateY(10px); } }

.modal__close{
  position:absolute; top:16px; right:16px;
  width:36px; height:36px; padding:0; cursor:pointer;
  display:inline-flex; align-items:center; justify-content:center;
  background:transparent; color:var(--muted);
  border:1px solid var(--line); border-radius:999px;
  font-size:18px; line-height:1;
  transition:color .16s var(--ease), border-color .16s var(--ease);
}
.modal__close:hover{ color:var(--ink); border-color:var(--line-hover); }

.modal .pill{ margin-bottom:16px; }
.modal h2{ font-size:clamp(24px, 3vw, 30px); }
.modal__lead{ margin-top:12px; color:var(--muted); font-size:15.5px; }

.count{
  display:grid; grid-template-columns:repeat(4,1fr); gap:1px;
  margin-top:26px;
  background:var(--line); border:1px solid var(--line); border-radius:var(--r);
  overflow:hidden;
}
.count div{ background:var(--bg-alt); padding:16px 8px; text-align:center; }
.count b{
  display:block; font-size:30px; font-weight:800; letter-spacing:-.03em;
  font-variant-numeric:tabular-nums;
}
.count span{ display:block; margin-top:2px; font-size:11.5px; letter-spacing:.08em; text-transform:uppercase; color:var(--muted); }
.count__target{ margin-top:12px; font-family:var(--f-mono); font-size:12px; color:var(--muted); text-align:center; }

.modal__form{ display:flex; gap:10px; margin-top:24px; flex-wrap:wrap; }
.modal__form input{
  flex:1 1 220px; height:48px; padding:0 18px;
  background:var(--bg-alt); border:1px solid var(--line); border-radius:999px;
  color:var(--ink); font-family:inherit; font-size:15px; outline:none;
  transition:border-color .18s var(--ease);
}
.modal__form input::placeholder{ color:var(--muted); }
.modal__form input:focus{ border-color:var(--green); }
.modal__form .btn{ height:48px; }
.modal__note{ display:block; margin-top:14px; font-size:12.5px; color:var(--muted); }

.modal__meta{
  display:flex; gap:20px; flex-wrap:wrap;
  margin-top:24px; padding-top:20px; border-top:1px solid var(--line-2);
}
.modal__meta div b{ display:block; font-size:16px; letter-spacing:-.02em; }
.modal__meta div span{ display:block; font-size:12.5px; color:var(--muted); }

@media (max-width:520px){
  .modal__panel{ padding:28px 22px 24px; }
  .count b{ font-size:24px; }
}

/* ── documentation ───────────────────────────────────────── */
.docs{ padding:56px 0 96px; }
.docs__inner{ display:grid; grid-template-columns:236px minmax(0,1fr); gap:56px; align-items:start; }

.docs__side{ position:sticky; top:96px; }
.docs__side h2{
  font-size:12.5px; font-weight:800; letter-spacing:.12em; text-transform:uppercase;
  color:var(--muted); margin-bottom:14px;
}
.docs__side a{
  display:block; padding:7px 12px; margin-left:-12px;
  font-size:14.5px; font-weight:600; color:var(--ink-2);
  border-radius:8px; border-left:2px solid transparent;
  transition:color .16s var(--ease), background .16s var(--ease), border-color .16s var(--ease);
}
.docs__side a:hover{ color:var(--ink); background:var(--bg-alt); }
.docs__side a.is-active{ color:var(--green); border-left-color:var(--green); background:var(--tint); }
.docs__side hr{ border:0; border-top:1px solid var(--line); margin:18px 0; }

.docs__body{ max-width:76ch; }
.docs__body > section{ scroll-margin-top:110px; }
.docs__body > section + section{ margin-top:56px; padding-top:56px; border-top:1px solid var(--line); }
.docs__body h1{ font-size:clamp(30px, 3.6vw, 44px); letter-spacing:-.035em; }
.docs__body h2{ font-size:clamp(22px, 2.4vw, 28px); margin-top:42px; }
.docs__body section > h2:first-child{ margin-top:0; }
.docs__body h3{ font-size:17.5px; margin-top:28px; }
.docs__body p{ margin-top:14px; color:var(--ink-2); font-size:15.8px; }
.docs__body h1 + p{ color:var(--muted); font-size:17px; }
.docs__body ul{ margin-top:14px; display:grid; gap:9px; }
.docs__body ul li{ position:relative; padding-left:20px; font-size:15.5px; color:var(--ink-2); }
.docs__body ul li::before{
  content:""; position:absolute; left:2px; top:10px;
  width:6px; height:6px; border-radius:50%; background:var(--green);
}
.docs__body ol{ margin-top:14px; display:grid; gap:9px; counter-reset:step; }
.docs__body ol li{ position:relative; padding-left:30px; font-size:15.5px; color:var(--ink-2); counter-increment:step; }
.docs__body ol li::before{
  content:counter(step); position:absolute; left:0; top:1px;
  width:20px; height:20px; border-radius:6px;
  background:var(--tint); border:1px solid var(--tint-line); color:var(--green-2);
  font-family:var(--f-mono); font-size:11px; line-height:18px; text-align:center;
}
.docs__body a:not(.btn){ color:var(--green); font-weight:600; }
.docs__body a:not(.btn):hover{ color:var(--green-2); }

code{
  font-family:var(--f-mono); font-size:.88em;
  background:var(--bg-alt); border:1px solid var(--line);
  border-radius:6px; padding:1px 5px;
}
pre{
  margin-top:16px; padding:16px 18px; overflow-x:auto;
  background:var(--bg-alt); border:1px solid var(--line); border-radius:var(--r-sm);
}
pre code{ background:none; border:0; padding:0; font-size:13px; line-height:1.65; display:block; }

.docs__table{ margin-top:18px; overflow-x:auto; border:1px solid var(--line); border-radius:var(--r-sm); }
.docs__table table{ width:100%; border-collapse:collapse; min-width:520px; }
.docs__table th, .docs__table td{
  text-align:left; padding:11px 16px; font-size:14.5px;
  border-bottom:1px solid var(--line-2);
}
.docs__table th{ font-size:12.5px; text-transform:uppercase; letter-spacing:.08em; color:var(--muted); }
.docs__table tr:last-child td{ border-bottom:0; }
.docs__table td code{ font-size:12.5px; }

.note{
  margin-top:18px; padding:14px 18px;
  border:1px solid var(--tint-line); background:var(--tint); border-radius:var(--r-sm);
  font-size:14.8px; color:var(--ink-2);
}
.note b{ color:var(--green-2); }
.note--warn{ border-color:var(--warn-line); background:var(--warn-bg); }
.note--warn b{ color:var(--warn); }

@media (max-width:1080px){
  .docs__inner{ grid-template-columns:1fr; gap:32px; }
  .docs__side{ position:static; }
  .docs__side nav{ display:flex; gap:6px; overflow-x:auto; padding-bottom:6px; }
  .docs__side a{ margin-left:0; white-space:nowrap; border-left:0; border-bottom:2px solid transparent; border-radius:8px; }
  .docs__side a.is-active{ border-left:0; border-bottom-color:var(--green); }
  .docs__side hr{ display:none; }
}

/* ── reveal / float ──────────────────────────────────────── */
.reveal{ opacity:0; transform:translateY(18px); transition:opacity .6s var(--ease), transform .6s var(--ease); }
.reveal.is-in{ opacity:1; transform:none; }

[data-float="1"]{ animation:float1 7s ease-in-out infinite; }
[data-float="2"]{ animation:float2 9s ease-in-out infinite; }
@keyframes float1{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-11px); } }
@keyframes float2{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-8px); } }

.hero__art{ opacity:0; transition:opacity .9s var(--ease), transform .9s var(--ease); }
.hero__art--left{ transform:translateX(-40px); }
.hero__art--right{ transform:translateX(40px); }
.hero__art.is-in{ opacity:1; transform:none; }
.hero__art img{ animation:drift 11s ease-in-out infinite; }
@keyframes drift{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-9px); } }

/* ── responsive ──────────────────────────────────────────── */
/* laptops & iPad landscape: keep the nav on one line */
@media (max-width:1180px){
  .nav__inner{ gap:18px; }
  .nav__links{ gap:18px; margin-left:0; }
  .nav__cta .btn--ghost{ display:none; }
}

@media (max-width:1080px){
  .grid--3{ grid-template-columns:repeat(2,1fr); }
  .grid--4{ grid-template-columns:repeat(2,1fr); }
  .timeline{ grid-template-columns:repeat(2,1fr); }
  .showcase__inner, .token{ grid-template-columns:1fr; gap:44px; }
  .faq{ grid-template-columns:1fr; gap:32px; }
  .hero__art--left{ width:210px; opacity:.9; }
  .hero__art--right{ width:170px; opacity:.9; }
}

@media (max-width:900px){
  .nav__links{
    position:absolute; top:72px; left:0; right:0;
    flex-direction:column; gap:0;
    background:var(--surface); border-bottom:1px solid var(--line);
    padding:8px 24px 18px;
    display:none;
  }
  .nav__links.is-open{ display:flex; }
  .nav__links a{ padding:12px 0; border-bottom:1px solid var(--line-2); }
  .nav__links a::after{ display:none; }
  .nav__cta{ margin-left:auto; }
  .nav__burger{ display:flex; margin-left:10px; }
  .steps{ grid-template-columns:1fr; }

  .hero{ padding:72px 0 340px; }
  .hero__art--left{ width:170px; left:-6px; }
  .hero__art--right{ width:145px; right:-6px; }
  .hero__trust{ grid-template-columns:repeat(2,1fr); }

  .section, .showcase, .security{ padding:72px 0; }
  .cta__inner{ padding:64px 24px; }
  .foot__inner{ grid-template-columns:1fr; gap:36px; }
}

@media (max-width:620px){
  .grid--3, .grid--4, .steps, .timeline{ grid-template-columns:1fr; }
  .hero__title{ max-width:none; }
  .strip__inner{ gap:18px; }
  .strip__logos{ gap:20px; }
  .foot__cols{ grid-template-columns:repeat(2,1fr); }
  .panel__apy b{ font-size:38px; }
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.001ms !important; animation-iteration-count:1 !important;
    transition-duration:.001ms !important; scroll-behavior:auto !important;
  }
  .reveal{ opacity:1; transform:none; }
  .hero__art{ opacity:1; transform:none; }
  .alloc__bar i{ width:var(--v); }
  .spark__line{ stroke-dashoffset:0; }

  /* the price ticker is the product, so it keeps running — hover pauses it */
  .ticker__track{
    animation-duration:42s !important;
    animation-iteration-count:infinite !important;
  }
}
