/* ============================================================
   CLO-PIP // landing — CRT phosphor terminal, production grade
   ============================================================ */

/* Fuentes auto-hospedadas (sin Google Fonts → RGPD + velocidad). OFL. */
@font-face{
  font-family:'VT323'; font-style:normal; font-weight:400; font-display:swap;
  src:url('assets/fonts/vt323-latin.woff2') format('woff2');
}
@font-face{
  font-family:'Share Tech Mono'; font-style:normal; font-weight:400; font-display:swap;
  src:url('assets/fonts/sharetechmono-latin.woff2') format('woff2');
}

:root{
  --phosphor:      #4cff4c;
  --phosphor-bright:#9dffb0;
  --phosphor-dim:  #2aa83a;
  --phosphor-deep: #0d3d16;
  --phosphor-dark: #08160a;
  --bg:            #030803;
  --bg-deep:       #010401;
  --bg-panel:      #061206;
  --amber:         #ffb000;
  --glow:    0 0 4px rgba(76,255,76,.7), 0 0 16px rgba(76,255,76,.35);
  --glow-soft: 0 0 10px rgba(76,255,76,.25);
  --maxw: 1180px;
  --ease: cubic-bezier(.22,1,.36,1);
}
html[data-theme="amber"]{
  --phosphor:#ffb000; --phosphor-bright:#ffd98a; --phosphor-dim:#b87b00;
  --phosphor-deep:#3a2700; --phosphor-dark:#170f00;
  --glow:0 0 4px rgba(255,176,0,.7),0 0 16px rgba(255,176,0,.35);
  --glow-soft:0 0 10px rgba(255,176,0,.22);
}

*{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; }

body{
  background:
    radial-gradient(ellipse 120% 80% at 50% -10%, rgba(76,255,76,.06), transparent 60%),
    radial-gradient(ellipse at center, var(--bg) 0%, var(--bg-deep) 100%);
  color:var(--phosphor);
  font-family:'Share Tech Mono', monospace;
  font-size:16px; line-height:1.6;
  min-height:100vh;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
body.booting{ overflow:hidden; height:100vh; }

::selection{ background:var(--phosphor); color:var(--bg-deep); }

h1,h2,h3{ font-family:'VT323',monospace; font-weight:400; line-height:.98; letter-spacing:1px; }
a{ color:inherit; text-decoration:none; }
code{
  font-family:'Share Tech Mono',monospace; font-size:.86em;
  color:var(--phosphor-bright); background:rgba(76,255,76,.07);
  border:1px solid var(--phosphor-deep); padding:1px 6px; border-radius:3px;
}
b{ color:var(--phosphor-bright); font-weight:400; }
.hl{ color:var(--phosphor-bright); text-shadow:var(--glow); }
.dim{ color:var(--phosphor-dim); }
.ok{ color:var(--phosphor); text-shadow:var(--glow); }

/* ============================================================
   GLOBAL CRT OVERLAYS
   ============================================================ */
.crt-scanlines,.crt-vignette,.crt-flicker,.crt-sweep,.grain{
  position:fixed; inset:0; pointer-events:none; z-index:9000;
}
.crt-scanlines{
  background:repeating-linear-gradient(to bottom,
    rgba(0,0,0,0) 0px, rgba(0,0,0,0) 2px,
    rgba(0,0,0,.16) 3px, rgba(0,0,0,.16) 4px);
  mix-blend-mode:multiply;
}
.crt-vignette{
  background:radial-gradient(ellipse at center, transparent 58%, rgba(0,0,0,.6) 100%);
}
.crt-flicker{ background:rgba(76,255,76,.012); animation:flick 7s infinite steps(1); }
@keyframes flick{ 0%,96%,100%{opacity:.5} 97%{opacity:.9} 98%{opacity:.3} 99%{opacity:.8} }
.crt-sweep{
  background:linear-gradient(to bottom, transparent, rgba(76,255,76,.05) 50%, transparent);
  height:38vh; top:-38vh; animation:sweep 9s linear infinite;
}
@keyframes sweep{ to{ transform:translateY(160vh) } }
.grain{
  opacity:.04; mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
@media (prefers-reduced-motion: reduce){
  .crt-sweep,.crt-flicker{ animation:none; }
}

/* ============================================================
   BOOT
   ============================================================ */
#boot{
  position:fixed; inset:0; z-index:9500; background:var(--bg-deep);
  display:flex; align-items:flex-start; padding:8vh 7vw;
  transition:opacity .5s var(--ease), visibility .5s;
}
/* Sin JS no hay boot que ocultar → no taparía la página en negro */
html:not(.js) #boot{ display:none; }
#boot.done{ opacity:0; visibility:hidden; }
#boot-log{
  font-family:'Share Tech Mono',monospace; font-size:clamp(13px,1.6vw,17px);
  line-height:1.7; color:var(--phosphor); text-shadow:var(--glow);
  white-space:pre-wrap;
}
#boot-log .c{ display:inline-block; width:9px; height:1.05em; background:var(--phosphor);
  box-shadow:var(--glow); vertical-align:-2px; animation:blink 1s steps(1) infinite; }
