/* =========================================================
   Le Corch · tokens
   Paleta "Atlántico Uruguayo" · 3 + 2 estricto.
   Cero terracota (firma exclusiva 512 + GF).
   Easing único · cubic-bezier(0.16, 1, 0.3, 1).
   ========================================================= */

:root {
  /* ===== Principales ===== */
  --color-arena:        #F0E8D6;
  --color-tinta:        #182331;
  --color-marina:       #1F4865;
  --color-marina-soft:  #2D5F84;

  /* ===== Tints internos de Arena ===== */
  --color-arena-soft:   #FAF4E5;
  --color-arena-densa:  #DECEAE;

  /* ===== Acento firma ===== */
  --color-firma:        #A88B5C;
  --color-firma-deep:   #8B7148;

  /* ===== Aliases retro-compat ===== */
  --color-bg:           var(--color-arena);
  --color-bg-soft:      var(--color-arena-densa);
  --color-foam:         var(--color-arena-soft);

  /* ===== Hairlines ===== */
  --hairline-soft:           rgba(24, 35, 49, 0.08);
  --hairline-mid:            rgba(24, 35, 49, 0.14);
  --hairline-strong:         rgba(24, 35, 49, 0.22);
  --hairline-on-dark:        rgba(240, 232, 214, 0.10);
  --hairline-on-dark-strong: rgba(240, 232, 214, 0.22);

  /* ===== Tipografía ===== */
  --font-display: 'DM Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-body:    'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;

  --peso-thin:   200;
  --peso-light:  300;
  --peso-reg:    400;
  --peso-med:    500;
  --peso-semi:   600;
  --peso-bold:   700;
  --peso-black:  800;

  --fs-eyebrow:   11px;
  --fs-small:     13px;
  --fs-body:      16px;
  --fs-lead:      clamp(18px, 1.4vw, 22px);
  --fs-h6:        clamp(16px, 1.2vw, 18px);
  --fs-h5:        clamp(20px, 1.5vw, 24px);
  --fs-h4:        clamp(24px, 2vw, 32px);
  --fs-h3:        clamp(30px, 2.5vw, 42px);
  --fs-h2:        clamp(38px, 4vw, 60px);
  --fs-h1:        clamp(48px, 6vw, 96px);
  --fs-display:   clamp(60px, 8vw, 140px);
  --fs-monolith:  clamp(72px, 14vw, 220px);

  --altura-body:    1.65;
  --altura-titulos: 1.05;

  /* ===== Espaciado ===== */
  --sp-1: 8px;   --sp-2: 16px;  --sp-3: 24px;  --sp-4: 32px;
  --sp-5: 48px;  --sp-6: 64px;  --sp-7: 96px;  --sp-8: 128px;
  --sp-9: 160px; --sp-10: 200px;

  --sp-lateral:    clamp(20px, 4vw, 80px);
  --sp-section-y:  clamp(80px, 10vw, 160px);

  --container: 1320px;
  --header-h:  84px;

  /* ===== Easing único ===== */
  --ease-premium: cubic-bezier(0.16, 1, 0.3, 1);
  --dur-hover:    480ms;
  --dur-reveal:   1100ms;
}

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