/* MODEDI · design tokens v0.1 — fuente: definiciones de identidad visual (2026-10-20) */
@font-face { font-family: "IBM Plex Sans"; font-weight: 300; font-style: normal; font-display: swap; src: url("../fonts/plex-sans-300.woff2") format("woff2"); }
@font-face { font-family: "IBM Plex Sans"; font-weight: 300; font-style: italic; font-display: swap; src: url("../fonts/plex-sans-300-italic.woff2") format("woff2"); }
@font-face { font-family: "IBM Plex Sans"; font-weight: 400; font-style: normal; font-display: swap; src: url("../fonts/plex-sans-400.woff2") format("woff2"); }
@font-face { font-family: "IBM Plex Sans"; font-weight: 500; font-style: normal; font-display: swap; src: url("../fonts/plex-sans-500.woff2") format("woff2"); }
@font-face { font-family: "IBM Plex Sans"; font-weight: 600; font-style: normal; font-display: swap; src: url("../fonts/plex-sans-600.woff2") format("woff2"); }
@font-face { font-family: "Lora"; font-weight: 400; font-style: normal; font-display: swap; src: url("../fonts/lora-400.woff2") format("woff2"); }
@font-face { font-family: "Lora"; font-weight: 400; font-style: italic; font-display: swap; src: url("../fonts/lora-400-italic.woff2") format("woff2"); }

:root {
  /* Color de marca */
  --mod-plum: #48158F;            /* títulos, logo, nombres de nivel sobre fondo claro */
  --mod-violet: #6419CC;          /* nivel 5 · acentos de acción */
  --mod-signal: #0051FF;          /* puntos del logo; solo marcas de decisión, nunca decorativo */
  --mod-ink: #2F2833;             /* texto principal sobre fondo claro */
  --mod-muted-on-light: #635C68;  /* texto secundario sobre fondo claro (4,9:1 sobre blanco) */
  --mod-ink-on-dark: #E0E0E0;     /* texto principal sobre fondo oscuro */
  --mod-muted-on-dark: #C7B8D9;   /* texto secundario sobre fondo oscuro */
  --mod-surface: #FFFFFF;
  --mod-surface-soft: #F4F1F7;
  --mod-surface-tint: #EFEAF6;
  --mod-line: #DDD6E6;

  /* Escala de Exposición: único uso permitido del rojo (nivel 1) */
  --mod-level-1: #DA5440;  /* Expuesto */
  --mod-level-2: #F0B232;  /* Inventariado */
  --mod-level-3: #D4509F;  /* Protegido */
  --mod-level-4: #8A3DC2;  /* Anticipado */
  --mod-level-5: #6419CC;  /* Gobernado */
  --mod-on-level-2: #48158F; /* número sobre nivel 2 (el blanco no alcanza contraste) */

  /* Tipografía */
  --font-title: "Lora", Georgia, "Times New Roman", serif;
  --font-text: "IBM Plex Sans", "Helvetica Neue", Arial, sans-serif;
  --fs-display: clamp(2.25rem, 1.4rem + 3.6vw, 4rem);
  --fs-h2: clamp(1.625rem, 1.2rem + 1.6vw, 2.25rem);
  --fs-h3: 1.1875rem;
  --fs-body: 1.0625rem;
  --fs-small: 0.875rem;
  --fs-label: 0.8125rem;

  /* Espaciado y forma */
  --sp-1: .25rem; --sp-2: .5rem; --sp-3: .75rem; --sp-4: 1rem; --sp-5: 1.5rem; --sp-6: 2rem; --sp-7: 3rem; --sp-8: 4.5rem; --sp-9: 7rem;
  --radius-s: .5rem; --radius-m: .875rem; --radius-l: 1.25rem;
  --shadow-card: 0 1px 2px rgba(47, 40, 51, .06), 0 6px 18px rgba(47, 40, 51, .06);
  --maxw: 72rem;
  --nav-h: 4.25rem;
}