html {
	font-size: 20px;
}

h1 {
	font-size: 3rem;
}

h2 {
	font-size: 2rem;
}

.article {
	grid-template-columns: 384px 1fr;
}

.article__image {
	order: -1;
	margin-top: 0.75rem;
}

.article--reverse {
	grid-template-columns: 1fr 384px;
}

.article--reverse .article__image {
	order: initial;
}

.hero::before {
	background-image: url("/images/hero.webp");
}

.layout__header {
	--gap: 2rem;
}

.layout__footer-list {
	flex-direction: row;
	gap: 2rem;
}

.layout__footer-item--last {
	margin-left: auto;
}

.page-section {
	gap: 4rem;
}

.page-section__header--with-nav {
	--icon-size: 3rem;
}

.page-section__nav-link {
	margin-top: 0.375rem;
}

.recipe-footer__text {
	margin-top: 2rem;
}

.search-form {
	grid-template-columns: 1fr auto;
	align-items: start;
}

.structure {
	grid-template-columns: 1fr min-content;
}