/*!
 * Custom Asset: active
 * Priority: 1
 * Context: frontend
 */

/* =========================================================
   Site design tokens
   Load this file before all other custom CSS files.
   ========================================================= */

:root {
	/* Typography */
	--site-font-family: Outfit, sans-serif;

	/* Brand colors */
	--site-color-primary: #004a60;
	--site-color-primary-light: #00546b;
	--site-color-primary-dark: #003f52;
	--site-color-accent: #e40081;
	--site-color-accent-dark: #9e0059;
	--site-color-accent-muted: #b00072;
	--site-color-accent-alt: #b00068;

	/* Semantic colors */
	--site-color-success: #008a3d;
	--site-color-success-dark: #065f46;
	--site-color-success-bg: #ecfdf5;
	--site-color-success-border: #a7f3d0;
	--site-color-error: #e40081;
	--site-color-error-dark: #9f1239;
	--site-color-error-bg: #fff1f2;
	--site-color-error-border: #fecdd3;
	--site-color-danger: #ff0f6d;
	--site-color-available: #58c26b;

	/* Neutral colors */
	--site-color-text: #4a4a4a;
	--site-color-heading: #263238;
	--site-color-black: #000000;
	--site-color-dark: #333333;
	--site-color-dark-strong: #1f1f1f;
	--site-color-white: #ffffff;

	/* Surfaces and borders */
	--site-color-soft: #e8f5f8;
	--site-color-soft-alt: #e6f2f5;
	--site-color-surface-muted: #f6f6f6;
	--site-color-border: #d9e5ea;
	--site-color-border-light: #dde5ea;
	--site-color-border-muted: #d7d7d7;
	--site-color-border-subtle: #e5e7eb;

	/* Radius */
	--site-radius-xs: 4px;
	--site-radius-sm: 8px;
	--site-radius-md: 12px;
	--site-radius-lg: 16px;
	--site-radius-pill: 999px;

	/* Spacing */
	--site-space-2xs: 4px;
	--site-space-xs: 8px;
	--site-space-sm: 12px;
	--site-space-md: 16px;
	--site-space-lg: 24px;
	--site-space-xl: 32px;
	--site-space-2xl: 40px;
	--site-space-3xl: 48px;
	--site-space-4xl: 64px;
	--site-space-5xl: 80px;
	--site-space-6xl: 96px;
	--site-space-7xl: 120px;
	--site-space-8xl: 180px;
	--site-space-9xl: 200px;
	--site-space-hero: 240px;

	/* Shadows */
	--site-shadow-header: 0 10px 30px rgba(0, 0, 0, .12);
	--site-shadow-card: 0 4px 52px 22px rgba(0, 0, 0, .06);
	--site-shadow-usp: 0 2px 78px -1px rgba(0, 0, 0, .05);

	/* Header / anchor offsets */
	--site-header-offset: 100px;
	--site-adminbar-offset: 0px;
}

@media (max-width: 1024px) {
	:root {
		--site-header-offset: 90px;
	}
}

@media (max-width: 767px) {
	:root {
		--site-header-offset: 80px;
	}
}

body.admin-bar {
	--site-adminbar-offset: 32px;
}

@media (max-width: 782px) {
	body.admin-bar {
		--site-adminbar-offset: 46px;
	}
}
