/* ==========================================================================
   MODO Comunicación — Design tokens
   Fuente: Manual de Marca MODO 2026. No agregar colores fuera de esta paleta.
   ========================================================================== */

:root {
  /* --- Paleta institucional (pág. 11 del manual) --- */
  --azul-oscuro:   #002967;  /* color estructural principal */
  --azul-electrico:#1455F4;  /* acento e interacción */
  --lima:          #E1FD09;  /* énfasis — uso estratégico y limitado */
  --gris-oscuro:   #3C3C3B;
  --gris:          #CCCCCC;
  --azul-claro:    #98B9FF;
  --blanco:        #FEFEFC;
  --blanco-lila:   #F1EDFE;

  /* --- Roles semánticos: usar estos en los componentes --- */
  --bg-oscuro:     var(--azul-oscuro);
  --bg-claro:      var(--blanco);
  --texto-claro:   var(--blanco);
  --texto-oscuro:  var(--azul-oscuro);
  --texto-tenue:   rgba(254, 254, 252, 0.72);
  --borde-tenue:   rgba(254, 254, 252, 0.16);
  --acento:        var(--lima);

  /* --- Tipografía --- */
  --font-display: 'Outfit', 'Helvetica Neue', Arial, sans-serif;
  --font-body:    'Hanken Grotesk', 'Helvetica Neue', Arial, sans-serif;

  --fs-nav:      clamp(0.75rem, 0.92vw, 0.8125rem);  /* 12 -> 13px */
  --fs-micro:    0.75rem;
  --fs-body:     1rem;
  --fs-body-lg:  1.125rem;
  --fs-h1:       clamp(2.625rem, 6.2vw, 5.25rem);   /* 42 → 84px */
  --fs-h2:       clamp(2rem, 4.2vw, 3.5rem);

  --lh-tight:  1.04;
  --lh-snug:   1.28;
  --lh-normal: 1.62;

  --ls-tight:  -0.028em;
  --ls-wide:   0.06em;

  /* --- Layout --- */
  --container:   1360px;
  --gutter:      clamp(1.25rem, 4vw, 4rem);
  --header-h:    88px;
  --header-h-sm: 68px;

  /* --- Espaciado --- */
  --sp-1: 0.5rem;
  --sp-2: 0.75rem;
  --sp-3: 1rem;
  --sp-4: 1.5rem;
  --sp-5: 2rem;
  --sp-6: 3rem;
  --sp-7: 4.5rem;
  --sp-8: 7rem;

  /* --- Radios (moderados, nunca pill salvo CTA) --- */
  --r-sm: 4px;
  --r-md: 6px;
  --r-lg: 10px;

  /* --- Movimiento: lento y sobrio --- */
  --ease:      cubic-bezier(0.22, 1, 0.36, 1);
  --ease-soft: cubic-bezier(0.4, 0, 0.2, 1);
  --t-fast:  180ms;
  --t-med:   340ms;
  --t-slow:  760ms;
  --t-reveal:1100ms;

  --z-header: 100;
  --z-menu:   200;
}