/* ============================================================
   DESIGN TOKENS — Block Rendering Design System
   Prefix: --blk-  (avoids collision with --theme-* vars)
   ============================================================ */

:root {
  /* ── Palette (Mapped to Theme Customizer Colors) ── */
  --blk-plum-900: var(--theme-primary-3, #2D1B3D);
  --blk-plum-700: var(--theme-primary-2, #4A2E5C);
  --blk-plum-500: var(--theme-primary, #6B4280);
  --blk-plum-100: var(--theme-border, #F0E8F4);

  --blk-gold-600: var(--theme-accent-2, #B8945F);
  --blk-gold-500: var(--theme-accent, #C9A876);
  --blk-gold-400: var(--theme-accent, #D4B98E);
  --blk-gold-200: var(--theme-accent-2, #E8D5B8);
  --blk-gold-100: color-mix(in srgb, var(--theme-site-bg, #F8F4EE) 85%, var(--theme-accent, #C9A876) 15%);

  /* Site-bg used for light section backgrounds (NOT surface which can be dark) */
  --blk-ivory:  var(--theme-site-bg, #F8F4EE);
  --blk-cream:  var(--theme-site-bg, #FAF7F2);
  --blk-white:  #FFFFFF;
  /* Ink = dark text for light backgrounds — use primary-3 (darkest brand shade) or fall back to near-black */
  --blk-ink:    var(--theme-primary-3, #1a1a1a);
  --blk-muted:  var(--theme-muted, #7A6E73);
  --blk-line:   var(--theme-border, #E8DFD3);

  /* Semantic */
  --blk-info-bg:    #F0E8F4;
  --blk-info-border:#6B4280;
  --blk-success-bg: #ECFDF5;
  --blk-success-border:#10B981;
  --blk-warning-bg: #F5EFE0;
  --blk-warning-border:#D97706;
  --blk-danger-bg:  #FEF2F2;
  --blk-danger-border:#EF4444;

  /* ── Typography ── */
  --blk-font-display: 'Cormorant Garamond', Georgia, serif;
  --blk-font-body:    'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  /* ── Spacing (8px base) ── */
  --blk-space-1:  0.5rem;   /*  8px */
  --blk-space-2:  1rem;     /* 16px */
  --blk-space-3:  1.5rem;   /* 24px */
  --blk-space-4:  2rem;     /* 32px */
  --blk-space-5:  2.5rem;   /* 40px */
  --blk-space-6:  3rem;     /* 48px */
  --blk-space-8:  4rem;     /* 64px */
  --blk-space-10: 5rem;     /* 80px */
  --blk-space-12: 6rem;     /* 96px */
  --blk-space-16: 8rem;     /* 128px */

  /* ── Radius ── */
  --blk-radius-sm: 6px;
  --blk-radius-md: 12px;
  --blk-radius-lg: 20px;
  --blk-radius-xl: 32px;
  --blk-radius-full: 9999px;

  /* ── Shadows ── */
  --blk-shadow-sm: 0 2px 8px rgba(45,27,61,0.06);
  --blk-shadow-md: 0 8px 24px rgba(45,27,61,0.10);
  --blk-shadow-lg: 0 20px 48px rgba(45,27,61,0.14);
  --blk-shadow-xl: 0 30px 64px rgba(45,27,61,0.18);

  /* ── Containers ── */
  --blk-container-narrow: 720px;
  --blk-container-normal: 1080px;
  --blk-container-wide:   1280px;

  /* ── Transitions ── */
  --blk-ease: cubic-bezier(0.4, 0, 0.2, 1);
  --blk-ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
}