:root{
  --azul:#008AC9; --azul-osc:#006FA3; --azul-claro:#E6F4FB;
  --navy:#0B1C33; --navy-2:#122B4A; --neon:#C8F23A;
  --gris:#7A868D; --linea:#E6E8EB; --negro:#0F1115;
  --fuente:'Barlow',system-ui,sans-serif; --titulo:'Barlow Condensed','Barlow',sans-serif;
  --pill:999px; --r:14px;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  min-height:100vh;min-height:100dvh;
  font-family:var(--fuente);color:#fff;
  background:radial-gradient(900px 600px at 75% -10%,rgba(0,138,201,.55),transparent 60%),
             radial-gradient(700px 500px at -10% 110%,rgba(200,242,58,.12),transparent 55%),
             var(--navy);
  display:flex;flex-direction:column;
}

.stage{flex:1;display:flex;align-items:center;justify-content:center;padding:64px 20px 40px}
.stage__inner{max-width:640px;width:100%;text-align:center;display:flex;flex-direction:column;align-items:center;gap:0;animation:sube .7s cubic-bezier(.2,.8,.2,1) both}
@keyframes sube{from{transform:translateY(24px);opacity:0}to{transform:translateY(0);opacity:1}}

.brand{display:inline-flex;align-items:center;justify-content:center;background:#fff;border-radius:14px;padding:14px 22px;box-shadow:0 20px 50px rgba(0,0,0,.35);margin-bottom:30px}
.brand img{height:44px;width:auto;display:block}

.overline{font-weight:700;font-size:12px;letter-spacing:.28em;text-transform:uppercase;color:var(--neon);margin:0 0 10px}
h1{font-family:var(--titulo);font-weight:800;text-transform:uppercase;font-size:clamp(46px,9vw,92px);line-height:.9;margin:0;letter-spacing:.01em}
.slogan{font-family:var(--titulo);font-weight:800;text-transform:uppercase;font-size:clamp(24px,4vw,40px);margin:12px 0 0;color:#B9C6D6;letter-spacing:.04em}
.slogan em{font-style:normal;color:var(--neon)}
.lead{font-size:16px;color:#B9C6D6;line-height:1.65;max-width:46ch;margin:18px auto 0}

.nl{display:flex;gap:10px;width:100%;max-width:480px;margin:34px auto 0}
.nl__input{flex:1;height:54px;border:1.5px solid rgba(255,255,255,.18);background:rgba(255,255,255,.08);border-radius:var(--pill);padding:0 22px;font:inherit;font-size:15px;color:#fff;outline:0;transition:.18s}
.nl__input::placeholder{color:#8ba0b5}
.nl__input:focus{border-color:var(--azul);background:rgba(255,255,255,.14);box-shadow:0 0 0 4px rgba(0,138,201,.25)}
.nl__btn{height:54px;padding:0 28px;border-radius:var(--pill);border:0;background:var(--neon);color:#1b2a00;font-family:var(--titulo);font-weight:800;text-transform:uppercase;letter-spacing:.05em;font-size:17px;cursor:pointer;transition:.18s;white-space:nowrap}
.nl__btn:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(200,242,58,.35)}
.nl__btn:active{transform:translateY(0)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0;pointer-events:none}
.nl__msg{font-size:13.5px;color:#8ba0b5;margin:14px 0 0;min-height:18px}
.nl__msg.err{color:#ff8a8a}

.foot{padding:22px 20px;text-align:center;font-size:12.5px;color:#7F93A8}
.foot p{margin:0}

@media (max-width:520px){
  .brand img{height:34px}
  .nl{flex-direction:column}
  .nl__btn{width:100%}
}
