.gh-membership-page { max-width: 1240px; padding: 0 20px; }

.gh-membership-landing {
	--gh-membership-promo-red: #cf1001;
	--gh-membership-promo-red-hover: #c91f24;
	--gh-membership-promo-red-soft: #fff1f1;
	color: #203d40;
}

.gh-membership-landing h1, .gh-membership-landing h2, .gh-membership-landing h3 { color: #12383b; }
.gh-membership-landing h2 { margin: 0 0 14px; font-size: 31px; line-height: 1.2; }
.gh-membership-landing p { color: #5a7477; line-height: 1.65; }
.gh-membership-landing__eyebrow { margin: 0 0 10px; color: #08777a !important; font-size: 12px; font-weight: 800; letter-spacing: .13em; }
.gh-membership-landing__hero { display: grid; grid-template-columns: 1.03fr .97fr; gap: 54px; align-items: center; padding: 64px 54px; background: linear-gradient(135deg, #fbfdfd, #edf7f7); border: 1px solid #d9e7e8; border-radius: 12px; overflow: hidden; }
.gh-membership-landing__hero h1 { margin: 0; font-size: 46px; line-height: 1.08; }
.gh-membership-landing__hero-copy > p:not(.gh-membership-landing__eyebrow) { max-width: 570px; margin: 18px 0 0; font-size: 18px; }
.gh-membership-landing__actions { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; margin-top: 25px; }
.gh-membership-landing__button { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 0 19px; border: 1px solid #08777a; border-radius: 5px; font-size: 14px; font-weight: 800; text-decoration: none; transition: background-color .15s, border-color .15s, color .15s; }
.gh-membership-landing__button:focus-visible { outline: 3px solid rgba(207, 16, 1, .3); outline-offset: 3px; }
.gh-membership-landing__button--primary { background: var(--gh-membership-promo-red); border-color: var(--gh-membership-promo-red); color: #fff; }
.gh-membership-landing__button--primary:hover { background: var(--gh-membership-promo-red-hover); border-color: var(--gh-membership-promo-red-hover); color: #fff; }
.gh-membership-landing__button--secondary { background: #fff; color: #08777a; }
.gh-membership-landing__button--secondary:hover { background: #edf8f8; color: #056467; }
.gh-membership-landing__trust { display: flex; flex-wrap: wrap; gap: 7px 0; margin: 24px 0 0; padding: 0; list-style: none; }
.gh-membership-landing__trust li { padding: 0 12px; border-right: 1px solid #bdd0d1; color: #275e61; font-size: 13px; font-weight: 700; }
.gh-membership-landing__trust li:first-child { padding-left: 0; color: var(--gh-membership-promo-red); }
.gh-membership-landing__trust li:last-child { border: 0; }
.gh-membership-landing__hero-preview { padding: 10px; background: #fff; border: 1px solid #d4e2e3; border-radius: 8px; box-shadow: 0 18px 34px rgba(23, 69, 72, .12); }
.gh-membership-landing__hero-preview img, .gh-membership-landing__dashboard img { display: block; width: 100%; height: auto; border-radius: 4px; }

.gh-membership-landing__pricing { display: grid; grid-template-columns: 1fr 390px; gap: 64px; align-items: center; margin: 72px 0; padding: 46px 52px; background-color: var(--gh-color-primary-dark); border-radius: 12px; }
.gh-membership-landing__pricing .gh-membership-landing__eyebrow { color: var(--gh-color-white, #fff) !important; }
.gh-membership-landing__pricing h2 { color: #fff; }
.gh-membership-landing__pricing p { max-width: 570px; color: #d4e8e9; }
.gh-membership-landing__pricing .gh-membership-landing__button { margin-top: 12px; }
.gh-membership-landing__price-example { margin: 0; padding: 22px; background: #fff; border-radius: 8px; }
.gh-membership-landing__price-example figcaption { margin-bottom: 15px; color: #647b7e; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; }
.gh-membership-landing__price-example > div { display: flex; justify-content: space-between; align-items: center; padding: 15px 0; border-top: 1px solid #e2ebeb; color: #587073; }
.gh-membership-landing__price-example strong { font-size: 22px; color: #38565a; }
.gh-membership-landing__price-example .is-member { margin: 0 -10px -10px; padding: 15px 10px; background: var(--gh-membership-promo-red-soft); border-radius: 5px; box-shadow: inset 3px 0 0 var(--gh-membership-promo-red); color: var(--gh-membership-promo-red); }
.gh-membership-landing__price-example .is-member strong { color: var(--gh-membership-promo-red); }

.gh-membership-landing__convenience { margin: 72px 0; }
.gh-membership-landing__convenience > h2 { max-width: 600px; }
.gh-membership-landing__cards { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-top: 26px; }
.gh-membership-landing__cards article { padding: 25px 20px; background: #fff; border: 1px solid #dce8e9; border-radius: 8px; box-shadow: 0 5px 14px rgba(31, 69, 72, .05); }
.gh-membership-landing__cards h3 { margin: 0 0 9px; font-size: 17px; }
.gh-membership-landing__cards p { margin: 0; font-size: 14px; }
.gh-membership-landing__dashboard { display: grid; grid-template-columns: .7fr 1.3fr; gap: 58px; align-items: center; margin: 72px 0; padding: 42px; background: #f0f8f8; border: 1px solid #dce9e9; border-radius: 12px; }
.gh-membership-landing__dashboard img { border: 1px solid #d1e0e1; box-shadow: 0 12px 28px rgba(24, 68, 71, .1); }
.gh-membership-landing__steps { margin: 72px 0; text-align: center; }
.gh-membership-landing__steps > p { margin-bottom: 10px; }
.gh-membership-landing__steps ol { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; margin: 28px 0 0; padding: 0; list-style: none; counter-reset: none; }
.gh-membership-landing__steps li { display: grid; justify-items: center; gap: 11px; color: #385e61; font-weight: 700; }
.gh-membership-landing__steps b { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 50%; background: #e2f3f2; color: #08777a; }
.gh-membership-landing__existing { display: flex; gap: 30px; align-items: center; justify-content: space-between; margin: 72px 0; padding: 31px 38px; background: #fff; border: 1px solid #dce7e8; border-radius: 10px; }
.gh-membership-landing__existing h2 { margin-bottom: 5px; font-size: 25px; }
.gh-membership-landing__existing p { max-width: 760px; margin: 0; }
.gh-membership-landing__final { padding: 58px 24px; text-align: center; background: linear-gradient(135deg, #f0f9f9, #e3f2f1); border-radius: 12px; }
.gh-membership-landing__final h2 { font-size: 32px; }
.gh-membership-landing__final p { max-width: 600px; margin: 0 auto; }
.gh-membership-landing__final .gh-membership-landing__actions { justify-content: center; }
.gh-membership-landing__text-link { color: #08777a; font-size: 14px; font-weight: 800; text-decoration: none; }
.gh-membership-landing__text-link:hover { text-decoration: underline; }

@media (max-width: 850px) {
	.gh-membership-landing__hero, .gh-membership-landing__pricing, .gh-membership-landing__dashboard { grid-template-columns: 1fr; gap: 30px; }
	.gh-membership-landing__cards { grid-template-columns: repeat(2, 1fr); }
	.gh-membership-landing__hero { padding: 45px; }
	.gh-membership-landing__hero-preview { max-width: 620px; }
	.gh-membership-landing__pricing { padding: 42px; }
	.gh-membership-landing__dashboard { gap: 28px; }
}

@media (max-width: 560px) {
	.gh-membership-page { padding: 0 12px; }
	.gh-membership-landing h2 { font-size: 26px; }
	.gh-membership-landing__hero { padding: 31px 22px; border-radius: 8px; }
	.gh-membership-landing__hero h1 { font-size: 34px; }
	.gh-membership-landing__hero-copy > p:not(.gh-membership-landing__eyebrow) { font-size: 16px; }
	.gh-membership-landing__trust li { padding: 0 9px 0 0; margin-right: 9px; }
	.gh-membership-landing__pricing, .gh-membership-landing__dashboard { margin: 42px 0; padding: 29px 22px; border-radius: 8px; }
	.gh-membership-landing__cards { grid-template-columns: 1fr; }
	.gh-membership-landing__convenience, .gh-membership-landing__steps { margin: 42px 0; }
	.gh-membership-landing__steps ol { grid-template-columns: 1fr; gap: 18px; }
	.gh-membership-landing__steps li { grid-template-columns: 38px 1fr; justify-items: start; align-items: center; text-align: left; }
	.gh-membership-landing__existing { display: grid; margin: 42px 0; padding: 25px 22px; }
	.gh-membership-landing__existing .gh-membership-landing__button { width: 100%; }
	.gh-membership-landing__final { padding: 40px 22px; border-radius: 8px; }
	.gh-membership-landing__final h2 { font-size: 27px; }
	.gh-membership-landing__actions { display: grid; }
	.gh-membership-landing__actions .gh-membership-landing__button { width: 100%; }
}