/* AXL Growth · estilos compartidos de la bienvenida y el panel (mismos colores y letras que la página) */
:root{
  --bg:#04060B; --bg-2:#070A13; --panel:#0B1019; --panel-2:#111826;
  --line:rgba(226,232,244,.09); --line-strong:rgba(226,232,244,.16);
  --blue:#2E55FF; --blue-bright:#6C8CFF; --cyan:#6EE7F9;
  --text:#F4F6FA; --muted:#8B93A7; --grey:#C7CDD9;
  --ok:#34D399; --warn:#FBBF24; --err:#FB7185; --wa:#25D366;
  --ease-out:cubic-bezier(.16,1,.3,1);
}
*{box-sizing:border-box; margin:0; padding:0;}
html{-webkit-text-size-adjust:100%;}
body{min-height:100vh; background:var(--bg); color:var(--text); font-family:'Inter', system-ui, sans-serif; line-height:1.55; -webkit-font-smoothing:antialiased; overflow-x:hidden;}
.fondo{position:fixed; inset:0; z-index:-1; pointer-events:none;
  background:radial-gradient(900px 520px at 85% -8%, rgba(46,85,255,.20), transparent 62%), radial-gradient(760px 480px at -12% 108%, rgba(110,231,249,.08), transparent 62%), var(--bg);}
.fondo::after{content:''; position:absolute; inset:0; opacity:.5;
  background-image:radial-gradient(circle, rgba(170,242,255,.16) 0 1px, transparent 1.4px); background-size:28px 28px;
  -webkit-mask-image:radial-gradient(ellipse 70% 55% at 50% 0%, #000, transparent 75%); mask-image:radial-gradient(ellipse 70% 55% at 50% 0%, #000, transparent 75%);}
h1,h2,h3{font-family:'Space Grotesk', sans-serif; font-weight:600; line-height:1.12; letter-spacing:-.015em;}
a{color:var(--cyan);}
button{font:inherit; color:inherit; cursor:pointer;}
:focus-visible{outline:2px solid var(--cyan); outline-offset:3px;}
[tabindex="-1"]:focus{outline:none;}
.mono{font-family:'JetBrains Mono', monospace;}
.sr{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap;}

.marca{display:inline-flex; align-items:baseline; gap:.2em; font-family:'Space Grotesk', sans-serif; font-weight:700; font-size:1.3rem; letter-spacing:.01em; color:#fff; text-decoration:none;}
.marca span{color:var(--cyan);}

.btn{display:inline-flex; align-items:center; justify-content:center; gap:9px; min-height:50px; padding:14px 24px; border:0; border-radius:12px; text-decoration:none;
  background:linear-gradient(135deg, var(--blue), var(--cyan)); color:#04060B; font-weight:600; font-size:.95rem; transition:transform .18s ease, box-shadow .25s ease, opacity .2s;}
.btn:hover{transform:translateY(-2px); box-shadow:0 14px 34px -14px rgba(110,231,249,.75);}
.btn:active{transform:translateY(0);}
.btn[disabled]{opacity:.55; pointer-events:none;}
.btn-ghost{background:transparent; color:var(--text); border:1px solid var(--line-strong);}
.btn-ghost:hover{border-color:var(--cyan); color:var(--cyan); box-shadow:none;}
.btn-wa{background:var(--wa); color:#04140A;}
.btn-wa:hover{box-shadow:0 14px 34px -14px rgba(37,211,102,.8);}
.btn svg{width:18px; height:18px; flex:none;}

.giro-anim{animation:girar 60s linear infinite;}
@keyframes girar{to{transform:rotate(360deg);}}
@keyframes entrar{from{opacity:0; transform:translateY(14px);} to{opacity:1; transform:none;}}
.entra{animation:entrar .5s var(--ease-out) both;}
@media (prefers-reduced-motion: reduce){ *,*::before,*::after{animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important;} }

.spinner{width:34px; height:34px; border-radius:50%; border:3px solid var(--line-strong); border-top-color:var(--cyan); animation:girar .8s linear infinite;}
.aviso{position:fixed; left:50%; bottom:24px; z-index:200; transform:translate(-50%, 20px); opacity:0; pointer-events:none; max-width:calc(100% - 32px);
  padding:12px 18px; border-radius:12px; background:var(--panel-2); border:1px solid var(--line-strong); box-shadow:0 20px 50px -20px #000; font-size:.9rem; transition:opacity .25s, transform .35s var(--ease-out);}
.aviso.ver{opacity:1; transform:translate(-50%, 0);}
.aviso.mal{border-color:rgba(251,113,133,.5);}