/* tokens.css — runtime design tokens (FE + editor).
   Active subset from catalog via npm run tokens:sync.
   Full Figma catalog: figma-tokens-sync/generated/tokens.generated.css
   Site overlay source: assets/src/css/tokens.theme.css
   Do not edit this file directly. */

/* --- Primitives (from Figma _Primitives) --- */
:root {
  --primitive-blue-200: #BFDBFE;
  --primitive-blue-300: #93C5FD;
  --primitive-blue-50: #EFF6FF;
  --primitive-blue-500: #3B82F6;
  --primitive-blue-700: #1D4ED8;
  --primitive-blue-800: #1E40AF;
  --primitive-blue-950: #172554;
  --primitive-cloudy-dancer-200: #DCD7CC;
  --primitive-cyan-100: #E0F1F4;
  --primitive-cyan-200: #BBDFE6;
  --primitive-cyan-400: #7FB5C5;
  --primitive-cyan-500: #3A8AA0;
  --primitive-cyan-950: #0F2F42;
  --primitive-green-200: #BBF7D0;
  --primitive-green-400: #4ADE80;
  --primitive-green-50: #F0FDF4;
  --primitive-green-500: #22C55E;
  --primitive-green-600: #16A34A;
  --primitive-green-800: #166534;
  --primitive-green-950: #052E16;
  --primitive-neutral-200: #CFD1D2;
  --primitive-neutral-300: #ADB1B3;
  --primitive-neutral-400: #84898C;
  --primitive-neutral-50: #F5F6F6;
  --primitive-neutral-500: #696E71;
  --primitive-neutral-600: #595D61;
  --primitive-neutral-700: #4C5052;
  --primitive-neutral-800: #434547;
  --primitive-neutral-900: #3B3C3E;
  --primitive-neutral-950: #1C1D1E;
  --primitive-orange-200: #FECBAA;
  --primitive-orange-400: #FA763D;
  --primitive-orange-50: #FFF4ED;
  --primitive-orange-500: #EA5906;
  --primitive-orange-600: #E6370D;
  --primitive-orange-700: #C1260D;
  --primitive-orange-800: #992013;
  --primitive-orange-900: #7B1E13;
  --primitive-red-200: #FECACA;
  --primitive-red-300: #FCA5A5;
  --primitive-red-400: #F87171;
  --primitive-red-50: #FEF2F2;
  --primitive-red-500: #EF4444;
  --primitive-red-600: #DC2626;
  --primitive-red-700: #B91C1C;
  --primitive-red-800: #991B1B;
  --primitive-red-950: #450A0A;
  --primitive-white: #FFFFFF;
  --primitive-yellow-200: #FEF08A;
  --primitive-yellow-300: #FDE047;
  --primitive-yellow-50: #FEFCE8;
  --primitive-yellow-500: #EAB308;
  --primitive-yellow-600: #CA8A04;
  --primitive-yellow-700: #A16207;
  --primitive-yellow-800: #854D0E;
  --primitive-yellow-950: #422006;
}

