/* =============================================================================
   RAS Cores — token overlay  (GENERATED by elementor-templates/seed-tokens.php)
   DO NOT EDIT BY HAND. Re-run the generator instead.
   -----------------------------------------------------------------------------
   The kit emits every --ras-* custom property on :root from post-18.css.
   This sheet adds the two things Variables cannot express:
     1. --ras-shadow (a shadow is not a colour/font/size Variable type)
     2. the DARK re-declaration of every colour token (04 §6.4)
   It loads AFTER the kit CSS, so these re-declarations win.
============================================================================= */

:root {
  --ras-shadow: 0 1px 3px rgba(0,0,0,0.08);
  --ras-canvas-explode: #f0efeb;
  --ras-explode-glow-base: 0.12;
  --ras-explode-cardbg: rgba(255,255,255,0.93);
}

/* Explicit choice — the header toggle writes html[data-ras-theme]. */
html[data-ras-theme="dark"] {
  --ras-copper: #d4a574;
  --ras-bg-page: #1a1e1e;
  --ras-bg-section: #202020;
  --ras-bg-section-alt: #1d1d1d;
  --ras-bg-card: #272d2d;
  --ras-bg-card-hover: #2e3434;
  --ras-bg-elevated: #2e2e2e;
  --ras-bg-surface: #242424;
  --ras-bg-surface-hover: #1a1a1a;
  --ras-bg-sticky: #191919;
  --ras-bg-timeline: #2a2e2e;
  --ras-bg-article-bottom: #2f2f2f;
  --ras-bg-article-card: rgba(62,62,62,0.5);
  --ras-bg-light-section: #e8e8e8;
  --ras-bg-stats: #daddd8;
  --ras-text-heading: #ffffff;
  --ras-text-body: #b0b0b0;
  --ras-text-muted: #9a9a9a;
  --ras-text-faint: #868484;
  --ras-border: rgba(255,255,255,0.1);
  --ras-border-subtle: #3e3e3e;
  --ras-border-card-light: #c0c0c0;
  --ras-tile-text: #a0a0a0;
  --ras-tile-active-text: #1a1a1a;
  --ras-card-white-bg: rgba(255,255,255,0.6);
  --ras-input-placeholder: rgba(255,255,255,0.4);
  --ras-shadow: none;
  --ras-canvas-explode: #0a0a0a;
  --ras-explode-glow-base: 0.25;
  --ras-explode-cardbg: rgba(0,0,0,0.82);
}

/* Device preference — guarded so an explicit "light" choice still wins. */
@media (prefers-color-scheme: dark) {
  html:not([data-ras-theme="light"]) {
    --ras-copper: #d4a574;
    --ras-bg-page: #1a1e1e;
    --ras-bg-section: #202020;
    --ras-bg-section-alt: #1d1d1d;
    --ras-bg-card: #272d2d;
    --ras-bg-card-hover: #2e3434;
    --ras-bg-elevated: #2e2e2e;
    --ras-bg-surface: #242424;
    --ras-bg-surface-hover: #1a1a1a;
    --ras-bg-sticky: #191919;
    --ras-bg-timeline: #2a2e2e;
    --ras-bg-article-bottom: #2f2f2f;
    --ras-bg-article-card: rgba(62,62,62,0.5);
    --ras-bg-light-section: #e8e8e8;
    --ras-bg-stats: #daddd8;
    --ras-text-heading: #ffffff;
    --ras-text-body: #b0b0b0;
    --ras-text-muted: #9a9a9a;
    --ras-text-faint: #868484;
    --ras-border: rgba(255,255,255,0.1);
    --ras-border-subtle: #3e3e3e;
    --ras-border-card-light: #c0c0c0;
    --ras-tile-text: #a0a0a0;
    --ras-tile-active-text: #1a1a1a;
    --ras-card-white-bg: rgba(255,255,255,0.6);
    --ras-input-placeholder: rgba(255,255,255,0.4);
    --ras-shadow: none;
    --ras-canvas-explode: #0a0a0a;
    --ras-explode-glow-base: 0.25;
    --ras-explode-cardbg: rgba(0,0,0,0.82);
  }
}

/* Card shadow — a var-driven box-shadow is not expressible in the atomic
   style schema, so the Global Class carries everything else and this rule
   carries the shadow. Dark mode ships no shadows by design. */
.elementor .ras-card { box-shadow: var(--ras-shadow); }

/* Page ground. */
body { background-color: var(--ras-bg-page); color: var(--ras-text-body); }