/* UTHERPEPS — design tokens. Fuente: Docs/brand/manual/UTHERPEPS_Brand_Manual.html
   Origen: [O §x] = manual original de la diseñadora (source/UTHERPEPS-IO-manual-de-marca.html)
           [E]    = etiqueta 30x15 vigente
           [P]    = PROPUESTA — pendiente de aprobación del owner (no es de la diseñadora) */
:root {
  /* ---- Color de marca [O §02] ---- */
  --uth-navy-950: #071B33;      /* base de marca, texto principal */
  --uth-blue-600: #176BEB;      /* acción principal, enlaces */
  --uth-blue-700: #1156C4;      /* hover */
  --uth-blue-200: #A7C7FF;      /* detalles */
  --uth-blue-50:  #E8F0FF;      /* fondos suaves */
  --uth-teal-400: #32D6CB;      /* acento, datos */
  --uth-teal-700: #147D75;      /* texto destacado / estado ok */
  --uth-teal-200: #A7EEE5;      /* patrón */
  --uth-teal-50:  #E8FAF7;      /* superficie */
  --uth-white:    #FFFFFF;
  --uth-mist-50:  #F4F7FB;      /* fondo de lectura */
  --uth-gray-600: #526477;      /* texto secundario */
  --uth-line:     #D7E1EB;      /* borde decorativo */
  --uth-line-control: #7D8FA3;  /* borde de controles */
  --uth-disabled-bg: #E4EAF0;   /* [O §05] disabled */
  --uth-deep-blue: #123E67;     /* [O §04] punto medio del degradado */
  --uth-sky-300:  #BED0E2;      /* [O hero] texto secundario sobre navy */

  /* ---- Semánticos ---- */
  --uth-success-fg: #147D75;    /* [O §05] */
  --uth-success-bg: #E8FAF7;    /* [O §05] */
  --uth-error-fg:   #B42318;    /* [O §05, "propuesto" por la diseñadora] */
  --uth-error-bg:   #FEF3F2;    /* [O §05, "propuesto" por la diseñadora] */
  --uth-warning-fg: #8A5A00;    /* [P] 5.42:1 sobre bg */
  --uth-warning-bg: #FFF4DB;    /* [P] */
  --uth-info-fg:    #1156C4;    /* [P] 5.81:1 sobre bg */
  --uth-info-bg:    #E8F0FF;    /* [P] */

  /* ---- Alias de superficie/texto, tema claro [O §07] ---- */
  --surface: #FFFFFF;
  --surface-soft: #F4F7FB;
  --text-primary: #071B33;
  --text-secondary: #526477;
  --border: #D7E1EB;
  --border-control: #7D8FA3;
  --brand-navy: #071B33;
  --brand-blue: #176BEB;
  --brand-blue-hover: #1156C4;
  --brand-teal: #32D6CB;

  /* ---- Tema oscuro [P] (el original solo muestra navy como fondo de narrativa) ---- */
  --dark-surface: #071B33;      /* [P] = navy-950 */
  --dark-surface-raised: #123E67; /* [P] reutiliza deep-blue del original */
  --dark-text-primary: #FFFFFF; /* [P] 17.3:1 */
  --dark-text-secondary: #BED0E2; /* [P] 10.97:1 */
  --dark-link: #A7C7FF;         /* [P] 10.1:1; el azul #176BEB da 3.58:1 sobre navy, solo UI/grande */
  --dark-accent: #32D6CB;       /* [O §01 versión inversa] */
  --dark-border: #123E67;       /* [P] */
  --dark-border-control: #6F96BD; /* [P] borde de inputs: 3.55:1 sobre #123E67, 5.4:1 sobre navy */
  /* Semánticos tema oscuro [P] — texto/icono/borde; AA sobre navy / panel #0D2B4B / raised #123E67 */
  --dark-danger: #FF8A8A;       /* [P] 7.6 / 6.3 / 4.84:1 */
  --dark-danger-bg: rgba(255, 138, 138, .12); /* [P] fondo de botón/aviso destructivo (ghost) */
  --dark-danger-solid: #D92D20; /* [P] relleno destructivo de confirmación; texto blanco 4.84:1 */
  --dark-on-danger-solid: #FFFFFF; /* [P] */
  --dark-warning: #FFBB52;      /* [P] 10.3 / 8.5 / 6.5:1 */
  --dark-warning-bg: rgba(255, 187, 82, .12); /* [P] */
  --dark-success: #32D6CB;      /* [P] = dark-accent; 9.6 / 7.9 / 6.1:1 */
  --dark-info: #A7C7FF;         /* [P] = dark-link */

  /* ---- Etiqueta 30x15 [E] — verde APROXIMADO por lectura visual del PDF, no extraído ---- */
  --uth-label-green: #0A8450;   /* [E aprox.] encabezado y cifra de cantidad; confirmar con archivo fuente */
  --uth-label-ink: #1A1A1A;     /* [E aprox.] texto */

  /* ---- Degradados [O §04] ---- */
  --uth-gradient-deep: linear-gradient(120deg, #071B33 0%, #123E67 65%, #176BEB 100%);
  --uth-gradient-energy: linear-gradient(135deg, #176BEB, #32D6CB);

  /* ---- Tipografía [O §03, §07] ---- */
  --font-heading: "Manrope", Arial, sans-serif;
  --font-body: "Inter", Arial, sans-serif;
  --font-data: "IBM Plex Mono", "Courier New", monospace;
  --font-label: Arial, Helvetica, sans-serif; /* [E] etiquetas */
  --fs-h1: 72px;  --lh-h1: 76px; --fw-h1: 500; --ls-h1: -0.05em;
  --fs-h2: 40px;  --lh-h2: 48px; --fw-h2: 500; --ls-h2: -0.03em;
  --fs-h3: 24px;  --lh-h3: 32px; --fw-h3: 600; --ls-h3: -0.02em;
  --fs-body: 16px; --lh-body: 26px; --fw-body: 400; --ls-body: 0;
  --fs-label: 12px; --lh-label: 18px; --fw-label: 500; --ls-label: 0.08em;
  --fs-h1-m: 40px; --lh-h1-m: 44px;   /* móvil [O §03] */
  --fs-h2-m: 30px; --lh-h2-m: 36px;
  --fs-h3-m: 22px; --lh-h3-m: 30px;

  /* ---- Espaciado base 4 px [O §06] ---- */
  --space-unit: 4px;
  --space-1: 4px;  --space-2: 8px;  --space-3: 12px; --space-4: 16px;
  --space-6: 24px; --space-8: 32px; --space-12: 48px; --space-16: 64px;
  --space-5: 20px;              /* margen móvil 320–639 [O §06] */
  --touch-min: 44px;            /* [O §03/§06] */

  /* ---- Layout [O §06] ---- */
  --container-max: 1280px;
  --bp-md: 640px;
  --bp-lg: 1024px;

  /* ---- Radios [O §04] ---- */
  --radius-input: 8px;
  --radius-control: 10px;
  --radius-card: 16px;
  --radius-feature: 24px;
  --radius-pill: 999px;

  /* ---- Sombras [O §04] ---- */
  --shadow-card: 0 12px 32px rgba(7, 27, 51, .08);

  /* ---- Foco y movimiento ---- */
  --focus-ring: 3px solid #176BEB;  /* [O §05]; sobre navy usar turquesa */
  --focus-ring-dark: 3px solid #32D6CB;
  --focus-offset: 5px;
  --motion-fast: 160ms;         /* [O §05] hover */
}