/* ==========================================================================
   Global Control Systems — tokens de diseño (Dirección A · Technical Editorial)
   Contrastes validados (WCAG): ver docs/DIRECCION_CREATIVA.md
   ========================================================================== */

@font-face {
  font-family: "Newsreader";
  src: url("../fonts/newsreader-var-latin.woff2") format("woff2");
  font-weight: 400 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Newsreader";
  src: url("../fonts/newsreader-italic-var-latin.woff2") format("woff2");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "IBM Plex Sans";
  src: url("../fonts/ibm-plex-sans-var-latin.woff2") format("woff2");
  font-weight: 400 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "IBM Plex Mono";
  src: url("../fonts/ibm-plex-mono-400-latin.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "IBM Plex Mono";
  src: url("../fonts/ibm-plex-mono-500-latin.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

:root {
  /* Color — superficies */
  --gcs-ink: #0B1220;          /* hero, bandas oscuras */
  --gcs-ink-deep: #070C16;     /* pie de página */
  --gcs-ink-line: #1E2A3F;     /* filetes sobre ink */
  --gcs-paper: #F8FAFC;        /* fondo principal */
  --gcs-surface: #EEF2F7;      /* bandas alternas */
  --gcs-line: #D5DCE5;         /* filetes sobre claro */

  /* Color — texto */
  --gcs-text: #172033;         /* 15,55:1 sobre paper */
  --gcs-muted: #526072;        /* 6,13:1 sobre paper */
  --gcs-on-dark: #F8FAFC;      /* 17,89:1 sobre ink */
  --gcs-on-dark-muted: #C9D2DE;/* 12,27:1 sobre ink */
  --gcs-muted-dark: #94A3B8;   /* 7,30:1 — solo sobre ink */

  /* Color — acción y acento */
  --gcs-blue: #2563EB;         /* CTA; blanco sobre azul 5,17:1 */
  --gcs-blue-deep: #1D4ED8;    /* hover/active; 6,41:1 sobre paper */
  --gcs-sky: #38BDF8;          /* solo sobre ink: 8,74:1 */
  --gcs-magenta: #F6038B;      /* acento del logotipo; solo gráficos sobre ink */

  /* Tipografía */
  --font-display: "Newsreader", Georgia, "Times New Roman", serif;
  --font-sans: "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, "SFMono-Regular", Consolas, monospace;

  --fs-xs: 0.75rem;
  --fs-sm: 0.875rem;
  --fs-base: 1rem;
  --fs-md: 1.125rem;
  --fs-lg: 1.25rem;
  --fs-h4: clamp(1.25rem, 1.15rem + 0.45vw, 1.5rem);
  --fs-h3: clamp(1.5rem, 1.3rem + 0.9vw, 2rem);
  --fs-h2: clamp(2rem, 1.55rem + 2vw, 3rem);
  --fs-h1: clamp(2.25rem, 1.45rem + 3.6vw, 4.25rem);

  --lh-tight: 1.08;
  --lh-snug: 1.25;
  --lh-body: 1.6;

  /* Espaciado (escala de 4 px) */
  --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-section: clamp(4rem, 2.8rem + 5vw, 7.5rem);

  /* Maquetación */
  --container: 1240px;
  --gutter: clamp(1rem, 0.5rem + 2.5vw, 2.5rem);
  --measure: 62ch;
  --header-h: 68px;
  --radius-sm: 4px;
  --radius: 6px;

  /* Movimiento (criterio Emil Kowalski) */
  --ease-out: cubic-bezier(0.23, 1, 0.32, 1);
  --ease-drawer: cubic-bezier(0.32, 0.72, 0, 1);
  --dur-press: 160ms;
  --dur-fast: 180ms;
  --dur-base: 240ms;

  /* Foco (se redefine en superficies oscuras) */
  --focus: var(--gcs-blue);

  /* Puente con Bootstrap */
  --bs-body-font-family: var(--font-sans);
  --bs-body-font-size: var(--fs-base);
  --bs-body-line-height: var(--lh-body);
  --bs-body-color: var(--gcs-text);
  --bs-body-bg: var(--gcs-paper);
  --bs-emphasis-color: var(--gcs-text);
  --bs-secondary-color: var(--gcs-muted);
  --bs-border-color: var(--gcs-line);
  --bs-link-color: var(--gcs-blue);
  --bs-link-color-rgb: 37, 99, 235;
  --bs-link-hover-color: var(--gcs-blue-deep);
  --bs-link-hover-color-rgb: 29, 78, 216;
  --bs-focus-ring-color: rgba(37, 99, 235, 0.35);
}