/* =========================================================
   MCL 1490 ANNUAL MEMBERSHIP RENEWAL PAGE
   File: annual-membership.css

   Replace the ENTIRE existing file with this stylesheet.
   ========================================================= */

:root {
	--am-red: #6b0d0d;
	--am-red-hover: #4f0909;
	--am-gold: #e0b24a;
	--am-navy: #07101f;
	--am-navy-card: #0d1728;
	--am-dark: #0f141c;
	--am-white: #ffffff;
	--am-light: #f7f5f1;
	--am-text: #111111;
	--am-muted: #565d65;
	--am-border: #d7dadd;
}

/* =========================================================
   PAGE CANVAS AND FULL-WIDTH RESET
   Uses the same basic approach as the Marine Ball page.
   ========================================================= */

html {
	overflow-x: hidden;
}

body:has(.annual-membership-hero),
body:has(.annual-membership-hero) #page,
body:has(.annual-membership-hero) .site,
body:has(.annual-membership-hero) .site-content,
body:has(.annual-membership-hero) .content-area,
body:has(.annual-membership-hero) .site-main,
body:has(.annual-membership-hero) .content-container,
body:has(.annual-membership-hero) .site-container,
body:has(.annual-membership-hero) .entry-content,
body:has(.annual-membership-hero) .entry-content-wrap {
	width: 100% !important;
	max-width: none !important;
	margin: 0 !important;
	padding: 0 !important;
}

body:has(.annual-membership-hero),
body:has(.annual-membership-hero) #page,
body:has(.annual-membership-hero) .site {
	background: var(--am-navy) !important;
}

.annual-membership-hero,
.annual-membership-options-section,
.annual-membership-impact-section,
.annual-membership-details-section,
.annual-membership-final-cta {
	width: 100vw !important;
	max-width: 100vw !important;
	margin-right: calc(50% - 50vw) !important;
	margin-left: calc(50% - 50vw) !important;
}

.annual-membership-hero > .kt-row-column-wrap,
.annual-membership-options-section > .kt-row-column-wrap,
.annual-membership-impact-section > .kt-row-column-wrap,
.annual-membership-details-section > .kt-row-column-wrap,
.annual-membership-final-cta > .kt-row-column-wrap {
	width: min(100% - 80px, 1440px) !important;
	max-width: 1440px !important;
	margin-inline: auto !important;
}

/* =========================================================
   MOBILE HEADER
   The Ball page did not hide the full header. Neither do we.
   We only remove the unused empty upper mobile row.
   ========================================================= */

@media (max-width: 1024px) {
	body:has(.annual-membership-hero) #mobile-header,
	body:has(.annual-membership-hero) .site-mobile-header-wrap,
	body:has(.annual-membership-hero) #mobile-header .site-main-header-wrap,
	body:has(.annual-membership-hero) #mobile-header .site-header-row-container,
	body:has(.annual-membership-hero) #mobile-header .site-header-row-container-inner {
		margin: 0 !important;
		padding-top: 0 !important;
		padding-bottom: 0 !important;
		background: var(--am-navy) !important;
	}

	/*
	 * Kadence can output an unused upper mobile row above the hamburger row.
	 * Hide the complete wrapper, not just the inner element.
	 */
	body:has(.annual-membership-hero) #mobile-header .site-header-upper-wrap,
	body:has(.annual-membership-hero) .site-mobile-header-wrap .site-header-upper-wrap {
		display: none !important;
		height: 0 !important;
		min-height: 0 !important;
		max-height: 0 !important;
		margin: 0 !important;
		padding: 0 !important;
		border: 0 !important;
		overflow: hidden !important;
	}

	body:has(.annual-membership-hero) #mobile-header .site-header-upper-inner-wrap,
	body:has(.annual-membership-hero) .site-mobile-header-wrap .site-header-upper-inner-wrap {
		display: none !important;
		height: 0 !important;
		min-height: 0 !important;
		margin: 0 !important;
		padding: 0 !important;
	}

	body:has(.annual-membership-hero) .site-header-wrap,
	body:has(.annual-membership-hero) .site-header-inner-wrap,
	body:has(.annual-membership-hero) .site-header,
	body:has(.annual-membership-hero) #masthead {
		margin: 0 !important;
		padding-top: 0 !important;
		padding-bottom: 0 !important;
		background: var(--am-navy) !important;
	}
}

