/* Dravik — Design Tokens
   Part of the Dravik design system. Loaded by functions.php (see enqueue order).
*/

/* ==========================================================================
   DRAVIK DESIGN TOKENS — single source of truth for the entire site
   Astra's palette (set in Customizer) maps to --ast-global-color-0..8.
   Everything below layers the Dravik system on top of it.
   ========================================================================== */

:root {
  /* --- Color aliases (mirror the Astra global palette) ------------------ */
  --dravik-accent: var(--ast-global-color-0, #9db8dc);   /* pale blue     */
  --dravik-steel:  var(--ast-global-color-1, #c7ccd6);   /* silver        */
  --dravik-heading: var(--ast-global-color-2, #ffffff);
  --dravik-text:   var(--ast-global-color-3, #dfe4ec);
  --dravik-ink:    var(--ast-global-color-4, #0e1117);   /* site bg       */
  --dravik-surface: var(--ast-global-color-5, #171d28);  /* cards         */
  --dravik-border: var(--ast-global-color-7, #2a3242);
  --dravik-text-dim: #9aa3b2;

  /* --- Derived aliases (v2.0 consolidation — single source for the "quiet
         card" recipe used by shop cards, pillars, accordions, policy cards,
         notices; previously duplicated as raw color-mix() in five files) --- */
  --dravik-surface-deep: color-mix(in srgb, var(--dravik-ink) 72%, black);
  --dravik-border-soft: color-mix(in srgb, var(--dravik-border) 60%, transparent);
  --dravik-border-hover: color-mix(in srgb, var(--dravik-accent) 28%, var(--dravik-border));

  /* --- Brand action color (approved Dravik blue — primary CTAs) --- */
  --dravik-blue: #2e7cf6;
  --dravik-blue-hover: color-mix(in srgb, #2e7cf6 85%, black);

  /* --- Typography scale (1.250 major third, 16px base) ------------------ */
  --dravik-text-xs: 0.8rem;      /* 12.8px  meta, captions              */
  --dravik-text-sm: 0.9rem;      /* 14.4px  small ui, labels            */
  --dravik-text-base: 1rem;      /* 16px    body                        */
  --dravik-text-lg: 1.25rem;     /* 20px    lead, h5                    */
  --dravik-text-xl: 1.563rem;    /* 25px    h4                          */
  --dravik-text-2xl: 1.953rem;   /* 31px    h3                          */
  --dravik-text-3xl: 2.441rem;   /* 39px    h2                          */
  --dravik-text-4xl: 3.052rem;   /* 49px    h1                          */
  --dravik-text-hero: clamp(3rem, 6vw, 4.5rem); /* homepage hero        */
  --dravik-leading-tight: 1.15;
  --dravik-leading-normal: 1.65;
  --dravik-tracking-wide: 0.18em; /* eyebrow / DRAVIK wordmark styling  */

  /* --- Spacing scale (4px grid) ----------------------------------------- */
  --dravik-space-1: 0.25rem;
  --dravik-space-2: 0.5rem;
  --dravik-space-3: 0.75rem;
  --dravik-space-4: 1rem;
  --dravik-space-6: 1.5rem;
  --dravik-space-8: 2rem;
  --dravik-space-12: 3rem;
  --dravik-space-16: 4rem;
  --dravik-space-24: 6rem;
  --dravik-section-pad: clamp(3rem, 8vw, 6rem);

  /* --- Radius ------------------------------------------------------------ */
  --dravik-radius-sm: 4px;    /* inputs, small chips     */
  --dravik-radius: 8px;       /* buttons, form fields    */
  --dravik-radius-lg: 14px;   /* cards, product cards    */
  --dravik-radius-full: 999px;

  /* --- Shadows (dark-theme tuned: subtle, never muddy) ------------------- */
  --dravik-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.35);
  --dravik-shadow: 0 4px 16px rgba(0, 0, 0, 0.35);
  --dravik-shadow-lg: 0 12px 40px rgba(0, 0, 0, 0.5);
  --dravik-glow-accent: 0 0 0 3px rgba(157, 184, 220, 0.22);

  /* --- Motion ------------------------------------------------------------ */
  --dravik-ease: cubic-bezier(0.22, 1, 0.36, 1);
  --dravik-duration-fast: 150ms;
  --dravik-duration: 250ms;
  --dravik-duration-slow: 400ms;

  /* --- Containers (Astra content widths set in Customizer: 1200px) ------- */
  --dravik-container: 1200px;
  --dravik-container-narrow: 760px;  /* long-form text pages */
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; }
}