/* ===== Fonts ===== */
@font-face{font-family:"Plus Jakarta Sans";font-weight:400;font-style:normal;font-display:swap;src:url(../assets/fonts/plus-jakarta-sans-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Plus Jakarta Sans";font-weight:500;font-style:normal;font-display:swap;src:url(../assets/fonts/plus-jakarta-sans-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"Plus Jakarta Sans";font-weight:600;font-style:normal;font-display:swap;src:url(../assets/fonts/plus-jakarta-sans-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:"Plus Jakarta Sans";font-weight:700;font-style:normal;font-display:swap;src:url(../assets/fonts/plus-jakarta-sans-latin-700-normal.woff2) format("woff2")}
@font-face{font-family:"Plus Jakarta Sans";font-weight:800;font-style:normal;font-display:swap;src:url(../assets/fonts/plus-jakarta-sans-latin-800-normal.woff2) format("woff2")}

/* ===== Tokens ===== */
:root{
  --ink:#1f0b4f;
  --ink-2:#47348f;
  --text:#4a3f78;
  --muted:#6d6296;
  --purple:#6a4cf6;
  --purple-2:#7c5cf7;
  --lime:#d8f43c;
  --lime-b:#bfd62f;
  --lav-1:#e4dfff;
  --lav-2:#eeeaff;
  --lav-3:#f4f2ff;
  --page:#f9f8ff;
  --line:#d9d2f6;
  --radius:28px;
  --ease:cubic-bezier(.22,.8,.2,1);
}
*,*::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;font-family:"Plus Jakarta Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  color:var(--text);background:var(--page);-webkit-font-smoothing:antialiased;overflow-x:hidden;
  line-height:1.4;
}
.js body.is-loading{overflow:hidden;height:100vh}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;border:0;background:none;cursor:pointer;padding:0}
svg{display:block}
h1,h2,h3,p{margin:0}
::selection{background:#cdbfff;color:var(--ink)}

/* ===== Buttons ===== */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;height:36px;padding:0 16px;
  border-radius:10px;font-size:13px;font-weight:500;letter-spacing:-.01em;white-space:nowrap;
  transition:transform .3s var(--ease),box-shadow .3s var(--ease),background .3s;
}
.btn svg{width:15px;height:15px}
.btn--dark{background:#4b2c82;color:#fff;box-shadow:0 6px 14px -6px rgba(75,44,130,.7)}
.btn--dark:hover{transform:translateY(-1px);background:#3d2270}
.btn--lime{background:var(--lime);color:#2a1a63;border:1px solid var(--lime-b);box-shadow:0 6px 16px -8px rgba(160,190,20,.8)}
.btn--lime:hover{transform:translateY(-1px);box-shadow:0 10px 22px -8px rgba(160,190,20,.9);background:#e0f755}
.btn--ghost{background:rgba(255,255,255,.55);color:#4a3f78;border:1px solid rgba(160,145,225,.4)}
.btn--ghost:hover{background:#fff;transform:translateY(-1px)}
.btn--lg{height:44px;padding:0 24px;border-radius:12px;font-size:14px}

/* ===== Loader ===== */
.loader{
  display:none;position:fixed;inset:0;z-index:1000;background:linear-gradient(180deg,#e8e4ff 0%,#dcd6fb 100%);
  overflow:hidden;
}
.loader canvas{position:absolute;inset:0;width:100%;height:100%}
.loader__percent{
  position:absolute;right:5vw;bottom:5vh;font-size:clamp(32px,3.2vw,48px);font-weight:600;color:#2a1260;
  letter-spacing:-.04em;font-variant-numeric:tabular-nums;
}

/* ===== Nav ===== */
.nav{position:fixed;z-index:50;top:14px;left:0;right:0;padding:0 2.2vw;pointer-events:none}
.nav__pill{
  pointer-events:auto;height:58px;display:flex;align-items:center;justify-content:space-between;
  padding:0 14px 0 16px;border-radius:18px;
  background:linear-gradient(180deg,#fff,#f6f3ff);
  box-shadow:0 8px 30px -14px rgba(70,45,160,.35),0 0 0 1px rgba(255,255,255,.7) inset;
  opacity:0;
}
.nav__logo{display:flex;align-items:center;gap:6px;color:var(--purple);font-weight:800;font-size:17px;letter-spacing:-.02em}
.nav__logo span{color:#2a1a63}
.nav__mark{width:30px;height:30px;color:#7a5cf0}
.nav__links{display:flex;gap:30px;position:absolute;left:50%;transform:translateX(-50%)}
.nav__links a{font-size:12.5px;font-weight:500;color:#3a2a6e;position:relative;padding:6px 0}
.nav__links a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1.5px;background:var(--purple);transform:scaleX(0);transform-origin:left;transition:transform .35s var(--ease)}
.nav__links a:hover::after,.nav__links a.is-active::after{transform:scaleX(1)}
.nav__cta{display:flex;gap:8px}

/* ===== Intro (pinned story) ===== */
.intro{position:relative;height:720vh;background:linear-gradient(180deg,#e6e2ff 0%,#efecff 55%,#f5f3ff 100%)}
.intro__stage{
  position:sticky;top:0;height:100vh;overflow:hidden;
}
.deco{position:absolute;pointer-events:none}
.deco .deco-run,.deco-run{animation:run 5s linear infinite}
@keyframes run{from{stroke-dashoffset:.14}to{stroke-dashoffset:-1}}
.pulse__p{stroke-dasharray:.12 1;animation:run 3.4s linear infinite}
.deco--hero-l{left:3vw;top:14vh;width:22vw;height:60vh;opacity:.9}
.deco--hero-r{right:3vw;top:10vh;width:22vw;height:60vh;opacity:.9}

.hero{
  position:absolute;left:0;right:0;top:17vh;text-align:center;z-index:5;padding:0 5vw;
}
.hero__title{
  font-size:clamp(40px,4.75vw,84px);line-height:1.06;font-weight:700;letter-spacing:-.045em;color:var(--ink);
  max-width:11.3em;margin:0 auto;
}
.hero__title .w{display:inline-block}
.hero__title .w-wrap{display:inline-block;overflow:hidden;vertical-align:top;padding:0 .04em .12em;margin:0 -.04em -.12em}
.hero__sub{margin:22px auto 0;font-size:clamp(12px,1.05vw,16px);line-height:1.55;font-weight:500;color:#6a5e98;letter-spacing:-.01em}
.hero__btns{display:flex;gap:12px;justify-content:center;margin-top:30px}

/* Orb */
.orb-rise{position:absolute;inset:0;z-index:2}
.orb{
  position:absolute;left:50%;top:50%;width:min(86vh,66vw);aspect-ratio:1;border-radius:50%;
  background:radial-gradient(circle at 50% 50%,#fff 0%,#fff 62%,rgba(255,255,255,.96) 78%,rgba(255,255,255,.8) 100%);
  overflow:hidden;will-change:transform,opacity;
}
.orb__blob{position:absolute;border-radius:50%;will-change:transform}
/* soft blobs via radial gradients (no blur filter → far cheaper to animate) */
.orb__blob--a{left:8%;top:12%;width:84%;height:76%;background:radial-gradient(closest-side,rgba(169,71,255,.95) 0%,rgba(169,71,255,.85) 28%,rgba(169,71,255,.35) 60%,rgba(169,71,255,0) 100%)}
.orb__blob--b{left:20%;top:30%;width:70%;height:66%;background:radial-gradient(closest-side,rgba(255,116,236,.95) 0%,rgba(255,116,236,.8) 30%,rgba(255,116,236,.3) 62%,rgba(255,116,236,0) 100%)}
.orb__blob--c{left:12%;top:-10%;width:76%;height:58%;background:radial-gradient(closest-side,rgba(123,139,255,.95) 0%,rgba(123,139,255,.75) 30%,rgba(123,139,255,.28) 62%,rgba(123,139,255,0) 100%)}
.orb__grain{position:absolute;inset:0;opacity:.1;border-radius:50%;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .4  0 0 0 0 .2  0 0 0 0 .8  0 0 0 .9 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>")}
#shardCanvas{position:absolute;inset:0;width:100%;height:100%;opacity:0;pointer-events:none;z-index:3}

.story{position:absolute;inset:0;z-index:6;pointer-events:none}
.story__item{
  position:absolute;left:50%;top:50%;width:min(780px,86vw);text-align:center;opacity:0;
}
.story__item h2{font-size:clamp(34px,3.4vw,58px);line-height:1.05;font-weight:700;letter-spacing:-.045em;color:var(--ink)}
.story__item p{margin-top:8px;font-size:clamp(12px,1.05vw,16px);font-weight:600;color:#3d2b78;letter-spacing:-.02em;max-width:19em;margin-left:auto;margin-right:auto}
.story__item .w{display:inline-block}

.intro__logo{position:absolute;left:50%;top:50%;width:min(15vw,190px);aspect-ratio:1;color:#7650ee;opacity:0;z-index:4}
.intro__logo svg{width:100%;height:100%;filter:drop-shadow(0 20px 30px rgba(118,80,238,.35))}

.scroll-hint{position:absolute;left:50%;bottom:22px;width:22px;height:34px;border:1.5px solid rgba(70,45,160,.35);border-radius:12px;z-index:6;opacity:0}
.scroll-hint span{position:absolute;left:50%;top:7px;width:3px;height:7px;border-radius:2px;background:#5b3fd0;transform:translateX(-50%);animation:hint 1.6s ease-in-out infinite}
@keyframes hint{0%{opacity:0;transform:translate(-50%,0)}30%{opacity:1}100%{opacity:0;transform:translate(-50%,10px)}}

/* ===== Panels ===== */
.panel-wrap{position:relative;background:var(--page);padding:0 3.4vw}
.panel-wrap:first-of-type{padding-top:0}
.panel-wrap--tight{padding-top:16px}
.panel-wrap--end{padding-bottom:30px}
.panel{
  position:relative;overflow:hidden;border:1px solid var(--line);border-radius:var(--radius);
  background:linear-gradient(180deg,#f3f1ff 0%,#f0edff 100%);
  padding:clamp(90px,10vw,150px) 0 clamp(90px,10vw,140px);
}
#solutions.panel-wrap{padding-top:0}
#solutions .panel{border-top-left-radius:0;border-top-right-radius:0;border-top:0;padding-top:clamp(100px,12vw,170px)}
.deco--sol-l{left:0;top:6%;width:20%;height:42%}
.deco--sol-r{right:0;top:40%;width:20%;height:50%}
.deco--ch-l{left:0;top:6%;width:22%;height:70%}
.deco--ch-r{right:0;top:20%;width:22%;height:70%}
.deco--how-l{left:0;top:0;width:20%;height:50%}
.deco--how-r{right:0;top:0;width:20%;height:50%}
.deco--inv-l{left:0;top:0;width:24%;height:80%}
.deco--inv-r{right:0;top:0;width:24%;height:80%}
.deco--faq-l{left:0;top:0;width:18%;height:48%}
.deco--faq-r{right:0;top:0;width:18%;height:48%}
.deco--cta-l{left:0;top:0;width:34%;height:100%}
.deco--cta-r{right:0;top:0;width:34%;height:100%}

.sec-head{position:relative;z-index:2;text-align:center;padding:0 4vw}
.h2{
  font-size:clamp(34px,3.9vw,64px);line-height:1.05;font-weight:700;letter-spacing:-.045em;color:var(--ink);
  max-width:11em;margin:0 auto;
}
.h2 .soft{color:var(--ink-2)}
.h2 .w{display:inline-block}
.sub{margin-top:14px;font-size:14px;font-weight:500;color:#4a3f78}

/* ===== Features ===== */
.feat{
  position:relative;z-index:2;width:min(880px,70vw);margin:clamp(90px,10vw,150px) auto 0;
  display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:clamp(30px,6vw,100px);
}
.feat--rev .feat__text{order:1}
.feat--rev .feat__media{order:2}
.feat__media{
  width:100%;max-width:350px;aspect-ratio:350/300;border-radius:22px;overflow:hidden;
  border:2px solid rgba(255,255,255,.9);box-shadow:0 30px 60px -34px rgba(70,45,160,.5),0 0 0 1px rgba(200,190,245,.5);
  background:#d9d2ff;
}
.feat--rev .feat__media{justify-self:end}
.art{width:100%;height:100%}
.feat__text{max-width:350px}
.badge{
  display:inline-flex;align-items:center;justify-content:center;min-width:42px;height:26px;padding:0 12px;border-radius:14px;
  background:#fff;border:1px solid #e1dbfa;box-shadow:0 4px 10px -4px rgba(70,45,160,.25);
  font-size:12px;font-weight:600;color:#2a1a63;
}
.feat__text h3{margin-top:30px;font-size:clamp(19px,1.7vw,25px);line-height:1.12;font-weight:700;letter-spacing:-.035em;color:var(--ink)}
.feat__text h3 .soft{color:#4b3a96}
.feat__text p{margin-top:28px;font-size:clamp(12.5px,1.05vw,15px);line-height:1.5;font-weight:500;color:var(--text);letter-spacing:-.01em}

/* ===== Chains ===== */
.panel--chains{padding-bottom:clamp(90px,9vw,130px)}
.orbit{position:relative;width:min(780px,92%);aspect-ratio:780/700;margin:clamp(60px,6vw,90px) auto 0;z-index:2}
.orbit__ring{position:absolute;left:50%;top:47%;border-radius:50%;border:1px solid #d9d2f5}
.orbit__ring--1{width:52%;aspect-ratio:1}
.orbit__ring--2{width:77%;aspect-ratio:1}
.orbit__ring--3{width:102%;aspect-ratio:1;border-color:#e4def9}
.orbit__core{
  position:absolute;left:50%;top:47%;width:27%;aspect-ratio:1;border-radius:50%;
  background:linear-gradient(180deg,#6a4cf6 0%,#8e7bff 100%);
  border:11px solid #4e38b3;box-shadow:0 30px 50px -16px rgba(106,76,246,.65);
  display:grid;place-items:center;color:#fff;
}
.orbit__core svg{width:62%;height:62%}
.orbit__core::after{content:"";position:absolute;inset:-34px;border-radius:50%;border:1px solid rgba(106,76,246,.25);animation:ping 3s ease-out infinite}
@keyframes ping{0%{transform:scale(.8);opacity:.9}100%{transform:scale(1.5);opacity:0}}
.chain{position:absolute;width:15%;aspect-ratio:1;animation:floaty 6s ease-in-out infinite}
.chain__ic{
  position:absolute;inset:0;border-radius:50%;background:#fff;border:9px solid #e9e5fd;display:grid;place-items:center;
  color:#8f7ef0;box-shadow:0 14px 26px -16px rgba(70,45,160,.5);
}
.chain__ic svg{width:50%;height:50%}
.chain__tag{
  position:absolute;display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 10px 0 6px;border-radius:9px;background:#fff;
  font-size:12.5px;font-weight:600;color:#2a1a63;white-space:nowrap;box-shadow:0 6px 14px -8px rgba(70,45,160,.4);border:1px solid #eee9fd;
}
.chain__tag i{width:16px;height:16px;border-radius:50%;background:var(--lime);display:grid;place-items:center}
.chain__tag i svg{width:10px;height:10px}
.chain--eth{left:25%;top:23.5%;animation-delay:-1s}
.chain--eth .chain__tag{right:112%;top:50%;transform:translateY(-50%)}
.chain--bnb{left:75%;top:24%;animation-delay:-2.2s}
.chain--bnb .chain__tag{left:112%;top:50%;transform:translateY(-50%)}
.chain--matic{left:24%;top:68%;animation-delay:-3.4s}
.chain--matic .chain__tag{right:112%;top:50%;transform:translateY(-50%)}
.chain--avax{left:75.5%;top:68.5%;animation-delay:-4.1s}
.chain--avax .chain__tag{left:112%;top:50%;transform:translateY(-50%)}
.chain--ftm{left:50%;top:92%;animation-delay:-5s}
.chain--ftm .chain__tag{left:50%;top:104%;transform:translateX(-50%)}
@keyframes floaty{0%,100%{translate:0 0}50%{translate:0 -8px}}

/* ===== How it works ===== */
.panel--how{padding-bottom:clamp(60px,6vw,90px)}
.flow{position:relative;width:min(1000px,80%);aspect-ratio:1000/560;margin:clamp(40px,5vw,80px) auto 0;z-index:2}
.flow__lines{position:absolute;inset:0;width:100%;height:100%}
.flow__user{position:absolute;top:8%;width:8.2%;aspect-ratio:1;border-radius:50%;background:#fff;display:grid;place-items:center}
.flow__user svg{width:58%;height:58%}
.flow__user--a{left:45.8%;border:2.5px solid #e6b5f6;box-shadow:0 0 0 5px rgba(230,181,246,.18)}
.flow__user--b{left:54.2%;border:2.5px solid #a7def5;box-shadow:0 0 0 5px rgba(167,222,245,.2)}
.flow__node{
  position:absolute;width:8%;aspect-ratio:1;border-radius:50%;
  background:radial-gradient(circle at 35% 30%,#fff,#f1eeff 70%);display:grid;place-items:center;
  box-shadow:0 0 0 7px rgba(255,255,255,.55),0 14px 24px -12px rgba(70,45,160,.45);
}
.flow__node--l1{left:15%;top:27%}.flow__node--l2{left:23%;top:48.2%}.flow__node--l3{left:15%;top:68%}
.flow__node--r1{left:85%;top:27%}.flow__node--r2{left:77%;top:48.2%}.flow__node--r3{left:85%;top:68%}
.flow__node svg{width:56%;height:56%}
.flow__agent{z-index:3;
  position:absolute;left:50%;top:48.2%;width:24%;height:13.5%;border-radius:999px;
  background:linear-gradient(180deg,#8a74ff 0%,#6a4cf6 100%);border:3px solid #5a3fd8;
  display:flex;align-items:center;justify-content:center;gap:10px;color:#fff;font-weight:700;font-size:clamp(14px,1.6vw,22px);
  box-shadow:0 0 0 8px rgba(122,92,247,.12),0 0 50px 8px rgba(122,92,247,.45);
}
.flow__agent-ic{width:32px;height:32px}
.flow__stage{z-index:0}
.flow__chip{z-index:2;position:absolute;left:50%;top:64%;width:9.4%;aspect-ratio:1}
.flow__chip svg{width:100%;height:100%;filter:drop-shadow(0 12px 14px rgba(106,76,246,.35))}
.flow__stage{
  position:absolute;left:50%;bottom:-4%;width:62%;height:24%;border-radius:50%;
  background:radial-gradient(ellipse at 50% 45%,#fff 0%,#f5f2ff 42%,#e7e2ff 70%,#dcd5fb 100%);
  box-shadow:0 30px 60px -20px rgba(106,76,246,.4);
}

/* ===== Investors ===== */
.panel--inv{padding-bottom:clamp(90px,8vw,120px)}
.marquee{position:relative;z-index:2;margin-top:clamp(60px,6vw,90px);overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);
  cursor:grab;touch-action:pan-y}
.marquee:active{cursor:grabbing}
.marquee__track{display:flex;gap:16px;width:max-content;padding:0 8px;will-change:transform}
.logo-card{
  width:clamp(190px,18.6vw,262px);aspect-ratio:2.05;border-radius:20px;background:#000;display:grid;place-items:center;flex:0 0 auto;
  box-shadow:0 20px 34px -22px rgba(0,0,0,.6);user-select:none;
}
.lg{display:flex;align-items:center;gap:12px;color:#fff;font-weight:700}
.lg svg{height:42px;width:auto}
.lg b{font-weight:700;letter-spacing:.02em}
.lg--zero{font-size:38px;letter-spacing:-.04em;font-weight:800}
.lg--spartan b{font-weight:400;letter-spacing:.3em;font-size:19px}
.lg--inf b{font-size:13.5px;line-height:1.15;letter-spacing:.04em}
.lg--inf svg{height:28px}
.lg--sba b{font-size:10.5px;line-height:1.2;letter-spacing:.04em}
.lg--sba b u{text-decoration:none;font-weight:800;font-size:12px}
.lg--l2iv b{font-size:32px;letter-spacing:.03em;font-family:ui-monospace,"SFMono-Regular",Menlo,monospace}
.lg--l2iv svg{height:34px}
.marquee__dots{display:flex;gap:6px;justify-content:center;margin-top:34px}
.marquee__dots i{width:6px;height:6px;border-radius:3px;background:#d3cbf4;transition:all .4s var(--ease)}
.marquee__dots i.on{width:16px;background:var(--purple)}

/* ===== FAQ ===== */
.panel--faq{padding-bottom:clamp(90px,8vw,120px)}
.faq{position:relative;z-index:2;width:min(880px,78%);margin:clamp(44px,5vw,70px) auto 0;display:flex;flex-direction:column;gap:12px}
.faq__item{
  background:#fff;border:1px solid #e2dcfa;border-radius:16px;overflow:hidden;
  transition:background .4s var(--ease),border-color .4s,box-shadow .4s;
}
.faq__item.is-open{background:#e9e5ff;border-color:#ddd6fb;box-shadow:0 18px 30px -24px rgba(70,45,160,.5)}
.faq__q{
  width:100%;display:flex;align-items:center;justify-content:space-between;gap:20px;text-align:left;
  padding:14px 14px 14px 14px;font-size:clamp(14px,1.25vw,18px);font-weight:700;letter-spacing:-.03em;color:var(--ink);
}
.faq__q span{padding:4px 0 4px 12px}
.faq__ic{
  flex:0 0 auto;width:40px;height:40px;border-radius:50%;border:3px solid #e4defa;background:#fff;display:grid;place-items:center;color:#4a3a96;
  transition:transform .5s var(--ease),border-color .4s,color .4s;
}
.faq__ic svg{width:18px;height:18px}
.faq__item.is-open .faq__ic{transform:rotate(180deg);border-color:#7a5cf5;color:#2a1a63}
.faq__a{height:0;overflow:hidden}
.faq__a-in{margin:0 12px 12px;padding:16px 18px;background:#fff;border:1px solid #ded8fa;border-radius:12px}
.faq__a-in p{font-size:clamp(12px,1vw,14px);line-height:1.6;font-weight:500;color:#5b5083}

/* ===== CTA ===== */
.panel--cta{padding:14px 14px 0;background:#f8f7ff;border-color:var(--line)}
.cta{
  position:relative;overflow:hidden;border:1px solid var(--line);border-radius:26px;
  background:linear-gradient(180deg,#eeeaff,#f0edff);min-height:min(66vh,640px);display:grid;place-items:center;padding:90px 0 120px;
}
.cta__floor{
  position:absolute;left:-10%;right:-10%;bottom:0;height:48%;
  background-image:linear-gradient(#d8d1f6 1px,transparent 1px),linear-gradient(90deg,#d8d1f6 1px,transparent 1px);
  background-size:90px 54px;transform:perspective(520px) rotateX(62deg);transform-origin:50% 100%;
  -webkit-mask-image:linear-gradient(0deg,#000 10%,transparent 90%);mask-image:linear-gradient(0deg,#000 10%,transparent 90%);opacity:.9;
}
.cta__inner{position:relative;z-index:3;text-align:center;display:flex;flex-direction:column;align-items:center}
.pill{
  display:inline-flex;align-items:center;gap:8px;height:32px;padding:0 14px 0 10px;border-radius:999px;background:#fff;
  box-shadow:0 8px 16px -10px rgba(70,45,160,.45);font-size:12px;font-weight:500;color:#2a1a63;border:1px solid #eae5fd;
}
.pill svg{width:16px;height:16px;color:var(--purple)}
.cta__title{margin-top:24px;font-size:clamp(40px,4.9vw,78px);line-height:1.05;font-weight:700;letter-spacing:-.045em;color:var(--ink)}
.cta__sub{margin-top:18px;font-size:clamp(12px,1.1vw,16px);font-weight:500;color:#3d2e78}
.mailbox{
  margin-top:44px;width:min(500px,86vw);height:60px;padding:6px;border-radius:18px;background:#fff;display:flex;align-items:center;gap:10px;
  box-shadow:0 20px 34px -24px rgba(70,45,160,.55);border:1px solid #e6e0fb;
}
.mailbox__ic{width:20px;height:20px;margin-left:12px;color:#9c92cf;flex:0 0 auto}
.mailbox input{flex:1;min-width:0;border:0;outline:0;background:transparent;font:inherit;font-size:14px;font-weight:500;color:var(--ink)}
.mailbox input::placeholder{color:#9d93c6}
.mailbox .btn{height:48px;padding:0 22px;border-radius:12px;font-size:14px;font-weight:600}
.mailbox.is-error{animation:shake .4s}
@keyframes shake{20%,60%{transform:translateX(-6px)}40%,80%{transform:translateX(6px)}}
.cta__msg{margin-top:14px;height:20px;font-size:13px;font-weight:600;color:#4a3a96}
.token{
  position:absolute;z-index:2;width:clamp(56px,6vw,84px);aspect-ratio:1;border-radius:50%;background:#fff;border:3px solid #a99bf0;
  box-shadow:0 0 0 6px rgba(190,178,248,.25);display:grid;place-items:center;color:#8d7bef;animation:floaty 6s ease-in-out infinite;
}
.token svg{width:48%;height:48%}
.token--eth{left:12%;top:22%}
.token--avax{left:19%;top:38%;animation-delay:-2s}
.token--matic{right:11%;top:36%;animation-delay:-3s}
.token--bnb{right:17%;top:53%;animation-delay:-4s}
.footer{display:flex;align-items:center;justify-content:space-between;padding:42px 4vw 38px}
.footer__logo{display:flex;align-items:center;gap:8px;color:var(--purple);font-weight:800;font-size:19px;letter-spacing:-.01em}
.footer__logo svg{width:30px;height:30px}
.footer__soc{display:flex;gap:26px;color:var(--purple)}
.footer__soc svg{width:20px;height:20px;transition:transform .3s var(--ease)}
.footer__soc a:hover svg{transform:translateY(-3px)}

/* ===== Reveal helpers ===== */


/* ===== Small screens fallback (site is desktop-first) ===== */
@media (max-width:900px){
  .nav__links{display:none}
  .feat{grid-template-columns:1fr;width:86vw}
  .feat--rev .feat__text,.feat--rev .feat__media{order:initial;justify-self:start}
  .deco{display:none}
  .token{display:none}
}

/* ---- performance: pause infinite animations that are off-screen ---- */
.panel-wrap:not(.in-view) *,.panel-wrap:not(.in-view) *::before,.panel-wrap:not(.in-view) *::after,
.intro:not(.in-view) *,.intro:not(.in-view) *::before,.intro:not(.in-view) *::after{animation-play-state:paused!important}
.nav__pill,.hero,.story__item,.intro__logo,.orb-rise{backface-visibility:hidden}
/* page-change veil */
.veil{position:fixed;inset:0;z-index:900;pointer-events:none;opacity:0;background:linear-gradient(180deg,#e9e5ff 0%,#f5f3ff 100%)}
.veil::after{content:"";position:absolute;left:50%;top:50%;width:46px;height:46px;margin:-23px 0 0 -23px;border-radius:50%;border:3px solid rgba(106,76,246,.18);border-top-color:#6a4cf6;animation:vspin .8s linear infinite}
@keyframes vspin{to{transform:rotate(360deg)}}

/* reload on a non-home section: no loader, hold a veil until we have jumped to the section */
.skip-loader .loader{display:none!important}
.skip-loader body.is-loading{overflow:visible;height:auto}
.skip-loader .veil{opacity:1}

.js .loader{display:block}
/* ---- fail-safe: a script failed to load → never leave the site covered or invisible ---- */
.fail-safe .loader,.fail-safe .veil{display:none!important}
.fail-safe body.is-loading{overflow:visible!important;height:auto!important}
.fail-safe .nav__pill{opacity:1!important;transform:none!important}
.fail-safe .intro{height:auto!important;min-height:100vh}
.fail-safe .intro__stage{position:relative!important}
.fail-safe .story,.fail-safe .scroll-hint{display:none!important}
/* skip link */
.skip-link{position:fixed;left:12px;top:-60px;z-index:1200;padding:12px 18px;border-radius:12px;background:#1f0b4f;color:#fff;font-weight:700;font-size:14px;transition:top .25s}
.skip-link:focus{top:12px;outline:3px solid var(--lime)}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #6a4cf6;outline-offset:3px;border-radius:10px}