@layer main {
	body {
		color: rgba(var(--color-text));
		line-height: 1.8;
		font-family: var(--font-family-content);
		display: flex;
		flex-direction: column;
		max-width: 100vw;
		overflow-x: hidden;

		&.no-scroll{
			max-height: 100vh;
			overflow-y: hidden;
			position: relative;
		}
	}

	body > main,
	body > header,
	body > footer {
		container: content / inline-size;
	}

	nav{
		ul{
			list-style: none;
			padding: 0;
		}

		[role="menubar"]{
			display: flex;
		}
	}

	article {

	}

	section {
		color: rgba(var(--color-text));

		main > &,
		article > &{
			padding-block: var(--section-padding);
		}
	}

	header {
		main > &,
		article > &,
		section > & {
			margin-bottom: calc(var(--spacer) * 2);

			@container (max-width: 768px){
                margin-bottom: var(--spacer);
            }
		}
	}

	main > header{
		padding-top: var(--section-padding);
	}

	.skip-to-main{
		height: 0;
		overflow: hidden;
		display: inline-block;
		position: absolute;
		color: rgb(var(--color-white));

		&:focus{
			height: auto;
		}
	}

	gmp-place-autocomplete {
		--gmp-mat-font-body-medium: normal 400 16px/24px var(--font-family-display);
		--gmp-mat-font-body-small: normal 400 14px/20px var(--font-family-content);

  		color-scheme: light;
		border-radius: 0px;
		border: 1px solid rgba(var(--color-md-gray));
		font-family: var(--font-family-display);
	}
}