/* ============================================================
   Design tokens
   ============================================================ */
@font-face {
	font-family: "Figtree";
	src: url("../fonts/figtree/figtree-latin.woff2") format("woff2");
	font-weight: 300 900;
	font-style: normal;
	font-display: swap;
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+2000-206F, U+2074, U+20AC, U+2122, U+2212;
}
@font-face {
	font-family: "Figtree";
	src: url("../fonts/figtree/figtree-latin-ext.woff2") format("woff2");
	font-weight: 300 900;
	font-style: normal;
	font-display: swap;
	unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

:root {
	/* Brand */
	--blue: #1a9ed9;
	--blue-600: #1689bd;
	--blue-700: #1278a8;
	--navy: #273246;
	--navy-700: #1f2838;

	/* Ink / text */
	--ink: #273246;
	--body: #4b5563;
	--muted: #7a8593;
	--white: #ffffff;

	/* Surfaces */
	--bg: #ffffff;
	--tint: #d7e4f5;       /* light blue section (logistics) */
	--field-bg: #d7e4f5;   /* form inputs */
	--slate: #83a0a9;      /* category band, borders, top bar */
	--line: #83a0a9;       /* design uses slate for hairline borders */
	--error: #ff383c;

	/* Typography */
	--font: "Figtree", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;

	/* Layout */
	--container: 1440px;
	--gutter: 48px;
	--radius: 12px;
	--radius-sm: 0px;      /* design buttons are sharp-cornered */
	--radius-lg: 20px;

	/* Effects */
	--shadow-sm: 0 2px 8px rgba(39, 50, 70, .06);
	--shadow: 0 18px 50px rgba(39, 50, 70, .10);
	--ease: cubic-bezier(.22, .61, .36, 1);
	--header-h: 112px;
}