/* --- Semantic tokens + spacing + radius (light mode) --- */
:root {
  --color-bg-brand-primary: var(--primitive-orange-500);
  --color-bg-brand-section: var(--primitive-orange-800);
  --color-bg-brand-solid: var(--primitive-orange-600);
  --color-bg-brand-solid-hover: var(--primitive-orange-700);
  --color-bg-error-solid: var(--primitive-red-600);
  --color-bg-primary-hover: var(--primitive-cloudy-dancer-200);
  --color-bg-secondary: var(--primitive-neutral-50);
  --color-bg-success-primary: var(--primitive-green-50);
  --color-bg-success-solid: var(--primitive-green-600);
  --color-bg-tertiary: var(--primitive-cyan-950);
  --color-bg-warning-solid: var(--primitive-yellow-600);
  --color-border-brand: var(--primitive-orange-500);
  --color-border-primary: var(--primitive-neutral-200);
  --color-border-secondary: var(--primitive-orange-200);
  --color-fg-primary: var(--primitive-neutral-900);
  --color-fg-success-primary: var(--primitive-green-600);
  --color-text-brand-primary: var(--primitive-orange-900);
  --color-text-brand-secondary: var(--primitive-orange-700);
  --color-text-brand-tertiary: var(--primitive-orange-600);
  --color-text-error-primary: var(--primitive-red-600);
  --color-text-placeholder: var(--primitive-neutral-500);
  --color-text-primary: var(--primitive-neutral-900);
  --color-text-secondary: var(--primitive-neutral-700);
  --color-text-secondary-hover: var(--primitive-neutral-800);
  --color-text-success-primary: var(--primitive-green-600);
  --color-text-tertiary: var(--primitive-neutral-600);
  --color-text-white: var(--primitive-white);
  --color-utility-blue-200: var(--primitive-blue-200);
  --color-utility-blue-50: var(--primitive-blue-50);
  --color-utility-blue-500: var(--primitive-blue-500);
  --color-utility-blue-700: var(--primitive-blue-700);
  --color-utility-green-200: var(--primitive-green-200);
  --color-utility-red-200: var(--primitive-red-200);
  --color-utility-red-50: var(--primitive-red-50);
  --color-utility-red-500: var(--primitive-red-500);
  --color-utility-red-700: var(--primitive-red-700);
  --color-utility-yellow-200: var(--primitive-yellow-200);
  --color-utility-yellow-50: var(--primitive-yellow-50);
  --color-utility-yellow-500: var(--primitive-yellow-500);
  --color-utility-yellow-700: var(--primitive-yellow-700);

  /* Spacing */
  --spacing-10xl: 8rem;
  --spacing-2xl: 1.25rem;
  --spacing-3xl: 1.5rem;
  --spacing-4xl: 2rem;
  --spacing-5xl: 2.5rem;
  --spacing-6xl: 3rem;
  --spacing-7xl: 4rem;
  --spacing-8xl: 5rem;
  --spacing-9xl: 6rem;
  --spacing-lg: 0.75rem;
  --spacing-md: 0.5rem;
  --spacing-sm: 0.375rem;
  --spacing-xl: 1rem;
  --spacing-xs: 0.25rem;
  --spacing-xxs: 0.125rem;

  /* Radius */
  --radius-full: 9999px;
  --radius-lg: 0.625rem;
  --radius-md: 0.5rem;
  --radius-sm: 0.375rem;

  /* Typography */
  --font-family-body: 'Google Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, sans-serif;
  --font-family-display: 'Google Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, sans-serif;
  --font-family-sans: 'Google Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, sans-serif;
}

/* --- Dark mode semantics --- */
@media (prefers-color-scheme: dark) {
  :root:not([data-color-scheme="light"]) {
  --color-bg-brand-primary: var(--primitive-orange-500);
  --color-bg-brand-section: var(--primitive-neutral-900);
  --color-bg-brand-solid: var(--primitive-orange-600);
  --color-bg-brand-solid-hover: var(--primitive-orange-500);
  --color-bg-error-solid: var(--primitive-red-600);
  --color-bg-primary: var(--primitive-neutral-950);
  --color-bg-primary-hover: var(--primitive-neutral-900);
  --color-bg-secondary: var(--primitive-neutral-900);
  --color-bg-success-primary: var(--primitive-green-950);
  --color-bg-success-solid: var(--primitive-green-600);
  --color-bg-tertiary: var(--primitive-neutral-800);
  --color-bg-warning-solid: var(--primitive-yellow-600);
  --color-border-brand: var(--primitive-orange-400);
  --color-border-primary: var(--primitive-neutral-700);
  --color-border-secondary: var(--primitive-neutral-800);
  --color-fg-primary: var(--primitive-white);
  --color-fg-success-primary: var(--primitive-green-500);
  --color-text-brand-primary: var(--primitive-neutral-50);
  --color-text-brand-secondary: var(--primitive-neutral-300);
  --color-text-brand-tertiary: var(--primitive-neutral-400);
  --color-text-error-primary: var(--primitive-red-400);
  --color-text-placeholder: var(--primitive-neutral-500);
  --color-text-primary: var(--primitive-neutral-50);
  --color-text-secondary: var(--primitive-neutral-300);
  --color-text-secondary-hover: var(--primitive-neutral-200);
  --color-text-success-primary: var(--primitive-green-400);
  --color-text-tertiary: var(--primitive-neutral-400);
  --color-text-white: var(--primitive-white);
  --color-utility-blue-200: var(--primitive-blue-800);
  --color-utility-blue-50: var(--primitive-blue-950);
  --color-utility-blue-500: var(--primitive-blue-500);
  --color-utility-blue-700: var(--primitive-blue-300);
  --color-utility-green-200: var(--primitive-green-800);
  --color-utility-red-200: var(--primitive-red-800);
  --color-utility-red-50: var(--primitive-red-950);
  --color-utility-red-500: var(--primitive-red-500);
  --color-utility-red-700: var(--primitive-red-300);
  --color-utility-yellow-200: var(--primitive-yellow-800);
  --color-utility-yellow-50: var(--primitive-yellow-950);
  --color-utility-yellow-500: var(--primitive-yellow-500);
  --color-utility-yellow-700: var(--primitive-yellow-300);
  }
}

