/* ──────────────────────────────────────────────────────────
   Uman Lodge · tokens.css
   Single source of truth for design tokens.
   Paleta y tipografía estrictamente del manual de marca 2023.
   ────────────────────────────────────────────────────────── */

:root {
  /* ── Paleta — Manual de marca ────────────────────────────── */
  --c-teal:    #1F5353; /* Color principal */
  --c-teal-dark: #163C3C; /* Hover de superficies teal */
  --c-moss:    #586B46;
  --c-meadow:  #8CA26E;
  --c-sun:     #E0A900;
  --c-ochre:   #CC8840;
  --c-fire:    #B65534;
  --c-mist:    #BCCEC2;
  --c-stone:   #899EAA;
  --c-paper:   #F4F4F4;

  /* ── Aliases semánticos ─────────────────────────────────── */
  --c-ink:     #1A1A1A;       /* texto principal sobre claro */
  --c-ink-soft:#4A4A4A;       /* texto secundario */
  --c-mute:    #7A7A7A;       /* texto auxiliar */
  --c-line:    #E6E6E6;       /* divisores sobre claro */
  --c-line-dark: rgba(244,244,244,0.18); /* divisores sobre teal */
  --c-bg:      #FFFFFF;
  --c-bg-alt:  var(--c-paper);
  --c-bg-deep: var(--c-teal);

  /* ── Tipografía ──────────────────────────────────────────── */
  --font-sans: "Flama", system-ui, -apple-system, "Helvetica Neue", sans-serif;
  --font-display: var(--font-sans);
  --font-body: var(--font-sans);

  /* Escala tipográfica fluida */
  --fs-micro:   11px;
  --fs-eyebrow: clamp(11px, 0.78vw, 13px);
  --fs-small:   13px;
  --fs-body:    clamp(15px, 1.05vw, 17px);
  --fs-lead:    clamp(19px, 1.5vw, 23px);
  --fs-h4:      clamp(22px, 2vw, 28px);
  --fs-h3:      clamp(28px, 3vw, 40px);
  --fs-h2:      clamp(36px, 4.5vw, 64px);
  --fs-h1:      clamp(48px, 8.5vw, 132px);
  --fs-display: clamp(64px, 11vw, 180px);

  /* Letter-spacing */
  --ls-tight:   -0.025em;
  --ls-display: -0.02em;
  --ls-normal:  0;
  --ls-mid:     0.04em;
  --ls-wide:    0.18em;
  --ls-eyebrow: 0.24em;

  /* Line-height */
  --lh-tight:  0.95;
  --lh-snug:   1.15;
  --lh-normal: 1.55;
  --lh-prose:  1.7;

  /* ── Espaciado (8pt) ─────────────────────────────────────── */
  --s-0:   0;
  --s-1:   8px;
  --s-2:   16px;
  --s-3:   24px;
  --s-4:   32px;
  --s-5:   48px;
  --s-6:   64px;
  --s-7:   96px;
  --s-8:   128px;
  --s-9:   192px;
  --s-10:  256px;

  /* ── Layout ──────────────────────────────────────────────── */
  --container-max: 1440px;
  --container-pad: clamp(20px, 4vw, 64px);
  --header-h:      72px;
  --sticky-bar-h:  72px;

  /* ── Bordes y radios ─────────────────────────────────────── */
  --r-0: 0;
  --r-1: 2px;     /* uso muy puntual */
  --bw:  1px;

  /* ── Sombras (uso restringido) ───────────────────────────── */
  --sh-soft:  0 1px 2px rgba(31,83,83,0.06), 0 8px 24px rgba(31,83,83,0.06);
  --sh-card:  0 2px 4px rgba(0,0,0,0.04), 0 16px 40px rgba(0,0,0,0.08);

  /* ── Transiciones ────────────────────────────────────────── */
  --t-quick: 160ms cubic-bezier(.2,.6,.2,1);
  --t-base:  240ms cubic-bezier(.2,.6,.2,1);
  --t-slow:  420ms cubic-bezier(.2,.6,.2,1);

  /* ── Z ───────────────────────────────────────────────────── */
  --z-base:       1;
  --z-sticky:    50;
  --z-nav:       60;
  --z-overlay:   80;
  --z-modal:     90;
  --z-toast:    100;
}