@font-face {
	font-family: 'Sofia Sans';
	font-style: normal;
	font-weight: 400 700;
	font-display: swap;
	src: url('../fonts/sofia-sans-cyrillic.woff2') format('woff2');
	unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
	font-family: 'Sofia Sans';
	font-style: normal;
	font-weight: 400 700;
	font-display: swap;
	src: url('../fonts/sofia-sans-latin.woff2') format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
		U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122,
		U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
	font-family: 'Sofia Sans Fallback';
	font-style: normal;
	font-weight: 400;
	src: local('Arial'), local('Helvetica Neue'), local('Roboto'), local('Segoe UI');
	size-adjust: 97%;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; }
h1, h2, h3, h4, p, figure, blockquote { margin: 0; }
ul, ol { margin: 0; padding: 0; }
img, svg, picture { display: block; max-width: 100%; }
img { height: auto; }
button, input, select, textarea { font: inherit; color: inherit; }
a { color: var(--c-link); }
a:hover { color: var(--c-link-hover); }

[hidden] { display: none !important; }

:root {

	--c-brand: #fbad03;
	--c-brand-dim: #dd9803;
	--c-ink-deep: #0547dc;
	--c-ink-deep-2: #1c56d8;
	--c-ink-deepest: #062f8f;
	--c-on-brand: #1a1200;
	--c-link: #0440c2;
	--c-link-hover: #0334a0;
	--c-shadow-tint: 5 71 220;
	--c-hero-glow: rgba(251, 173, 3, .16);

	--c-page: #ffffff;
	--c-surface: #ffffff;
	--c-surface-2: #f4f6fa;
	--c-surface-3: #e7ecf4;
	--c-ink: #1f2a3c;
	--c-ink-muted: #55637a;
	--c-border: #d7deea;
	--c-border-strong: #77869e;
	--c-on-dark: #ffffff;
	--c-on-dark-muted: #c9d6ea;
	--c-focus-on-dark: #ffd84d;
	--c-danger: #b3261e;
	--c-danger-surface: #fdecea;
	--c-danger-ink: #8c1d18;
	--c-success: #0d6b3f;
	--c-success-surface: #e8f5ee;
	--c-success-ink: #0b5c36;

	--c-focus: var(--c-link);

	--sp-xs: 4px;
	--sp-sm: 8px;
	--sp-md: 16px;
	--sp-lg: 24px;
	--sp-xl: 32px;
	--sp-2xl: 48px;
	--sp-3xl: 64px;

	--container: 72rem;
	--gutter: clamp(1rem, 4vw, 2rem);
	--section-y: clamp(2.5rem, 6vw, 4.5rem);
	--measure: 66ch;

	--form-measure: 34rem;

	--r-sm: 6px;
	--r-md: 10px;
	--r-lg: 14px;
	--r-pill: 999px;

	--sh-1: 0 1px 2px rgb(var(--c-shadow-tint) / .06), 0 2px 8px rgb(var(--c-shadow-tint) / .06);
	--sh-2: 0 2px 4px rgb(var(--c-shadow-tint) / .09), 0 8px 24px rgb(var(--c-shadow-tint) / .10);

	--dur-fast: 140ms;
	--dur-base: 200ms;
	--ease: cubic-bezier(.2, .7, .3, 1);

	--font-sans: 'Sofia Sans', 'Sofia Sans Fallback', 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
	--fs-display: clamp(2.00rem, 1.55rem + 2.00vw, 3.00rem);
	--fs-heading: clamp(1.55rem, 1.30rem + 1.11vw, 2.05rem);
	--fs-title: clamp(1.20rem, 1.11rem + 0.42vw, 1.40rem);
	--fs-body: clamp(1.0625rem, 1.03rem + 0.15vw, 1.125rem);

	--fw-regular: 400;
	--fw-bold: 700;
}

body {
	background: var(--c-page);
	color: var(--c-ink);
	font-family: var(--font-sans);
	font-size: var(--fs-body);
	font-weight: var(--fw-regular);
	line-height: 1.65;
	letter-spacing: normal;
}

h1, h2, h3 {
	color: var(--c-ink-deep);
	font-weight: var(--fw-bold);
	text-wrap: balance;
}

h1 { font-size: var(--fs-display); line-height: 1.15; }
h2 { font-size: var(--fs-heading); line-height: 1.20; }
h3 { font-size: var(--fs-title); line-height: 1.25; }

p, li { max-width: var(--measure); }

.visually-hidden {
	position: absolute;
	width: 1px; height: 1px;
	margin: -1px; padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}

:focus-visible {
	outline: 3px solid var(--c-focus);
	outline-offset: 2px;
	border-radius: var(--r-sm);
}

.hero :focus-visible,
.site-footer :focus-visible,
.callbar :focus-visible,
.holiday-banner :focus-visible { outline-color: var(--c-focus-on-dark); }

.btn--primary:focus-visible { outline-color: var(--c-on-brand); }

.hero .btn--primary:focus-visible,
.site-footer .btn--primary:focus-visible,
.callbar .btn--primary:focus-visible { outline-color: var(--c-focus-on-dark); }

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after {
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .01ms !important;
		scroll-behavior: auto !important;
	}
}