[data-color-scheme="dark"] {
  --color-bg-brand-primary: var(--primitive-orange-500);
  --color-bg-brand-section: var(--primitive-neutral-900);
  --color-bg-brand-solid: var(--primitive-orange-600);
  --color-bg-brand-solid-hover: var(--primitive-orange-500);
  --color-bg-error-solid: var(--primitive-red-600);
  --color-bg-primary: var(--primitive-neutral-950);
  --color-bg-primary-hover: var(--primitive-neutral-900);
  --color-bg-secondary: var(--primitive-neutral-900);
  --color-bg-success-primary: var(--primitive-green-950);
  --color-bg-success-solid: var(--primitive-green-600);
  --color-bg-tertiary: var(--primitive-neutral-800);
  --color-bg-warning-solid: var(--primitive-yellow-600);
  --color-border-brand: var(--primitive-orange-400);
  --color-border-primary: var(--primitive-neutral-700);
  --color-border-secondary: var(--primitive-neutral-800);
  --color-fg-primary: var(--primitive-white);
  --color-fg-success-primary: var(--primitive-green-500);
  --color-text-brand-primary: var(--primitive-neutral-50);
  --color-text-brand-secondary: var(--primitive-neutral-300);
  --color-text-brand-tertiary: var(--primitive-neutral-400);
  --color-text-error-primary: var(--primitive-red-400);
  --color-text-placeholder: var(--primitive-neutral-500);
  --color-text-primary: var(--primitive-neutral-50);
  --color-text-secondary: var(--primitive-neutral-300);
  --color-text-secondary-hover: var(--primitive-neutral-200);
  --color-text-success-primary: var(--primitive-green-400);
  --color-text-tertiary: var(--primitive-neutral-400);
  --color-text-white: var(--primitive-white);
  --color-utility-blue-200: var(--primitive-blue-800);
  --color-utility-blue-50: var(--primitive-blue-950);
  --color-utility-blue-500: var(--primitive-blue-500);
  --color-utility-blue-700: var(--primitive-blue-300);
  --color-utility-green-200: var(--primitive-green-800);
  --color-utility-red-200: var(--primitive-red-800);
  --color-utility-red-50: var(--primitive-red-950);
  --color-utility-red-500: var(--primitive-red-500);
  --color-utility-red-700: var(--primitive-red-300);
  --color-utility-yellow-200: var(--primitive-yellow-800);
  --color-utility-yellow-50: var(--primitive-yellow-950);
  --color-utility-yellow-500: var(--primitive-yellow-500);
  --color-utility-yellow-700: var(--primitive-yellow-300);
}

/* --- Site overlay (tokens.theme.css) --- */
:root {
	--primitive-cyan-300: #8CC7D4;
	--color-bg-primary: var(--primitive-neutral-50);
	--radius-xl: 0.75rem;
	--radius-xs: 4px;
	--container-padding: clamp(1rem, 0.25rem + 2vw, 2rem);
	--content-width: var(--wp--custom--layout--content-max, var(--width-3xl));
	--header-height: var(--wp--custom--layout--header-height, 100px);
	--header-width: var(--wp--custom--layout--header-width, 83.75rem);
	--post-width: var(--wp--custom--layout--post-width, var(--paragraph-max-width));
	--spacing: var(--wp--custom--layout--spacing-unit, 0.25rem);
	--box-border-radius: var(--wp--custom--components--radius-box, var(--radius-lg));
	--avatar-border-radius: var(--wp--custom--components--avatar-radius, 50%);
	--o-chevron-icon: var(--wp--custom--icon--chevron, url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="%233B3C3E"><path d="M504-480 320-664l56-56 240 240-240 240-56-56 184-184Z"/></svg>'));
	--text-color: var(--color-text-primary);
	--primary-font: var(--font-family-body);
	--menu-desktop-bg-color: var(--color-bg-primary);
	--menu-desktop-link-color: var(--color-text-tertiary);
	--menu-mobile-link-color: var(--color-text-primary);
	--colour-menu-burger: var(--color-fg-primary);
	--button-primary-bg-color: var(--color-bg-brand-solid);
	--button-primary-label-color: var(--color-text-white);
	--color-button-contact-bg: var(--primitive-cyan-100);
	--color-button-contact-bg-hover: var(--primitive-cyan-200);
	--color-button-contact-border: var(--primitive-cyan-400);
	--color-button-contact-border-hover: var(--primitive-cyan-500);
	--color-button-contact-text: var(--primitive-cyan-950);
	--fs-100: var(--wp--preset--font-size--text-xs);
	--base-font-size: 16px;
}
