/* ==========================================================================
   Adaptability Plus design tokens
   Single source of truth. Change the hue (332) here to re-skin the product.
   ========================================================================== */
:root {
  color-scheme: light;

  /* ---- Colour: neutrals (tinted 0.004-0.02 toward brand hue 332) ---- */
  --bg: oklch(1 0 0);
  --surface: oklch(0.975 0.004 332);
  --surface-2: oklch(0.955 0.006 332);
  --surface-3: oklch(0.93 0.008 332);
  --ink: oklch(0.20 0.02 332);
  --ink-2: oklch(0.30 0.02 332);
  --muted: oklch(0.46 0.02 332);
  --muted-2: oklch(0.58 0.015 332);
  --border: oklch(0.90 0.008 332);
  --border-strong: oklch(0.82 0.012 332);

  /* ---- Colour: brand ---- */
  --primary: oklch(0.42 0.14 332);
  --primary-strong: oklch(0.33 0.13 332);
  --primary-soft: oklch(0.95 0.025 332);
  --primary-soft-2: oklch(0.90 0.05 332);
  --primary-soft-3: oklch(0.82 0.08 332);
  --on-primary: oklch(0.99 0 0);

  --accent: oklch(0.80 0.14 75);
  --accent-strong: oklch(0.70 0.15 70);
  --accent-soft: oklch(0.96 0.04 80);
  --on-accent: oklch(0.20 0.03 60);

  --drench: oklch(0.17 0.03 332);
  --drench-2: oklch(0.23 0.04 332);
  --drench-3: oklch(0.30 0.05 332);
  --on-drench: oklch(0.97 0.005 332);
  --on-drench-muted: oklch(0.76 0.02 332);
  --drench-border: oklch(0.32 0.03 332);

  /* ---- Colour: semantic (states only, never decoration) ---- */
  --success: oklch(0.60 0.13 155);
  --success-soft: oklch(0.95 0.04 155);
  --success-ink: oklch(0.36 0.10 155);
  --warning: oklch(0.75 0.15 75);
  --warning-soft: oklch(0.96 0.05 80);
  --warning-ink: oklch(0.42 0.11 70);
  --danger: oklch(0.55 0.19 25);
  --danger-soft: oklch(0.95 0.04 25);
  --danger-ink: oklch(0.42 0.16 25);
  --info: oklch(0.55 0.12 250);
  --info-soft: oklch(0.95 0.03 250);
  --info-ink: oklch(0.40 0.11 250);

  /* ---- Colour: development levels (sequential ramp of the brand hue) ---- */
  --band-1: oklch(0.90 0.05 332);  /* Emerging */
  --band-2: oklch(0.75 0.10 332);  /* Developing */
  --band-3: oklch(0.55 0.14 332);  /* Established */
  --band-4: oklch(0.38 0.14 332);  /* Advanced */
  --band-1-ink: oklch(0.38 0.12 332);
  --band-2-ink: oklch(0.34 0.12 332);
  --band-3-ink: oklch(0.99 0 0);
  --band-4-ink: oklch(0.99 0 0);

  /* ---- Typography ---- */
  --font-display: "Bricolage Grotesque", "Geist", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-body: "Geist", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;

  /* Marketing scale (fluid, ratio ~1.25) */
  --fs-display: clamp(2.75rem, 1.6rem + 3.8vw, 5.25rem);
  --fs-h1: clamp(2.25rem, 1.5rem + 2.6vw, 4rem);
  --fs-h2: clamp(1.875rem, 1.35rem + 1.7vw, 2.875rem);
  --fs-h3: clamp(1.375rem, 1.15rem + 0.8vw, 1.875rem);
  --fs-h4: 1.25rem;
  --fs-lead: clamp(1.125rem, 1.05rem + 0.35vw, 1.3125rem);
  --fs-body: 1.0625rem;
  --fs-small: 0.9375rem;
  --fs-xs: 0.8125rem;

  /* Product scale (fixed rem, ratio 1.125) */
  --fs-app-h1: 1.625rem;
  --fs-app-h2: 1.25rem;
  --fs-app-h3: 1.0625rem;
  --fs-app-body: 0.9375rem;
  --fs-app-small: 0.8125rem;
  --fs-app-xs: 0.75rem;

  --lh-tight: 1.05;
  --lh-snug: 1.2;
  --lh-body: 1.6;
  --lh-relaxed: 1.7;

  --tracking-display: -0.03em;
  --tracking-heading: -0.02em;
  --tracking-ui: 0;

  /* ---- Spacing (4px base) ---- */
  --s-1: 0.25rem;
  --s-2: 0.5rem;
  --s-3: 0.75rem;
  --s-4: 1rem;
  --s-5: 1.5rem;
  --s-6: 2rem;
  --s-7: 3rem;
  --s-8: 4rem;
  --s-9: 5rem;
  --s-10: 6rem;
  --section: clamp(4.5rem, 3rem + 5vw, 8rem);
  --section-tight: clamp(3rem, 2rem + 3vw, 5rem);
  --gutter: clamp(1.25rem, 4vw, 2.5rem);

  --container: 1200px;
  --container-wide: 1400px;
  --container-narrow: 760px;
  --measure: 65ch;

  /* ---- Shape (locked: controls 10px, panels 16px, pills full) ---- */
  --r-ctl: 10px;
  --r-card: 16px;
  --r-lg: 24px;
  --r-pill: 999px;

  /* ---- Elevation (tinted to brand hue, never pure black) ---- */
  --shadow-1: 0 1px 2px oklch(0.20 0.03 332 / 0.06), 0 1px 3px oklch(0.20 0.03 332 / 0.05);
  --shadow-2: 0 4px 12px oklch(0.20 0.03 332 / 0.08), 0 1px 3px oklch(0.20 0.03 332 / 0.05);
  --shadow-3: 0 16px 40px oklch(0.20 0.04 332 / 0.14), 0 2px 6px oklch(0.20 0.03 332 / 0.06);
  --shadow-4: 0 32px 80px oklch(0.20 0.05 332 / 0.22), 0 4px 12px oklch(0.20 0.03 332 / 0.08);

  /* ---- Z-index scale ---- */
  --z-dropdown: 10;
  --z-sticky: 20;
  --z-backdrop: 30;
  --z-modal: 40;
  --z-toast: 50;
  --z-tooltip: 60;

  /* ---- Motion ---- */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-out-quart: cubic-bezier(0.25, 1, 0.5, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-1: 150ms;
  --dur-2: 250ms;
  --dur-3: 500ms;
  --dur-4: 900ms;

  /* ---- Layout: app shell ---- */
  --sidebar-w: 264px;
  --topbar-h: 64px;
  --header-h: 72px;
}
