/**
 * root.css — Blackwood Collections
 * TODAS las variables CSS del sistema. Solo se definen aquí.
 */

:root {
  /* ── Colores HEX ─────────────────────────────────────── */
  --bw-color-dark:        #0A0A0F;
  --bw-color-light:       #F5F5F0;
  --bw-color-white:       #FFFFFF;
  --bw-color-blue:        #0060FF;
  --bw-color-blue-hover:  #0050DD;
  --bw-color-violet:      #8B00FF;
  --bw-color-orange:      #E8651A;
  --bw-color-blue-muted:  #4D94FF;

  /* ── Colores RGB (para rgba()) ───────────────────────── */
  --bw-rgb-dark:          10, 10, 15;
  --bw-rgb-light:         245, 245, 240;
  --bw-rgb-white:         255, 255, 255;
  --bw-rgb-blue:          0, 96, 255;
  --bw-rgb-violet:        139, 0, 255;
  --bw-rgb-orange:        232, 101, 26;

  /* ── Tipografía ──────────────────────────────────────── */
  --bw-font-primary:      'Outfit', sans-serif;
  --bw-font-mono:         'Space Mono', monospace;
  --bw-font-weight-light: 300;
  --bw-font-weight-reg:   400;
  --bw-font-weight-med:   500;
  --bw-font-weight-semi:  600;
  --bw-font-weight-bold:  700;

  /* ── Escala tipográfica fluida ───────────────────────── */
  --bw-text-xs:      clamp(0.70rem, 0.9vw,  0.80rem);
  --bw-text-sm:      clamp(0.85rem, 1.1vw,  1.00rem);
  --bw-text-base:    clamp(1.00rem, 1.4vw,  1.125rem);
  --bw-text-lg:      clamp(1.15rem, 1.8vw,  1.375rem);
  --bw-text-xl:      clamp(1.50rem, 2.5vw,  2.00rem);
  --bw-text-2xl:     clamp(1.80rem, 3.0vw,  2.50rem);
  --bw-text-3xl:     clamp(2.20rem, 5.0vw,  4.50rem);
  --bw-text-hero:    clamp(2.80rem, 6.0vw,  5.50rem);
  --bw-text-section: clamp(2.50rem, 4.5vw,  3.50rem);

  /* ── Espaciados fluidos ──────────────────────────────── */
  --bw-space-xs:      clamp(0.50rem, 1.0vw,  0.75rem);
  --bw-space-sm:      clamp(0.75rem, 1.5vw,  1.00rem);
  --bw-space-md:      clamp(1.00rem, 2.0vw,  1.50rem);
  --bw-space-lg:      clamp(1.50rem, 3.0vw,  2.50rem);
  --bw-space-xl:      clamp(2.00rem, 4.0vw,  4.00rem);
  --bw-space-2xl:     clamp(3.00rem, 6.0vw,  7.00rem);
  --bw-space-section: clamp(4.00rem, 7.0vw,  7.00rem);

  /* ── Layout ──────────────────────────────────────────── */
  --bw-max-width:    1440px;
  --bw-padding-x:    clamp(1.25rem, 3.0vw, 3.00rem);
  --bw-radius-sm:    12px;
  --bw-radius-md:    20px;
  --bw-radius-lg:    28px;
  --bw-radius-xl:    32px;
  --bw-radius-pill:  9999px;

  /* ── Nav ─────────────────────────────────────────────── */
  --bw-nav-height:   72px;

  /* ── Transiciones ────────────────────────────────────── */
  --bw-transition-fast: 150ms ease;
  --bw-transition-base: 300ms ease;
  --bw-transition-slow: 500ms ease;
  --bw-transition-img:  700ms ease;

  /* ── Sombras ─────────────────────────────────────────── */
  --bw-shadow-card:  0 4px 24px rgba(var(--bw-rgb-dark), 0.06);
  --bw-shadow-hover: 0 8px 40px rgba(var(--bw-rgb-dark), 0.12);

  /* ── Opacidades semánticas ───────────────────────────── */
  --bw-text-muted:    rgba(var(--bw-rgb-dark), 0.40);
  --bw-text-subtle:   rgba(var(--bw-rgb-dark), 0.50);
  --bw-border-subtle: rgba(var(--bw-rgb-dark), 0.06);
  --bw-border-light:  rgba(var(--bw-rgb-dark), 0.10);
}
