/* ============================================================
   SUR ENDÉMICO · Design Tokens
   Paleta "Bosque Endémico" + Fraunces + Geist
============================================================ */

:root {
  /* ─── COLOR ─── */
  --color-paper:        #F5F1E8;
  --color-paper-alt:    #FAF7F0;
  --color-ink:          #1A1A14;
  --color-ink-soft:     #574F45;

  --color-forest:       #2C4A35;
  --color-forest-deep:  #1A2E20;
  --color-olive:        #5D6F4B;

  --color-clay:         #A66B4A;
  --color-clay-soft:    #C28968;

  --color-gold:         #A88C5C;
  --color-gold-bright:  #C9A876;
  --color-gold-deep:    #7A6440;

  --color-success:      #4A6B3C;
  --color-warning:      #B8743E;
  --color-error:        #8B3A2A;
  --color-info:         #4A5D6B;

  /* ─── TYPOGRAPHY ─── */
  --font-display: 'Fraunces', 'Georgia', 'Times New Roman', serif;
  --font-body:    'Geist', -apple-system, BlinkMacSystemFont, 'Helvetica Neue', sans-serif;
  --font-mono:    'Geist Mono', 'JetBrains Mono', ui-monospace, monospace;

  --text-xs:    11px;
  --text-sm:    13.5px;
  --text-base:  16px;
  --text-lg:    20px;
  --text-xl:    25px;
  --text-2xl:   31px;
  --text-3xl:   39px;
  --text-4xl:   49px;
  --text-hero:  clamp(56px, 9vw, 128px);

  --weight-light:    300;
  --weight-regular:  400;
  --weight-medium:   500;
  --weight-bold:     700;

  --leading-tight:   1.05;
  --leading-normal:  1.5;
  --leading-loose:   1.75;

  --tracking-tight:  -0.02em;
  --tracking-normal: 0em;
  --tracking-wide:   0.08em;
  --tracking-eyebrow: 0.28em;

  /* ─── SPACING ─── */
  --space-1:   4px;
  --space-2:   8px;
  --space-3:   12px;
  --space-4:   16px;
  --space-5:   24px;
  --space-6:   32px;
  --space-7:   48px;
  --space-8:   64px;
  --space-9:   96px;
  --space-10:  128px;
  --space-11:  192px;

  --container-max:   1280px;
  --container-prose: 720px;
  --gutter:          clamp(20px, 4vw, 64px);

  /* ─── RADII ─── */
  --radius-sm:    4px;
  --radius-md:    8px;
  --radius-lg:    14px;
  --radius-xl:    24px;
  --radius-pill:  9999px;

  /* ─── BORDERS ─── */
  --border-hairline: 1px solid rgba(26, 26, 20, 0.08);
  --border-soft:     1px solid rgba(26, 26, 20, 0.14);
  --border-strong:   2px solid var(--color-ink);

  /* ─── SHADOWS ─── */
  --shadow-soft:  0 1px 2px rgba(26, 26, 20, 0.04), 0 4px 12px rgba(26, 26, 20, 0.06);
  --shadow-lift:  0 8px 24px rgba(26, 26, 20, 0.10), 0 2px 6px rgba(26, 26, 20, 0.06);
  --shadow-deep:  0 24px 64px rgba(26, 26, 20, 0.14), 0 8px 24px rgba(26, 26, 20, 0.08);

  /* ─── EASINGS ─── */
  --ease-out:     cubic-bezier(0.23, 1, 0.32, 1);
  --ease-in-out:  cubic-bezier(0.77, 0, 0.175, 1);
  --ease-drawer:  cubic-bezier(0.32, 0.72, 0, 1);

  /* ─── DURATIONS ─── */
  --dur-fast:   100ms;
  --dur-base:   160ms;
  --dur-medium: 240ms;
  --dur-slow:   400ms;
  --dur-lazy:   700ms;
}