/* ==========================================================================
   Tokens del sistema de diseño de RMTracker Solutions

   Rediseño del 2026-09-28: de la revista a la empresa de software.
   Neutros fríos (pizarra), una sola familia sans para titulares y texto
   —Inter, con el tracking cerrado en los tamaños grandes— y el verde del
   isotipo como acento. Las bandas oscuras (portada y cierre) llevan su
   propio juego de tokens `--rm-night-*`, fijo en los dos temas.

   Cada par de texto está medido en scripts/check_contrast.py.
   ========================================================================== */

@font-face {
  font-family: 'Fraunces';
  src: url("../fonts/Fraunces.b65477430776.woff2") format('woff2-variations');
  font-weight: 300 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Inter';
  src: url("../fonts/Inter.2bf3d951bf9d.woff2") format('woff2-variations');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'JetBrains Mono';
  src: url("../fonts/JetBrainsMono.7e47e1e38341.woff2") format('woff2-variations');
  font-weight: 100 800;
  font-style: normal;
  font-display: swap;
}

:root {
  color-scheme: light dark;

  /* --- Escala de neutros fríos (pizarra) --- */
  --rm-n-0:   #ffffff;
  --rm-n-25:  #fafbfc;
  --rm-n-50:  #f5f7fa;
  --rm-n-100: #f1f4f8;
  --rm-n-200: #e3e8ef;
  --rm-n-300: #cdd5e0;
  --rm-n-400: #9aa6b6;
  --rm-n-500: #6b7889;
  --rm-n-600: #4a5565;
  --rm-n-700: #333d4c;
  --rm-n-800: #1f2733;
  --rm-n-900: #0f1623;
  --rm-n-950: #0a0e16;

  /* --- Marca: el verde de la M del isotipo --- */
  --rm-brand: #58a040;
  --rm-brand-bright: #6cbf4f;

  /* --- Tipografía ---
     Fraunces se queda en el repositorio pero ya no se carga: una serif de
     revista era justo lo que hacía que la web se leyera como un estudio
     editorial y no como una empresa de software. */
  --rm-font-display: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --rm-font-body: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --rm-font-mono: 'JetBrains Mono', ui-monospace, 'Cascadia Code', monospace;

  --rm-text-xs:   0.8125rem;
  --rm-text-sm:   0.9062rem;
  --rm-text-base: 1rem;
  --rm-text-lg:   clamp(1.0625rem, 0.2vw + 1rem, 1.1875rem);
  --rm-text-xl:   clamp(1.25rem, 0.5vw + 1.1rem, 1.5rem);
  --rm-text-2xl:  clamp(1.625rem, 1.4vw + 1.2rem, 2.375rem);
  --rm-text-3xl:  clamp(2rem, 2.6vw + 1.3rem, 3.25rem);
  --rm-text-4xl:  clamp(2.5rem, 4.4vw + 1.2rem, 4.5rem);

  --rm-leading-tight: 1.06;
  --rm-leading-snug: 1.3;
  --rm-leading-normal: 1.6;
  --rm-measure: 68ch;

  /* --- Espaciado, base 4px --- */
  --rm-space-1: 0.25rem;
  --rm-space-2: 0.5rem;
  --rm-space-3: 0.75rem;
  --rm-space-4: 1rem;
  --rm-space-5: 1.5rem;
  --rm-space-6: 2rem;
  --rm-space-7: 2.5rem;
  --rm-space-8: 3rem;
  --rm-space-9: 4rem;
  --rm-space-10: 5.5rem;
  --rm-space-11: 7rem;
  --rm-space-12: 9rem;

  /* --- Radios --- */
  --rm-radius-sm: 6px;
  --rm-radius-md: 10px;
  --rm-radius-lg: 16px;
  --rm-radius-xl: 24px;
  --rm-radius-pill: 999px;

  /* --- Elevación --- */
  --rm-shadow-raised: 0 1px 2px rgb(15 22 35 / 0.06), 0 4px 16px rgb(15 22 35 / 0.06);
  --rm-shadow-card: 0 1px 2px rgb(15 22 35 / 0.05), 0 12px 32px -12px rgb(15 22 35 / 0.14);
  --rm-shadow-overlay: 0 12px 40px rgb(15 22 35 / 0.18);
  --rm-shadow-device: 0 30px 60px -20px rgb(0 0 0 / 0.55), 0 12px 24px -12px rgb(0 0 0 / 0.4);

  /* --- Movimiento --- */
  --rm-ease: cubic-bezier(0.2, 0, 0.1, 1);
  --rm-duration-fast: 120ms;
  --rm-duration: 200ms;

  /* --- Bandas oscuras: iguales en los dos temas --- */
  --rm-night: #070b14;
  --rm-night-surface: #0e1422;
  --rm-night-rule: rgb(255 255 255 / 0.1);
  --rm-night-ink: #f3f6fa;
  --rm-night-muted: #c9d1dc;
  --rm-night-subtle: #8b96a8;

  /* --- Tema claro (por defecto) --- */
  --rm-paper: var(--rm-n-25);
  --rm-surface: var(--rm-n-0);
  --rm-surface-sunken: var(--rm-n-100);
  --rm-ink: var(--rm-n-900);
  --rm-ink-muted: var(--rm-n-600);
  --rm-ink-subtle: #5f6b7e;
  --rm-rule: var(--rm-n-200);
  --rm-rule-strong: var(--rm-n-300);
  --rm-accent: #2d6f22;
  --rm-accent-hover: #1f5417;
  --rm-accent-ink: var(--rm-n-0);
  --rm-accent-wash: #eaf5e5;
  --rm-solid: var(--rm-n-900);
  --rm-solid-hover: var(--rm-n-700);
  --rm-solid-ink: var(--rm-n-25);
}

