.features-page {
	padding: clamp(60px, 7vw, 112px) 0 120px;
	background: #fff;
}

.features-page__shell { width: min(calc(100% - 48px), 1200px); }
.features-page__header { margin-bottom: clamp(40px, 5.5vw, 80px); text-align: center; }
.features-page__heading {
	position: relative;
	display: grid;
	place-items: center;
	width: min(660px, 100%);
	margin: 0 auto 32px;
	padding: 0 48px 18px;
	border-bottom: 1px solid #aab493;
	color: var(--color-green);
}
.features-page__heading::before, .features-page__heading::after {
	content: "";
	position: absolute;
	bottom: 0;
	width: 40px;
	height: 68px;
	background: url('../images/works/leaf.svg') center / contain no-repeat;
}
.features-page__heading::before { left: 0; transform: rotate(-20deg); }
.features-page__heading::after { right: 0; transform: scaleX(-1) rotate(-20deg); }
.features-page__heading h1 { margin: 0; font-size: clamp(32px, 4vw, 52px); font-weight: 400; letter-spacing: .2em; line-height: 1.4; }
.features-page__heading > span { font-size: clamp(15px, 2vw, 18px); letter-spacing: .12em; }
.features-page__header > h2 { margin: 28px 0 18px; font-size: 19px; letter-spacing: .1em; }
.features-page__header > p { margin: 0; font-size: 15px; letter-spacing: .06em; line-height: 2; }
.features-page__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; }
.features-page__card { min-width: 0; }
.features-page__card--wide { grid-column: 1 / -1; }
.features-page__link {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	min-height: clamp(200px, 18vw, 252px);
	padding: 28px;
	background: var(--color-beige);
	isolation: isolate;
}
.features-page__image { position: absolute; z-index: -1; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.features-page__panel { width: 76%; padding: 22px 16px; background: rgb(248 241 238 / 92%); text-align: center; }
.features-page__panel h2 { margin: 0 auto 10px; max-width: 15em; color: var(--color-green); font-size: clamp(18px, 1.8vw, 25px); font-weight: 600; letter-spacing: .1em; line-height: 1.65; overflow-wrap: anywhere; }
.features-page__more { display: inline-flex; align-items: center; justify-content: center; gap: 4px; padding: 4px 14px; border: 1px solid #8fa071; border-radius: 24px; background: #fff; color: var(--color-green); font-size: 12px; font-weight: 600; line-height: 1.5; }
.features-page__link:hover .features-page__more, .features-page__link:focus-visible .features-page__more { background: var(--color-green); color: #fff; }
.features-page__link:focus-visible { outline: 3px solid var(--color-green); outline-offset: 4px; }
.features-page__card--wide .features-page__link { align-items: flex-end; justify-content: flex-end; min-height: clamp(260px, 37vw, 500px); padding: 36px; }
.features-page__card--wide .features-page__panel { width: min(480px, 60%); }
.features-page__pagination { margin-top: 44px; }
.features-page__pagination .nav-links { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 12px; }
.features-page__pagination .page-numbers { display: grid; place-items: center; min-width: 44px; min-height: 44px; padding: 6px 12px; border-radius: 24px; color: var(--color-green); }
.features-page__pagination a:hover, .features-page__pagination .current { background: var(--color-green); color: #fff; }
.features-page__empty { padding: 50px 16px; background: var(--color-beige); text-align: center; }

@media (max-width: 900px) {
	.features-page__grid { gap: 20px; }
	.features-page__link { padding: 18px; }
	.features-page__panel { width: 90%; padding: 18px 12px; }
	.features-page__panel h2 { font-size: 18px; }
}
@media (max-width: 600px) {
	.features-page { padding-bottom: 72px; }
	.features-page__shell { width: calc(100% - 32px); }
	.features-page__header > p { font-size: 13px; }
	.features-page__grid { grid-template-columns: minmax(0, 1fr); }
	.features-page__link, .features-page__card--wide .features-page__link { min-height: 180px; align-items: center; justify-content: center; padding: 20px; }
	.features-page__panel, .features-page__card--wide .features-page__panel { width: 90%; padding: 18px 12px; }
}
