/* Tech Bureau design tokens — the one place colours, type, spacing, shape and motion are defined.
   The main page (Aurora theme) and the Tradie Web Co. pages both consume these.
   Defaults are the dark Tech Bureau palette; a theme file overrides them via html[data-theme]. */

:root {
  /* ---- brand ---- */
  --brand-navy: #0d121f;
  --brand-navy-2: #1a202c;
  --brand-blue: #4878fa;
  --brand-violet: #9b6cff;

  /* ---- semantic colour (dark default) ---- */
  --color-bg: #0d121f;
  --color-bg-raised: #111829;
  --color-surface: #161d2e;
  --color-surface-2: #1a202c;
  --color-field: #1a202c;
  --color-fg: #f3f5f7;
  --color-fg-strong: #ffffff;
  --color-muted: #90a3bf;            /* 7.3:1 on --color-bg */
  --color-border: rgba(255, 255, 255, 0.08);
  --color-border-strong: rgba(255, 255, 255, 0.16);
  --color-glass: rgba(255, 255, 255, 0.035);

  --color-accent: #4878fa;           /* decorative accent: glows, borders, icons */
  --color-accent-fill: #3a67ee;      /* button fill: white text 4.8:1 */
  --color-accent-fill-hover: #2f5be0;
  --color-accent-text: #8aa8ff;      /* accent used as text on dark: 7.9:1 */
  --color-accent-soft: rgba(72, 120, 250, 0.12);
  --color-accent-rgb: 72, 120, 250;
  --color-on-accent: #ffffff;
  --color-ring: #8aa8ff;
  --color-danger: #ff8a8a;
  --color-success: #4ade80;

  /* "inverse" band: a section that is dark even on a light theme */
  --color-band-bg: #0d121f;
  --color-band-fg: #f3f5f7;
  --color-band-muted: #90a3bf;
  --color-band-surface: rgba(255, 255, 255, 0.06);
  --color-band-border: rgba(255, 255, 255, 0.12);

  /* ---- type ---- */
  --font: 'Plus Jakarta Sans', 'jakarta', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-base: 1rem;
  --text-lg: clamp(1.0625rem, 0.99rem + 0.3vw, 1.25rem);
  --text-xl: clamp(1.125rem, 1rem + 0.5vw, 1.375rem);
  --text-h3: clamp(1.125rem, 1.05rem + 0.4vw, 1.375rem);
  --text-h2: clamp(1.75rem, 1.4rem + 1.6vw, 2.75rem);
  --text-h1: clamp(2.25rem, 1.5rem + 3.2vw, 4.25rem);
  --text-stat: clamp(2rem, 1.6rem + 1.8vw, 3rem);
  --leading: 1.6;
  --tracking-tight: -0.02em;
  --tracking-wide: 0.12em;

  /* ---- space ---- */
  --space-1: 0.25rem; --space-2: 0.5rem; --space-3: 0.75rem; --space-4: 1rem;
  --space-5: 1.5rem; --space-6: 2rem; --space-7: 3rem; --space-8: 4rem; --space-9: 6rem;
  --section-y: clamp(3.5rem, 2.5rem + 4vw, 6.5rem);
  --container: 1200px;
  --gutter: clamp(1rem, 4vw, 2.5rem);

  /* ---- shape & effects ---- */
  --radius-sm: 10px;
  --radius: 16px;
  --radius-lg: 24px;
  --radius-pill: 999px;
  --blur: 16px;
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.25);
  --shadow: 0 20px 50px -30px rgba(0, 0, 0, 0.7);
  --shadow-accent: 0 12px 32px -12px rgba(var(--color-accent-rgb), 0.8);
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --dur-fast: 160ms;
  --dur: 240ms;
  --header-h: 68px;
}
