@layer reset {
	*{
		margin: 0;
		padding: 0;
		box-sizing: border-box;

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

	:root {
		font-size: 18px;
		line-height: 1.4;
		font-family: var(--font-content);
		text-rendering: optimizeLegibility;
		text-decoration-skip-ink: auto;
		font-feature-settings:
			'calt' on,
			'dlig' on,
			'kern',
			'locl';
		font-variant-ligatures: discretionary-ligatures;
		-moz-osx-font-smoothing: grayscale;
		-webkit-font-smoothing: antialiased;
		-moz-font-smoothing: antialiased;
		text-size-adjust: 100%;
		max-width: 100vw;
		overflow-x: hidden;
	}

	body{
		max-width: 100vw;
		overflow-x: hidden;
	}

	img,
	svg,
	picture,
	video {
		height: auto;
		max-width: 100%;
	}

	main {
		container: content / inline-size;
	}
}