/* Scope Eyecare child theme styles. Keep this small; move to a build pipeline when custom CSS grows. */

@font-face {
	font-display: swap;
	font-family: "Geist";
	font-stretch: 75% 125%;
	font-style: normal;
	font-weight: 300 900;
	src: url("../../../ollie/assets/fonts/geist/Geist-VariableFont_wght.woff2") format("woff2");
}

:root {
	--scope-focus: #005fcc;
	--wp--preset--color--primary: #ff6637;
	--wp--preset--color--primary-accent: #ffebe1;
	--wp--preset--color--primary-alt: #ffb281;
	--wp--preset--color--primary-alt-accent: #453029;
	--wp--preset--color--main: #15110f;
	--wp--preset--color--main-accent: #ddd1cb;
	--wp--preset--color--base: #ffffff;
	--wp--preset--color--secondary: #645048;
	--wp--preset--color--tertiary: #faf6f4;
	--wp--preset--color--border-light: #e7deda;
	--wp--preset--color--border-dark: #60514b;
	--wp--preset--font-family--primary: Geist, sans-serif;
}

body {
	font-family: Geist, sans-serif;
}

html {
	scroll-behavior: smooth;
}

.wp-site-blocks {
	min-height: 100vh;
}

.scope-page-kicker {
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0;
	text-transform: uppercase;
}

.scope-client-placeholder {
	border: 1px dashed color-mix(in srgb, currentColor 30%, transparent);
	border-radius: var(--wp--custom--scope--border-radius, 6px);
}

:where(a, button, input, select, textarea):focus-visible {
	outline: 3px solid var(--scope-focus);
	outline-offset: 2px;
}