/* =========================================================================
   ENELCOM S.A. — tokens.css
   Paleta derivada del logo: menta sobre negro. Sin amarillo.
   Contrastes medidos con la fórmula WCAG (ver README §Verificado).
   ========================================================================= */

:root {
  /* --- Color ----------------------------------------------------------- */
  --negro:     #0B0F0E;   /* header, hero, footer                            */
  --grafito:   #16201D;   /* superficie oscura secundaria                    */
  --tinta:     #101614;   /* texto principal sobre claro                     */
  --gris:      #5C6A66;   /* texto secundario sobre claro    5.31:1 / papel  */
  --papel:     #F6F8F7;   /* fondo de las secciones de lectura               */
  --menta:     #45D6A5;   /* acento SOLO sobre oscuro       10.48:1 / negro  */
  --menta-900: #0E7A5A;   /* acento sobre claro              4.98:1 / papel  */

  /* #45D6A5 sobre #F6F8F7 da 1.72:1. Nunca texto menta sobre fondo claro. */

  --linea-clara:  rgba(16, 22, 20, .12);
  --linea-oscura: rgba(255, 255, 255, .14);
  --borde-campo:  rgba(16, 22, 20, .18);
  --anillo-foco:  rgba(14, 122, 90, .15);

  /* Botones: cada variante conserva el contraste en todos sus estados. */
  --boton-primario-fondo:        #45D6A5;
  --boton-primario-hover:        #6BE0BC;
  --boton-primario-active:       #2FC798;
  --boton-primario-texto:        #0B0F0E;
  --boton-secundario-fondo:      #0B0F0E;
  --boton-secundario-hover:      #16201D;
  --boton-secundario-active:     #24312D;
  --boton-secundario-texto:      #FFFFFF;
  --boton-deshabilitado-fondo:   #D8E0DD;
  --boton-deshabilitado-texto:   #46534F;
  --boton-foco:                  #0E7A5A;

  --sombra-tarjeta: 0 1px 3px rgba(11, 15, 14, .08);

  /* --- Tipografía ------------------------------------------------------- */
  --ff-titulo: "Manrope", "Segoe UI", system-ui, -apple-system, sans-serif;
  --ff-texto:  "Manrope", "Segoe UI", system-ui, -apple-system, sans-serif;
  --ff-mono:   "Manrope", "Segoe UI", system-ui, -apple-system, sans-serif;

  --fs-hero:    clamp(2.2rem, 4.4vw, 3.6rem);
  --fs-h2:      clamp(1.8rem, 3vw, 2.6rem);
  --fs-h3:      clamp(1.05rem, 1rem + .25vw, 1.25rem);
  --fs-lead:    clamp(1.05rem, 1rem + .35vw, 1.25rem);
  --fs-body:    clamp(1rem, .97rem + .15vw, 1.075rem);
  --fs-eyebrow: 12px;
  --fs-mono:    12px;

  --lh-hero:  1.08;
  --lh-h2:    1.12;
  --lh-texto: 1.65;

  --ls-titulo:  -0.02em;
  --ls-eyebrow: .09em;

  /* --- Ritmo vertical --------------------------------------------------- */
  --seccion:     clamp(72px, 9vh, 112px);  /* entre secciones               */
  --gap-eyebrow: 16px;                     /* eyebrow → titular             */
  --gap-titular: 24px;                     /* titular → primer párrafo      */
  --gap-bloque:  40px;                     /* entre bloques de una sección  */

  --s1: 8px;  --s2: 16px;  --s3: 24px;  --s4: 32px;  --s5: 40px;  --s6: 48px;

  /* --- Grilla ----------------------------------------------------------- */
  --ancho-max: 1180px;
  --margen:    clamp(20px, 5vw, 48px);
  --header-h:  80px;
  --medida:    64ch;   /* medida de línea 60–70 caracteres */

  /* --- Forma ------------------------------------------------------------ */
  --radio:    4px;
  --radio-md: 6px;
  --radio-lg: 8px;

  /* --- Movimiento ------------------------------------------------------- */
  --ease:     cubic-bezier(.22, .61, .36, 1);
  --t-rapido: 140ms;
  --t-medio:  260ms;
}