/* --- Tema oscuro: automático para quien no ha elegido --- */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme='light']) {
    --rm-paper: var(--rm-n-950);
    --rm-surface: #111724;
    --rm-surface-sunken: #070a10;
    --rm-ink: #eef2f7;
    --rm-ink-muted: #a7b1c0;
    --rm-ink-subtle: #7f8a9b;
    --rm-rule: #1e2633;
    --rm-rule-strong: #2c3645;
    --rm-accent: #7cc75f;
    --rm-accent-hover: #9bd884;
    --rm-accent-ink: var(--rm-n-950);
    --rm-accent-wash: #14231a;
    --rm-solid: #eef2f7;
    --rm-solid-hover: #cdd5e0;
    --rm-solid-ink: var(--rm-n-950);

    --rm-shadow-raised: 0 1px 2px rgb(0 0 0 / 0.4), 0 4px 12px rgb(0 0 0 / 0.3);
    --rm-shadow-card: 0 1px 2px rgb(0 0 0 / 0.4), 0 16px 40px -16px rgb(0 0 0 / 0.6);
    --rm-shadow-overlay: 0 8px 32px rgb(0 0 0 / 0.55);
  }
}

/* --- Tema oscuro: elección explícita, gana sobre el sistema --- */
:root[data-theme='dark'] {
  color-scheme: dark;
  --rm-paper: var(--rm-n-950);
  --rm-surface: #111724;
  --rm-surface-sunken: #070a10;
  --rm-ink: #eef2f7;
  --rm-ink-muted: #a7b1c0;
  --rm-ink-subtle: #7f8a9b;
  --rm-rule: #1e2633;
  --rm-rule-strong: #2c3645;
  --rm-accent: #7cc75f;
  --rm-accent-hover: #9bd884;
  --rm-accent-ink: var(--rm-n-950);
  --rm-accent-wash: #14231a;
  --rm-solid: #eef2f7;
  --rm-solid-hover: #cdd5e0;
  --rm-solid-ink: var(--rm-n-950);

  --rm-shadow-raised: 0 1px 2px rgb(0 0 0 / 0.4), 0 4px 12px rgb(0 0 0 / 0.3);
  --rm-shadow-card: 0 1px 2px rgb(0 0 0 / 0.4), 0 16px 40px -16px rgb(0 0 0 / 0.6);
  --rm-shadow-overlay: 0 8px 32px rgb(0 0 0 / 0.55);
}

:root[data-theme='light'] {
  color-scheme: light;
}
