/* ==========================================================================
   ADRENALEX — Clean Energy. Rewired.
   Layout concept: a black-can world. Chrome condensed type on near-black,
   can contour-line texture as the signature surface, and one accent that
   changes with the flavor you pick. Mobile-first.
   ========================================================================== */

@font-face{font-family:"Barlow Condensed";src:url("/assets/fonts/BarlowCondensed-SemiBold.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"Barlow Condensed";src:url("/assets/fonts/BarlowCondensed-Bold.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"Barlow Condensed";src:url("/assets/fonts/BarlowCondensed-ExtraBold.woff2") format("woff2");font-weight:800;font-style:normal;font-display:swap}
@font-face{font-family:"Barlow";src:url("/assets/fonts/Barlow-Regular.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Barlow";src:url("/assets/fonts/Barlow-Medium.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"Barlow";src:url("/assets/fonts/Barlow-SemiBold.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap}

:root{
  /* Color */
  --ink:#050607;          /* page ground: can black */
  --ink-2:#0a0c0f;        /* alternate band */
  --panel:#0f1216;        /* raised surfaces */
  --line:rgba(206,220,236,.12);
  --line-2:rgba(206,220,236,.24);
  --chrome:#f1f4f7;       /* headline silver-white */
  --text:#d4dae1;         /* body */
  --mute:#8b95a1;         /* secondary */
  --volt:#14b6f6;         /* brand electric blue (REWIRED.) */

  /* Flavor accents (can packaging) */
  --f-blue:#14b6f6;
  --f-white:#e6ebf0;
  --f-cherry:#f0232f;
  --f-lemon:#f6e10a;
  --flavor:var(--f-blue);

  /* Type */
  --display:"Barlow Condensed","Arial Narrow","Roboto Condensed",Impact,sans-serif;
  --body:"Barlow","Helvetica Neue",Arial,system-ui,sans-serif;

  /* Scale */
  --fs-hero:clamp(3rem,9.6vw,6rem);
  --fs-h2:clamp(2.25rem,6.4vw,4.25rem);
  --fs-h3:clamp(1.35rem,2.6vw,1.75rem);
  --fs-body:clamp(1rem,.96rem + .2vw,1.125rem);

  --gutter:max(16px, env(safe-area-inset-left, 0px));
  --gutter-r:max(16px, env(safe-area-inset-right, 0px));
  --maxw:1240px;
  --cut:14px;
  --ease:cubic-bezier(.2,.7,.2,1);
  color-scheme:dark;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:84px}
body{margin:0;background:var(--ink);color:var(--text);font-family:var(--body);font-size:var(--fs-body);line-height:1.6;overflow-x:hidden;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
h1,h2,h3,h4{margin:0;font-family:var(--display);color:var(--chrome);line-height:.95;text-transform:uppercase;text-wrap:balance}
p{margin:0}
ul,ol{margin:0;padding:0;list-style:none}
button{font:inherit;color:inherit}
[hidden]{display:none!important}
:focus-visible{outline:2px solid var(--volt);outline-offset:3px}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.skip{position:absolute;left:12px;top:-60px;z-index:100;background:var(--chrome);color:var(--ink);padding:10px 16px;font-weight:600;text-decoration:none}
.skip:focus{top:12px}

.wrap{width:100%;max-width:calc(var(--maxw) + 64px);margin-inline:auto;padding-left:var(--gutter);padding-right:var(--gutter-r)}
@media (min-width:720px){.wrap{padding-left:max(32px,env(safe-area-inset-left,0px));padding-right:max(32px,env(safe-area-inset-right,0px))}}

/* ---------- Buttons ---------- */
.btn{
  --bg:transparent;--fg:var(--chrome);
  display:inline-flex;align-items:center;justify-content:center;gap:.5em;
  min-height:52px;padding:0 1.6em;border:0;cursor:pointer;
  background:var(--bg);color:var(--fg);
  font-family:var(--display);font-weight:700;font-size:1.06rem;letter-spacing:.08em;text-transform:uppercase;text-decoration:none;white-space:nowrap;
  clip-path:polygon(0 0,100% 0,100% calc(100% - var(--cut)),calc(100% - var(--cut)) 100%,0 100%);
  transition:background-color .2s,color .2s,transform .2s var(--ease);
}
.btn--primary{--bg:var(--chrome);--fg:var(--ink);background-image:linear-gradient(180deg,#fff 0%,#e3e8ed 55%,#c9d0d7 100%)}
.btn--primary:hover{--bg:#fff;transform:translateY(-1px);background-image:linear-gradient(180deg,#fff 0%,#fff 100%)}
.btn:focus-visible{outline:none;box-shadow:inset 0 0 0 3px var(--volt)}
.btn--sm{min-height:42px;font-size:.95rem;padding:0 1.15em;--cut:10px}
.btn--lg{min-height:58px;font-size:1.15rem;padding:0 2em}
.btn--block{width:100%}
.link-arrow{min-height:44px;font-family:var(--display);font-weight:700;letter-spacing:.1em;text-transform:uppercase;text-decoration:none;color:var(--chrome);display:inline-flex;align-items:center;gap:.5em;padding:.4em 0;border-bottom:1px solid var(--line-2)}
.link-arrow::after{content:"";width:.5em;height:.5em;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(-45deg);transition:transform .2s var(--ease)}
.link-arrow:hover::after{transform:translateX(3px) rotate(-45deg)}

/* ---------- Topo texture (can contour signature) ---------- */
.topo{position:absolute;inset:0;pointer-events:none;background:var(--tint,var(--volt));
  -webkit-mask:url("/assets/img/topo.svg") center/cover no-repeat;mask:url("/assets/img/topo.svg") center/cover no-repeat;opacity:.13}
.topo--hero{opacity:.16;-webkit-mask-size:140% auto;mask-size:140% auto;animation:drift 60s linear infinite alternate}
.topo--formula{--tint:var(--chrome);opacity:.05}
.topo--flavor{--tint:var(--flavor);opacity:.2;transition:background-color .6s}
.topo--join{opacity:.12}
@keyframes drift{from{-webkit-mask-position:0% 40%;mask-position:0% 40%}to{-webkit-mask-position:100% 60%;mask-position:100% 60%}}

/* ---------- Announcement ---------- */
.announce{background:#000;border-bottom:1px solid var(--line);font-size:.9rem}
.announce__in{display:flex;align-items:center;justify-content:center;gap:.6rem;min-height:40px;padding-block:6px;text-align:center}
.announce a{color:var(--chrome);font-weight:600;text-underline-offset:3px}
.pulse{flex:none;width:8px;height:8px;border-radius:50%;background:var(--volt);box-shadow:0 0 0 0 rgba(20,182,246,.6);animation:pulse 2s infinite}
@keyframes pulse{70%{box-shadow:0 0 0 10px rgba(20,182,246,0)}100%{box-shadow:0 0 0 0 rgba(20,182,246,0)}}

/* ---------- Nav ---------- */
.nav{position:sticky;top:env(safe-area-inset-top,0px);z-index:50;background:rgba(5,6,7,.82);-webkit-backdrop-filter:blur(14px) saturate(140%);backdrop-filter:blur(14px) saturate(140%);border-bottom:1px solid var(--line)}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:60;background:var(--ink)}
.nav__in{display:flex;align-items:center;gap:1rem;min-height:68px}
.nav__logo{flex:none;display:block}
.nav__logo img{width:150px;height:auto}
.nav__links{display:none}
.nav__cta{display:none}
.nav__toggle{margin-left:auto;width:44px;height:44px;display:grid;place-content:center;gap:7px;background:none;border:1px solid var(--line-2);cursor:pointer}
.nav__toggle span{display:block;width:20px;height:2px;background:var(--chrome);transition:transform .25s var(--ease)}
.nav__toggle[aria-expanded="true"] span:first-child{transform:translateY(4.5px) rotate(45deg)}
.nav__toggle[aria-expanded="true"] span:last-child{transform:translateY(-4.5px) rotate(-45deg)}
.nav.is-open .nav__links{display:flex;flex-direction:column;position:absolute;left:0;right:0;top:100%;background:var(--ink);border-bottom:1px solid var(--line);padding:8px var(--gutter-r) 20px var(--gutter)}
.nav.is-open .nav__links a:not(.btn){padding:14px 0;min-height:52px;border-bottom:1px solid var(--line);font-family:var(--display);font-weight:700;font-size:1.35rem;letter-spacing:.06em;text-transform:uppercase;text-decoration:none;color:var(--chrome)}
.nav__cta-mobile{margin-top:16px}
@media (min-width:960px){
  .nav__logo img{width:168px}
  .nav__links{display:flex;align-items:center;gap:2rem;margin-left:auto}
  .nav__links a:not(.btn){font-family:var(--display);font-weight:600;font-size:1rem;letter-spacing:.1em;text-transform:uppercase;text-decoration:none;color:var(--text);padding:6px 0;position:relative}
  .nav__links a:not(.btn)::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--volt);transform:scaleX(0);transform-origin:left;transition:transform .25s var(--ease)}
  .nav__links a:not(.btn):hover{color:var(--chrome)}
  .nav__links a:not(.btn):hover::after,.nav__links a.is-current::after{transform:scaleX(1)}
  .nav__cta-mobile{display:none}
  .nav__cta{display:inline-flex;margin-left:1.5rem}
  .nav__toggle{display:none}
}

/* ---------- Shared section ---------- */
.section{position:relative;padding-block:clamp(64px,9vw,120px);overflow:hidden}
.section>.wrap{position:relative}
.kicker{font-family:var(--display);font-weight:700;font-size:.95rem;letter-spacing:.22em;text-transform:uppercase;color:var(--volt);margin-bottom:1rem}
.kicker--center{text-align:center}
.h2{font-size:var(--fs-h2);font-weight:800;letter-spacing:.005em}
.h2--center{text-align:center;margin-inline:auto}
.h3{font-size:var(--fs-h3);font-weight:800;letter-spacing:.04em;margin:clamp(48px,7vw,80px) 0 1.5rem}
.split{display:grid;gap:1.25rem;margin-bottom:clamp(40px,6vw,72px)}
.split__head{min-width:0}
.split__body{color:var(--text);max-width:58ch;min-width:0}
.split__body p+p{margin-top:1rem}
@media (min-width:960px){.split{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:4rem;align-items:end}}
.fine{font-size:.82rem;line-height:1.5;color:var(--mute);margin-top:1.5rem;max-width:90ch}
.fine--box{border:1px solid var(--line);padding:16px 18px;margin-top:2.5rem}

/* ---------- Hero ---------- */
.hero{position:relative;overflow:hidden;padding-block:clamp(28px,5vw,64px) clamp(40px,6vw,72px);background:radial-gradient(120% 80% at 75% 35%,rgba(20,182,246,.10),transparent 60%),var(--ink)}
.hero__grid{position:relative;display:grid;gap:1.5rem}
.hero__copy{min-width:0;display:flex;flex-direction:column;gap:1.4rem}
.eyebrow{display:flex;flex-wrap:wrap;gap:.4rem .9rem;font-family:var(--display);font-weight:700;font-size:.9rem;letter-spacing:.2em;text-transform:uppercase;color:var(--mute)}
.eyebrow span{display:inline-flex;align-items:center;gap:.9rem}
.eyebrow span+span::before{content:"";width:5px;height:5px;background:var(--volt);transform:rotate(45deg)}
.hero__title{font-size:var(--fs-hero);font-weight:800;line-height:.88;letter-spacing:-.005em;
  background:linear-gradient(180deg,#ffffff 0%,#e7ebef 42%,#a9b1ba 50%,#eef1f4 62%,#c8cfd6 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero__title em{font-style:normal;display:block;background:linear-gradient(180deg,#7fd8ff 0%,#14b6f6 55%,#0a8fd0 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero__lede{max-width:44ch;font-size:clamp(1.05rem,1rem + .35vw,1.25rem);color:var(--text)}
.hero__secondary{display:flex;flex-wrap:wrap;gap:1.75rem}
.hero__visual{margin:0;order:-1;position:relative;margin-inline:calc(var(--gutter) * -1) calc(var(--gutter-r) * -1)}
.hero__visual img{width:100%;-webkit-mask-image:radial-gradient(ellipse 54% 58% at 50% 50%,#000 62%,transparent 100%);mask-image:radial-gradient(ellipse 54% 58% at 50% 50%,#000 62%,transparent 100%);animation:rise 1.1s var(--ease) both}
@keyframes rise{from{transform:translateY(24px) scale(.98)}to{transform:none}}
@media (min-width:960px){
  .hero__grid{grid-template-columns:minmax(0,.95fr) minmax(0,1.15fr);align-items:center;gap:2rem}
  .hero__title{font-size:min(6rem,5.5vw)}
  .hero__visual{order:0;margin:0 calc(var(--gutter-r) * -1) 0 -4%}
  .hero__visual img{-webkit-mask-image:radial-gradient(ellipse 52% 56% at 50% 50%,#000 64%,transparent 100%);mask-image:radial-gradient(ellipse 52% 56% at 50% 50%,#000 64%,transparent 100%)}
}

/* Proof strip */
.proof{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-top:1px solid var(--line);border-left:1px solid var(--line);margin-top:clamp(32px,5vw,56px)}
.proof li{display:flex;flex-direction:column;gap:.25rem;padding:18px 18px 16px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
.proof strong{font-family:var(--display);font-weight:800;font-size:clamp(2.2rem,5vw,3rem);line-height:1;color:var(--chrome);font-variant-numeric:tabular-nums}
.proof small{font-size:.45em;margin-left:.12em;letter-spacing:.06em;color:var(--mute)}
.proof span{font-family:var(--display);font-weight:600;letter-spacing:.16em;text-transform:uppercase;font-size:.85rem;color:var(--mute)}
@media (min-width:720px){.proof{grid-template-columns:repeat(4,minmax(0,1fr))}}

/* ---------- Signup forms ---------- */
.signup{display:flex;flex-direction:column;gap:.75rem;width:100%;max-width:560px}
.signup__row{display:flex;flex-direction:column;gap:10px}
.signup input[type=email],.signup input[type=tel]{width:100%;min-height:54px;padding:0 18px;background:rgba(255,255,255,.04);border:1px solid var(--line-2);color:var(--chrome);font:inherit;font-size:1.02rem;border-radius:0;transition:border-color .2s,background-color .2s}
.signup input::placeholder{color:#6d7681}
.signup input:focus{outline:none;border-color:var(--volt);background:rgba(20,182,246,.06)}
.signup input[aria-invalid=true]{border-color:#ff6a6a}
.signup__note{font-size:.88rem;color:var(--mute)}
.signup__msg{font-size:.95rem;font-weight:600}
.signup__msg:empty{display:none}
.signup__msg.is-ok{color:#7ee2a8}
.signup__msg.is-err{color:#ff8a8a}
.signup.is-done .signup__row,.signup.is-done .signup__fields,.signup.is-done .consent,.signup.is-done>.btn,.signup.is-done .signup__note{display:none}
@media (min-width:560px){.signup__row{flex-direction:row}.signup__row input{flex:1}.signup__row .btn{flex:none}}
.signup--full{max-width:620px;margin-inline:auto}
.signup__fields{display:grid;gap:14px}
@media (min-width:640px){.signup__fields{grid-template-columns:1fr 1fr}}
.field{display:flex;flex-direction:column;gap:6px;min-width:0}
.field label{font-family:var(--display);font-weight:700;letter-spacing:.14em;text-transform:uppercase;font-size:.85rem;color:var(--chrome)}
.field label span{font-family:var(--body);font-weight:400;letter-spacing:0;text-transform:none;color:var(--mute)}
.consent{display:flex;gap:12px;align-items:flex-start;font-size:.78rem;line-height:1.5;color:var(--mute);cursor:pointer}
.consent input{flex:none;width:24px;height:24px;margin-top:2px;accent-color:var(--volt)}
.consent a{color:var(--text)}

/* ---------- Ticker ---------- */
.ticker{border-block:1px solid var(--line);background:#000;overflow:hidden;padding-block:14px}
.ticker__track{display:flex;align-items:center;gap:2rem;width:max-content;animation:tick 38s linear infinite}
.ticker span{font-family:var(--display);font-weight:800;font-size:clamp(1.2rem,2.6vw,1.6rem);letter-spacing:.12em;text-transform:uppercase;color:var(--chrome);white-space:nowrap}
.ticker i{width:9px;height:9px;background:var(--volt);transform:rotate(45deg);flex:none}
@keyframes tick{to{transform:translateX(-50%)}}

/* ---------- Why ---------- */
.why{background:linear-gradient(180deg,var(--ink) 0%,var(--ink-2) 100%)}
.pillars{display:grid;gap:1px;background:var(--line);border:1px solid var(--line)}
.pillar{background:var(--ink-2);padding:clamp(24px,3.5vw,40px);display:flex;flex-direction:column;gap:.9rem;min-width:0}
.pillar__icon{width:44px;height:44px;color:var(--volt)}
.pillar h3{font-size:var(--fs-h3);font-weight:800;letter-spacing:.03em}
.pillar p{color:var(--text)}
@media (min-width:860px){.pillars{grid-template-columns:repeat(3,minmax(0,1fr))}}

.compare{margin-top:clamp(56px,8vw,96px)}
.compare__title{font-size:var(--fs-h3);font-weight:800;letter-spacing:.04em;margin-bottom:1.25rem}
.compare__scroll{overflow-x:auto;border:1px solid var(--line);-webkit-overflow-scrolling:touch}
.compare__table{width:100%;min-width:560px;border-collapse:collapse;font-size:.98rem}
.compare__table th,.compare__table td{padding:16px 18px;text-align:left;vertical-align:top;border-bottom:1px solid var(--line)}
.compare__table tbody tr:last-child>*{border-bottom:0}
.compare__table thead th{font-family:var(--display);font-weight:800;font-size:1.1rem;letter-spacing:.1em;text-transform:uppercase;color:var(--mute);background:rgba(255,255,255,.02)}
.compare__table thead th.is-adx{color:var(--volt)}
.compare__table tbody th{font-family:var(--display);font-weight:700;letter-spacing:.12em;text-transform:uppercase;font-size:.9rem;color:var(--mute);width:24%}
.compare__table td.is-adx{color:var(--chrome);font-weight:500;background:rgba(20,182,246,.06);border-left:2px solid var(--volt)}
.compare__table td:not(.is-adx){color:var(--mute)}

/* ---------- Formula ---------- */
.formula{background:var(--ink-2)}
.specs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-top:1px solid var(--line-2)}
.spec{padding:24px 16px 24px 0;border-bottom:1px solid var(--line);display:flex;flex-direction:column;gap:.4rem;min-width:0}
.spec:nth-child(odd){padding-right:16px;border-right:1px solid var(--line)}
.spec:nth-child(even){padding-left:16px}
.spec__val{font-family:var(--display);font-weight:800;font-size:clamp(3.2rem,9vw,5.5rem);line-height:.9;color:var(--chrome);font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.spec__val span{font-size:.36em;margin-left:.12em;color:var(--volt);letter-spacing:.04em}
.spec__name{font-family:var(--display);font-weight:700;font-size:1.25rem;letter-spacing:.1em;text-transform:uppercase;color:var(--chrome)}
.spec__desc{font-size:.95rem;color:var(--mute)}
@media (min-width:900px){
  .specs{grid-template-columns:repeat(4,minmax(0,1fr))}
  .spec,.spec:nth-child(odd),.spec:nth-child(even){padding:32px 28px;border-right:1px solid var(--line)}
  .spec:first-child{padding-left:0}
  .spec:last-child{border-right:0}
}
.pathway{margin-top:clamp(56px,8vw,96px)}
.pathway__title{font-size:var(--fs-h3);font-weight:800;letter-spacing:.04em;margin-bottom:1.5rem}
.pathway__steps{display:grid;gap:14px;counter-reset:step}
.pathway__steps li{position:relative;padding:22px 22px 22px 64px;background:var(--panel);border:1px solid var(--line);counter-increment:step;min-width:0}
.pathway__steps li::before{content:counter(step);position:absolute;left:20px;top:18px;font-family:var(--display);font-weight:800;font-size:1.8rem;line-height:1;color:var(--volt)}
.pathway__label{font-family:var(--display);font-weight:700;letter-spacing:.14em;text-transform:uppercase;font-size:.95rem;color:var(--chrome);margin-bottom:.4rem}
.pathway__steps p:not(.pathway__label){color:var(--text);font-size:.98rem}
.pathway__steps strong{color:var(--chrome)}
@media (min-width:900px){
  .pathway__steps{grid-template-columns:repeat(3,minmax(0,1fr));gap:0}
  .pathway__steps li{border-right-width:0}
  .pathway__steps li:last-child{border-right-width:1px;border-color:rgba(20,182,246,.45);background:linear-gradient(180deg,rgba(20,182,246,.10),var(--panel))}
}

/* ---------- Flavors ---------- */
.flavors{background:#000;transition:--flavor .6s}
.flavors[data-flavor="blue-voltage"]{--flavor:var(--f-blue)}
.flavors[data-flavor="white-lightning"]{--flavor:var(--f-white)}
.flavors[data-flavor="cherry-charge"]{--flavor:var(--f-cherry)}
.flavors[data-flavor="amped-lemonade"]{--flavor:var(--f-lemon)}
.flavors__glow{position:absolute;inset:0;background:radial-gradient(50% 45% at 50% 62%,color-mix(in srgb,var(--flavor) 26%,transparent),transparent 70%);transition:background .6s;pointer-events:none}
.flavor-ui{display:grid;gap:24px}
.flavor-tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.flavor-tab{display:flex;flex-direction:column;align-items:center;gap:8px;padding:12px 6px;background:rgba(255,255,255,.03);border:1px solid var(--line);cursor:pointer;text-align:center;transition:border-color .25s,background-color .25s;min-width:0}
.flavor-tab img{width:28px;height:auto;flex:none}
.flavor-tab b{display:block;font-family:var(--display);font-weight:800;font-size:.9rem;letter-spacing:.06em;text-transform:uppercase;line-height:1.05;color:var(--chrome)}
.flavor-tab small{display:none}
.flavor-tab:hover{border-color:var(--line-2)}
.flavor-tab[aria-selected="true"]{border-color:var(--flavor);background:color-mix(in srgb,var(--flavor) 10%,transparent)}
.flavor-tab[aria-selected="true"] b{color:var(--flavor)}
.flavor-stage{display:grid;gap:24px;align-items:center;outline:none}
.flavor-can{position:relative;display:grid;place-items:center;height:clamp(380px,62vw,560px);width:100%}
.can{grid-area:1/1;height:100%;min-height:0;display:flex;align-items:center;justify-content:center;opacity:0;transform:translateX(30px) rotate(4deg);transition:opacity .45s var(--ease),transform .6s var(--ease);pointer-events:none}
.can.is-active{opacity:1;transform:none}
.can img{height:100%;width:auto;max-width:none;-webkit-mask-image:radial-gradient(60% 52% at 50% 50%,#000 72%,transparent 100%);mask-image:radial-gradient(60% 52% at 50% 50%,#000 72%,transparent 100%);filter:drop-shadow(0 30px 40px rgba(0,0,0,.6))}
.flavor-info{min-width:0}
.flavor-info__base{font-family:var(--display);font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--flavor);transition:color .4s}
.flavor-info__name{font-size:clamp(2.8rem,8vw,5rem);font-weight:800;margin:.35rem 0 1rem}
.flavor-info__desc{max-width:40ch;color:var(--text);font-size:1.08rem}
.flavor-info__facts{display:flex;flex-wrap:wrap;gap:8px;margin-top:1.5rem}
.flavor-info__facts li{font-family:var(--display);font-weight:600;letter-spacing:.1em;text-transform:uppercase;font-size:.85rem;padding:6px 12px;border:1px solid var(--line-2);color:var(--chrome)}
@media (min-width:900px){
  .flavor-ui{grid-template-columns:260px minmax(0,1fr);gap:48px;align-items:center}
  .flavor-tabs{grid-template-columns:1fr;gap:10px}
  .flavor-tab{flex-direction:row;justify-content:flex-start;gap:16px;padding:16px 18px;text-align:left}
  .flavor-tab img{width:34px}
  .flavor-tab b{font-size:1.2rem}
  .flavor-tab small{display:block;font-size:.85rem;color:var(--mute);letter-spacing:.04em;margin-top:2px}
  .flavor-stage{grid-template-columns:minmax(0,.9fr) minmax(0,1fr);gap:40px}
}

/* ---------- Moments ---------- */
.moments{background:var(--ink);padding-block:clamp(64px,9vw,110px)}
.moments__list{display:grid;gap:1px;background:var(--line);border:1px solid var(--line);margin-top:clamp(32px,5vw,56px)}
.moments__list li{background:var(--ink);padding:24px;min-width:0}
.moments__time{font-family:var(--display);font-weight:800;font-size:1.45rem;letter-spacing:.06em;text-transform:uppercase;color:var(--chrome);margin-bottom:.35rem}
.moments__list li p:last-child{color:var(--mute)}
@media (min-width:640px){.moments__list{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1000px){.moments__list{grid-template-columns:repeat(4,minmax(0,1fr))}}

/* ---------- Kickstarter ---------- */
.ks{background:linear-gradient(180deg,var(--ink-2),var(--ink))}
.ks__assure{display:flex;gap:.7rem;align-items:flex-start;padding:14px 16px;border:1px solid rgba(20,182,246,.35);background:rgba(20,182,246,.06);color:var(--chrome);font-weight:500}
.ks__assure::before{content:"";flex:none;width:18px;height:18px;margin-top:3px;background:var(--volt);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2 4 5v6c0 5 3.4 9.4 8 11 4.6-1.6 8-6 8-11V5l-8-3Zm-1.2 14.2-4-4 1.4-1.4 2.6 2.6 5.6-5.6 1.4 1.4-7 7Z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2 4 5v6c0 5 3.4 9.4 8 11 4.6-1.6 8-6 8-11V5l-8-3Zm-1.2 14.2-4-4 1.4-1.4 2.6 2.6 5.6-5.6 1.4 1.4-7 7Z'/%3E%3C/svg%3E") center/contain no-repeat}
.funds{display:grid;gap:1px;background:var(--line);border:1px solid var(--line)}
.funds li{display:flex;gap:16px;align-items:flex-start;padding:22px;background:var(--ink-2);min-width:0}
.funds svg{flex:none;width:32px;height:32px;color:var(--volt)}
.funds h4{font-size:1.25rem;font-weight:800;letter-spacing:.04em;margin-bottom:.35rem}
.funds p{color:var(--mute);font-size:.96rem}
@media (min-width:720px){.funds{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1080px){.funds{grid-template-columns:repeat(3,minmax(0,1fr))}}

.progress{display:grid;gap:18px;padding:clamp(20px,3vw,32px);border:1px solid var(--line-2);background:var(--panel);margin-bottom:8px}
.progress__nums{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.progress__nums strong{display:block;font-family:var(--display);font-weight:800;font-size:clamp(1.8rem,5vw,3rem);line-height:1;color:var(--chrome);font-variant-numeric:tabular-nums}
.progress__nums span{font-size:.9rem;color:var(--mute)}
.progress__nums p:first-child strong{color:var(--volt)}
.progress__bar{height:10px;background:rgba(255,255,255,.08);overflow:hidden}
.progress__bar span{display:block;height:100%;width:0;background:linear-gradient(90deg,#0a8fd0,var(--volt));transition:width 1.2s var(--ease)}
.progress .btn{justify-self:start}

/* ---------- Rewards ---------- */
.rewards{background:var(--ink)}
.tiers{display:grid;gap:14px}
.tier{position:relative;display:flex;flex-direction:column;gap:.75rem;padding:26px 24px;background:var(--panel);border:1px solid var(--line);min-width:0}
.tier h3{font-size:1.75rem;font-weight:800;letter-spacing:.02em}
.tier p{color:var(--mute);font-size:.98rem}
.tier__tag{font-family:var(--display);font-weight:700;letter-spacing:.18em;text-transform:uppercase;font-size:.8rem;color:var(--chrome)!important}
.tier__price{margin-top:auto;padding-top:14px;border-top:1px solid var(--line);font-family:var(--display);font-weight:700;letter-spacing:.14em;text-transform:uppercase;font-size:.85rem;color:var(--text)!important}
.tier--early{border-color:var(--volt);background:linear-gradient(180deg,rgba(20,182,246,.14),var(--panel) 60%)}
.tier--early .tier__tag{color:var(--volt)!important}
.tier--early::after{content:"";position:absolute;top:0;right:0;width:0;height:0;border-style:solid;border-width:0 26px 26px 0;border-color:transparent var(--volt) transparent transparent}
.rewards__cta{margin-top:clamp(32px,5vw,48px);display:flex;justify-content:center}
@media (min-width:700px){.tiers{grid-template-columns:repeat(2,minmax(0,1fr))}.tier--early{grid-column:1/-1}}
@media (min-width:1100px){.tiers{grid-template-columns:repeat(5,minmax(0,1fr))}.tier--early{grid-column:auto}}

/* ---------- Roadmap ---------- */
.roadmap{background:var(--ink-2)}
.road{position:relative;display:grid;gap:0;counter-reset:road}
.road__step{position:relative;padding:0 0 28px 44px;min-width:0}
.road__step::before{content:"";position:absolute;left:9px;top:8px;bottom:-8px;width:2px;background:var(--line-2)}
.road__step:last-child::before{display:none}
.road__step::after{content:"";position:absolute;left:2px;top:4px;width:16px;height:16px;border:2px solid var(--line-2);background:var(--ink-2);transform:rotate(45deg)}
.road__step.is-done::after{background:var(--volt);border-color:var(--volt)}
.road__step.is-done::before{background:var(--volt)}
.road__step.is-now::after{border-color:var(--volt);box-shadow:0 0 0 4px rgba(20,182,246,.18)}
.road__status{display:inline-block;font-family:var(--display);font-weight:700;letter-spacing:.18em;text-transform:uppercase;font-size:.75rem;padding:3px 8px;border:1px solid var(--line-2);color:var(--mute);margin-bottom:.6rem}
.is-done .road__status{border-color:var(--volt);color:var(--ink);background:var(--volt)}
.is-now .road__status{border-color:var(--volt);color:var(--volt)}
.road__step h3{font-size:1.45rem;font-weight:800;letter-spacing:.03em;margin-bottom:.3rem}
.road__step p{color:var(--mute);font-size:.96rem;max-width:46ch}
@media (min-width:900px){
  .road{grid-template-columns:repeat(3,minmax(0,1fr));gap:40px 32px}
  .road__step{padding:28px 0 0;border-top:2px solid var(--line-2)}
  .road__step::before{display:none}
  .road__step::after{left:0;top:-9px}
  .road__step.is-done{border-top-color:var(--volt)}
  .road__step.is-now{border-top-color:rgba(20,182,246,.5)}
}

/* ---------- Retail ---------- */
.retail{background:var(--ink)}
.retail__grid{display:grid;gap:40px;align-items:center}
.retail__copy{display:flex;flex-direction:column;gap:1.25rem;min-width:0}
.retail__copy>p{max-width:52ch}
.channels{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line);margin-top:.75rem}
.channels li{background:var(--ink);padding:18px;min-width:0}
.channels h3{font-size:1.15rem;font-weight:800;letter-spacing:.06em;margin-bottom:.3rem}
.channels p{font-size:.9rem;color:var(--mute)}
.retail__visual{margin:0;min-width:0}
.retail__visual img{width:100%;border:1px solid var(--line)}
.retail__visual figcaption{font-size:.8rem;color:var(--mute);margin-top:.6rem}
@media (min-width:960px){.retail__grid{grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:64px}}

/* ---------- Statement ---------- */
.statement{position:relative;overflow:hidden;background:#000;padding-block:clamp(96px,16vw,200px);text-align:center;isolation:isolate}
.statement__bg{position:absolute;inset:0;z-index:-1}
.statement__bg img{width:100%;height:100%;object-fit:cover;opacity:.5;filter:blur(14px) saturate(1.4);transform:scale(1.08)}
.statement__bg::after{content:"";position:absolute;inset:0;background:radial-gradient(70% 70% at 50% 50%,rgba(0,0,0,.35),#000 85%)}
.statement__in{display:flex;flex-direction:column;align-items:center;gap:1.5rem}
.statement__title{font-size:clamp(3.4rem,13vw,10rem);font-weight:800;line-height:.86;
  background:linear-gradient(180deg,#ffffff 0%,#e3e7eb 44%,#9aa3ad 52%,#eef1f4 64%,#bcc4cc 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.statement__title span{background:linear-gradient(180deg,#8fdcff 0%,#14b6f6 55%,#0a8fd0 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.statement p{max-width:56ch;color:var(--text);font-size:clamp(1.05rem,1rem + .3vw,1.25rem)}

/* ---------- FAQ ---------- */
.faq{background:var(--ink)}
.faq__grid{display:grid;gap:32px}
.faq__head{display:flex;flex-direction:column;gap:1rem;min-width:0}
.faq__head a{color:var(--chrome);text-underline-offset:3px}
.faq__list{border-top:1px solid var(--line-2);min-width:0}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:20px 0;font-family:var(--display);font-weight:700;font-size:clamp(1.15rem,2.2vw,1.4rem);letter-spacing:.04em;text-transform:uppercase;color:var(--chrome)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";flex:none;width:14px;height:14px;background:linear-gradient(var(--volt),var(--volt)) center/100% 2px no-repeat,linear-gradient(var(--volt),var(--volt)) center/2px 100% no-repeat;transition:transform .25s var(--ease)}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details>div{padding:0 0 22px;max-width:68ch;color:var(--text)}
@media (min-width:960px){.faq__grid{grid-template-columns:minmax(0,.8fr) minmax(0,1.4fr);gap:64px}.faq__head{position:sticky;top:110px;align-self:start}}

/* ---------- Join ---------- */
.join{background:radial-gradient(70% 60% at 50% 0%,rgba(20,182,246,.12),transparent 70%),var(--ink-2);border-top:1px solid var(--line)}
.join__in{display:flex;flex-direction:column;align-items:center;text-align:center}
.join__in>div{width:100%;display:flex;flex-direction:column;align-items:center}
.join__mark img{width:96px;margin-bottom:24px}
.join__lede{max-width:52ch;margin:1.25rem auto 2rem;color:var(--text)}
.join .signup{text-align:left}

/* ---------- Footer ---------- */
.footer{background:#000;border-top:1px solid var(--line);padding-block:56px 32px;font-size:.95rem}
.footer__in{display:grid;gap:32px}
.footer__brand img{width:190px}
.footer__nav{display:flex;flex-direction:column;gap:0;align-items:flex-start}
.footer__nav a{display:inline-flex;align-items:center;min-height:44px;text-decoration:none;color:var(--text);font-family:var(--display);font-weight:600;letter-spacing:.12em;text-transform:uppercase}
.footer__nav a:hover{color:var(--chrome)}
.footer__legal{margin-top:40px;display:grid;gap:8px;font-size:.8rem;color:var(--mute)}
.footer__legal::before{content:"";display:block;height:1px;background:var(--line);margin-bottom:16px}
@media (min-width:760px){.footer__in{grid-template-columns:1.4fr 1fr 1fr;align-items:start}}

/* ---------- Sticky mobile CTA ---------- */
.sticky-cta{position:fixed;left:0;right:0;bottom:0;z-index:40;padding:10px var(--gutter-r) calc(10px + env(safe-area-inset-bottom,0px)) var(--gutter);background:rgba(5,6,7,.9);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-top:1px solid var(--line);transform:translateY(110%);transition:transform .35s var(--ease)}
.sticky-cta.is-visible{transform:none}
@media (min-width:960px){.sticky-cta{display:none}}

/* ---------- Reveal (content is visible at rest; this only adds motion) ---------- */
.reveal{transition:transform .8s var(--ease)}
.reveal.is-pending{transform:translateY(18px)}

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

/* ---------- Light "silver" section variant ----------
   Add class="section--light" to a section to flip it to the silver palette.
   Tokens are redefined locally, so every component inside follows. */
.section--light{
  --ink:#eef1f4;
  --ink-2:#e6eaee;
  --panel:#ffffff;
  --line:rgba(12,22,34,.12);
  --line-2:rgba(12,22,34,.24);
  --chrome:#07090c;
  --text:#262d36;
  --mute:#5a6470;
  --volt:#0779b0;
  color-scheme:light;
  color:var(--text);
}
.formula.section--light{background:linear-gradient(180deg,#f3f5f7 0%,#e3e8ec 100%)}
.faq.section--light{background:linear-gradient(180deg,#e9edf1 0%,#f3f5f7 100%)}
.section--light .topo--formula{--tint:#0b1a2a;opacity:.07}
.section--light .pathway__steps li:last-child{border-color:rgba(7,121,176,.45);background:linear-gradient(180deg,rgba(7,121,176,.08),#fff)}
.section--light .fine--box{background:rgba(255,255,255,.5)}
