/* ===========================================================================
   ID One · tokens de marca — fuente única de verdad
   ---------------------------------------------------------------------------
   Paleta aprobada (extraída del archivo original y verificada píxel a píxel):
     #040203 negro · #010A3D índigo · #467B8D azul grisáceo
     #43BD8E verde · #E1FEA4 verde lima

   Todos los contrastes de este archivo están medidos contra WCAG 2.2 AA.
   Reglas que NO se pueden romper, porque son medidas, no gusto:

     · El LIMA sobre blanco da 1.11:1. Es invisible. Solo va sobre el índigo
       (17.01:1) o como fondo de botón con texto índigo.
     · El VERDE sobre blanco da 2.36:1. No sirve como texto ni como gráfico
       con significado sobre fondo claro. Para eso está --verde-fuerte.
     · El AZUL GRISÁCEO da 4.69:1 sobre blanco: alcanza justo para texto
       normal, pero no para texto sobre el índigo (4.03:1). Sobre oscuro se
       usa --sobre-indigo-suave.
   ========================================================================= */

:root{
  /* --- paleta base, tal cual viene del archivo original --- */
  --negro:#040203;
  --indigo:#010A3D;
  --azul-gris:#467B8D;
  --verde:#43BD8E;
  --lima:#E1FEA4;

  /* --- variantes derivadas, para cumplir contraste --- */
  --indigo-claro:#0A1A5C;        /* hover de botones índigo */
  --indigo-medio:#122055;        /* tarjetas sobre fondo índigo */
  --azul-gris-fuerte:#2F5B6B;    /* texto chico sobre blanco · 7.42:1 */
  --azul-gris-suave:#E7EEF1;     /* fondos y bordes informativos */
  --verde-fuerte:#24694B;        /* texto e iconos verdes sobre blanco · 6.57:1 */
  --verde-suave:#E4F6EE;         /* fondo de estados activos */
  --lima-hover:#D2F58A;

  /* --- superficies --- */
  --fondo:#FAFAFA;
  --superficie:#FFFFFF;
  --fondo-2:#EFEFEF;
  --linea:#E3E6EC;              /* separadores decorativos */
  --borde-control:#7E8798;      /* bordes de campos y botones · 3.62:1 */
  --linea-oscura:rgba(255,255,255,.16);

  /* --- texto --- */
  --texto:#191919;               /* 17.58:1 sobre blanco */
  --texto-parrafo:#4A4A4A;       /* 8.86:1 sobre blanco */
  --texto-suave:#5C6470;         /* 6.19:1 sobre blanco */
  --sobre-indigo:#FFFFFF;        /* 18.88:1 */
  --sobre-indigo-suave:#B8C4DC;  /* 10.76:1 */

  /* --- tipografía --- */
  --fuente:'Plus Jakarta Sans',system-ui,-apple-system,'Segoe UI',sans-serif;

  /* --- espaciado base 8px --- */
  --e1:8px;  --e2:16px; --e3:24px; --e4:32px;
  --e5:40px; --e6:48px; --e8:64px; --e10:80px; --e12:96px;

  /* --- formas --- */
  --r-tarjeta:16px;
  --r-boton:8px;
  --ancho:1200px;
  --sombra-sutil:0 1px 2px rgba(1,10,61,.06);
  --sombra-tarjeta:0 2px 10px rgba(1,10,61,.08);

  /* --- movimiento --- */
  --transicion:150ms ease;
}

/* Quien active "reducir movimiento" en su sistema no debería recibir
   animaciones: no es una preferencia estética, suele ser vestibular. */
@media (prefers-reduced-motion:reduce){
  :root{ --transicion:0ms; }
  *,*::before,*::after{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
    scroll-behavior:auto !important;
  }
}

/* El foco de teclado tiene que verse siempre, en cualquier fondo. */
:where(a,button,input,textarea,select,summary,[tabindex]):focus-visible{
  outline:3px solid var(--verde);
  outline-offset:2px;
  border-radius:4px;
}