/* ==========================================================================
   ANZOLAHERRERA — Variables de diseño (design tokens)
   Colores tomados del logo oficial: azul #1C3661 y naranja #F29102.
   Cambie aquí colores, tipografías y espaciados para todo el sitio.
   ========================================================================== */

:root {
  /* --- Colores de marca --- */
  --navy-950: #071022;
  --navy-900: #0b1730;
  --navy-800: #0e1e38;
  --navy-700: #1c3661;   /* Azul del logo */
  --navy-500: #3b5a8c;
  --navy-300: #8d9ab0;
  --navy-100: #dfe5ef;

  --orange-500: #f29102; /* Naranja del logo */
  --orange-600: #d97e00;
  --orange-100: #fdf0db;

  --banner-border: #7b170f; /* Borde superior de los banners */
  --banner-border-width: 5px;

  --green-500: #1f9d6b;  /* Estados "OK" en indicadores */
  --red-500: #d9443b;    /* Alertas */

  /* --- Neutros --- */
  --white: #ffffff;
  --bg: #f6f8fb;
  --surface: #ffffff;
  --ink: #142033;        /* Texto principal */
  --ink-soft: #4f5b6e;   /* Texto secundario */
  --ink-faint: #7a8597;
  --line: #e2e7ef;

  /* --- Roles --- */
  --color-primary: var(--navy-700);
  --color-accent: var(--orange-500);
  --color-accent-hover: var(--orange-600);
  --color-on-accent: var(--navy-950);

  /* --- Tipografía --- */
  --font-display: "Sora", "Segoe UI", system-ui, sans-serif;
  --font-body: "Inter", "Segoe UI", system-ui, -apple-system, sans-serif;
  --font-mono: ui-monospace, "SFMono-Regular", "Cascadia Code", Consolas, monospace;

  --fs-xs: 0.8125rem;   /* 13px */
  --fs-sm: 0.9375rem;   /* 15px */
  --fs-base: 1.0625rem; /* 17px */
  --fs-lg: 1.25rem;
  --fs-xl: clamp(1.5rem, 1.2rem + 1.2vw, 2rem);
  --fs-2xl: clamp(1.875rem, 1.4rem + 2vw, 2.75rem);
  --fs-3xl: clamp(2.25rem, 1.5rem + 3.2vw, 3.75rem);

  --lh-tight: 1.15;
  --lh-snug: 1.35;
  --lh-body: 1.65;

  /* --- Espaciado --- */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4rem;
  --space-9: 6rem;
  --section-y: clamp(4rem, 3rem + 4vw, 7rem);

  /* --- Layout --- */
  --container: 1180px;
  --container-narrow: 760px;
  --gutter: clamp(1rem, 0.5rem + 2vw, 2rem);
  --header-h: 76px;

  /* --- Formas y sombras --- */
  --radius-sm: 6px;
  --radius: 12px;
  --radius-lg: 20px;
  --shadow-sm: 0 1px 2px rgba(11, 23, 48, 0.06), 0 1px 3px rgba(11, 23, 48, 0.08);
  --shadow: 0 8px 24px -8px rgba(11, 23, 48, 0.18);
  --shadow-lg: 0 24px 48px -16px rgba(11, 23, 48, 0.28);

  /* --- Movimiento --- */
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --dur-fast: 150ms;
  --dur: 300ms;
  --dur-slow: 700ms;
}