/* ==========================================================================
   CyprusBites, Public design tokens ("Sea & Citrus" direction)
   Single source of truth for the visitor-facing site. Feature code uses
   the semantic aliases only. Distinct identity from the admin pack.
   ========================================================================== */

@font-face {
	font-family: "Bricolage Grotesque";
	src: url("../fonts/BricolageGrotesque.woff2") format("woff2");
	font-weight: 200 800;
	font-style: normal;
	font-display: swap;
	/* Bricolage's Greek and Cyrillic accents render broken (the tonos on
	   large bold headings detaches). Scope this face to LATIN so Greek/Cyrillic
	   headings fall through --font-display to Inter/system, which render them
	   correctly, matching the body text. Latin headings are unchanged. */
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0100-017F, U+0180-024F, U+1E00-1EFF, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* Inter is scoped to Latin (like Bricolage below): Greek and Cyrillic fall
   through to the reliable Helvetica/Arial system stack in --font-body/--display,
   which ship on every OS with correct Greek accents. */
@font-face { font-family: "Inter"; src: url("../fonts/Inter-Regular.woff2") format("woff2"); font-weight: 400; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0100-017F, U+0180-024F, U+1E00-1EFF, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Inter"; src: url("../fonts/Inter-Medium.woff2") format("woff2"); font-weight: 500; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0100-017F, U+0180-024F, U+1E00-1EFF, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Inter"; src: url("../fonts/Inter-SemiBold.woff2") format("woff2"); font-weight: 600; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0100-017F, U+0180-024F, U+1E00-1EFF, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Inter"; src: url("../fonts/Inter-Bold.woff2") format("woff2"); font-weight: 700; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0100-017F, U+0180-024F, U+1E00-1EFF, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

/* Better kerning everywhere; never fake a weight (so Greek in Arial uses its real
   bold instead of a synthetic extra-bold that mangles the accents). */
html { font-kerning: normal; text-rendering: optimizeLegibility; font-synthesis: none; }

:root {
	/* Primitives, sea-washed neutrals */
	--wash-0: #FBFCFB;
	--wash-50: #F3F6F5;
	--wash-100: #E9EFED;
	--wash-200: #D8E2DF;
	--wash-300: #BCCCC8;

	/* Deep petrol ink */
	--petrol-950: #10282C;
	--petrol-800: #1C4046;
	--petrol-600: #2E5F63;
	--petrol-500: #40777A;

	/* Action teal */
	--teal-600: #0E6E68;
	--teal-700: #0A5A55;
	--teal-100: #DDEEEC;

	/* Bougainvillea, MATCH RING ONLY (the signature; never decoration) */
	--bloom-600: #CE3D6E;
	--bloom-100: #FBE6EE;

	/* Citrus, offers, stars, small delights */
	--citrus-500: #F0A72C;
	--citrus-100: #FCF0DA;

	/* Status */
	--good-600: #217447;
	--good-100: #E4F2E8;
	--warn-600: #8F620D;
	--warn-100: #F9EFD9;
	--bad-600: #C3352B;

	/* Semantic aliases, what feature code uses */
	--bg-page: var(--wash-50);
	--bg-card: #FFFFFF;
	--bg-dip: var(--wash-100);
	--bg-ink: var(--petrol-950);   /* footer + hero band */
	--ink: var(--petrol-950);
	--ink-soft: #47605E;
	--ink-faint: #6E8482;
	--ink-on-dark: #F2F7F6;
	--ink-on-dark-soft: #A9C0BD;
	--line: var(--wash-200);
	--line-strong: var(--wash-300);
	--act: var(--teal-600);
	--act-hover: var(--teal-700);
	--act-wash: var(--teal-100);
	--match: var(--bloom-600);
	--match-wash: var(--bloom-100);
	--sun: var(--citrus-500);
	--sun-wash: var(--citrus-100);

	/* Type */
	/* Latin uses the brand faces; Greek and Cyrillic fall to a reliable
	   Helvetica/Arial system stack (real precomposed accents + real bold weights,
	   predictable on Windows, macOS, Android and iOS). */
	--font-display: "Bricolage Grotesque", "Helvetica Neue", Helvetica, Arial, sans-serif;
	--font-body: "Inter", "Helvetica Neue", Helvetica, Arial, sans-serif;

	--fs-xs: 0.75rem;    /* 12, meta, stamps */
	--fs-sm: 0.8125rem;  /* 13, chips, help */
	--fs-base: 0.9375rem;/* 15, body */
	--fs-md: 1.0625rem;  /* 17, lead */
	--fs-lg: 1.25rem;    /* 20, card titles */
	--fs-xl: 1.625rem;   /* 26, section heads */
	--fs-hero: clamp(2.1rem, 6.5vw, 3.6rem);
	/* Article and page headlines (v5.85). These were referenced by the blog,
	   CMS pages, SEO landings and the party sheets but never defined, so the
	   whole font-size declaration was invalid and every one of those titles
	   fell back to body text. A published guide had a 15px headline. */
	--fs-2xl: clamp(1.9rem, 4.6vw, 2.6rem);

	/* Space (4px scale) */
	--sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px;
	--sp-5: 20px; --sp-6: 24px; --sp-7: 28px; --sp-8: 32px; --sp-10: 40px; --sp-12: 48px; --sp-14: 56px;

	/* Shape & shadow, chunky, friendly */
	--r-sm: 8px;
	--r-md: 14px;
	--r-lg: 20px;
	--r-xl: 28px;
	--r-pill: 999px;
	--shadow-card: 0 1px 2px rgba(16, 40, 44, 0.06), 0 6px 20px -8px rgba(16, 40, 44, 0.10);
	--shadow-pop: 0 12px 36px -10px rgba(16, 40, 44, 0.25);
	--ring: 0 0 0 3px rgba(14, 110, 104, 0.28);

	--page-max: 1280px;
}
