:root {
	/* Colors */
	--color-surface: #f9f9f9;
	--color-surface-dim: #dadada;
	--color-surface-bright: #f9f9f9;
	--color-surface-container-lowest: #ffffff;
	--color-surface-container-low: #f3f3f3;
	--color-surface-container: #eeeeee;
	--color-surface-container-high: #e8e8e8;
	--color-surface-container-highest: #e2e2e2;
	--color-on-surface: #1a1c1c;
	--color-on-surface-variant: #44474b;
	--color-inverse-surface: #2f3131;
	--color-inverse-on-surface: #f1f1f1;
	--color-outline: #74777c;
	--color-outline-variant: #c4c6cc;
	--color-surface-tint: #545f6c;
	--color-primary: #09141f;
	--color-on-primary: #ffffff;
	--color-primary-container: #1e2934;
	--color-on-primary-container: #85909e;
	--color-inverse-primary: #bcc8d6;
	--color-secondary: #5e5f5a;
	--color-on-secondary: #ffffff;
	--color-secondary-container: #e3e3dd;
	--color-on-secondary-container: #646560;
	--color-tertiary: #1f1005;
	--color-on-tertiary: #ffffff;
	--color-tertiary-container: #362416;
	--color-on-tertiary-container: #a58a77;
	--color-error: #ba1a1a;
	--color-on-error: #ffffff;
	--color-error-container: #ffdad6;
	--color-on-error-container: #93000a;
	--color-primary-fixed: #d8e4f3;
	--color-primary-fixed-dim: #bcc8d6;
	--color-on-primary-fixed: #111d27;
	--color-on-primary-fixed-variant: #3d4854;
	--color-secondary-fixed: #e3e3dd;
	--color-secondary-fixed-dim: #c7c7c1;
	--color-on-secondary-fixed: #1b1c19;
	--color-on-secondary-fixed-variant: #464743;
	--color-tertiary-fixed: #fddcc7;
	--color-tertiary-fixed-dim: #dfc1ac;
	--color-on-tertiary-fixed: #28180b;
	--color-on-tertiary-fixed-variant: #584233;
	--color-background: #f9f9f9;
	--color-on-background: #1a1c1c;
	--color-surface-variant: #e2e2e2;
	--color-ink-deep: #1E2934;
	--color-surface-taupe: #F2F1EB;
	--color-divider-subtle: #F0F0F0;
	--color-text-muted: #6D6D6D;

	/* Typography */
	--font-primary: 'Libre Caslon Text', serif;
	--font-secondary: 'Inter', sans-serif;

	/* Spacing */
	--spacing-base: 8px;
	--spacing-gutter: 24px;
	--margin-mobile: 20px;
	--margin-desktop: 80px;
	--section-gap-mobile: 64px;
	--section-gap-desktop: 120px;
	--container-max: 1360px;

	/* Border Radius */
	--radius-sm: 0.125rem;
	--radius-default: 0.25rem; /* 4px */
	--radius-md: 0.375rem;
	--radius-lg: 0.5rem;
	--radius-xl: 0.75rem;
	--radius-full: 9999px;
}

/* Reset & Base Styles */
*, *::before, *::after {
	box-sizing: border-box;
}

body {
	margin: 0;
	font-family: var(--font-secondary);
	font-size: 16px;
	font-weight: 300;
	line-height: 24px;
	letter-spacing: 0.01em;
	background-color: var(--color-background);
	color: var(--color-on-background);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

::selection {
	background-color: var(--color-surface-taupe);
	color: var(--color-ink-deep);
}

img {
	max-width: 100%;
	height: auto;
	display: block;
}

a {
	color: inherit;
	text-decoration: none;
}

button {
	background: none;
	border: none;
	padding: 0;
	cursor: pointer;
	font: inherit;
	color: inherit;
}