/* SolarPrograms.com — Design Tokens
   One canonical :root block. No hardcoded hex anywhere else.
   Text on dark: --ivory (never pure white).
   One accent: --accent (solar amber).
   Updated by editing this file only.
*/

:root {
  /* === COLOUR === */
  --ink:         #1a1a1a;       /* near-black body text */
  --ink-2:       #4a4a4a;       /* secondary text */
  --ink-3:       #767676;       /* tertiary / caption */
  --ivory:       #f8f6f1;       /* text on dark surfaces */
  --bg:          #ffffff;       /* page background */
  --bg-2:        #f5f4f0;       /* subtle alternate rows */
  --bg-dark:     #161614;       /* dark bands */
  --bg-dark-2:   #1f1f1c;       /* dark card bg */
  --accent:      #e8900a;       /* solar amber — one accent */
  --accent-dim:  #7a4d07;       /* accent on dark bg */
  --accent-pale: #fdf2de;       /* tint for badges */
  --line:        #e0ddd7;       /* hairline borders */
  --line-dark:   #2e2e2a;       /* borders on dark */
  --focus:       #e8900a;       /* 3px focus ring */
  --danger:      #c0392b;       /* error states */
  --success:     #2e7d32;       /* success states */

  /* === TYPOGRAPHY === */
  --font-sans: "Satoshi", "Inter", system-ui, -apple-system, BlinkMacSystemFont,
               "SF Pro Text", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-mono: "JetBrains Mono", "Fira Code", "Cascadia Code", ui-monospace,
               "Courier New", monospace;

  /* Type scale — fluid between 390px and 1280px */
  --step--1: clamp(0.75rem,  0.70rem + 0.27vw, 0.875rem);
  --step-0:  clamp(0.9375rem, 0.88rem + 0.31vw, 1.0625rem);
  --step-1:  clamp(1.125rem, 1.02rem + 0.54vw, 1.375rem);
  --step-2:  clamp(1.35rem,  1.19rem + 0.84vw, 1.75rem);
  --step-3:  clamp(1.62rem,  1.36rem + 1.3vw, 2.25rem);
  --step-4:  clamp(1.95rem,  1.56rem + 2.0vw, 2.875rem);
  --step-5:  clamp(2.34rem,  1.76rem + 2.9vw, 3.625rem);

  --leading-tight:  1.15;
  --leading-snug:   1.35;
  --leading-normal: 1.6;
  --tracking-tight: -0.025em;
  --tracking-snug:  -0.015em;
  --tracking-wide:  0.06em;
  --tracking-wider: 0.1em;

  /* === SPACING (8px base grid) === */
  --sp-1:  0.25rem;   /*  4px */
  --sp-2:  0.5rem;    /*  8px */
  --sp-3:  0.75rem;   /* 12px */
  --sp-4:  1rem;      /* 16px */
  --sp-5:  1.25rem;   /* 20px */
  --sp-6:  1.5rem;    /* 24px */
  --sp-8:  2rem;      /* 32px */
  --sp-10: 2.5rem;    /* 40px */
  --sp-12: 3rem;      /* 48px */
  --sp-16: 4rem;      /* 64px */
  --sp-20: 5rem;      /* 80px */
  --sp-24: 6rem;      /* 96px */
  --sp-32: 8rem;      /* 128px */

  /* === LAYOUT === */
  --maxw:        1140px;
  --gutter:      clamp(1rem, 4vw, 2rem);
  --header-h:    60px;

  /* === RADII === */
  --r-sm:   8px;
  --r-md:  14px;
  --r-lg:  22px;
  --r-full: 999px;

  /* === SHADOWS === */
  --shadow-xs:  0 1px 2px rgba(0,0,0,0.06);
  --shadow-sm:  0 2px 6px rgba(0,0,0,0.08), 0 1px 2px rgba(0,0,0,0.04);
  --shadow-md:  0 8px 24px rgba(0,0,0,0.10), 0 2px 6px rgba(0,0,0,0.06);
  --shadow-lg:  0 20px 60px rgba(0,0,0,0.14), 0 4px 12px rgba(0,0,0,0.08);

  /* === MOTION === */
  --ease-out:    cubic-bezier(0.0, 0.0, 0.2, 1.0);
  --ease-in-out: cubic-bezier(0.4, 0.0, 0.2, 1.0);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1.0);

  --dur-micro: 160ms;
  --dur-state: 280ms;
  --dur-enter: 520ms;

  /* === Z-INDEX === */
  --z-base:    1;
  --z-raised:  10;
  --z-overlay: 100;
  --z-modal:   200;
  --z-header:  300;
  --z-toast:   400;
}
