/**
 * NRC Action — Front Page Image Treatments
 *
 * Overrides for the homepage's .hero and .battleground sections to
 * add background image + navy gradient overlay treatment, matching
 * the site-wide image system used on the popup and battleground page.
 *
 * Enqueued only on the front page via functions.php.
 */

:root {
	--nrca-red: #de120c;
	--nrca-navy: #011e6b;
	--nrca-green: #13aa22;
	--nrca-black: #0d0d0d;
	--nrca-white: #ffffff;
	--nrca-cream: #f8f5ee;
}

/* ══════════════════════════════════════════════════════════
 * HERO — "Fighting for Nevada."
 * Vegas Strip background with navy overlay
 * ══════════════════════════════════════════════════════════ */

.hero {
	position: relative;
	background-color: var(--nrca-navy);
	background-image:
		linear-gradient(180deg, rgba(1, 30, 107, 0.65) 0%, rgba(1, 30, 107, 0.82) 55%, rgba(1, 30, 107, 0.93) 100%),
		url('https://nrcaction.com/wp-content/uploads/2026/07/RR_LVCVA_Strip_Caesars_Bellagio_Paris_SM_1__704abf3c-7d0a-4d56-ae67-3167dc7784b4.jpg');
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
	border-left: 8px solid var(--nrca-red);
	color: var(--nrca-white);
	overflow: hidden;
}

.hero .hero-bg-text {
	color: var(--nrca-white);
	opacity: 0.05;
}

.hero .hero-kicker {
	color: var(--nrca-red) !important;
	opacity: 1 !important;
	font-weight: 900;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

.hero .hero-dot {
	background: var(--nrca-red) !important;
}

.hero .hero-headline {
	color: var(--nrca-white) !important;
	opacity: 1 !important;
	text-shadow: 0 2px 24px rgba(0, 0, 0, 0.5);
}

.hero .hero-headline span {
	color: var(--nrca-white) !important;
	opacity: 1 !important;
}

.hero .hero-desc {
	color: var(--nrca-white) !important;
	opacity: 1 !important;
	text-shadow: 0 1px 12px rgba(0, 0, 0, 0.4);
}

.hero .btn-primary {
	background: var(--nrca-red) !important;
	color: var(--nrca-white) !important;
	border: none !important;
	opacity: 1 !important;
	transition: background 0.15s, color 0.15s;
}

.hero .btn-primary:hover {
	background: var(--nrca-white) !important;
	color: var(--nrca-red) !important;
}

.hero .btn-secondary {
	background: transparent !important;
	color: var(--nrca-white) !important;
	border: 2px solid var(--nrca-white) !important;
	opacity: 1 !important;
	transition: background 0.15s, color 0.15s;
}

.hero .btn-secondary:hover {
	background: var(--nrca-white) !important;
	color: var(--nrca-navy) !important;
}

/* ══════════════════════════════════════════════════════════
 * BATTLEGROUND PREVIEW SECTION — "Battle-ground."
 * Polling place background with navy overlay
 * ══════════════════════════════════════════════════════════ */

.battleground {
	position: relative;
	background-color: var(--nrca-navy);
	background-image:
		linear-gradient(180deg, rgba(1, 30, 107, 0.68) 0%, rgba(1, 30, 107, 0.85) 55%, rgba(1, 30, 107, 0.95) 100%),
		url('https://nrcaction.com/wp-content/uploads/2026/07/gettyimages-1440124076-a14e91515bebf1e651b177e398da8ff9f59b69af-scaled.jpg');
	background-size: cover;
	background-position: center 20%;
	background-repeat: no-repeat;
	border-left: 8px solid var(--nrca-red);
	color: var(--nrca-white);
	overflow: hidden;
	margin: 0 !important;
	border-top: none !important;
}

.battleground .bg-year {
	color: var(--nrca-white);
	opacity: 0.06;
}

.battleground .bg-kicker {
	color: var(--nrca-red) !important;
	opacity: 1 !important;
	font-weight: 900;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

.battleground .bg-headline {
	color: var(--nrca-white) !important;
	opacity: 1 !important;
	text-shadow: 0 2px 24px rgba(0, 0, 0, 0.45);
}

.battleground .bg-body {
	color: var(--nrca-white) !important;
	opacity: 1 !important;
	text-shadow: 0 1px 12px rgba(0, 0, 0, 0.4);
}

.battleground .bg-body strong {
	color: var(--nrca-white) !important;
	background: var(--nrca-red) !important;
	background-color: var(--nrca-red) !important;
	opacity: 1 !important;
	padding: 2px 10px 4px;
	margin: 0 2px;
	display: inline-block;
	line-height: 1.35;
	text-shadow: none;
	font-weight: 900;
}

.battleground .btn-primary {
	background: var(--nrca-red);
	color: var(--nrca-white);
	border: none;
	transition: background 0.15s, color 0.15s;
}

.battleground .btn-primary:hover {
	background: var(--nrca-white);
	color: var(--nrca-red);
}

.battleground .btn-secondary {
	background: transparent;
	color: var(--nrca-white);
	border: 2px solid var(--nrca-white);
	transition: background 0.15s, color 0.15s;
}

.battleground .btn-secondary:hover {
	background: var(--nrca-white);
	color: var(--nrca-navy);
}

/* ══════════════════════════════════════════════════════════
 * PRE-FOOTER IMAGE BAND — Summerlin community
 * Full-bleed photographic break sitting between the red
 * "Take Action" CTA and the navy footer. Red left accent bar
 * ties it to the site-wide image system; the bottom navy fade
 * dissolves the photo into the footer with no seam.
 * Purely decorative (no text), so the markup carries aria-hidden.
 * ══════════════════════════════════════════════════════════ */

.prefooter-band {
	position: relative;
	min-height: clamp(300px, 36vw, 460px);
	background-color: var(--nrca-navy);
	background-image:
		linear-gradient(180deg, rgba(1, 30, 107, 0) 52%, rgba(1, 30, 107, 0.55) 80%, rgba(1, 30, 107, 1) 100%),
		url('https://nrcaction.com/wp-content/uploads/2026/07/summerlin-master-planned-community.jpg');
	background-size: cover;
	background-position: center 55%;
	background-repeat: no-repeat;
	border-left: 8px solid var(--nrca-red);
	margin: 0;
	overflow: hidden;
}

@media (max-width: 640px) {
	.prefooter-band {
		min-height: 240px;
		background-position: center 50%;
	}
}

@media (max-width: 400px) {
	.prefooter-band {
		min-height: 200px;
	}
}