/* ==========================================================================
   Design tokens — Light This Nation (by Moksha Global)
   Warm premium canvas + orange accent, carried forward from the original brand.
   ========================================================================== */

:root {
  /* Surfaces */
  --canvas: #FBF7F0;          /* warm page background */
  --canvas-2: #FFFFFF;        /* cards / raised surfaces */
  --canvas-3: #F4EFE3;        /* alternating section band */
  --void: #0A0D12;            /* near-black brand dark */
  --void-2: #11161F;          /* lifted dark surface */

  /* Ink (text) */
  --ink: #0F1419;             /* primary text */
  --ink-2: #444C59;           /* secondary text (AA on canvas) */
  --ink-3: #5C636E;           /* muted — raised from original for AA */
  --on-dark: rgba(255, 255, 255, 0.92);
  --on-dark-2: rgba(255, 255, 255, 0.70);
  --on-dark-3: rgba(255, 255, 255, 0.60);

  /* Lines */
  --rule: rgba(15, 20, 25, 0.10);
  --rule-strong: rgba(15, 20, 25, 0.18);
  --rule-dark: rgba(255, 255, 255, 0.10);

  /* Accent — "color temperature" orange */
  --temp: #FF9A2B;
  --temp-2: #FFB04D;
  --temp-soft: rgba(255, 154, 43, 0.14);
  --temp-ink: #A8500F;        /* darker orange — AA text/links on light */
  --temp-glow: rgba(255, 154, 43, 0.55);

  /* Accent — cool counterpoint used sparingly for "5000K" cues */
  --cool: #6FA8FF;

  /* Shadows */
  --shadow-sm: 0 1px 3px rgba(15, 20, 25, 0.05);
  --shadow: 0 2px 6px rgba(15, 20, 25, 0.05), 0 14px 36px rgba(15, 20, 25, 0.08);
  --shadow-lg: 0 30px 70px rgba(15, 20, 25, 0.18);
  --shadow-temp: 0 16px 40px rgba(255, 154, 43, 0.28);

  /* Radii */
  --r-sm: 8px;
  --r: 12px;
  --r-lg: 18px;
  --r-xl: 26px;

  /* Layout */
  --max: 1240px;
  --pad: clamp(20px, 4.5vw, 72px);
  --gutter: clamp(16px, 2.4vw, 28px);

  /* Type families */
  --f-display: "Space Grotesk", "Segoe UI", system-ui, sans-serif;
  --f-body: "Inter", "Segoe UI", system-ui, sans-serif;
  --f-mono: "JetBrains Mono", ui-monospace, "Cascadia Mono", monospace;

  /* Type scale */
  --t-eyebrow: clamp(11px, 0.8vw, 12px);
  --t-lede: clamp(16px, 1.2vw, 19px);

  /* Motion */
  --ease: cubic-bezier(0.22, 0.61, 0.36, 1);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);

  /* Sticky mobile bar height (used to pad the page bottom on small screens) */
  --mobilebar-h: 64px;

  color-scheme: light;
}