/* Al-Maidah design tokens. Colours from the menu card: sign yellow, ink, brand teal.
   Contrast (WCAG): ink on yellow 13.4:1 · teal on yellow 5.0:1 · white on teal 6.0:1 ·
   muted on cream 6.9:1 · cream on ink 16:1. Never put yellow text on cream/white. */

@font-face {
	font-family: "Roboto Slab";
	src: url("../fonts/roboto-slab-var.woff2") format("woff2");
	font-weight: 400 900;
	font-display: swap;
}

@font-face {
	font-family: "DM Sans";
	src: url("../fonts/dm-sans-var.woff2") format("woff2");
	font-weight: 400 800;
	font-display: swap;
}

:root {
	--yellow: #ffed00;
	--yellow-hi: #fff35c;
	--yellow-soft: #fff8b8;
	--ink: #231f20;
	--ink-2: #383234;
	--ink-3: #4a4446;
	--cream: #fffcee;
	--paper: #ffffff;
	--teal: #146c81;
	--teal-dark: #0d5465;
	--teal-soft: #e4f2f5;
	--wa: #0f7a40; /* white on it 5.4:1 (stock WhatsApp green fails AA) */
	--wa-dark: #0a5e31;
	--muted: #5b5456;
	--line: rgb(35 31 32 / 0.14);
	--line-strong: rgb(35 31 32 / 0.3);
	--ok: #11823b;
	--bad: #b42318;

	--f-head: "Roboto Slab", Rockwell, "Courier New", serif;
	--f-body: "DM Sans", system-ui, -apple-system, "Segoe UI", sans-serif;

	--fs-xs: 0.8125rem;
	--fs-sm: 0.9375rem;
	--fs-md: 1.0625rem;
	--fs-lg: 1.25rem;
	--fs-xl: clamp(1.5rem, 1.2rem + 1vw, 1.875rem);
	--fs-2xl: clamp(1.9rem, 1.4rem + 2.2vw, 3rem);
	--fs-3xl: clamp(2.8rem, 1.8rem + 5vw, 5.6rem);

	--sp-1: 0.25rem;
	--sp-2: 0.5rem;
	--sp-3: 0.75rem;
	--sp-4: 1rem;
	--sp-5: 1.5rem;
	--sp-6: 2rem;
	--sp-7: 3rem;
	--sp-8: clamp(3.5rem, 2.5rem + 4vw, 6rem);

	--r-sm: 8px;
	--r-md: 14px;
	--r-lg: 22px;
	--r-pill: 999px;

	--shadow-1: 0 1px 2px rgb(35 31 32 / 0.08), 0 2px 8px rgb(35 31 32 / 0.06);
	--shadow-2: 0 10px 30px -10px rgb(35 31 32 / 0.35);
	--shadow-pop: 6px 6px 0 var(--ink);

	--wrap: 1200px;
	--gutter: clamp(16px, 4vw, 32px);
	--header-h: 72px;
	--ease: cubic-bezier(0.2, 0.8, 0.2, 1);
}