/**
 * Design tokens extracted from the Figma file "ПРОЖЕКТОР"
 * (colors read from the Home/Team/Contacts/FAQ frames' "Selection colors"
 * panel; type + button specs read from the actual text/button layers).
 */

:root {
	/* Colors */
	--color-primary: #275cac;
	--color-primary-hover: #1e4886;
	--color-text: #212227;
	--color-text-soft: rgba(33, 34, 39, 0.65);
	--color-text-faint: rgba(33, 34, 39, 0.24);
	--color-tint: #e3ebfe;
	--color-tint-strong: #bad6ff;
	--color-surface-100: #f5f5f5;
	--color-surface-200: #f0f0f0;
	--color-white: #ffffff;
	--color-black: #000000;
	--color-overlay: rgba(0, 0, 0, 0.4);
	--color-overlay-soft: rgba(0, 0, 0, 0.08);
	--color-accent: #ff0033;

	/* Typography */
	--font-head: "e-Ukraine Head", "Montserrat", "Helvetica Neue", Arial, sans-serif;
	--font-body: "e-Ukraine", "Inter", "Helvetica Neue", Arial, sans-serif;
	/* Figma sets the Feature Cards eyebrow + list numerals in "Geist Mono",
	   which isn't one of the two typefaces this theme ships (see fonts.css) —
	   kept as a system monospace fallback stack rather than bundling a third
	   font family for two small accents. */
	--font-mono: "Geist Mono", ui-monospace, "SF Mono", "Cascadia Code", Menlo, Consolas, monospace;

	/* fs-h1 is only consumed by .hero__title. Figma flattened that layer to
	   vector outlines (bbox 1163x122px at the 1920 frame), so the size below
	   is back-calculated from that bounding box rather than read off a live
	   text layer — treat it as a close estimate, not an exact figure. */
	--fs-h1: clamp(2.75rem, 3rem + 6.25vw, 10.5rem);
	--fs-h2: clamp(2rem, 1.5rem + 2.2vw, 3.75rem);
	--fs-h3: clamp(1.5rem, 1.25rem + 1vw, 2rem);
	--fs-h4: clamp(1.25rem, 1.1rem + 0.5vw, 1.5rem);
	--fs-body-lg: 1.125rem;
	--fs-body: 1rem;
	--fs-small: 0.875rem;
	--fs-tiny: 0.75rem;

	/* fs-stat is only consumed by .stat__value (Stats block big numbers).
	   Figma «Home» frame (106:92), "numbers" row: the value layers are a
	   flat 80px Geist Medium — its own scale, distinct from the heading
	   tokens above, so it gets a dedicated fluid clamp rather than reusing
	   fs-h2. Plateaus at 5rem (80px), i.e. the raw Figma size, matching how
	   fs-h2 (60px) and the CTA title (50px) also keep their literal px. */
	--fs-stat: clamp(1.875rem, 0.875rem + 5vw, 5rem);

	--lh-heading: 1.2;
	--lh-body: 1.3;

	/* Radius */
	--radius-pill: 999px;
	--radius-lg: 24px;
	--radius-md: 16px;
	--radius-sm: 8px;

	/* Spacing scale */
	--space-1: 0.25rem;
	--space-2: 0.5rem;
	--space-3: 0.75rem;
	--space-4: 1rem;
	--space-5: 1.5rem;
	--space-6: 2rem;
	--space-7: 3rem;
	--space-8: 4rem;
	--space-9: 6rem;
	--space-10: 8rem;

	/* Layout */
	--container-max: 1240px;
	--container-pad: clamp(20px, 4vw, 64px);
	--header-height: 80px;

	/* Motion */
	--ease: cubic-bezier(0.4, 0, 0.2, 1);
	--duration: 200ms;

	/* Shadows */
	--shadow-card: 0 4px 24px rgba(33, 34, 39, 0.08);
	--shadow-menu: 0 24px 48px rgba(33, 34, 39, 0.18);
}