/* Bunzl Tech design system — vendored tokens.
   Source: claude.ai/design project "Bunzl Tech Design System"
   (tokens/{fonts,colors,typography,spacing,radius,shadows,motion,base}.css),
   concatenated into one file because Propshaft does not fingerprint @import
   paths. `stylesheet_link_tag :app` links every stylesheet in this directory,
   so this file needs no tag of its own.
   Do not hand-edit: re-pull from the design system instead. */

@import url("https://fonts.googleapis.com/css2?family=Geist:wght@100..900&family=Geist+Mono:wght@100..900&display=swap");

:root {
  /* colors */
  --hsl-background: 0 0% 100%;
  --hsl-foreground: 222 47% 11%;
  --hsl-card: 0 0% 100%;
  --hsl-primary: 208 100% 17%;      /* #002F57 — logo blue */
  --hsl-primary-foreground: 0 0% 98%;
  --hsl-hero: 208 100% 17%;
  --hsl-secondary: 240 4.8% 95.9%;
  --hsl-muted: 240 4.8% 95.9%;
  --hsl-muted-foreground: 215 19% 35%;
  --hsl-destructive: 0 84.2% 60.2%;
  --hsl-border: 240 5.9% 90%;
  --hsl-input: 240 5.9% 90%;
  --hsl-ring: 240 10% 3.9%;

  --color-background: hsl(var(--hsl-background));
  --color-foreground: hsl(var(--hsl-foreground));
  --color-primary: hsl(var(--hsl-primary));
  --color-primary-foreground: hsl(var(--hsl-primary-foreground));
  --color-hero: hsl(var(--hsl-hero));
  --color-card: hsl(var(--hsl-card));
  --color-secondary: hsl(var(--hsl-secondary));
  --color-muted: hsl(var(--hsl-muted));
  --color-muted-foreground: hsl(var(--hsl-muted-foreground));
  --color-destructive: hsl(var(--hsl-destructive));
  --color-border: hsl(var(--hsl-border));
  --color-input: hsl(var(--hsl-input));
  --color-ring: hsl(var(--hsl-ring));
  --color-brand-blue: #002f57;
  --color-brand-black: #000000;
  --color-brand-white: #ffffff;
  --color-hero-deep: #001c33;
  --color-brand-tint-1: #eef2f6;
  --color-brand-tint-2: #dbe4ec;
  --color-brand-tint-3: #94aec5;
  --color-neutral-300: #d4d4d4;
  --color-neutral-500: #737373;
  --color-neutral-950: #0a0a0a;

  --surface-page: var(--color-background);
  --surface-card: var(--color-card);
  --surface-band: hsl(var(--hsl-muted) / 0.3);
  --text-body: var(--color-foreground);
  --text-muted: var(--color-muted-foreground);
  --text-on-primary: var(--color-primary-foreground);
  --border-default: var(--color-border);
  --border-field: var(--color-neutral-300);
  --focus-ring: var(--color-ring);
  --header-scrim: hsl(0 0% 100% / 0.9);

  /* typography */
  --font-sans: "Geist", "Geist Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: "Geist Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
  --text-xs: 0.75rem; --text-sm: 0.875rem; --text-base: 1rem; --text-lg: 1.125rem;
  --text-xl: 1.25rem; --text-2xl: 1.5rem; --text-3xl: 1.875rem; --text-4xl: 2.25rem;
  --leading-tight: 1.25; --leading-normal: 1.5; --leading-relaxed: 1.625;
  --weight-normal: 400; --weight-medium: 500; --weight-semibold: 600; --weight-bold: 700;
  --tracking-tight: -0.025em; --tracking-normal: 0; --tracking-wide: 0.025em;
  --type-eyebrow-weight: var(--weight-medium);
  --type-wordmark-transform: uppercase;
  --type-nav-transform: uppercase;

  /* spacing */
  --space-1: 0.25rem; --space-2: 0.5rem; --space-3: 0.75rem; --space-4: 1rem;
  --space-5: 1.25rem; --space-6: 1.5rem; --space-8: 2rem; --space-12: 3rem;
  --space-16: 4rem;
  --container-max: 80rem;
  --container-padding: 2rem;
  --header-height: 6rem;

  /* radius */
  --radius: 0.5rem;
  --radius-md: calc(var(--radius) - 2px);
  --radius-sm: calc(var(--radius) - 4px);
  --radius-2xl: 1rem;
  --radius-full: 9999px;
  --radius-button: 0.25rem;   /* Tailwind `rounded` = 4px, not --radius */
  --radius-field: var(--radius-md);
  --radius-card: var(--radius-2xl);

  /* shadows — the brand is flat; --shadow-sm is the only elevation it allows */
  --shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);
  --ring-focus: 0 0 0 1px var(--focus-ring);
  --ring-field: 0 0 0 4px hsl(var(--hsl-foreground) / 0.05);
  --blur-header: 24px;

  /* motion */
  --ease-out-quint: cubic-bezier(0.33, 1, 0.68, 1);
  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1);
  --duration-instant: 150ms;
  --duration-fast: 200ms;
  --duration-medium: 300ms;
  --opacity-disabled: 0.5;
  --hover-mix: 0.9;
}