/* ── La entrada con el haz de IA ATMA · opción A1 (26-sep-2026) ─────────
   Pedro eligió la A1 de vista-previa-entrada-a.html: el fondo índigo de IA
   ATMA, una línea de luz fina que baja hasta el saludo, "BIENVENIDO A" chico
   y apagado, ΛTMΛ grande como protagonista y la tarjeta de vidrio con el
   borde de arriba encendido. Todo el bloque un poco por encima del medio.
   Vale para entrar, crear cuenta, recuperar e invitación (mismas piezas).

   Carga después de entrada.css; quitar su <link> devuelve la entrada de antes. */

/* El fondo de IA ATMA, sin la foto ni los rayos. */
.acceso{
  justify-content:center !important; gap:30px !important; padding:44px 20px 9vh !important;
  background:linear-gradient(180deg, #120f2a 0%, #0b0a1a 55%, #07060f 100%) !important;
}
.acceso::before{
  inset:0 !important; animation:none !important;
  background:
    radial-gradient(ellipse 60% 55% at 50% 0%, rgba(46,36,110,.55), transparent 70%),
    radial-gradient(ellipse 80% 60% at 50% 100%, rgba(30,22,70,.45), transparent 70%),
    linear-gradient(90deg, transparent calc(50% - 80px), rgba(185,165,255,.045) 50%, transparent calc(50% + 80px)) !important;
}
/* El halo detrás del saludo. */
.acceso::after{
  top:auto !important; bottom:auto !important; width:min(720px, 100vw) !important; height:360px !important;
  top:calc(50% - 440px) !important; animation:none !important; mix-blend-mode:normal !important;
  background:radial-gradient(ellipse at 50% 60%, rgba(185,165,255,.16), transparent 65%) !important;
}
.acceso .rayos, .acceso .piramide{ display:none !important }

/* El haz: ya no es el cono difuso, es la línea de luz de IA ATMA. Baja
   desde arriba y se apaga justo antes de "Bienvenido a". */
.acceso > .haz{
  top:0 !important; width:1px !important; clip-path:none !important; filter:none !important;
  height:max(60px, calc(50% - 300px)) !important; z-index:1;
  background:linear-gradient(180deg, transparent, rgb(185,165,255) 72%, rgba(185,165,255,.25)) !important;
  box-shadow:0 0 24px 3px rgba(185,165,255,.45);
  animation:entrada-haz-late 5s ease-in-out infinite;
}
@keyframes entrada-haz-late{ 0%,100%{ opacity:.75 } 50%{ opacity:1 } }

/* "BIENVENIDO A": chico y apagado. ΛTMΛ: grande, fino, con el degradado. */
.acceso .marca-grande .sobre{
  font:300 11px Jost, sans-serif !important; letter-spacing:.42em !important; padding-left:.42em;
  text-transform:uppercase; color:rgba(238,237,245,.42) !important; text-shadow:none !important; margin-bottom:16px !important;
}
.acceso .marca-grande .logo{
  font-size:clamp(40px, 4.4vw, 58px) !important; font-weight:200 !important; letter-spacing:.14em !important; padding-left:.14em; /* el texto ya trae espacios: "Λ T M Λ" */
  background:linear-gradient(90deg, #fff, #d3c5ff 45%, #8fa3f2 72%, #45c3cd) !important;
  -webkit-background-clip:text !important; background-clip:text !important; color:transparent !important;
  filter:drop-shadow(0 0 22px rgba(185,165,255,.35)) !important;
}

/* La tarjeta: vidrio índigo y el filo de arriba encendido (entrada.css). */
.acceso .tarjeta-acceso{
  max-width:420px !important; padding:30px 32px 22px !important; border-radius:26px !important;
  background:linear-gradient(180deg, rgba(24,18,56,.6), rgba(10,8,26,.78)) !important;
  border:1px solid rgba(185,165,255,.14) !important;
}
/* En la de ENTRAR sobran el título y la frase: el saludo ya está arriba.
   En crear cuenta y recuperar se quedan, porque dicen qué se está haciendo. */
.acceso .tarjeta-acceso.solo-campos h1, .acceso .tarjeta-acceso.solo-campos .entradilla{ display:none }
.acceso .tarjeta-acceso h1{ font-size:24px !important }

/* El botón Entrar, en píldora de luz lila como en la maqueta. */
.acceso .tarjeta-acceso .btn-luz{
  border:1px solid rgba(185,165,255,.45) !important; border-radius:99px !important;
  background:linear-gradient(180deg, rgba(185,165,255,.16), rgba(185,165,255,.06)) !important;
  box-shadow:0 0 30px -8px rgba(185,165,255,.5) !important; color:#eeedf5 !important;
}

@media (max-width:760px){
  .acceso{ padding:90px 18px 40px !important; justify-content:flex-start !important }
  .acceso > .haz{ height:80px !important }
  .acceso::after{ top:0 !important }
  .acceso .tarjeta-acceso{ padding:26px 20px 18px !important }
}
@media (prefers-reduced-motion:reduce){ .acceso > .haz{ animation:none } }