/* =========================================================
   HERO
   ========================================================= */

.annual-membership-hero {
	position: relative;
	overflow: hidden;
	min-height: 620px;
	color: var(--am-white);
	background-image:
		linear-gradient(
			90deg,
			rgba(5, 12, 23, 0.97) 0%,
			rgba(5, 12, 23, 0.91) 35%,
			rgba(5, 12, 23, 0.66) 58%,
			rgba(5, 12, 23, 0.34) 100%
		),
		url("https://mcl1490.org/wp-content/uploads/2026/05/MCL1490_hero-image-5-scaled.webp");
	background-position: 58% center;
	background-repeat: no-repeat;
	background-size: cover;
}

.annual-membership-hero::after {
	content: "";
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
	height: 5px;
	background: linear-gradient(
		90deg,
		var(--am-red) 0%,
		var(--am-gold) 50%,
		var(--am-red) 100%
	);
}

.annual-membership-hero > .kt-row-column-wrap {
	position: relative;
	z-index: 2;
	align-items: center;
	gap: 52px;
	padding-top: 78px !important;
	padding-bottom: 70px !important;
}

.annual-membership-eyebrow,
.annual-membership-hero .section-eyebrow {
	margin-bottom: 18px;
	color: var(--am-gold);
	font-size: 14px;
	font-weight: 800;
	letter-spacing: 0.16em;
	text-transform: uppercase;
}

.annual-membership-title {
	max-width: 600px;
	margin: 0 0 22px;
	color: var(--am-white);
	font-size: clamp(3rem, 6vw, 5.4rem);
	line-height: 0.98;
	letter-spacing: -0.045em;
}

.annual-membership-hero-copy {
	max-width: 700px;
	margin: 0 0 30px;
	color: rgba(255, 255, 255, 0.9);
	font-size: clamp(1.05rem, 1.35vw, 1.25rem);
	line-height: 1.68;
}

.annual-membership-hero-actions {
	gap: 14px;
}

.annual-membership-hero-panel {
	max-width: 510px;
	margin-left: auto;
	padding: 34px;
	border: 1px solid rgba(255, 255, 255, 0.14);
	border-radius: 12px;
	background: rgba(5, 12, 23, 0.88);
	box-shadow: 0 24px 60px rgba(0, 0, 0, 0.3);
	backdrop-filter: blur(7px);
	-webkit-backdrop-filter: blur(7px);
}

.annual-membership-benefit {
	display: flex;
	align-items: flex-start;
	gap: 18px;
	margin: 0;
	padding: 24px 0;
	border-bottom: 1px solid rgba(255, 255, 255, 0.11);
}

.annual-membership-benefit:first-child {
	padding-top: 0;
}

.annual-membership-benefit:last-child {
	padding-bottom: 0;
	border-bottom: 0;
}

.annual-membership-benefit-icon {
	display: grid;
	flex: 0 0 48px;
	width: 48px;
	height: 48px;
	place-items: center;
	border: 1px solid rgba(224, 178, 74, 0.6);
	border-radius: 50%;
	color: var(--am-gold);
	font-size: 0.82rem;
	font-weight: 900;
	letter-spacing: 0.08em;
}

.annual-membership-benefit-copy h3 {
	margin: 0 0 7px;
	color: var(--am-white);
	font-size: 1.15rem;
	line-height: 1.25;
}

