:root {
	--landing-purple: #652d86;
	--landing-teal: #2bb3c0;
	--landing-lavender: #aa8ec3;
	--landing-amber: #f3ead3;
	--landing-border: #c6cdd1;
	--landing-ink: #171717;
	--landing-muted: #3f4148;
	--landing-white: #ffffff;
	--landing-shell: 92rem;
	--landing-section-space: 80px;
	--landing-control-radius: 21.6px;
	--landing-font-display: "Geist", Arial, Helvetica, sans-serif;
	--landing-font-brand: "Plus Jakarta Sans", "Geist", Arial, Helvetica, sans-serif;
}

html,
body {
	margin: 0;
	min-width: 320px;
	overflow-x: hidden;
	background: var(--landing-white);
	color: var(--landing-ink);
	font-family: var(--landing-font-display);
}

html {
	height: auto;
	overflow-y: scroll;
}

body {
	height: auto !important;
	min-height: 100vh;
	overflow-y: auto !important;
}

body:has(.app-sidebar) {
	height: 100dvh !important;
	overflow: hidden !important;
}

html:has(.app-sidebar) {
	overflow: hidden;
}

*,
*::before,
*::after {
	box-sizing: border-box;
}

button,
a,
input,
textarea,
select {
	font: inherit;
}

button:focus-visible,
a:focus-visible {
	outline: 3px solid var(--landing-teal);
	outline-offset: 4px;
}

fluent-button.landing-button::part(content) {
	color: var(--landing-white);
	font-size: 18px;
	font-weight: 600;
}

.landing-button-shell--secondary fluent-button.landing-button::part(content) {
	color: var(--landing-ink);
}

fluent-button.landing-text-button::part(content) {
	color: var(--landing-ink);
	font-size: 18px;
	font-weight: 500;
}

.page {
	min-height: 100vh;
}