:root {
	--fg-color-bg: #f1eada;
	--fg-color-surface: #ded0b9;
	--fg-color-surface-alt: #d3c1a7;
	--fg-color-text: #3d2e22;
	--fg-color-muted: #62503f;
	--fg-color-line: #897158;
	--fg-color-action: #493a2f;
	--fg-color-action-text: #fffaf0;
	--fg-color-accent: #694514;
	--fg-color-success: #2f5d3a;
	--fg-color-warning: #894a08;
	--fg-color-danger: #a3281f;

	--fg-font-display: 'Bodoni Moda', Georgia, 'Times New Roman', serif;
	--fg-font-body: 'Schibsted Grotesk', system-ui, -apple-system, 'Segoe UI', sans-serif;

	--fg-radius-s: 2px;
	--fg-radius-m: 4px;
	--fg-radius-l: 12px;

	--fg-space-1: 4px;
	--fg-space-2: 8px;
	--fg-space-3: 12px;
	--fg-space-4: 16px;
	--fg-space-5: 24px;
	--fg-space-6: 32px;
	--fg-space-7: 48px;
	--fg-space-8: 80px;

	--fg-shadow: 0 6px 25px rgb(48 36 25 / 50%);

	--fg-color-header-line: #b6a185;
	--fg-color-wave-line: #9e681b;
	--fg-color-wave-glow: #e8c480;
	--fg-logo-filter: brightness(0) saturate(100%) invert(17%) sepia(14%) saturate(900%) hue-rotate(344deg) brightness(96%) contrast(89%);
	--fg-gutter: clamp(24px, 5vw, 80px);
	--fg-ease-out: cubic-bezier(0.23, 1, 0.32, 1);
	--fg-layer-sticky: 10;
	--fg-layer-menu: 20;
	--fg-layer-skip: 30;

	color-scheme: light;
}