/* ==========================================================================
   Machu Picchu Today — Design Tokens
   Fonte única de verdade para cores, tipografia, espaçamentos e timings.
   ========================================================================== */

:root {
  /* ---------- Cores da marca ---------- */
  --mpt-blue-950: #001A37;          /* Tinta de fundo profundíssima */
  --mpt-blue-900: #00264F;          /* Backgrounds escuros principais */
  --mpt-blue-800: #00356B;          /* Azul escuro secundário */
  --mpt-blue-700: #003D80;          /* Azul principal da marca */
  --mpt-blue-600: #0E4D96;          /* Azul de hover/highlight */
  --mpt-blue-500: #1E64B5;          /* Azul claro de detalhes */
  --mpt-blue-100: #DEE7F2;          /* Azul muito claro para chips */

  --mpt-gold-800: #9C7E4A;          /* Dourado profundo (texto sobre claro) */
  --mpt-gold-700: #B08F55;          /* Dourado de hover */
  --mpt-gold-600: #CFA970;          /* Dourado principal */
  --mpt-gold-500: #DCBF8E;          /* Dourado claro/realce em escuro */
  --mpt-gold-400: #E6CFA8;          /* Dourado muito claro */
  --mpt-gold-100: #F2E6D2;          /* Dourado para fundos */
  --mpt-gold-50: #FAF3E6;           /* Tom dourado quase ivory */

  --mpt-ivory: #F4E9E0;             /* Marfim — fundo principal claro */
  --mpt-cream: #FAF5EE;             /* Creme suave — fundos alternados */
  --mpt-paper: #FFFFFF;             /* Branco puro */
  --mpt-stone-100: #F1ECE3;
  --mpt-stone-200: #E6DBCE;         /* Bordas suaves */
  --mpt-stone-300: #C9BCA8;
  --mpt-stone-400: #8B7E6F;         /* Texto secundário */
  --mpt-stone-600: #5B4F40;
  --mpt-stone-800: #2A2419;         /* Marrom escuro de texto */

  --mpt-success: #2F7D5B;
  --mpt-warning: #C97B2B;
  --mpt-error: #B83A2E;

  /* Cores semânticas */
  --color-bg: var(--mpt-ivory);
  --color-bg-alt: var(--mpt-cream);
  --color-bg-dark: var(--mpt-blue-900);
  --color-bg-dark-alt: var(--mpt-blue-800);
  --color-text: var(--mpt-stone-800);
  --color-text-soft: var(--mpt-stone-400);
  --color-text-inverse: var(--mpt-ivory);
  --color-accent: var(--mpt-gold-600);
  --color-accent-strong: var(--mpt-gold-800);
  --color-link: var(--mpt-blue-700);
  --color-border: var(--mpt-stone-200);
  --color-border-strong: var(--mpt-gold-700);

  /* ---------- Tipografia ---------- */
  --font-serif: "Lora", Georgia, serif;
  --font-sans: "Inter", "Helvetica Neue", Arial, system-ui, sans-serif;
  --font-display: "Fraunces", Georgia, serif;

  /* Escala fluida (clamp) — mais editorial e premium */
  --fs-eyebrow: 0.75rem;            /* 12px */
  --fs-micro: 0.82rem;
  --fs-body-sm: 0.92rem;
  --fs-body: 1.05rem;
  --fs-body-lg: 1.18rem;
  --fs-h6: 1.05rem;
  --fs-h5: clamp(1.10rem, 0.9rem + 0.6vw, 1.30rem);
  --fs-h4: clamp(1.30rem, 1.05rem + 0.9vw, 1.65rem);
  --fs-h3: clamp(1.75rem, 1.35rem + 1.4vw, 2.40rem);
  --fs-h2: clamp(2.20rem, 1.55rem + 2.4vw, 3.50rem);
  --fs-h1: clamp(2.80rem, 1.80rem + 4.0vw, 5.20rem);
  --fs-display: clamp(2.35rem, 1.55rem + 2.9vw, 4.1rem);

  --lh-tight: 1.02;
  --lh-snug: 1.14;
  --lh-normal: 1.45;
  --lh-relaxed: 1.65;
  --lh-prose: 1.75;

  --fw-light: 300;
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;

  --ls-tighter: -0.04em;
  --ls-tight: -0.025em;
  --ls-normal: 0;
  --ls-wide: 0.06em;
  --ls-wider: 0.18em;
  --ls-widest: 0.32em;

  /* ---------- Espaçamentos ---------- */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 2.5rem;
  --space-8: 3rem;
  --space-9: 4rem;
  --space-10: 5rem;
  --space-11: 6rem;
  --space-12: 8rem;
  --space-13: 10rem;

  --section-py: clamp(5rem, 3.5rem + 5vw, 9rem);
  --section-py-sm: clamp(3rem, 2rem + 2.5vw, 5rem);

  /* ---------- Container ---------- */
  --container-max: 1280px;
  --container-wide: 1440px;
  --container-narrow: 920px;
  --container-px: clamp(1.25rem, 1rem + 2vw, 2.5rem);

  /* ---------- Raios ---------- */
  --r-xs: 4px;
  --r-sm: 6px;
  --r-md: 10px;
  --r-lg: 16px;
  --r-xl: 24px;
  --r-2xl: 36px;
  --r-pill: 999px;

  /* ---------- Sombras ---------- */
  --shadow-soft: 0 8px 28px -12px rgba(0, 38, 79, 0.18);
  --shadow-md: 0 14px 36px -16px rgba(0, 38, 79, 0.28);
  --shadow-lg: 0 28px 60px -20px rgba(0, 38, 79, 0.32);
  --shadow-xl: 0 40px 80px -24px rgba(0, 26, 55, 0.45);
  --shadow-gold: 0 18px 42px -16px rgba(176, 143, 85, 0.45);
  --shadow-gold-strong: 0 24px 60px -18px rgba(176, 143, 85, 0.6);
  --shadow-inset: inset 0 1px 0 rgba(255, 255, 255, 0.1);

  /* ---------- Transições / easings premium ---------- */
  --ease-out-quad: cubic-bezier(0.22, 0.61, 0.36, 1);
  --ease-out-quart: cubic-bezier(0.165, 0.84, 0.44, 1);
  --ease-out-expo: cubic-bezier(0.19, 1, 0.22, 1);
  --ease-out-circ: cubic-bezier(0.075, 0.82, 0.165, 1);
  --ease-in-out-cubic: cubic-bezier(0.65, 0.05, 0.36, 1);
  --ease-in-out-quart: cubic-bezier(0.77, 0, 0.175, 1);

  --t-fast: 200ms;
  --t-base: 360ms;
  --t-slow: 600ms;
  --t-slower: 900ms;
  --t-cinematic: 1200ms;

  /* ---------- Camadas ---------- */
  --z-base: 1;
  --z-sticky: 20;
  --z-header: 50;
  --z-overlay: 80;
  --z-modal: 100;
  --z-toast: 200;
  --z-floating-cta: 60;

  /* ---------- Outros ---------- */
  --header-h: 92px;
  --header-h-scrolled: 70px;
}

/* Mobile/tablet: header, padding de seção e tipo um pouco mais compactos.
   Os valores ≥1024px ficam intactos. */
@media (max-width: 1024px) {
  :root {
    --header-h: 76px;
    --header-h-scrolled: 60px;
    --section-py: clamp(3.5rem, 2rem + 4.5vw, 6rem);
    --section-py-sm: clamp(2.25rem, 1.5rem + 2vw, 3.5rem);
  }
}
@media (max-width: 640px) {
  :root {
    --header-h: 66px;
    --header-h-scrolled: 56px;
    --fs-eyebrow: 0.7rem;
    --section-py: clamp(3rem, 2rem + 3vw, 4.5rem);
    --section-py-sm: clamp(2rem, 1.5rem + 1.5vw, 3rem);
  }
}