/* ============================================================
   Los Entresijos — Design Tokens
   ============================================================ */

:root {
  /* --- Colors --- */
  --bg-base:       #0E0E0F;
  --bg-surface:    #161618;
  --bg-elevated:   #1F1F22;
  --border:        rgba(255,255,255,0.08);
  --border-muted:  rgba(255,255,255,0.04);

  --text-primary:  #F0EDE6;
  --text-secondary:#A09B93;
  --text-disabled: #5A5651;

  --accent:        #C8923A;
  --accent-pale:   rgba(200,146,58,0.12);
  --accent-hover:  #E0A84C;

  /* --- Typography --- */
  --font-display: 'Fraunces', Georgia, serif;
  --font-body:    'Plus Jakarta Sans', system-ui, sans-serif;

  --text-xs:    0.72rem;
  --text-sm:    0.85rem;
  --text-base:  1rem;
  --text-lg:    1.15rem;
  --text-xl:    clamp(1.25rem, 2.2vw, 1.6rem);
  --text-2xl:   clamp(1.7rem, 3.5vw, 2.4rem);
  --text-3xl:   clamp(2.2rem, 5vw, 3.2rem);
  --text-hero:  clamp(2.6rem, 6vw, 5rem);
  --text-quote: clamp(1.8rem, 3.8vw, 3rem);

  /* --- Spacing --- */
  --space-1:  0.25rem;
  --space-2:  0.5rem;
  --space-3:  0.75rem;
  --space-4:  1rem;
  --space-5:  1.25rem;
  --space-6:  1.5rem;
  --space-8:  2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;
  --space-24: 6rem;
  --space-32: 8rem;

  /* --- Radii --- */
  --radius-sm:  4px;
  --radius-md:  8px;
  --radius-lg:  16px;
  --radius-xl:  24px;
  --radius-full: 9999px;

  /* --- Transitions --- */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in:  cubic-bezier(0.4, 0, 1, 1);
  --duration-fast: 150ms;
  --duration-base: 250ms;
  --duration-slow: 400ms;

  /* --- Shadows --- */
  --shadow-sm: 0 1px 3px rgba(0,0,0,0.4);
  --shadow-md: 0 4px 16px rgba(0,0,0,0.5);
  --shadow-lg: 0 12px 40px rgba(0,0,0,0.6);
  --shadow-accent: 0 4px 24px rgba(200,146,58,0.2);

  /* --- Layout --- */
  --container-max: 1200px;
  --container-pad: clamp(var(--space-6), 5vw, var(--space-12));
  --nav-height: 72px;
}