.annual-membership-benefit-copy p {
	margin: 0;
	color: rgba(255, 255, 255, 0.74);
	font-size: 0.96rem;
	line-height: 1.55;
}

/* =========================================================
   MEMBERSHIP OPTIONS
   ========================================================= */

.annual-membership-options-section {
	background: var(--am-light);
}

.annual-membership-options-section > .kt-row-column-wrap {
	padding-top: 84px !important;
	padding-bottom: 84px !important;
}

.annual-membership-section-title {
	margin-bottom: 14px;
	color: #0b1726;
}

.annual-membership-options-intro {
	max-width: 760px;
	margin: 0 auto 46px;
	color: #5c626b;
}

.annual-membership-price-grid {
	max-width: 1100px;
	margin: 0 auto;
	gap: 28px;
	align-items: stretch;
	overflow: visible !important;
}

.annual-membership-price-grid > .wp-block-column {
	display: flex;
	overflow: visible !important;
}

.annual-membership-price-card {
	position: relative;
	display: flex;
	width: 100%;
	min-height: 100%;
	flex-direction: column;
	padding: 40px;
	border: 1px solid var(--am-border);
	border-radius: 10px;
	background: var(--am-white);
	box-shadow: 0 14px 34px rgba(11, 23, 38, 0.07);
	transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

.annual-membership-price-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 20px 44px rgba(11, 23, 38, 0.12);
}

.annual-membership-price-card-featured {
	overflow: visible !important;
	border: 2px solid var(--am-red);
	box-shadow: 0 18px 45px rgba(107, 13, 13, 0.14);
}

.annual-membership-card-kicker {
	margin: 0 0 12px;
	color: var(--am-red);
	font-size: 0.76rem;
	font-weight: 900;
	letter-spacing: 0.13em;
}

.annual-membership-card-title {
	margin: 0 0 18px;
	color: #0b1726;
	font-size: clamp(1.55rem, 2vw, 2rem);
	line-height: 1.15;
}

.annual-membership-price-row {
	display: flex;
	align-items: baseline;
	gap: 11px;
	margin-bottom: 20px;
}

.annual-membership-price {
	color: var(--am-red);
	font-size: clamp(2.7rem, 4vw, 3.6rem);
	font-weight: 800;
	line-height: 1;
	letter-spacing: -0.04em;
}

.annual-membership-price-term {
	color: #343940;
	font-size: 1rem;
	font-weight: 700;
}

.annual-membership-card-copy {
	margin: 0 0 22px;
	color: #535a63;
	line-height: 1.68;
}

.annual-membership-feature-list {
	margin: 0 0 30px;
	padding-left: 0;
	list-style: none;
}

.annual-membership-feature-list li {
	position: relative;
	margin: 0 0 12px;
	padding-left: 28px;
	color: #30363e;
}

.annual-membership-feature-list li::before {
	content: "✓";
	position: absolute;
	top: 0;
	left: 0;
	color: var(--am-red);
	font-weight: 900;
}

.annual-membership-price-card .wp-block-buttons {
	margin-top: auto;
}

.annual-membership-payment-button,
.annual-membership-payment-button .wp-block-button__link {
	width: 100%;
}

.annual-membership-payment-button .wp-block-button__link {
	display: flex !important;
	min-height: 48px;
	align-items: center;
	justify-content: center;
	padding: 12px 20px !important;
	line-height: 1.15 !important;
	text-align: center;
	text-decoration: none !important;
}

/* Recommended image badge */

.annual-membership-recommended-badge {
	position: absolute;
	top: -46px;
	right: -36px;
	z-index: 30;
	width: 112px;
	height: auto;
	margin: 0 !important;
	padding: 0 !important;
	overflow: visible !important;
	border: 0 !important;
	border-radius: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
	line-height: 0 !important;
	pointer-events: none;
}