@keyframes blink{ 50%{opacity:0} }

/* ============================================================
   NAV
   ============================================================ */
.nav{
  position:fixed; top:0; left:0; right:0; z-index:200;
  display:flex; align-items:center; justify-content:space-between;
  padding:16px clamp(18px,4vw,42px);
  background:linear-gradient(to bottom, rgba(3,8,3,.9), rgba(3,8,3,0));
  backdrop-filter:blur(2px);
  transition:background .3s, border-color .3s, padding .3s;
  border-bottom:1px solid transparent;
}
.nav.scrolled{
  background:rgba(3,8,3,.92); border-bottom:1px solid var(--phosphor-deep);
  padding-top:11px; padding-bottom:11px;
}
.nav-brand{ font-family:'VT323',monospace; font-size:28px; letter-spacing:2px;
  text-shadow:var(--glow); display:flex; flex-direction:column; line-height:.78; }
.nav-brand-sub{ font-family:'Share Tech Mono'; font-size:9px; letter-spacing:3px;
  color:var(--phosphor-dim); margin-top:3px; }
.nav-links{ display:flex; gap:26px; font-size:13px; letter-spacing:1px; }
.nav-links a{ color:var(--phosphor-dim); transition:.18s; }
.nav-links a:hover{ color:var(--phosphor); text-shadow:var(--glow); }
.nav-cta{
  font-family:'VT323',monospace; font-size:19px; letter-spacing:1px;
  border:1px solid var(--phosphor-dim); padding:5px 16px;
  color:var(--phosphor); transition:.2s;
}
.nav-cta:hover{ background:var(--phosphor); color:var(--bg-deep); box-shadow:var(--glow); }
.nav-right{ display:flex; align-items:center; gap:14px; }
.lang-toggle{
  display:flex; align-items:center; gap:6px;
  background:none; border:1px solid var(--phosphor-deep);
  color:var(--phosphor-dim); font-family:'VT323',monospace; font-size:16px; letter-spacing:1px;
  padding:4px 10px; cursor:pointer; transition:.2s;
}
.lang-toggle:hover{ border-color:var(--phosphor-dim); }
.lang-toggle .sep{ color:var(--phosphor-deep); }
.lang-toggle [data-lang-opt]{ transition:.2s; }
.lang-toggle [data-lang-opt].active{ color:var(--phosphor); text-shadow:var(--glow); }
@media(max-width:760px){ .nav-links{ display:none; } }

/* form privacy note */
.form-privacy{ font-size:11px; color:var(--phosphor-dim); margin-top:10px; letter-spacing:.4px; line-height:1.5; }
.form-privacy a{ color:var(--phosphor-dim); text-decoration:underline; transition:.18s; }
.form-privacy a:hover{ color:var(--phosphor); text-shadow:var(--glow-soft); }
.footer-legal{ margin-top:10px; }
.footer-legal a{ color:var(--phosphor-dim); text-decoration:underline; transition:.18s; }
.footer-legal a:hover{ color:var(--phosphor); }

