/* MakeSitePlan design tokens.
   Colours come from the logo (green #9BD505, navy #081119); type, radii and motion from design-direction.md.
   In the WordPress theme these become theme.json presets behind the Elementor-kit fallback chain (spec §6). */
:root {
  /* Colour */
  --msp-primary: #9BD505;          /* logo green. Fills only: never text on white (1.76:1) */
  --msp-secondary: #081119;        /* logo navy. Headings, dark sections, text on green (10.8:1) */
  --msp-secondary-2: #101D28;      /* raised surface on dark */
  --msp-text: #4F5A63;             /* body on white 7.06:1 */
  --msp-accent: #447000;           /* green ink for links/text on light 5.89:1 */
  --msp-bg: #FFFFFF;
  --msp-surface: #F4F6F7;
  --msp-surface-2: #EAEEF0;
  --msp-divider: #DDE2E5;
  --msp-muted: #5B6670;            /* meta text, 5.4:1 on surface */
  --msp-on-dark: #FFFFFF;
  --msp-on-dark-muted: #A7B0B8;    /* 8.6:1 on navy */
  --msp-on-dark-line: rgb(255 255 255 / .14);
  --msp-redline: #D43C2E;          /* reviewer markups only (illustrations, correction numbers) */

  /* Type */
  --msp-font: "Stack Sans Headline", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --msp-fs-display: clamp(2.75rem, 1.2rem + 6.6vw, 6.875rem);
  --msp-fs-h2: clamp(2rem, 1.1rem + 3.8vw, 4.625rem);
  --msp-fs-h2-alt: clamp(1.875rem, 1.1rem + 3.2vw, 4rem);
  --msp-fs-h3-lg: clamp(1.625rem, 1.2rem + 1.8vw, 2.75rem);
  --msp-fs-h3: clamp(1.5rem, 1.25rem + 1vw, 2.125rem);
  --msp-fs-h4: clamp(1.25rem, 1.15rem + .5vw, 1.5rem);
  --msp-fs-lead: clamp(1.0625rem, .95rem + .45vw, 1.25rem);
  --msp-fs-body: 1rem;
  --msp-fs-small: .875rem;

  /* Shape + space */
  --msp-radius-pill: 100px;
  --msp-radius-lg: 24px;
  --msp-radius-md: 18px;
  --msp-radius-sm: 14px;
  --msp-radius-xs: 10px;
  --msp-container: 1410px;
  --msp-gutter: clamp(16px, 3.5vw, 30px);
  --msp-section-y: clamp(4rem, 2rem + 8vw, 10rem);
  --msp-header-h: 88px;
  --msp-shadow-lg: 0 30px 80px -20px rgb(8 17 25 / .35);

  /* Motion */
  --msp-ease-out: cubic-bezier(.2, .7, .2, 1);
  --msp-ease-inout: cubic-bezier(.77, 0, .175, 1);
  --msp-dur-fast: .3s;
  --msp-dur-base: .5s;
  --msp-dur-slow: .9s;
}

@media (max-width: 1023px) {
  :root { --msp-header-h: 76px; }
}