.annual-membership-recommended-badge img {
	display: block !important;
	width: 112px !important;
	max-width: none !important;
	height: auto !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
	background: transparent !important;
	filter: drop-shadow(0 8px 12px rgba(0, 0, 0, 0.22));
}

/* Eligibility */

.annual-membership-eligibility-note {
	max-width: 1100px;
	margin: 28px auto 0;
	padding: 26px 30px;
	border: 1px solid #e4d9c6;
	border-radius: 10px;
	background: linear-gradient(135deg, #fffaf0, #f7efe1);
}

.annual-membership-eligibility-note h3 {
	margin: 0 0 8px;
	color: var(--am-red);
	font-size: 1.15rem;
}

.annual-membership-eligibility-note p {
	margin: 0;
	color: #454a51;
	line-height: 1.65;
}

.annual-membership-stripe-note {
	margin: 22px 0 0;
	color: #6a7078;
	font-size: 0.9rem;
	line-height: 1.55;
}

/* =========================================================
   IMPACT
   ========================================================= */

.annual-membership-impact-section {
	background: radial-gradient(
		circle at 50% 0%,
		#172b43 0%,
		#081321 56%,
		#050d17 100%
	);
}

.annual-membership-impact-section > .kt-row-column-wrap {
	padding-top: 82px !important;
	padding-bottom: 82px !important;
}

.annual-membership-impact-section .section-title,
.annual-membership-impact-title {
	color: var(--am-white);
}

.annual-membership-impact-grid {
	margin-top: 42px;
	gap: 0;
}

.annual-membership-impact-card {
	height: 100%;
	padding: 18px 28px;
	border-right: 1px solid rgba(255, 255, 255, 0.16);
	text-align: center;
}

.annual-membership-impact-grid > .wp-block-column:last-child .annual-membership-impact-card {
	border-right: 0;
}

.annual-membership-impact-number {
	margin: 0 0 15px;
	color: var(--am-gold);
	font-size: 0.86rem;
	font-weight: 900;
	letter-spacing: 0.16em;
}

.annual-membership-impact-card h3 {
	margin: 0 0 12px;
	color: var(--am-white);
	font-size: 1.2rem;
}

.annual-membership-impact-card p {
	margin: 0;
	color: rgba(255, 255, 255, 0.74);
	line-height: 1.62;
}

/* =========================================================
   DETAILS
   ========================================================= */

.annual-membership-details-section {
	background: var(--am-white);
}

.annual-membership-details-section > .kt-row-column-wrap {
	padding-top: 82px !important;
	padding-bottom: 82px !important;
}

.annual-membership-details-grid {
	max-width: 1050px;
	margin: 40px auto 0;
	gap: 28px;
}

.annual-membership-detail-card {
	height: 100%;
	padding: 32px;
	border: 1px solid #dde0e3;
	border-radius: 10px;
	background: #f8f8f7;
}

.annual-membership-detail-card h3 {
	margin: 0 0 12px;
	color: #101c2b;
}

.annual-membership-detail-card p {
	margin: 0;
	color: var(--am-muted);
	line-height: 1.7;
}

.annual-membership-records-note {
	max-width: 900px;
	margin: 30px auto 0;
	padding: 18px 22px;
	border-left: 4px solid var(--am-gold);
	background: #f7f3eb;
	color: #454b52;
	line-height: 1.65;
	text-align: left !important;
}

/* =========================================================
   FINAL CTA
   ========================================================= */

.annual-membership-final-cta {
	position: relative;
	overflow: hidden;
	background: var(--am-red);
}

.annual-membership-final-cta::before {
	content: "";
	position: absolute;
	inset: 0;
	opacity: 0.07;
	background-image: linear-gradient(
		135deg,
		transparent 25%,
		rgba(255, 255, 255, 0.14) 25%,
		rgba(255, 255, 255, 0.14) 26%,
		transparent 26%,
		transparent 75%,
		rgba(255, 255, 255, 0.14) 75%,
		rgba(255, 255, 255, 0.14) 76%,
		transparent 76%
	);
	background-size: 44px 44px;
}

.annual-membership-final-cta > .kt-row-column-wrap {
	position: relative;
	z-index: 2;
	padding-top: 80px !important;
	padding-bottom: 80px !important;
}

.annual-membership-final-cta .section-eyebrow {
	color: var(--am-gold);
}

.annual-membership-cta-title,
.annual-membership-final-cta .section-title {
	color: var(--am-white);
}

.annual-membership-cta-copy {
	max-width: 850px;
	margin: 0 auto 30px;
	color: rgba(255, 255, 255, 0.88);
}

.annual-membership-cta-actions {
	gap: 14px;
}

.annual-membership-final-cta .btn-primary .wp-block-button__link {
	border: 1px solid var(--am-white) !important;
	background: var(--am-white) !important;
	color: var(--am-red) !important;
}

.annual-membership-final-cta .btn-primary .wp-block-button__link:hover,
.annual-membership-final-cta .btn-primary .wp-block-button__link:focus {
	background: #f3f3f3 !important;
	color: var(--am-red-hover) !important;
}

.annual-membership-final-cta .btn-outline-light .wp-block-button__link {
	border-color: var(--am-white) !important;
	background: transparent !important;
	color: var(--am-white) !important;
}

/* =========================================================
   BUTTON NORMALIZATION
   ========================================================= */

.annual-membership-hero .wp-block-button__link,
.annual-membership-options-section .wp-block-button__link,
.annual-membership-final-cta .wp-block-button__link {
	display: inline-flex !important;
	min-height: 46px;
	align-items: center;
	justify-content: center;
	padding: 12px 22px !important;
	border-radius: 4px !important;
	font-weight: 800;
	line-height: 1.1 !important;
	text-align: center;
	text-decoration: none !important;
	transition:
		transform 0.2s ease,
		background-color 0.2s ease,
		border-color 0.2s ease,
		color 0.2s ease;
}

.annual-membership-hero .wp-block-button__link:hover,
.annual-membership-options-section .wp-block-button__link:hover,
.annual-membership-final-cta .wp-block-button__link:hover {
	transform: translateY(-1px);
}

/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 1024px) {
	.annual-membership-hero > .kt-row-column-wrap,
	.annual-membership-options-section > .kt-row-column-wrap,
	.annual-membership-impact-section > .kt-row-column-wrap,
	.annual-membership-details-section > .kt-row-column-wrap,
	.annual-membership-final-cta > .kt-row-column-wrap {
		width: min(100% - 36px, 960px) !important;
	}

	.annual-membership-hero {
		min-height: 600px;
		background-position: 62% center;
	}

	.annual-membership-title {
		max-width: 520px;
	}

	.annual-membership-hero-panel {
		padding: 28px;
	}

	.annual-membership-price-card {
		padding: 32px;
	}

	.annual-membership-recommended-badge {
		top: -36px;
		right: -16px;
		width: 96px;
	}

	.annual-membership-recommended-badge img {
		width: 96px !important;
	}

	.annual-membership-impact-grid {
		flex-wrap: wrap !important;
	}

	.annual-membership-impact-grid > .wp-block-column {
		flex-basis: 50% !important;
	}

	.annual-membership-impact-card {
		border-bottom: 1px solid rgba(255, 255, 255, 0.16);
	}
}

