@font-face {
	font-family: 'Switzer';
	src: url('/assets/fonts/Switzer-Variable.woff2') format('woff2');
	font-weight: 100 900;
	font-display: swap;
}

@font-face {
	font-family: 'Recia';
	src: url('/assets/fonts/Recia-Variable.woff2') format('woff2');
	font-weight: 100 900;
	font-display: swap;
}

:root {
	--switzer: 'Switzer', sans-serif;
	--recia: 'Recia', serif;
}

body.text-page.marketing-site {
	--surface: #121010;
	--surface-section: #171412;
	--surface-elevated: #1d1a18;
	--ink-strong: #f0ebe3;
	--ink: #e7dfd3;
	--ink-soft: rgba(232, 224, 212, 0.72);
	--eyebrow: rgba(196, 163, 90, 0.72);
	--accent: #ff3c00;
	--outline-border: rgba(232, 224, 212, 0.18);
	--toggle-bg: transparent;
	--header-bg: rgba(18, 16, 16, 0.92);
	--header-border: rgba(58, 53, 48, 0.9);
	--footer-border: rgba(58, 53, 48, 0.75);
	background: linear-gradient(180deg, var(--surface-section) 0%, var(--surface) 22rem);
	color: var(--ink);
	font-family: var(--switzer);
	min-height: 100vh;
}

.text-page.marketing-site .site-header {
	position: sticky;
	top: 0;
	z-index: 10;
	background: var(--header-bg);
	backdrop-filter: blur(10px);
	border-bottom: 1px solid var(--header-border);
}

.text-page.marketing-site .header-page .logo img {
	width: 140px;
	height: auto;
}

.text-page.marketing-site .button--outline,
.text-page.marketing-site a.button--outline {
	color: var(--ink-strong);
	border-color: var(--outline-border);
	background: transparent;
}

.text-page.marketing-site .button--outline:hover,
.text-page.marketing-site a.button--outline:hover {
	color: var(--accent);
	border-color: var(--accent);
	background: transparent;
}

.text-page-content {
	padding: 2.5rem 0 6rem;
}

.text-page-wrapper {
	max-width: 48rem;
	margin: 0 auto;
	padding: 0 1rem;
}

body.text-page.marketing-site[data-theme="light"] {
	--surface: #fffcf3;
	--surface-section: #f5efe2;
	--surface-elevated: #fffef8;
	--ink-strong: #221d19;
	--ink: #2e2722;
	--ink-soft: rgba(46, 39, 34, 0.74);
	--eyebrow: rgba(110, 83, 18, 0.72);
	--outline-border: rgba(34, 29, 25, 0.12);
	--header-bg: rgba(255, 252, 243, 0.9);
	--header-border: rgba(214, 201, 181, 0.85);
	--footer-border: rgba(214, 201, 181, 0.7);
}

@media (prefers-color-scheme: light) {
	body.text-page.marketing-site:not([data-theme="dark"]) {
		--surface: #fffcf3;
		--surface-section: #f5efe2;
		--surface-elevated: #fffef8;
		--ink-strong: #221d19;
		--ink: #2e2722;
		--ink-soft: rgba(46, 39, 34, 0.74);
		--eyebrow: rgba(110, 83, 18, 0.72);
		--outline-border: rgba(34, 29, 25, 0.12);
		--header-bg: rgba(255, 252, 243, 0.9);
		--header-border: rgba(214, 201, 181, 0.85);
		--footer-border: rgba(214, 201, 181, 0.7);
	}
}

.text-page-wrapper h2 {
	font-family: var(--recia);
	font-weight: 600;
	font-size: 1.5rem;
	line-height: 1.3;
	margin-top: 2.5rem;
	margin-bottom: 1rem;
	color: var(--ink-strong);
}

.text-page-wrapper h3 {
	font-family: var(--recia);
	font-weight: 600;
	font-size: 1.125rem;
	line-height: 1.4;
	margin-top: 2rem;
	margin-bottom: 0.75rem;
	color: var(--ink-strong);
}

.text-page-wrapper p {
	font-size: 1rem;
	line-height: 1.7;
	margin-bottom: 1rem;
	color: var(--ink-soft);
}

.text-page-wrapper ul,
.text-page-wrapper ol {
	margin-bottom: 1rem;
	padding-left: 1.5rem;
	color: var(--ink-soft);
	line-height: 1.7;
}

.text-page-wrapper li {
	margin-bottom: 0.5rem;
}

.text-page-wrapper strong {
	color: var(--ink-strong);
}

.text-page-wrapper a {
	color: var(--ink-strong);
	text-decoration: underline;
}

.text-page-wrapper hr {
	border: 0;
	border-top: 1px solid var(--header-border);
	margin: 2rem 0;
}

@media (max-width: 42em) {
	.text-page-content {
		padding-top: 2rem;
	}
}