/* =========================================
   DESIGN TOKENS — Axl Lake EPK
   Sistema de diseño completo
   ========================================= */

:root {
  /* ── Fondos ── */
  --color-bg-primary: #0A0A0A;
  --color-bg-secondary: #111111;
  --color-bg-tertiary: #1A1A1A;
  --color-bg-card: #141414;

  /* ── Acentos neutros ── */
  --color-warm-gray: #B8B0A8;
  --color-cool-gray: #8A8A8A;
  --color-divider: rgba(255, 255, 255, 0.06);

  /* ── Texto ── */
  --color-text-primary: #F5F5F0;
  --color-text-secondary: #A0A0A0;
  --color-text-tertiary: #6B6B6B;
  --color-text-accent: #D4C8B8;

  /* ── Interacción ── */
  --color-white: #FFFFFF;
  --color-hover: rgba(255, 255, 255, 0.08);
  --color-border: rgba(255, 255, 255, 0.10);
  --color-border-hover: rgba(255, 255, 255, 0.20);

  /* ── Tipografía ── */
  --font-heading: 'Prata', 'Georgia', serif;
  --font-body: 'Inter', 'Helvetica Neue', sans-serif;
  --font-secondary: 'Space Grotesk', 'Helvetica Neue', sans-serif;

  /* Adjustments to accommodate Prata metrics (larger lower bounds for Mobile) */
  --text-display: clamp(3.5rem, 6vw, 5rem);
  --text-h1: clamp(2.2rem, 4vw, 3rem);
  --text-h2: clamp(1.6rem, 2vw, 1.8rem);
  --text-h3: clamp(1.25rem, 1.5vw, 1.4rem);
  --text-body: clamp(1.05rem, 1.25vw, 1.15rem);
  --text-small: clamp(0.875rem, 1vw, 0.95rem);
  --text-micro: clamp(0.75rem, 0.85vw, 0.825rem);

  /* ── Spacing ── */
  --space-xs: 0.5rem;
  --space-sm: 1rem;
  --space-md: 1.5rem;
  --space-lg: 2rem;
  --space-xl: 3rem;
  --space-2xl: 4rem;
  --space-3xl: 6rem;
  --space-4xl: 8rem;
  --space-section: clamp(4rem, 8vw, 6rem);

  /* ── Transiciones ── */
  --ease-smooth: cubic-bezier(0.25, 0.1, 0.25, 1);
  --duration-fast: 0.2s;
  --duration-normal: 0.3s;
  --duration-slow: 0.6s;
}