/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 767px) {
	html,
	body:has(.annual-membership-hero) {
		width: 100%;
		max-width: 100%;
		overflow-x: hidden;
		background: var(--am-navy) !important;
	}

	body:has(.annual-membership-hero) #page,
	body:has(.annual-membership-hero) .site,
	body:has(.annual-membership-hero) .site-content,
	body:has(.annual-membership-hero) .content-area,
	body:has(.annual-membership-hero) .site-main,
	body:has(.annual-membership-hero) .content-container,
	body:has(.annual-membership-hero) .site-container,
	body:has(.annual-membership-hero) .entry-content,
	body:has(.annual-membership-hero) .entry-content-wrap {
		width: 100% !important;
		max-width: 100% !important;
		margin: 0 !important;
		padding: 0 !important;
	}

	.annual-membership-hero,
	.annual-membership-options-section,
	.annual-membership-impact-section,
	.annual-membership-details-section,
	.annual-membership-final-cta {
		width: 100% !important;
		max-width: 100% !important;
		margin-right: 0 !important;
		margin-left: 0 !important;
	}

	.annual-membership-hero > .kt-row-column-wrap,
	.annual-membership-options-section > .kt-row-column-wrap,
	.annual-membership-impact-section > .kt-row-column-wrap,
	.annual-membership-details-section > .kt-row-column-wrap,
	.annual-membership-final-cta > .kt-row-column-wrap {
		width: 100% !important;
		max-width: 100% !important;
		margin: 0 !important;
		padding-right: 18px !important;
		padding-left: 18px !important;
	}

	/* Compact hero so payment choices appear much sooner. */

	.annual-membership-hero {
		min-height: auto;
		background-image:
			linear-gradient(
				180deg,
				rgba(5, 12, 23, 0.84) 0%,
				rgba(5, 12, 23, 0.95) 58%,
				rgba(5, 12, 23, 0.99) 100%
			),
			url("https://mcl1490.org/wp-content/uploads/2026/07/annual-membership-hero.webp");
		background-position: 60% center;
		background-size: cover;
	}

	.annual-membership-hero > .kt-row-column-wrap {
		display: block !important;
		padding-top: 28px !important;
		padding-bottom: 30px !important;
	}

	.annual-membership-eyebrow,
	.annual-membership-hero .section-eyebrow {
		margin-bottom: 12px;
		font-size: 0.7rem;
		letter-spacing: 0.14em;
	}

	.annual-membership-title {
		max-width: 100%;
		margin-bottom: 14px;
		font-size: clamp(2.1rem, 10.5vw, 3rem);
		line-height: 0.98;
		letter-spacing: -0.04em;
	}

	.annual-membership-hero-copy {
		margin-bottom: 20px;
		font-size: 0.96rem;
		line-height: 1.55;
	}

	.annual-membership-hero-actions,
	.annual-membership-cta-actions {
		display: flex;
		align-items: stretch;
		flex-direction: column;
		gap: 9px;
	}

	.annual-membership-hero-actions .wp-block-button,
	.annual-membership-hero-actions .wp-block-button__link,
	.annual-membership-cta-actions .wp-block-button,
	.annual-membership-cta-actions .wp-block-button__link {
		width: 100%;
	}

	/*
	 * Hide the desktop benefit panel on phones.
	 * Existing members reach the payment choices immediately.
	 */
	.annual-membership-hero-panel {
		display: none !important;
	}

	/* Options */

	.annual-membership-options-section > .kt-row-column-wrap {
		padding-top: 44px !important;
		padding-bottom: 48px !important;
	}

	.annual-membership-options-intro {
		margin-bottom: 28px;
		font-size: 0.94rem;
		line-height: 1.55;
	}

	.annual-membership-price-grid,
	.annual-membership-details-grid {
		gap: 16px;
	}

	.annual-membership-price-grid > .wp-block-column,
	.annual-membership-details-grid > .wp-block-column {
		width: 100%;
	}

	.annual-membership-price-card {
		padding: 24px 19px;
	}

	.annual-membership-price-card:hover {
		transform: none;
	}

	.annual-membership-price-card-featured {
		margin-top: 10px;
	}

	.annual-membership-card-title {
		font-size: 1.45rem;
	}

	.annual-membership-price-row {
		align-items: flex-end;
		gap: 8px;
	}

	.annual-membership-price {
		font-size: 2.65rem;
	}

	.annual-membership-price-term {
		padding-bottom: 4px;
		font-size: 0.86rem;
	}

	.annual-membership-card-copy,
	.annual-membership-feature-list li {
		font-size: 0.92rem;
	}

	.annual-membership-recommended-badge {
		top: -24px;
		right: -2px;
		width: 68px;
	}

	.annual-membership-recommended-badge img {
		width: 68px !important;
	}

	.annual-membership-eligibility-note {
		margin-top: 18px;
		padding: 19px;
	}

	.annual-membership-stripe-note {
		margin-top: 16px;
		font-size: 0.78rem;
		line-height: 1.45;
	}

	/* Impact */

	.annual-membership-impact-section > .kt-row-column-wrap {
		padding-top: 50px !important;
		padding-bottom: 50px !important;
	}

	.annual-membership-impact-grid {
		margin-top: 24px;
	}

	.annual-membership-impact-grid > .wp-block-column {
		flex-basis: 100% !important;
	}

	.annual-membership-impact-card,
	.annual-membership-impact-grid > .wp-block-column:last-child .annual-membership-impact-card {
		padding: 21px 8px;
		border-right: 0;
		border-bottom: 1px solid rgba(255, 255, 255, 0.16);
	}

	.annual-membership-impact-grid > .wp-block-column:last-child .annual-membership-impact-card {
		border-bottom: 0;
	}

	/* Details */

	.annual-membership-details-section > .kt-row-column-wrap {
		padding-top: 48px !important;
		padding-bottom: 48px !important;
	}

	.annual-membership-details-grid {
		margin-top: 24px;
	}

	.annual-membership-detail-card {
		padding: 21px 19px;
	}

	.annual-membership-records-note {
		margin-top: 18px;
		padding: 15px 16px;
		font-size: 0.88rem;
	}

	/* CTA */

	.annual-membership-final-cta {
		text-align: center;
	}

	.annual-membership-final-cta > .kt-row-column-wrap {
		padding-top: 48px !important;
		padding-bottom: 48px !important;
	}

	.annual-membership-cta-copy {
		margin-bottom: 20px;
		font-size: 0.94rem;
		line-height: 1.55;
	}
}

