/* ==========================================================================
   TRAIL TRAVEL — Design tokens
   Colores extraídos de las piezas de marca reales (PDFs de viaje / logo).
   ========================================================================== */

@font-face {
  font-family: "League Spartan";
  src: url("../fonts/LeagueSpartan-Variable.woff2") format("woff2-variations"),
       url("../fonts/LeagueSpartan-Variable.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "TT Interphases Mono";
  src: url("../fonts/TTInterphasesMono-Variable.woff2") format("woff2-variations"),
       url("../fonts/TTInterphasesMono-Variable.woff2") format("woff2");
  font-weight: 100 800;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "TT Interphases Mono";
  src: url("../fonts/TTInterphasesMono-Bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

:root {
  /* ---- Color: base ---- */
  --forest: #26402A;
  --forest-deep: #182A1B;
  --forest-mid: #345239;
  --cream: #F4F1E1;
  --cream-dim: #E9EBC7;
  --ink: #16220F;

  /* ---- Color: acentos por destino ---- */
  --accent-ferrugem: #FBDD5A;
  --accent-ferrugem-ink: #4A3B00;
  --accent-ilha: #C7F3D5;
  --accent-ilha-ink: #0F3A22;
  --accent-costa: #E8692F;
  --accent-costa-ink: #3A1400;

  --eyebrow-ink: #664E3B;

  /* acento activo por defecto (se sobreescribe por página con data-destino) */
  --accent: var(--accent-ferrugem);
  --accent-ink: var(--accent-ferrugem-ink);

  /* ---- Tipografía ---- */
  --font-display: "League Spartan", "Arial Narrow", sans-serif;
  --font-mono: "TT Interphases Mono", ui-monospace, "SF Mono", monospace;
  --tracking-tight: -0.045em; /* -8% de Figma es agresivo en cuerpos de texto largos; se aplica completo solo a titulares grandes */
  --tracking-display: -0.08em;

  --text-hero: clamp(2rem, 1rem + 6.5vw, 7.5rem);
  --text-h1: clamp(2.25rem, 1.7rem + 2.5vw, 4rem);
  --text-h2: clamp(1.6rem, 1.3rem + 1.4vw, 2.5rem);
  --text-h3: clamp(1.25rem, 1.1rem + 0.6vw, 1.6rem);
  --text-lead: clamp(1.05rem, 0.95rem + 0.4vw, 1.25rem);
  --text-body: 1rem;
  --text-small: 0.875rem;
  --text-label: 0.75rem;

  /* ---- Espaciado (ritmo base 8px) ---- */
  --space-1: 0.5rem;
  --space-2: 1rem;
  --space-3: 1.5rem;
  --space-4: 2rem;
  --space-5: 2.5rem;
  --space-6: 3rem;
  --space-8: 4rem;
  --space-10: 5rem;
  --space-12: 6rem;
  --space-16: 8rem;

  /* ---- Layout ---- */
  --container-max: 1360px;
  --container-pad: clamp(1.25rem, 4vw, 3rem);
  --radius-lg: 28px;
  --radius-md: 16px;
  --radius-sm: 10px;
  --radius-pill: 999px;

  /* ---- Motion ---- */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --duration-fast: 180ms;
  --duration-base: 300ms;
  --duration-slow: 500ms;

  /* ---- Elevación ---- */
  --shadow-card: 0 20px 40px -20px rgba(22, 34, 15, 0.35);
  --shadow-soft: 0 10px 24px -16px rgba(22, 34, 15, 0.25);
}

/* Páginas de destino activan su propio acento */
[data-destino="ferrugem"] { --accent: var(--accent-ferrugem); --accent-ink: var(--accent-ferrugem-ink); }
[data-destino="ilha-grande"] { --accent: var(--accent-ilha); --accent-ink: var(--accent-ilha-ink); }
[data-destino="costa-rica"] { --accent: var(--accent-costa); --accent-ink: var(--accent-costa-ink); }

@media (prefers-reduced-motion: reduce) {
  :root {
    --duration-fast: 0ms;
    --duration-base: 0ms;
    --duration-slow: 0ms;
  }
}