/* Greenleaf benefits — layered reference implementation, 2026-09-04. */
.theme-greenleaf-ecommerce .gl-benefits {
	--gl-benefits-cream: #fffaf0;
	--gl-benefits-gold: #d9a72e;
	--gl-benefits-gold-dark: #78530a;
	--gl-benefits-gold-light: #fff1a8;
	--gl-benefits-green: #0d5a2b;
	--gl-benefits-green-deep: #003d20;
	--gl-benefits-green-ink: #104724;
	--gl-benefits-text: #30333a;
	background: #fcfbf8;
	color: var(--gl-benefits-text);
	font-family: Roboto, Arial, sans-serif;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	margin-top: 52px;
	max-width: none;
	overflow: hidden;
	padding: 0 0 26px;
	width: 100vw;
}

.theme-greenleaf-ecommerce .gl-benefits,
.theme-greenleaf-ecommerce .gl-benefits * {
	box-sizing: border-box;
}

.theme-greenleaf-ecommerce .gl-benefits__hero {
	align-items: center;
	background:
		radial-gradient(circle at 83% 22%, rgba(255, 230, 116, .2), transparent 25%),
		radial-gradient(circle at 18% 82%, rgba(193, 157, 55, .2), transparent 27%),
		linear-gradient(112deg, #164d2c 0%, #064c29 34%, #003d20 63%, #174e2c 100%);
	border-bottom: 2px solid #d7b84b;
	color: #fff;
	display: grid;
	grid-template-columns: minmax(190px, 1fr) minmax(570px, 2.2fr) minmax(190px, 1fr);
	min-height: 228px;
	overflow: hidden;
	padding: 22px clamp(34px, 5vw, 92px) 24px;
	position: relative;
	text-align: center;
}

.theme-greenleaf-ecommerce .gl-benefits__hero::before,
.theme-greenleaf-ecommerce .gl-benefits__hero::after,
.theme-greenleaf-ecommerce .gl-benefits__hero-glow::before,
.theme-greenleaf-ecommerce .gl-benefits__hero-glow::after {
	content: "";
	pointer-events: none;
	position: absolute;
}

.theme-greenleaf-ecommerce .gl-benefits__hero::before {
	background: linear-gradient(115deg, rgba(255, 246, 176, .82), rgba(163, 119, 14, .15) 55%, transparent 85%);
	border-radius: 48% 52% 46% 54%;
	box-shadow: 0 0 28px rgba(255, 226, 101, .55);
	height: 116px;
	left: -4%;
	op: -38px;
	transform: rotate(8deg);
	width: 43%;
}

.theme-greenleaf-ecommerce .gl-benefits__hero::after {
	background: linear-gradient(100deg, transparent, rgba(255, 238, 145, .94) 58%, rgba(185, 137, 28, .35));
	border-radius: 55% 45% 0 0;
	bottom: -74px;
	height: 138px;
	right: -4%;
	transform: rotate(-8deg);
	width: 48%;
}

.theme-greenleaf-ecommerce .gl-benefits__hero-glow {
	inset: 0;
	pointer-events: none;
	position: absolute;
}

.theme-greenleaf-ecommerce .gl-benefits__hero-glow::before {
	background: linear-gradient(105deg, rgba(117, 128, 36, .14), rgba(235, 209, 97, .6) 44%, rgba(31, 91, 42, .08) 74%);
	border-top: 1px solid rgba(255, 236, 142, .8);
	bottom: -61px;
	height: 130px;
	left: -5%;
	transform: rotate(-5deg);
	width: 58%;
}

.theme-greenleaf-ecommerce .gl-benefits__hero-glow::after {
	background: linear-gradient(100deg, transparent, rgba(255, 239, 150, .65) 54%, rgba(78, 99, 30, .16));
	border-top: 2px solid rgba(255, 243, 175, .9);
	bottom: 19px;
	height: 72px;
	right: -7%;
	transform: rotate(-7deg);
	width: 47%;
}

.theme-greenleaf-ecommerce .gl-benefits__hero-copy,
.theme-greenleaf-ecommerce .gl-benefits__hero-side {
	position: relative;
	z-index: 2;
}

.theme-greenleaf-ecommerce .gl-benefits__hero-copy {
	align-self: center;
}

.theme-greenleaf-ecommerce .gl-benefits__eyebrow {
	color: #f6edcc;
	display: block;
	font-size: clamp(25px, 2.3vw, 37px);
	font-weight: 300;
	letter-spacing: .14em;
	line-height: 1;
	margin-bottom: 2px;
	text-transform: uppercase;
}

.theme-greenleaf-ecommerce .gl-benefits__hero-copy h2 {
	line-height: 0;
	margin: 0;
}

.theme-greenleaf-ecommerce .gl-benefits__wordmark {
	display: block;
	height: auto;
	margin: -1px auto 0;
	max-width: 100%;
	width: min(44vw, 700px);
}

.theme-greenleaf-ecommerce .gl-benefits__hero-copy > p {
	color: #fff;
	font-size: clamp(15px, 1.35vw, 20px);
	font-weight: 500;
	line-height: 1.25;
	margin: 9px 0 0;
	text-shadow: 0 2px 4px rgba(0, 35, 17, .75);
}

.theme-greenleaf-ecommerce .gl-benefits__hero-side {
	color: #f1dea0;
	font-size: 14px;
	font-weight: 400;
	letter-spacing: .29em;
	line-height: 1.58;
	margin: 0;
	text-transform: uppercase;
}

.theme-greenleaf-ecommerce .gl-benefits__hero-side--left { justify-self: start; }
.theme-greenleaf-ecommerce .gl-benefits__hero-side--right { justify-self: end; text-align: left; }

.theme-greenleaf-ecommerce .gl-benefits__container {
	max-width: 1518px;
	padding: 22px 0 0;
	width: calc(100% - 80px);
}

.theme-greenleaf-ecommerce .gl-benefits__grid {
	display: grid;
	gap: 22px;
	grid-template-columns: repeat(4, minmax(0, 1fr));
}

.theme-greenleaf-ecommerce .gl-benefits__card {
	background: var(--card-cap);
	border: 1px solid rgba(209, 171, 68, .24);
	border-radius: 28px;
	box-shadow: 0 13px 28px rgba(31, 43, 30, .08);
	display: flex;
	min-height: 512px;
	overflow: hidden;
	padding: 0;
	position: relative;
	transition: box-shadow .2s ease, transform .2s ease;
}

.theme-greenleaf-ecommerce .gl-benefits__card::before,
.theme-greenleaf-ecommerce .gl-benefits__card::after {
	border: 1px solid var(--cap-line);
	border-radius: 50%;
	content: "";
	height: 128px;
	pointer-events: none;
	position: absolute;
	top: -50px;
	transform: rotate(-16deg);
	width: 205px;
	z-index: 1;
}

.theme-greenleaf-ecommerce .gl-benefits__card::before {
	box-shadow: inset 0 -18px 34px var(--cap-haze);
	right: -33px;
}

.theme-greenleaf-ecommerce .gl-benefits__card::after {
	height: 105px;
	left: -58px;
	op: 31px;
	transform: rotate(13deg);
	width: 180px;
}

.theme-greenleaf-ecommerce .gl-benefits__card--green {
	--card-cap: radial-gradient(circle at 72% 22%, rgba(80, 139, 76, .38), transparent 28%), linear-gradient(142deg, #073f24, #0c6131 67%, #073f24);
	--cap-haze: rgba(221, 191, 90, .08);
	--cap-line: rgba(222, 197, 101, .16);
}

.theme-greenleaf-ecommerce .gl-benefits__card--gold {
	--card-cap: radial-gradient(circle at 26% 18%, rgba(255, 255, 255, .5), transparent 30%), linear-gradient(138deg, #d9a33b, #fff2be 68%, #d9a33b);
	--cap-haze: rgba(138, 95, 7, .06);
	--cap-line: rgba(145, 99, 13, .13);
}

.theme-greenleaf-ecommerce .gl-benefits__card:hover {
	box-shadow: 0 17px 34px rgba(31, 43, 30, .14);
	transform: translateY(-3px);
}

.theme-greenleaf-ecommerce .gl-benefits__icon-wrap {
	align-items: center;
	background: transparent;
	border: 0;
	border-radius: 50%;
	color: #5f3a00;
	display: flex;
	height: 140px;
	justify-content: center;
	left: 50%;
	position: absolute;
	top: 10px;
	transform: translateX(-50%);
	width: 140px;
	z-index: 3;
}

.theme-greenleaf-ecommerce .gl-benefits__icon-wrap::before {
	display: none;
}

.theme-greenleaf-ecommerce .gl-benefits__medallion {
	display: block;
	height: 100%;
	inset: 0;
	object-fit: contain;
	pointer-events: none;
	position: absolute;
	width: 100%;
	z-index: 0;
}

.theme-greenleaf-ecommerce .gl-benefits__icon-wrap > svg {
	fill: none;
	height: 61px;
	position: relative;
	stroke: currentColor;
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-width: 3.3;
	width: 61px;
	z-index: 1;
}

.theme-greenleaf-ecommerce .gl-benefits__card-content {
	background: linear-gradient(180deg, rgba(255, 255, 255, .99), #fff 64%, #fffcf6 100%);
	border-radius: 34px 34px 27px 27px;
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	margin-top: 86px;
	min-width: 0;
	padding: 63px 22px 17px;
	position: relative;
	text-align: center;
	z-index: 2;
}

.theme-greenleaf-ecommerce .gl-benefits__card h3 {
	color: var(--gl-benefits-gold-dark);
	font-size: clamp(24px, 1.8vw, 29px);
	font-weight: 800;
	letter-spacing: -.015em;
	line-height: 1.05;
	margin: 0 0 8px;
	text-transform: uppercase;
}

.theme-greenleaf-ecommerce .gl-benefits__lead {
	color: #121212;
	font-size: 17px;
	font-weight: 600;
	line-height: 1.25;
	margin: 0 0 15px;
}

.theme-greenleaf-ecommerce .gl-benefits__list {
	list-style: none;
	margin: 0 0 16px;
	padding: 0;
	text-align: left;
}

.theme-greenleaf-ecommerce .gl-benefits__list li {
	color: #4a4d55;
	font-size: 14px;
	line-height: 1.32;
	margin-bottom: 15px;
	min-height: 34px;
	padding-left: 31px;
	position: relative;
}

.theme-greenleaf-ecommerce .gl-benefits__list li::before {
	align-items: center;
	background: linear-gradient(145deg, #376d28, #034c27);
	border-radius: 50%;
	box-shadow: 0 2px 4px rgba(0, 55, 25, .2);
	color: #fff;
	content: "✓";
	display: flex;
	font-size: 13px;
	font-weight: 800;
	height: 22px;
	justify-content: center;
	left: 0;
	line-height: 1;
	position: absolute;
	top: -1px;
	width: 22px;
}

.theme-greenleaf-ecommerce .gl-benefits__list li:last-child { margin-bottom: 0; }

.theme-greenleaf-ecommerce .gl-benefits__card-foot {
	align-items: center;
	background: radial-gradient(circle at 17% 50%, rgba(255, 236, 147, .72), transparent 26%), linear-gradient(105deg, #fff9df, #f5ecd4);
	border: 1px solid #d9b75c;
	border-radius: 14px;
	display: grid;
	gap: 12px;
	grid-template-columns: 54px minmax(0, 1fr);
	margin-top: auto;
	min-height: 74px;
	padding: 8px 14px;
	text-align: left;
}

.theme-greenleaf-ecommerce .gl-benefits__card-foot > svg {
	fill: none;
	filter: drop-shadow(0 2px 2px rgba(112, 67, 0, .18));
	height: 49px;
	stroke: #8b650d;
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-width: 2.2;
	width: 49px;
}

.theme-greenleaf-ecommerce .gl-benefits__card-foot p { margin: 0; min-width: 0; }
.theme-greenleaf-ecommerce .gl-benefits__card-foot strong,
.theme-greenleaf-ecommerce .gl-benefits__card-foot span { display: block; }
.theme-greenleaf-ecommerce .gl-benefits__card-foot strong {
	color: #181500;
	font-size: 17px;
	font-weight: 800;
	line-height: 1.14;
}
.theme-greenleaf-ecommerce .gl-benefits__card:first-child .gl-benefits__card-foot strong { font-size: 31px; }
.theme-greenleaf-ecommerce .gl-benefits__card-foot span {
	color: #31533a;
	font-size: 13px;
	line-height: 1.2;
	margin-top: 2px;
}

.theme-greenleaf-ecommerce .gl-benefits__facts {
	background: linear-gradient(112deg, #123d24, #00502a 48%, #154a29);
	border: 1px solid rgba(222, 186, 82, .42);
	border-radius: 28px;
	box-shadow: 0 10px 23px rgba(0, 51, 24, .18), inset 0 0 24px rgba(72, 135, 65, .24);
	display: grid;
	grid-template-columns: 1fr 1.12fr 1.28fr .98fr 1.18fr;
	margin-top: 20px;
	min-height: 106px;
	padding: 16px 11px;
}

.theme-greenleaf-ecommerce .gl-benefits__fact {
	align-items: center;
	border-right: 1px solid rgba(221, 183, 72, .55);
	display: grid;
	gap: 13px;
	grid-template-columns: 55px minmax(0, 1fr);
	min-width: 0;
	padding: 4px 19px;
	text-align: left;
}

.theme-greenleaf-ecommerce .gl-benefits__fact:last-child { border-right: 0; }
.theme-greenleaf-ecommerce .gl-benefits__fact > svg {
	fill: none;
	filter: drop-shadow(0 0 4px rgba(255, 221, 111, .28));
	height: 53px;
	stroke: #f1ce69;
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-width: 2.1;
	width: 53px;
}
.theme-greenleaf-ecommerce .gl-benefits__fact p { margin: 0; min-width: 0; }
.theme-greenleaf-ecommerce .gl-benefits__fact strong,
.theme-greenleaf-ecommerce .gl-benefits__fact span { display: block; }
.theme-greenleaf-ecommerce .gl-benefits__fact strong,
.theme-greenleaf-ecommerce .gl-benefits__fact b {
	background: linear-gradient(180deg, #fff4aa, #dba62f);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text;
	color: #f4d777;
	font-weight: 800;
	text-shadow: 0 1px 5px rgba(255, 221, 110, .16);
}
.theme-greenleaf-ecommerce .gl-benefits__fact strong { font-size: 22px; line-height: 1.04; }
.theme-greenleaf-ecommerce .gl-benefits__fact span { color: #fff; font-size: 13px; line-height: 1.32; margin-top: 3px; }

@media (max-width: 1199px) {
	.theme-greenleaf-ecommerce .gl-benefits__hero {
		grid-template-columns: minmax(0, 1fr);
		min-height: 210px;
	}
	.theme-greenleaf-ecommerce .gl-benefits__hero-side { display: none; }
	.theme-greenleaf-ecommerce .gl-benefits__container { width: calc(100% - 40px); }
	.theme-greenleaf-ecommerce .gl-benefits__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.theme-greenleaf-ecommerce .gl-benefits__card-content { padding-left: 30px; padding-right: 30px; }
	.theme-greenleaf-ecommerce .gl-benefits__facts { grid-template-columns: repeat(6, minmax(0, 1fr)); row-gap: 17px; }
	.theme-greenleaf-ecommerce .gl-benefits__fact { grid-column: span 2; }
	.theme-greenleaf-ecommerce .gl-benefits__fact:nth-child(3) { border-right: 0; }
	.theme-greenleaf-ecommerce .gl-benefits__fact:nth-child(4) { grid-column: 2 / span 2; }
	.theme-greenleaf-ecommerce .gl-benefits__fact:nth-child(5) { border-right: 0; grid-column: 4 / span 2; }
}

@media (max-width: 767px) {
	.theme-greenleaf-ecommerce .gl-benefits { margin-top: 34px; padding-bottom: 20px; }
	.theme-greenleaf-ecommerce .gl-benefits__hero { min-height: 180px; padding: 24px 18px; }
	.theme-greenleaf-ecommerce .gl-benefits__eyebrow { font-size: clamp(18px, 6vw, 25px); letter-spacing: .1em; }
	.theme-greenleaf-ecommerce .gl-benefits__wordmark { width: min(92vw, 620px); }
	.theme-greenleaf-ecommerce .gl-benefits__hero-copy > p { font-size: 14px; margin-top: 10px; }
	.theme-greenleaf-ecommerce .gl-benefits__container { padding-top: 16px; width: calc(100% - 28px); }
	.theme-greenleaf-ecommerce .gl-benefits__grid { gap: 16px; grid-template-columns: minmax(0, 1fr); }
	.theme-greenleaf-ecommerce .gl-benefits__card { min-height: 0; }
	.theme-greenleaf-ecommerce .gl-benefits__card-content { padding-left: 20px; padding-right: 20px; }
	.theme-greenleaf-ecommerce .gl-benefits__card h3 { font-size: 25px; }
	.theme-greenleaf-ecommerce .gl-benefits__list li { font-size: 14px; min-height: 0; }
	.theme-greenleaf-ecommerce .gl-benefits__facts { grid-template-columns: minmax(0, 1fr); padding: 7px 17px; row-gap: 0; }
	.theme-greenleaf-ecommerce .gl-benefits__fact,
	.theme-greenleaf-ecommerce .gl-benefits__fact:nth-child(4),
	.theme-greenleaf-ecommerce .gl-benefits__fact:nth-child(5) {
		border-bottom: 1px solid rgba(221, 183, 72, .42);
		border-right: 0;
		grid-column: auto;
		padding: 13px 5px;
	}
	.theme-greenleaf-ecommerce .gl-benefits__fact:last-child { border-bottom: 0; }
}

@media (max-width: 390px) {
	.theme-greenleaf-ecommerce .gl-benefits__wordmark { width: 100%; }
	.theme-greenleaf-ecommerce .gl-benefits__eyebrow { font-size: 17px; }
	.theme-greenleaf-ecommerce .gl-benefits__icon-wrap { height: 132px; top: 12px; width: 132px; }
	.theme-greenleaf-ecommerce .gl-benefits__card-content { padding-left: 16px; padding-right: 16px; }
}

@media (prefers-reduced-motion: reduce) {
	.theme-greenleaf-ecommerce .gl-benefits__card { transition: none; }
}
