* {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
	font: inherit;
	line-height: calc(1em + .5rem);
}

html {
	color-scheme: only light;
	text-size-adjust: none;
	-webkit-text-size-adjust: none;
	-moz-text-size-adjust: none;
	print-color-adjust: exact;
}

body {
	min-height: 100svh;
	color: oklch(.252 0 0);
	background-color: oklch(1 0 0);
	font-family: ui-sans-serif, system-ui;
	font-size: 1rem;
	font-weight: 400;
	overflow-wrap: break-word;
	text-wrap: pretty;
	text-rendering: optimizeLegibility;
	font-smooth: always;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	-webkit-tap-highlight-color: transparent;

	@media not print {
		background-image: url("/background-image.avif");
		background-size: cover;
		background-position: center left;
		backdrop-filter: blur(8px);
		border-image: fill 1 linear-gradient(transparent, oklch(0 0 0));

		@media (width > 991px) {
			background-position: center;
		}
	}
}

main {
	@media not print {
		background-color: white;
		padding: 1.5rem clamp(1rem, 3.3241vw + .0069rem, 2.5rem);
		box-shadow: 0 1px 2px oklch(0 0 0 / .05);

		@media (width > 991px) {
			margin-left: auto;
			width: fit-content;
			padding: 2.5rem 3.75rem;
			border-bottom-left-radius: 3rem;
			box-shadow: none;

			@supports (corner-shape: squircle) {
				border-bottom-left-radius: 7rem;
				corner-shape: squircle;
			}
		}
	}
}

h1 {
	color: oklch(0 0 0);
	font-size: clamp(2.0273rem, 3.448vw + .9972rem, 3.5832rem);
	font-weight: 700;
	letter-spacing: -.04em;
	text-wrap: balance;
}

p {
	margin-top: .625em;
	font-size: clamp(1.125rem, .1662vw + 1.0753rem, 1.2rem);
}