/**
 * Courthouse Hero page template styles.
 */

:root {
	--chd-hero-navy: #0b1f3a;
	--chd-hero-red: #e63329;
	--chd-hero-text: #042e56;
}

/* Hide main content sidebars only — keep header/top widget areas visible */
body.chd-no-sidebar .site-content .sidebar,
body.chd-no-sidebar .site-content #secondary,
body.chd-no-sidebar #secondary.sidebar,
body.chd-no-sidebar aside.sidebar {
	display: none !important;
}

body.chd-no-sidebar .site-content .content-area,
body.chd-no-sidebar #primary,
body.chd-no-sidebar .content-area {
	width: 100% !important;
	max-width: 100% !important;
	float: none !important;
}

body.chd-hero-template .site-content,
body.chd-hero-template #content,
body.chd-hero-template .content-area,
body.chd-hero-template .site-main,
body.chd-hero-template #main,
body.chd-hero-template .hfeed.site {
	max-width: none;
	width: 100%;
	padding-left: 0;
	padding-right: 0;
	overflow-x: clip;
}

body.chd-hero-template .site-inner {
	padding-top: 0;
}

/* Hero section — full viewport width background */
.chd-hero-page {
	width: 100%;
	max-width: 100%;
}

.chd-hero {
	position: relative;
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	min-height: 420px;
	background-color: #f7f8fa;
	background-image: var(--chd-hero-bg, none);
	background-position: right center;
	background-size: cover;
	background-repeat: no-repeat;
	overflow: hidden;
}

.chd-hero::before {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(
		90deg,
		#ffffff 0%,
		#ffffff 35%,
		rgba(255, 255, 255, 0.92) 50%,
		rgba(255, 255, 255, 0.4) 70%,
		transparent 100%
	);
	pointer-events: none;
}

.chd-hero__inner {
	position: relative;
	z-index: 1;
	max-width: 1200px;
	margin: 0 auto;
	padding: 100px 5%;
}

.chd-hero-page--county .chd-hero__inner {
	padding: 110px 5% 200px;
}

.chd-hero__content {
	max-width: 720px;
}

/* Title box with double border */
.chd-hero__title-box {
	display: inline-block;
	padding: 20px 28px;
	margin: 0 0 24px;
	background: var(--chd-hero-navy);
	border: 3px solid var(--chd-hero-navy);
	outline: 2px solid #ffffff;
	outline-offset: -8px;
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.35);
}

.chd-hero__title {
	margin: 0;
	font-style: normal;
	font-family: "PoppinsSB";
	font-weight: 700;
	font-size: 45px;
	line-height: 45px;
	color: #ffffff;
}

.chd-hero__paragraph {
	margin: 0 0 28px;
	font-style: normal;
	font-weight: 400;
	font-size: 31px;
	line-height: 32px;
	color: #042e56;
	max-width: 100%;
}

/* CTA button */
.chd-hero__button {
	display: inline-block;
	padding: 14px 28px;
	background: var(--chd-hero-red);
	color: #ffffff !important;
	font-size: 0.8125rem;
	font-family: "PoppinsSB";
	letter-spacing: 0.06em;
	text-transform: uppercase;
	text-decoration: none;
	border: 2px solid var(--chd-hero-red);
	box-shadow: inset 0 0 0 1px #ffffff;
	transition: background 0.2s ease, border-color 0.2s ease;
}

.chd-hero__button:hover,
.chd-hero__button:focus {
	background: #cc2a22;
	border-color: #cc2a22;
	color: #ffffff !important;
}

/* Content area below hero — full-width band, contained inner */
.chd-hero-page__content {
	width: 100%;
	background: #ffffff;
	overflow: visible;
}

.chd-hero-page__content-inner {
	max-width: 1200px;
	margin: 0 auto;
	padding: 80px 0;
	overflow: visible;
}

.chd-hero-page__content-inner > .chd-county-cards,
.chd-hero-page__content-inner > .chd-courthouse-search {
	width: 100%;
}

.chd-hero-page__content-inner p:has(.chd-county-cards),
.chd-hero-page__content-inner p:has(.chd-courthouse-search) {
	margin: 0;
	padding: 0;
}

.chd-hero-page__content-inner > p:empty {
	display: none;
}

@media (max-width: 768px) {
	.chd-hero {
		min-height: 360px;
		background-position: right center;
	}

	.chd-hero::before {
		background: linear-gradient(
			180deg,
			#ffffff 0%,
			rgba(255, 255, 255, 0.95) 55%,
			rgba(255, 255, 255, 0.75) 100%
		);
	}

	.chd-hero__inner {
		padding: 60px 5%;
	}

	.chd-hero-page--county .chd-hero__inner {
		padding: 80px 5% 120px;
	}

	.chd-hero__content {
		max-width: 100%;
	}

	.chd-hero__title-box {
		padding: 16px 20px;
	}

	.chd-hero__title {
		font-size: 28px;
		line-height: 28px;
	}

	.chd-hero__paragraph {
		font-size: 22px;
		line-height: 28px;
	}

	.chd-hero-page__content-inner {
		padding: 48px 0 64px;
	}
}