/*!
 * Harvardbridge Automotives — design tokens
 * @version 1.1.0
 * Changelog:
 * 1.1.0 — Font files now ship with the theme, so the @font-face rules below resolve on a
 *         clean install rather than falling through to the system stack.
 * 1.0.0 — Initial build.
 *
 * Contrast ratios in the comments are measured, not estimated. Do not substitute a colour
 * without re-measuring: three of these values fail on the surface they are not paired with,
 * and the rules saying so are part of the token, not a suggestion.
 */

/* ------------------------------------------------------------------
   Fonts — self-hosted, woff2 only, swap so text is never invisible.
   The four files ship in assets/fonts/, subset to Latin: 54 KB for the
   set. The system stack below still catches the case where the folder
   fails to upload, so a broken deploy degrades rather than breaks.
   ------------------------------------------------------------------ */

@font-face {
	font-family: "Space Grotesk";
	src: url("../fonts/space-grotesk-500.woff2") format("woff2");
	font-weight: 500;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Space Grotesk";
	src: url("../fonts/space-grotesk-700.woff2") format("woff2");
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Inter";
	src: url("../fonts/inter-400.woff2") format("woff2");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Inter";
	src: url("../fonts/inter-600.woff2") format("woff2");
	font-weight: 600;
	font-style: normal;
	font-display: swap;
}

:root {
	/* Surfaces --------------------------------------------------- */
	--hba-obsidian: #0B0F14;   /* page background. never pure black */
	--hba-carbon: #161C24;     /* cards, surfaces */
	--hba-slate: #1E2732;      /* borders, raised surfaces */
	--hba-white: #FFFFFF;
	--hba-paper: #F4F6F8;      /* light sections */

	/* Text -------------------------------------------------------- */
	--hba-chrome: #E9EDF2;     /* 16.35:1 on obsidian — body text on dark */
	--hba-steel: #9BA7B4;      /* 7.85:1 on obsidian — muted on dark ONLY. 2.45:1 on white, never use on light */
	--hba-ink: #0B0F14;        /* body text on light surfaces */
	--hba-ink-muted: #46525F;  /* 8.05:1 on paper — the muted text for LIGHT surfaces */

	/* Accent ------------------------------------------------------ */
	--hba-solar: #F5B301;      /* 10.37:1 vs obsidian — CTA fill and large accents only */
	--hba-solar-text: #8A6200; /* 5.49:1 on white — the only amber permitted as text on light */
	--hba-on-cta: #0B0F14;     /* 10.37:1 on solar. white on solar is 1.85:1 and fails */

	/* Status — never colour alone, always icon + text label -------- */
	--hba-verified: #1FA971;        /* 6.38:1 on obsidian */
	--hba-verified-text: #0C7A4E;   /* 5.37:1 on white */
	--hba-alert: #E5675F;           /* 5.89:1 on obsidian */
	--hba-alert-text: #B3261E;      /* 6.54:1 on white */

	/* Type -------------------------------------------------------- */
	--hba-font-display: "Space Grotesk", "Archivo", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
	--hba-font-body: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
	--hba-font-mono: ui-monospace, "SFMono-Regular", "Roboto Mono", "DejaVu Sans Mono", monospace;

	--hba-step--1: clamp(0.82rem, 0.79rem + 0.15vw, 0.9rem);
	--hba-step-0: clamp(1rem, 0.96rem + 0.2vw, 1.08rem);
	--hba-step-1: clamp(1.18rem, 1.1rem + 0.4vw, 1.36rem);
	--hba-step-2: clamp(1.4rem, 1.26rem + 0.7vw, 1.75rem);
	--hba-step-3: clamp(1.7rem, 1.45rem + 1.2vw, 2.35rem);
	--hba-step-4: clamp(2.05rem, 1.6rem + 2.1vw, 3.2rem);
	--hba-step-5: clamp(2.5rem, 1.8rem + 3.4vw, 4.4rem);

	--hba-leading-tight: 1.1;
	--hba-leading-snug: 1.3;
	--hba-leading-body: 1.65;
	--hba-tracking-eyebrow: 0.18em;

	/* Space — a 4px base, so touch targets land on the grid -------- */
	--hba-space-2xs: 0.25rem;
	--hba-space-xs: 0.5rem;
	--hba-space-sm: 0.75rem;
	--hba-space-md: 1rem;
	--hba-space-lg: 1.5rem;
	--hba-space-xl: 2.25rem;
	--hba-space-2xl: 3.5rem;
	--hba-space-3xl: 5rem;

	/* Layout ------------------------------------------------------ */
	--hba-measure: 68ch;
	--hba-container: 74rem;
	--hba-container-narrow: 46rem;
	--hba-gutter: clamp(1rem, 4vw, 2.5rem);

	--hba-radius-sm: 4px;
	--hba-radius-md: 8px;
	--hba-radius-lg: 14px;
	--hba-radius-pill: 999px;

	--hba-border: 1px solid var(--hba-slate);
	--hba-border-light: 1px solid rgba(11, 15, 20, 0.12);

	--hba-shadow-raised: 0 1px 0 rgba(233, 237, 242, 0.05), 0 12px 32px rgba(0, 0, 0, 0.45);
	--hba-shadow-bar: 0 -8px 28px rgba(0, 0, 0, 0.5);

	/* Signature: the inspection light. A hard amber edge with a soft
	   falloff, the way a fluorescent tube reads in corrected paint. */
	--hba-lightbar: linear-gradient(90deg, transparent 0%, rgba(245, 179, 1, 0.85) 18%, rgba(245, 179, 1, 0.95) 50%, rgba(245, 179, 1, 0.85) 82%, transparent 100%);
	--hba-panel-sheen: radial-gradient(120% 70% at 50% 0%, rgba(233, 237, 242, 0.09) 0%, rgba(233, 237, 242, 0) 60%);

	/* Components -------------------------------------------------- */
	--hba-actionbar-h: 64px;
	--hba-tap: 48px;          /* minimum touch target */
	--hba-tap-lg: 56px;       /* action bar targets */
	--hba-focus: 3px solid var(--hba-solar);
	--hba-focus-offset: 2px;
	--hba-transition: 160ms cubic-bezier(0.2, 0, 0, 1);
}

@media (prefers-reduced-motion: reduce) {
	:root {
		--hba-transition: 1ms linear;
	}
}