/* ============================================================
   HERO
   ============================================================ */
.hero{
  position:relative; min-height:100vh;
  display:flex; flex-direction:column; justify-content:center;
  padding:120px clamp(18px,4vw,42px) 40px;
  overflow:hidden;
}
.hero-grid{
  position:absolute; inset:0; z-index:0; opacity:.5;
  background-image:
    linear-gradient(rgba(76,255,76,.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(76,255,76,.05) 1px, transparent 1px);
  background-size:46px 46px;
  mask-image:radial-gradient(ellipse 90% 70% at 30% 40%, #000 20%, transparent 75%);
  -webkit-mask-image:radial-gradient(ellipse 90% 70% at 30% 40%, #000 20%, transparent 75%);
}
.hero-inner{
  position:relative; z-index:2; width:100%; max-width:var(--maxw); margin:0 auto;
  display:grid; grid-template-columns:1.15fr .85fr; gap:48px; align-items:center;
}
.kicker{
  display:inline-flex; align-items:center; gap:8px;
  font-size:12px; letter-spacing:3px; color:var(--phosphor-dim);
  border:1px solid var(--phosphor-deep); padding:5px 12px; margin-bottom:26px;
}
.led{ width:8px; height:8px; border-radius:50%; background:var(--phosphor);
  box-shadow:var(--glow); animation:pulse 1.8s infinite; }
@keyframes pulse{ 0%,100%{opacity:1} 50%{opacity:.35} }

.hero-title{
  font-size:clamp(44px, 8vw, 104px); line-height:.92; letter-spacing:1px;
  text-shadow:var(--glow); margin-bottom:24px;
}
.hero-sub{ font-size:clamp(14px,1.5vw,17px); color:var(--phosphor-dim);
  max-width:46ch; margin-bottom:30px; line-height:1.65; }
.hero-sub b{ color:var(--phosphor); }

/* glitch word */
.glitch{ position:relative; display:inline-block; color:var(--phosphor-bright); }
.glitch::before,.glitch::after{
  content:attr(data-text); position:absolute; left:0; top:0; width:100%;
  overflow:hidden; opacity:.8;
}
.glitch::before{ color:#ff3b6b; transform:translate(-2px,0); clip-path:inset(0 0 55% 0); animation:gl1 2.6s infinite steps(2); }
.glitch::after{ color:#2ad6ff; transform:translate(2px,0); clip-path:inset(55% 0 0 0); animation:gl2 3.1s infinite steps(2); }
@keyframes gl1{ 0%,92%,100%{transform:translate(-2px,0)} 94%{transform:translate(2px,-1px)} 96%{transform:translate(-3px,1px)} }
@keyframes gl2{ 0%,90%,100%{transform:translate(2px,0)} 93%{transform:translate(-2px,1px)} 97%{transform:translate(3px,-1px)} }
@media(prefers-reduced-motion:reduce){ .glitch::before,.glitch::after{ animation:none; opacity:0; } }

/* hero form */
.hero-form{
  display:flex; align-items:center; gap:0;
  border:1px solid var(--phosphor-dim); background:rgba(76,255,76,.04);
  max-width:480px; padding:4px 4px 4px 14px;
}
.hero-form .prompt{ color:var(--phosphor); font-size:20px; margin-right:8px; }
.hero-form input,.wl-form input{
  flex:1; background:transparent; border:none; outline:none;
  color:var(--phosphor-bright); font-family:'Share Tech Mono'; font-size:15px;
  padding:10px 6px; min-width:0;
}
.hero-form input::placeholder,.wl-form input::placeholder{ color:var(--phosphor-deep); }
.hero-form button{
  font-family:'VT323',monospace; font-size:19px; letter-spacing:1px; white-space:nowrap;
  background:var(--phosphor); color:var(--bg-deep); border:none; cursor:pointer;
  padding:9px 20px; transition:.18s;
}
.hero-form button:hover{ box-shadow:var(--glow); filter:brightness(1.12); }
.hero-form-note{ font-size:12px; color:var(--phosphor-dim); margin-top:10px; letter-spacing:.5px; }

.hero-stats{ display:flex; gap:34px; margin-top:38px; flex-wrap:wrap; }
.hstat{ display:flex; flex-direction:column; }
.hstat .n{ font-family:'VT323'; font-size:34px; line-height:1; text-shadow:var(--glow); }
.hstat .l{ font-size:10px; letter-spacing:2px; color:var(--phosphor-dim); margin-top:4px; }

/* hero device */
.hero-art{ display:flex; justify-content:center; }
.device-frame{
  position:relative; width:min(100%,380px); aspect-ratio:3/3.4;
  border-radius:26px; padding:14px;
  background:linear-gradient(160deg,#0c1a0c,#040804);
  box-shadow:0 0 0 2px #0a1a0a, 0 30px 80px rgba(0,0,0,.7), inset 0 0 30px rgba(0,0,0,.6);
  animation:float 6s ease-in-out infinite;
}
@keyframes float{ 0%,100%{transform:translateY(0) rotate(-.4deg)} 50%{transform:translateY(-14px) rotate(.4deg)} }
.device-screen{
  position:relative; height:100%; border-radius:16px; overflow:hidden;
  background:radial-gradient(ellipse at center, #061206 0%, #020602 100%);
  box-shadow:inset 0 0 60px rgba(0,0,0,.9), inset 0 0 14px var(--phosphor-deep);
  display:flex; flex-direction:column; padding:12px;
}
.device-screen::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:repeating-linear-gradient(to bottom, transparent 0 2px, rgba(0,0,0,.22) 3px 4px);
}
.device-head,.device-foot{
  display:flex; justify-content:space-between; font-size:10px; letter-spacing:1px;
  color:var(--phosphor-dim); z-index:2;
}
.device-head{ border-bottom:1px solid var(--phosphor-deep); padding-bottom:6px; }
.device-foot{ border-top:1px solid var(--phosphor-deep); padding-top:6px; }
.mascot{
  flex:1; width:100%; min-height:0; object-fit:contain; padding:10px 0; z-index:1;
  /* WebP ya viene recoloreada y con alpha → sin canvas ni mix-blend; solo el glow */
  filter:
    saturate(1.15) brightness(1.05)
    drop-shadow(0 0 16px rgba(76,255,76,.5))
    drop-shadow(0 0 5px rgba(157,255,176,.45));
}

.scroll-hint{
  position:absolute; bottom:24px; left:50%; transform:translateX(-50%); z-index:3;
  font-size:12px; letter-spacing:3px; color:var(--phosphor-dim);
  animation:bob 2.2s infinite;
}
@keyframes bob{ 0%,100%{transform:translate(-50%,0)} 50%{transform:translate(-50%,7px)} }

@media(max-width:880px){
  .hero-inner{ grid-template-columns:1fr; gap:36px; }
  .hero-art{ order:-1; }
  .device-frame{ width:min(72%,300px); }
}

/* ============================================================
   MARQUEE
   ============================================================ */
.marquee{
  border-top:1px solid var(--phosphor-deep); border-bottom:1px solid var(--phosphor-deep);
  background:rgba(76,255,76,.03); overflow:hidden; padding:12px 0;
}
.marquee-track{
  display:flex; gap:22px; white-space:nowrap; width:max-content;
  font-family:'VT323'; font-size:22px; letter-spacing:2px; color:var(--phosphor-dim);
  animation:scroll 28s linear infinite;
}
.marquee-track span{ text-shadow:var(--glow-soft); }
@keyframes scroll{ to{ transform:translateX(-50%) } }

/* ============================================================
   SECTIONS
   ============================================================ */
.section{
  position:relative; max-width:var(--maxw); margin:0 auto;
  padding:clamp(70px,11vw,140px) clamp(18px,4vw,42px);
}
.section.alt{ max-width:none; background:
   linear-gradient(to bottom, transparent, rgba(76,255,76,.02), transparent); }
.section.alt > *{ max-width:var(--maxw); margin-left:auto; margin-right:auto; }

.section-head{ margin-bottom:54px; max-width:760px; }
.tag{ font-size:12px; letter-spacing:3px; color:var(--phosphor-dim); display:block; margin-bottom:16px; }
.section-head h2{ font-size:clamp(32px,5.2vw,62px); text-shadow:var(--glow); margin-bottom:18px; }
.section-head p{ color:var(--phosphor-dim); font-size:clamp(14px,1.5vw,17px); line-height:1.7; max-width:62ch; }
.section-head p code{ white-space:nowrap; }

/* feature rows */
.feature-rows{ display:flex; flex-direction:column; }
.frow{
  display:grid; grid-template-columns:auto 1fr; gap:24px; align-items:start;
  padding:28px 0; border-top:1px solid var(--phosphor-deep);
}
.frow:last-child{ border-bottom:1px solid var(--phosphor-deep); }
.frow-i{ font-family:'VT323'; font-size:38px; color:var(--phosphor-dim);
  text-shadow:var(--glow-soft); min-width:60px; }
.frow h3{ font-size:30px; margin-bottom:8px; text-shadow:var(--glow); }
.frow p{ color:var(--phosphor-dim); max-width:60ch; }
.frow:hover .frow-i{ color:var(--phosphor); text-shadow:var(--glow); transition:.25s; }

/* ============================================================
   PANEL GRID
   ============================================================ */
.panel-grid{
  display:grid; grid-template-columns:repeat(3,1fr); gap:18px;
}
.pcard{
  position:relative; background:var(--bg-panel);
  border:1px solid var(--phosphor-deep); padding:22px 20px 24px;
  overflow:hidden; transition:.25s var(--ease);
}
.pcard::before{
  content:""; position:absolute; inset:0; pointer-events:none; opacity:.5;
  background:repeating-linear-gradient(to bottom, transparent 0 3px, rgba(0,0,0,.18) 4px 5px);
}
.pcard:hover{ border-color:var(--phosphor); box-shadow:var(--glow-soft), inset 0 0 30px rgba(76,255,76,.04);
  transform:translateY(-4px); }
.pcard > *{ position:relative; z-index:1; }
.pcard.wide{ grid-column:span 3; }
.pcard header{ display:flex; align-items:center; justify-content:space-between; margin-bottom:16px; }
.pcard-tab{ font-family:'VT323'; font-size:22px; letter-spacing:2px;
  background:var(--phosphor); color:var(--bg-deep); padding:1px 12px; box-shadow:var(--glow); }
.pcard-led{ width:9px; height:9px; border-radius:50%; background:var(--phosphor-dim);
  box-shadow:var(--glow-soft); }
.pcard:hover .pcard-led{ background:var(--phosphor); box-shadow:var(--glow); }
.pcard h3{ font-size:26px; margin-bottom:8px; text-shadow:var(--glow-soft); }
.pcard p{ color:var(--phosphor-dim); font-size:14px; line-height:1.6; }
.pcard-bar{ height:10px; border:1px solid var(--phosphor-dim); margin-top:14px; }
.pcard-bar i{ display:block; height:100%; background:var(--phosphor); box-shadow:var(--glow); }
.pcard-list{ list-style:none; margin-top:14px; font-size:13px; }
.pcard-list li{ padding:4px 0; border-bottom:1px solid var(--phosphor-deep); color:var(--phosphor-bright); }
.pcard-list em{ color:var(--phosphor-dim); font-style:normal; float:right; }
.pcard-quest{ margin-top:14px; display:flex; justify-content:space-between;
  border:1px solid var(--phosphor-deep); padding:8px 12px; font-size:13px; }
.ach-strip{ display:flex; flex-wrap:wrap; gap:8px; margin-top:16px; }
.ach{ font-size:11px; letter-spacing:1px; padding:3px 10px; border:1px solid var(--phosphor-deep);
  color:var(--phosphor-dim); }
.ach.on{ color:var(--bg-deep); background:var(--phosphor); box-shadow:var(--glow); }

@media(max-width:860px){
  .panel-grid{ grid-template-columns:repeat(2,1fr); }
  .pcard.wide{ grid-column:span 2; }
}
@media(max-width:560px){
  .panel-grid{ grid-template-columns:1fr; }
  .pcard.wide{ grid-column:span 1; }
}

/* ============================================================
   STEPS
   ============================================================ */
.steps{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.step{ border:1px solid var(--phosphor-deep); padding:26px 22px; background:rgba(76,255,76,.02);
  position:relative; transition:.25s; }
.step:hover{ border-color:var(--phosphor-dim); }
.step-n{ font-family:'VT323'; font-size:54px; line-height:.8; color:var(--phosphor);
  text-shadow:var(--glow); display:block; margin-bottom:14px; }
.step h3{ font-size:26px; margin-bottom:8px; }
.step p{ color:var(--phosphor-dim); font-size:14px; }
.fineprint{ margin-top:34px; font-size:12px; color:var(--phosphor-dim); line-height:1.7;
  border-left:2px solid var(--phosphor-deep); padding-left:16px; max-width:70ch; }
@media(max-width:680px){ .steps{ grid-template-columns:1fr; } }

/* ============================================================
   PRICING + WAITLIST
   ============================================================ */
.pricing{
  display:grid; grid-template-columns:1fr 1.1fr; gap:34px; align-items:stretch;
}
.price-card,.waitlist-card{
  border:1px solid var(--phosphor-dim); padding:38px 34px; position:relative;
  background:var(--bg-panel);
}
.price-card{
  background:linear-gradient(160deg, rgba(76,255,76,.06), rgba(76,255,76,.01));
  box-shadow:var(--glow-soft), inset 0 0 40px rgba(76,255,76,.03);
  display:flex; flex-direction:column;
}
.price-badge{ align-self:flex-start; font-size:11px; letter-spacing:3px;
  border:1px solid var(--phosphor); padding:4px 12px; color:var(--phosphor);
  text-shadow:var(--glow); margin-bottom:24px; }
.price-amount{ font-family:'VT323'; font-size:clamp(72px,12vw,120px); line-height:.8;
  text-shadow:var(--glow); }
.price-amount .cur{ font-size:.45em; vertical-align:super; color:var(--phosphor-dim); }
.price-amount .dec{ font-size:.45em; color:var(--phosphor-dim); }
.price-tag{ font-size:12px; letter-spacing:2px; color:var(--phosphor-dim); margin:6px 0 24px; }
.price-list{ list-style:none; margin-bottom:24px; }
.price-list li{ padding:8px 0; border-bottom:1px solid var(--phosphor-deep); font-size:14px;
  display:flex; align-items:center; gap:10px; }
.price-list li::before{ content:"▸"; color:var(--phosphor); text-shadow:var(--glow); }
.price-soon{ margin-top:auto; font-size:12.5px; color:var(--phosphor-dim); line-height:1.65;
  border-top:1px dashed var(--phosphor-deep); padding-top:18px; }

.waitlist-card{ display:flex; flex-direction:column; justify-content:center;
  box-shadow:inset 0 0 40px rgba(0,0,0,.4); }
.waitlist-card h2{ font-size:clamp(38px,6vw,64px); text-shadow:var(--glow); margin-bottom:14px; }
.waitlist-card > p{ color:var(--phosphor-dim); margin-bottom:28px; max-width:48ch; }
.wl-form{ display:flex; flex-direction:column; gap:14px; }
.wl-label{ font-size:12px; letter-spacing:2px; color:var(--phosphor-dim); display:block; margin-bottom:6px; }
.wl-form label{ display:block; }
.wl-form input{
  width:100%; background:rgba(0,0,0,.3); border:1px solid var(--phosphor-dim);
  padding:14px 16px; color:var(--phosphor-bright); font-family:'Share Tech Mono'; font-size:16px;
  outline:none; transition:.2s;
}
.wl-form input:focus{ border-color:var(--phosphor); box-shadow:var(--glow-soft); }
.wl-form button{
  font-family:'VT323',monospace; font-size:24px; letter-spacing:2px;
  background:var(--phosphor); color:var(--bg-deep); border:none; cursor:pointer;
  padding:13px; transition:.18s;
}
.wl-form button:hover{ box-shadow:var(--glow); filter:brightness(1.12); }
.wl-form button:disabled{ opacity:.5; cursor:wait; }
.wl-intent{ border:none; padding:0; margin:2px 0 2px; }
.wl-intent legend{ font-size:12px; letter-spacing:2px; color:var(--phosphor-dim); margin-bottom:8px; padding:0; }
.wl-radio{ display:flex; align-items:center; gap:9px; padding:6px 0; font-size:13px;
  color:var(--phosphor-dim); cursor:pointer; transition:.18s; }
.wl-radio:hover{ color:var(--phosphor); }
.wl-radio input{ appearance:none; -webkit-appearance:none; width:14px; height:14px; margin:0;
  border:1px solid var(--phosphor-dim); border-radius:50%; background:rgba(0,0,0,.3);
  display:grid; place-content:center; cursor:pointer; transition:.18s; }
.wl-radio input::before{ content:""; width:7px; height:7px; border-radius:50%;
  background:var(--phosphor); box-shadow:var(--glow); transform:scale(0); transition:.15s var(--ease); }
.wl-radio input:checked{ border-color:var(--phosphor); }
.wl-radio input:checked::before{ transform:scale(1); }
.wl-radio input:checked + span{ color:var(--phosphor-bright); }
.wl-note{ font-size:13px; min-height:1.4em; margin-top:14px; letter-spacing:.5px; }
.wl-note.ok{ color:var(--phosphor-bright); text-shadow:var(--glow-soft); }
.wl-note.err{ color:#ff5b7b; }
.wl-counter{ margin-top:24px; font-size:13px; color:var(--phosphor-dim);
  display:flex; align-items:center; gap:8px; }
.wl-counter b{ color:var(--phosphor); text-shadow:var(--glow); }

@media(max-width:820px){ .pricing{ grid-template-columns:1fr; } }

/* ============================================================
   FOOTER
   ============================================================ */
.footer{
  border-top:1px solid var(--phosphor-deep); margin-top:40px;
  padding:48px clamp(18px,4vw,42px); max-width:var(--maxw); margin-inline:auto;
  display:grid; grid-template-columns:1fr 1.4fr auto; gap:30px; align-items:start;
  font-size:13px;
}
.footer-brand{ font-family:'VT323'; font-size:34px; letter-spacing:2px; text-shadow:var(--glow);
  display:flex; flex-direction:column; line-height:.8; }
.footer-brand small{ font-family:'Share Tech Mono'; font-size:10px; letter-spacing:2px;
  color:var(--phosphor-dim); margin-top:8px; }
.footer-mid p{ color:var(--phosphor-dim); line-height:1.7; }
.footer-status{ text-align:right; color:var(--phosphor-dim); font-size:12px; letter-spacing:1px; }
@media(max-width:680px){ .footer{ grid-template-columns:1fr; } .footer-status{ text-align:left; } }

/* ============================================================
   REVEAL ON SCROLL
   ============================================================ */
/* Por defecto (sin JS) el contenido es visible; el reveal solo se activa con JS */
.reveal{ transition:opacity .7s var(--ease), transform .7s var(--ease); }
html.js .reveal{ opacity:0; transform:translateY(26px); }
html.js .reveal.in{ opacity:1; transform:none; }
@media(prefers-reduced-motion:reduce){ html.js .reveal{ opacity:1; transform:none; } }