/* =========================================================
   SMALL MOBILE
   ========================================================= */

@media (max-width: 420px) {
	.annual-membership-title {
		font-size: 2.05rem;
	}

	.annual-membership-price-card {
		padding: 22px 16px;
	}

	.annual-membership-recommended-badge {
		top: -22px;
		right: -1px;
		width: 64px;
	}

	.annual-membership-recommended-badge img {
		width: 64px !important;
	}
}

@media (max-width: 767px) {
	.annual-membership-hero {
		background-image:
			linear-gradient(
				180deg,
				rgba(5, 12, 23, 0.9) 0%,
				rgba(5, 12, 23, 0.96) 58%,
				rgba(5, 12, 23, 0.995) 100%
			),
			url("https://mcl1490.org/wp-content/uploads/2026/07/annual-membership-hero.webp");
	}
}

/* ==========================================
   Center Final CTA Content
   ========================================== */

.annual-membership-final-cta {
	text-align: center;
}

.annual-membership-final-cta .kt-row-column-wrap {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}

.annual-membership-final-cta .section-eyebrow,
.annual-membership-final-cta .annual-membership-cta-title,
.annual-membership-final-cta .annual-membership-cta-copy {
	text-align: center;
	margin-left: auto;
	margin-right: auto;
}

.annual-membership-final-cta .annual-membership-cta-title {
	max-width: 760px;
	font-size: clamp(2rem, 3vw, 2.8rem);
	margin-bottom: 18px;
}

.annual-membership-final-cta .annual-membership-cta-copy {
	max-width: 760px;
	margin-bottom: 32px;
	line-height: 1.7;
}

.annual-membership-final-cta .annual-membership-cta-actions {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 14px;
	flex-wrap: wrap;
}