/* ==========================================================================
   Hayes Hunter PC – site-wide additions (navigation + footer)
   Loaded after main.css from header.php. Keeps the theme's existing markup.
   ========================================================================== */

:root {
	--hh-forest: #0c3227;
	--hh-forest-2: #12402f;
	--hh-sage: #699221;
	--hh-sage-dark: #557a17;
	--hh-gold: #e1be63;
	--hh-gold-ink: #8a6a1f;
	--hh-cream: #f6f3ec;
	--hh-line: #e3ddd0;
	--hh-ink: #1b2620;
	--hh-muted: #56635c;
}

/* Tighter spacing so seven top-level items fit beside the logo + CTA */
#main-nav ul#nav-list > li { padding-right: 14px; }
#main-nav ul#nav-list > li > a { font-size: .95rem; letter-spacing: .02em; }

/* Group labels inside the standard (green) dropdowns */
#nav-list ul.dropdown li.hh-dd-title,
#nav-list-mobile ul.dropdown li.hh-dd-title {
	font-family: "DM Sans", sans-serif;
	font-size: .7rem;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--hh-gold);
	padding-top: 14px;
	padding-bottom: 2px;
}
#nav-list ul.dropdown li.hh-dd-title:first-child { padding-top: 0; }
#nav-list ul.dropdown li a { font-size: .95rem; }

/* ---------- Real Estate mega menu ---------- */
#main-nav ul#nav-list > li.hh-has-mega { position: static; }

.hh-mega {
	position: absolute;
	left: 50%;
	top: calc(100% + 24px);          /* clears the tall logo in the un-scrolled header */
	width: min(1180px, 96vw);
	transform: translate(-50%, 8px);
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	/* closing waits .2s (grace period for the pointer), then fades */
	transition: opacity .18s ease .2s, transform .18s ease .2s, visibility 0s linear .38s;
	z-index: 1000001;
}
/* Invisible hover bridge: a strip directly under the "Real Estate Law" link
   (same width as the link) that fills the gap down to the panel, so the
   pointer never leaves the hover area. Only active while the menu is open,
   so it never blocks the neighbouring menu items. */
#main-nav ul#nav-list > li.hh-has-mega > a { position: relative; }
#main-nav ul#nav-list > li.hh-has-mega > a::after {
	content: "";
	position: absolute;
	left: -12px;
	right: -12px;
	top: 100%;
	height: 64px;
	display: none;
}
#main-nav ul#nav-list > li.hh-has-mega:hover > a::after { display: block; }
#nav-list li.hh-has-mega:hover > .hh-mega,
#nav-list li.hh-has-mega:focus-within > .hh-mega {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	transform: translate(-50%, 0);
	transition: opacity .18s ease, transform .18s ease, visibility 0s;
}
#header.scrolling .hh-mega { top: 100%; }

.hh-mega-inner {
	display: grid;
	grid-template-columns: repeat(4, 1fr) 1.15fr;
	gap: 0;
	background: #fff;
	border-top: 3px solid var(--hh-sage);
	box-shadow: 0 24px 60px rgba(12, 50, 39, .22);
	border-radius: 0 0 6px 6px;
	overflow: hidden;
}
.hh-mega-col { padding: 28px 22px 26px; border-right: 1px solid var(--hh-line); }
.hh-mega-col ul { list-style: none; margin: 0; padding: 0; }
.hh-mega-col li { padding: 0; font-size: 1rem; }
.hh-mega-col a {
	display: block;
	padding: 6px 0;
	color: var(--hh-ink) !important;
	font-size: .93rem;
	line-height: 1.35;
	border-bottom: 0 !important;
	transition: color .15s ease, transform .15s ease;
}
.hh-mega-col a:hover,
.hh-mega-col a:focus-visible { color: var(--hh-sage) !important; transform: translateX(3px); }

.hh-mega-title {
	font-family: "DM Sans", sans-serif !important;
	font-size: .7rem !important;
	font-weight: 700 !important;
	letter-spacing: .14em !important;
	text-transform: uppercase;
	color: var(--hh-gold-ink) !important;
	margin: 0 0 10px !important;
	line-height: 1.3 !important;
}
.hh-mega-cta {
	padding: 28px 26px;
	background: var(--hh-forest);
	color: #fff;
	display: flex;
	flex-direction: column;
	gap: 10px;
}
.hh-mega-cta .hh-mega-title { color: var(--hh-gold) !important; }
.hh-mega-cta p { color: rgba(255,255,255,.82) !important; font-size: .93rem !important; margin: 0 !important; line-height: 1.5 !important; }
.hh-mega-cta a { color: #fff !important; font-weight: 600; font-size: .95rem; border-bottom: 0 !important; }
.hh-mega-cta a:hover { color: var(--hh-gold) !important; }
.hh-mega-cta .hh-mega-phone {
	margin-top: auto;
	font-family: "Playfair Display", serif;
	font-size: 1.35rem;
	font-weight: 400;
	color: var(--hh-gold) !important;
}

/* Hide desktop nav a bit earlier so the longer labels never wrap */
@media (max-width: 1280px) {
	#main-nav ul#nav-list > li { padding-right: 8px; }
	#main-nav ul#nav-list > li > a { font-size: .88rem; padding-right: 6px; }
}

/* ---------- Mobile menu ---------- */
#nav-list-mobile ul.dropdown li.hh-dd-title { list-style: none; }

/* ---------- Footer ---------- */
#footer h3 a { color: inherit; }
#footer h3 a:hover { text-decoration: underline; }
#footer .hh-foot-col h3 + ul { margin-bottom: 18px; }

/* Footer heading links: match plain headings */
#footer h3 a { font-size: inherit; font-family: inherit; font-weight: inherit; letter-spacing: inherit; }

/* Footer callout: video always covers its box (fixes gray band on tall screens) */
#footer-callout { height: auto; min-height: min(80vh, 620px); padding: 110px 0; }
#footer-callout:after { top: 0; left: 0; }
#footer-callout #footer-bgvid { width: 100%; height: 100%; object-fit: cover; top: 0; left: 0; transform: none; }