:root {
  /* ---- Marca (rediseño 2026-08-20 — dirección v2 aprobada por Jonás en
     Claude Design: azul náutico + latón sobre marfil, ver Ketch Lab/Fase 2) ---- */
  --color-ink: #191713;
  --color-paper: #F5EDDE;

  /* Azul — el color de marca dominante, no solo un acento. Nombrado "navy"
     para no chocar con --color-accent-*, que sigue siendo latón. */
  --color-navy: #16304E;
  --color-navy-deep: #0D2038;
  --color-navy-light: #1B3A5C;

  /* Acento — latón. Ver marca/paleta.md para por qué hay tres tonos. */
  --color-brass: #A9812F;       /* decorativo / texto grande solamente */
  --color-brass-ink: #6E5424;   /* texto pequeño sobre --color-paper */
  --color-brass-light: #E2C179; /* texto / acentos sobre fondo oscuro */

  /* Escala neutra */
  --neutral-50: #F5EDDE;
  --neutral-200: #EDE3CE;
  --neutral-400: #ABA89D;
  --neutral-600: #6B6759;
  --neutral-900: #191713;

  /* Semánticos */
  --color-success: #35694C;
  --color-success-dark: #6FB98C;
  --color-error: #A5402F;
  --color-error-dark: #E37060;

  /* ---- Tipografía ---- */
  --font-display: "Bodoni Moda", Didot, Georgia, "Times New Roman", serif;
  --font-body: "Archivo", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  /* Mono — señal "técnica" puntual (etiquetas, estados, marcas de tiempo).
     Nunca para texto de lectura larga, solo detalles cortos en mayúscula. */
  --font-mono: "IBM Plex Mono", "SF Mono", ui-monospace, Menlo, Consolas, monospace;

  /* Escala fluida. Los titulares grandes llevan tracking negativo: a tamaño
     grande el espaciado por defecto se ve suelto. Los kickers llevan tracking
     positivo porque van en mayúscula y pequeños. */
  --fs-display: clamp(3rem, 7vw + 0.5rem, 8.5rem);
  --fs-h1: clamp(2.5rem, 5vw + 0.5rem, 5rem);
  --fs-h2: clamp(2rem, 3vw + 0.75rem, 3.5rem);
  --fs-h3: clamp(1.25rem, 0.6vw + 1rem, 1.6rem);
  --fs-lead: clamp(1.125rem, 0.5vw + 1rem, 1.4rem);
  --fs-body: 1.0625rem;
  --fs-small: 0.9375rem;
  --fs-kicker: 0.6875rem;

  /* Bodoni Moda ya es una serif angosta de tracking apretado por diseño —
     hereda menos negativo que Instrument Serif para no cerrarse de más. */
  --tracking-display: -0.02em;
  --tracking-h1: -0.018em;
  --tracking-h2: -0.015em;
  --tracking-kicker: 0.18em;

  --leading-tight: 0.98;
  --leading-snug: 1.08;
  --leading-body: 1.6;

  /* ---- Espaciado ---- */
  --space-2xs: 0.375rem;
  --space-xs: 0.625rem;
  --space-sm: 1rem;
  --space-md: 1.75rem;
  --space-lg: clamp(2.5rem, 3vw + 1rem, 4.5rem);
  --space-xl: clamp(4.5rem, 6vw + 1rem, 9rem);
  --space-2xl: clamp(7rem, 10vw + 1rem, 14rem);

  --max-width: 1240px;
  --measure: 34rem;
  --radius: 2px;

  /* ---- Movimiento ---- */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-fast: 180ms;
  --dur-base: 280ms;
  --dur-slow: 600ms;

  /* ---- Roles semánticos: modo claro por defecto ---- */
  --color-bg: var(--color-paper);
  --color-bg-raised: var(--neutral-200);
  --color-fg: var(--color-ink);
  --color-fg-secondary: var(--neutral-600);
  --color-accent-text: var(--color-brass-ink);
  --color-accent-decorative: var(--color-brass);
  --color-rule: rgba(25, 23, 19, 0.14);
  --color-rule-strong: rgba(25, 23, 19, 0.28);
  --logo-filter: none;
}

/* El navy ya es un tono oscuro por naturaleza — el modo oscuro no inventa un
   color nuevo, adopta el que ya es parte de la marca (ver Servicios y
   Contacto, que lo usan como bloque fijo sin importar el tema). */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --color-bg: var(--color-navy-deep);
    --color-bg-raised: var(--color-navy);
    --color-fg: var(--color-paper);
    --color-fg-secondary: rgba(245, 237, 222, 0.72);
    --color-accent-text: var(--color-brass-light);
    --color-accent-decorative: var(--color-brass-light);
    --color-rule: rgba(245, 237, 222, 0.16);
    --color-rule-strong: rgba(245, 237, 222, 0.3);
    /* Los SVG de marca traen la tinta fija en el archivo y no siguen variables. */
    --logo-filter: invert(1);
  }
}

:root[data-theme="dark"] {
  --color-bg: var(--color-navy-deep);
  --color-bg-raised: var(--color-navy);
  --color-fg: var(--color-paper);
  --color-fg-secondary: rgba(245, 237, 222, 0.72);
  --color-accent-text: var(--color-brass-light);
  --color-accent-decorative: var(--color-brass-light);
  --color-rule: rgba(245, 237, 222, 0.16);
  --color-rule-strong: rgba(245, 237, 222, 0.3);
  --logo-filter: invert(1);
}
