.lol-purchase {
	--lol-purchase-ink: #1c2f29;
	--lol-purchase-muted: #68766c;
	--lol-purchase-paper: #f7f8f3;
	--lol-purchase-line: #dce3da;
	--lol-purchase-green: #244f3a;
	--lol-purchase-dark: #17382b;
	background: var(--lol-purchase-paper);
	color: var(--lol-purchase-ink);
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	line-height: 1.6;
	padding: clamp(3rem, 8vw, 7rem) 1.25rem;
}

.lol-purchase__shell { margin: 0 auto; max-width: 1180px; }

.lol-purchase h1,
.lol-purchase h2,
.lol-purchase h3 {
	font-family: Georgia, "Times New Roman", serif;
	font-weight: 400;
}

.lol-purchase h1,
.lol-purchase h2,
.lol-purchase h3,
.lol-purchase p { margin-top: 0; }

.lol-purchase__hero {
	align-items: center;
	display: grid;
	gap: clamp(3rem, 9vw, 8rem);
	grid-template-columns: minmax(0, 1fr) minmax(18rem, 31rem);
	margin: 0 auto clamp(6rem, 13vw, 11rem);
	max-width: 1040px;
}

.lol-purchase__eyebrow {
	color: #756bb2;
	font-size: .7rem;
	font-weight: 700;
	letter-spacing: .14em;
	margin-bottom: 1rem;
	text-transform: uppercase;
}

.lol-purchase h1 {
	color: var(--lol-purchase-dark);
	font-size: clamp(2.8rem, 6vw, 5.6rem);
	line-height: 1.03;
	margin-bottom: 1.5rem;
}

.lol-purchase__lead {
	color: var(--lol-purchase-muted);
	font-family: Georgia, "Times New Roman", serif;
	font-size: clamp(1.05rem, 1.7vw, 1.3rem);
	line-height: 1.8;
	margin-bottom: 2rem;
	max-width: 34rem;
}

.lol-purchase__button {
	align-items: center;
	background: var(--lol-purchase-green);
	border: 1px solid var(--lol-purchase-green);
	color: #fff;
	display: inline-flex;
	font-size: .8rem;
	font-weight: 700;
	gap: .7rem;
	letter-spacing: .04em;
	padding: .9rem 1.2rem;
	text-decoration: none;
	transition: background-color .2s ease, border-color .2s ease, color .2s ease;
}

.lol-purchase__button:hover,
.lol-purchase__button:focus-visible {
	background: var(--lol-purchase-dark);
	border-color: var(--lol-purchase-dark);
	color: #fff;
}

.lol-purchase__button span { color: #f0c96b; font-size: 1.1rem; }

.lol-purchase__email {
	color: var(--lol-purchase-muted);
	font-size: .75rem;
	margin: 1rem 0 0;
}

.lol-purchase__email a { color: var(--lol-purchase-green); }

.lol-purchase__cover {
	background: #fff;
	box-shadow: 1.5rem 1.5rem 0 rgba(220, 227, 218, .75);
	margin: 0;
	transform: rotate(2deg);
}

.lol-purchase__cover img { display: block; width: 100%; }

.lol-purchase__benefits,
.lol-purchase__samples { margin: 0 auto clamp(6rem, 13vw, 11rem); max-width: 1040px; }

.lol-purchase__section-heading {
	border-top: 1px solid var(--lol-purchase-line);
	margin-bottom: 2.5rem;
	padding-top: 1.5rem;
}

.lol-purchase__section-heading .lol-purchase__eyebrow { margin-bottom: .75rem; }

.lol-purchase h2 {
	color: var(--lol-purchase-dark);
	font-size: clamp(2.1rem, 4vw, 3.7rem);
	line-height: 1.08;
	margin-bottom: 0;
}

.lol-purchase__benefit-grid {
	display: grid;
	gap: 2rem;
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.lol-purchase__benefit-grid article { border-top: 1px solid var(--lol-purchase-line); padding-top: 1rem; }
.lol-purchase__benefit-number { color: #756bb2; font-size: .72rem; font-weight: 700; letter-spacing: .1em; }
.lol-purchase h3 { color: var(--lol-purchase-dark); font-size: 1.55rem; line-height: 1.15; margin: 2rem 0 .8rem; }
.lol-purchase__benefit-grid p { color: var(--lol-purchase-muted); font-size: .9rem; margin-bottom: 0; }

.lol-purchase__sample-grid {
	display: grid;
	gap: 1.25rem;
	grid-template-columns: minmax(0, 1.35fr) minmax(0, .65fr);
}

.lol-purchase__sample { margin: 0; }
.lol-purchase__sample img { background: #e5ebe3; display: block; height: 100%; object-fit: cover; width: 100%; }
.lol-purchase__sample--wide img { object-fit: contain; }
.lol-purchase__sample figcaption { color: var(--lol-purchase-muted); font-size: .72rem; padding-top: .6rem; }

.lol-purchase__cta {
	background: var(--lol-purchase-dark);
	color: #fff;
	margin: 0 auto;
	max-width: 1040px;
	padding: clamp(2.5rem, 7vw, 5.5rem);
	text-align: center;
}

.lol-purchase__cta .lol-purchase__eyebrow { color: #e7c879; }
.lol-purchase__cta h2 { color: #fff; margin-bottom: 2rem; }
.lol-purchase__button--light { background: #e7c879; border-color: #e7c879; color: var(--lol-purchase-dark); }
.lol-purchase__button--light:hover,
.lol-purchase__button--light:focus-visible { background: #f2d994; border-color: #f2d994; color: var(--lol-purchase-dark); }

@media (max-width: 760px) {
	.lol-purchase__hero { gap: 3rem; grid-template-columns: 1fr; }
	.lol-purchase__hero-copy { max-width: 36rem; }
	.lol-purchase__cover { margin: 0 auto; max-width: 28rem; width: 80%; }
	.lol-purchase__benefit-grid,
	.lol-purchase__sample-grid { grid-template-columns: 1fr; }
	.lol-purchase__sample--wide { order: 0; }
	.lol-purchase__sample:not(.lol-purchase__sample--wide) { max-width: 28rem; }
}

@media (max-width: 480px) {
	.lol-purchase { padding-left: 1rem; padding-right: 1rem; }
	.lol-purchase h1 { font-size: clamp(2.4rem, 12vw, 3.6rem); }
	.lol-purchase__cover { width: 90%; }
}