/* ============================================================
   Design tokens - New Energy Products Site
   Per docs/design-taste-guideline.md (taste-skill v2 aligned)
   Aesthetic: Industrial Precision - neutral zinc + solar amber
   Shape rule (documented): cards 0px · buttons/inputs 4px
   ============================================================ */

:root {
  /* ---- Type scale ---- */
  --text-display: clamp(2.75rem, 5.5vw, 4.25rem);
  --text-h1: clamp(2rem, 4vw, 3rem);
  --text-h2: clamp(1.5rem, 3vw, 2.125rem);
  --text-h3: 1.25rem;
  --text-body: 1rem;
  --text-body-lg: 1.0625rem;
  --text-sm: 0.875rem;
  --text-caption: 0.8125rem;

  --leading-tight: 1.06;
  --leading-snug: 1.32;
  --leading-body: 1.65;

  --tracking-tight: -0.025em;
  --tracking-label: 0.16em;

  /* ---- Fonts (self-hosted, see fonts.css) ---- */
  --font-sans: "Geist Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", "Helvetica Neue", sans-serif;
  --font-mono: "Geist Mono", ui-monospace, "SF Mono", "Cascadia Code", Consolas, monospace;

  /* ---- Light palette ---- */
  --bg: #FAFAF9;
  --surface: #FFFFFF;
  --surface-2: #F5F5F4;
  --ink: #1C1C1F;
  --ink-dim: #52525B;
  --ink-mute: #63636B;
  --line: rgba(28, 28, 31, 0.12);
  --accent: #F59E0B;          /* solar amber - the single accent */
  --accent-strong: #B45309;   /* accent used as text on light bg */
  --accent-soft: #FEF3C7;     /* accent tint fill */

  /* Light bands (competitor-aligned: light-first, dark footer only) */
  --band-soft: #F5F5F4;       /* light gray band (stats, sub-bands) */
  --band-tint: #FFF8E7;       /* amber tint band (CTA) */
  --hero-glow: rgba(245, 158, 11, 0.10); /* hero ambient glow */
  --ok: #059669;              /* semantic only: safety / positive states */

  /* ---- Dark palette (technical sections) ---- */
  --bg-dark: #0B0B0D;
  --surface-dark: #131316;
  --surface-2-dark: #1A1A1E;
  --ink-dark: #F7F7F5;
  --ink-dim-dark: #A1A1AA;
  --line-dark: rgba(247, 247, 245, 0.14);
  --accent-dark: #FBBF24;

  /* ---- Spacing scale (4px base) ---- */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-9: 96px;

  /* ---- Layout ---- */
  --container: 1280px;
  --section-pad: clamp(4rem, 8vw, 7rem);
  --nav-h: 64px;

  /* ---- Shape (documented rule) ---- */
  --radius-card: 0px;
  --radius-control: 4px;

  /* ---- Motion ---- */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --dur: 0.18s;
}