/* ============================================================
   TOKENS — single source of truth for color, type and spacing.
   Change values here to re-skin the whole site.
   ============================================================ */

:root {
  /* --- Color: agua, piedra y bosque del sur de Chile --- */
  --c-paper:      #F6F3EE;   /* off-white cálido, fondo principal */
  --c-paper-2:    #EBE6DD;   /* fondo alterno, bloques suaves */
  --c-paper-3:    #DFD8CC;   /* bordes sobre claro */

  --c-ink:        #14181A;   /* titulares sobre claro */
  --c-ink-2:      #3D4749;   /* texto de lectura */
  --c-ink-3:      #6C7779;   /* texto secundario */

  --c-deep:       #0B2F36;   /* secciones oscuras */
  --c-deep-2:     #072026;   /* footer, profundidad */
  --c-deep-3:     #14464F;   /* bordes sobre oscuro */

  --c-tide:       #11737D;   /* acento primario (agua) — AA 5.0:1 sobre papel */
  --c-tide-2:     #2FA0A6;   /* acento claro / hover, sobre fondos oscuros */
  --c-foam:       #CDE4E1;   /* texto claro sobre oscuro */
  --c-foam-2:     #9BBBB8;   /* texto secundario sobre oscuro */

  --c-sand:       #C2B29A;   /* natural cálido */
  --c-ember:      #A8623D;   /* acento cálido, uso mínimo */

  /* --- Tipografía --- */
  --f-display: "Playfair Display", "Iowan Old Style", Georgia, "Times New Roman", serif;
  --f-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;

  --t-hero:    clamp(2.65rem, 6.6vw, 5.5rem);
  --t-h1:      clamp(2.3rem, 5.2vw, 4.25rem);
  --t-h2:      clamp(1.85rem, 3.6vw, 3rem);
  --t-h3:      clamp(1.3rem, 2vw, 1.7rem);
  --t-h4:      clamp(1.05rem, 1.3vw, 1.2rem);
  --t-lead:    clamp(1.05rem, 1.25vw, 1.28rem);
  --t-body:    clamp(0.98rem, 0.55vw + 0.85rem, 1.08rem);
  --t-small:   0.875rem;
  --t-eyebrow: 0.72rem;

  --lh-tight: 1.06;
  --lh-head:  1.14;
  --lh-body:  1.68;
  --ls-eyebrow: 0.2em;
  --ls-display: -0.015em;

  /* --- Espaciado --- */
  --s-1: 0.25rem;  --s-2: 0.5rem;   --s-3: 0.75rem;  --s-4: 1rem;
  --s-5: 1.5rem;   --s-6: 2rem;     --s-7: 2.75rem;  --s-8: 3.5rem;
  --s-9: 4.5rem;   --s-10: 6rem;    --s-11: 8rem;

  --section-y: clamp(4.5rem, 9vw, 9rem);
  --section-y-sm: clamp(3rem, 6vw, 5.5rem);

  /* --- Layout --- */
  --wrap: 1300px;
  --wrap-text: 62ch;
  --gutter: clamp(1.25rem, 5vw, 4.5rem);
  --header-h: 76px;

  /* --- Detalle --- */
  --radius: 2px;          /* casi recto: editorial, no "tarjeta" */
  --radius-pill: 999px;
  --hairline: 1px solid var(--c-paper-3);
  --hairline-dark: 1px solid rgba(207, 224, 220, 0.18);

  --shadow-soft: 0 24px 60px -32px rgba(6, 26, 32, 0.45);

  /* --- Movimiento --- */
  --ease: cubic-bezier(0.22, 0.61, 0.36, 1);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --dur: 0.5s;
  --dur-fast: 0.25s;
}

@media (max-width: 640px) {
  :root { --header-h: 64px; }
}
