/**
 * Est. 1973 header/footer shell (Wave 3.0 foundation).
 *
 * Purely a visual re-skin of the EXISTING header.php / footer.php DOM using
 * est1973 tokens — no menu/nav DOM restructuring happens here (that stays
 * frozen per the SEO-freeze addendum). Everything is scoped under
 * `body.ccs-est1973` so it is inert unless CCS_EST1973 is active (see
 * ccs-est1973-flag.php, which adds the body class via the `body_class`
 * filter only when the flag is on).
 *
 * Deliberately does NOT touch: .mega-menu / .sub-menu positioning,
 * .toggle-menu / .js-search-toggle interaction states, or any
 * layout/position/display property that ccs-cta-tracking.js or the mobile
 * menu JS depends on — only color, font-family, and background are
 * overridden so the existing structure and behavior keep working.
 */

body.ccs-est1973 {
	font-family: var(--e73-font-serif);
	color: var(--e73-body);
}
body.ccs-est1973 h1,
body.ccs-est1973 h2,
body.ccs-est1973 h3 {
	font-family: var(--e73-font-slab);
}

/* Extras critical paints `.home .accordian-icon-links ul li a.a-icon-links`
   orange (#cc4a10) before the deferred home sheet. Out-specify that exact
   node here (eager shell) so computed color is ink after first paint. */
body.ccs-est1973.home .accordian-icon-links ul li a.a-icon-links,
body.ccs-est1973.home .accordian-icon-links ul li a.a-icon-links * {
	color: var(--e73-ink) !important;
	-webkit-text-fill-color: var(--e73-ink);
}
body.ccs-est1973.home .accordian-icon-links ul li a.a-icon-links:hover,
body.ccs-est1973.home .accordian-icon-links ul li a.a-icon-links:hover * {
	color: var(--e73-red) !important;
	-webkit-text-fill-color: var(--e73-red);
}
body.ccs-est1973.home .accordian-icon-links ul li a.a-icon-links i {
	color: var(--e73-teal) !important;
	-webkit-text-fill-color: var(--e73-teal);
}

/* ---- promo / notification bar ---- */
body.ccs-est1973 .header-notification-bar {
	background: var(--e73-dark);
	color: #E9DFC8;
}

body.ccs-est1973 .header-notification-bar a {
	color: var(--e73-butter-2);
}

/* ---- header shell ---- */
body.ccs-est1973 .page-header {
	/* Fully opaque — the header is position:fixed (header.css) and sits above
	   scrolled content at every scroll position; a translucent background let
	   section headings/images ghost through the cream band. */
	background: var(--e73-porcelain);
	border-bottom: 3px double var(--e73-line);
}

body.ccs-est1973 .page-header .logo-container {
	display: inline-flex;
	align-items: center;
}

body.ccs-est1973 .page-header .est1973-hlogo {
	height: 52px;
	width: auto;
	max-width: none;
}

@media (max-width: 640px) {
	body.ccs-est1973 .page-header .est1973-hlogo {
		height: 34px;
	}
}

/* Neutralize the legacy hi-DPI mobile background-image swap (header.css
   ~L747/763) so the vintage <img> keeps rendering on retina phones. */
body.ccs-est1973 .retina-logo img {
	display: block !important;
}

body.ccs-est1973 .retina-logo {
	background: none !important;
	width: auto !important;
	height: auto !important;
}

body.ccs-est1973 .header-phone a,
body.ccs-est1973 .header-phone i {
	color: var(--e73-red);
}

body.ccs-est1973 .header-btn .btn.btn-primary {
	background: var(--e73-teal);
	border-color: var(--e73-teal);
	color: var(--e73-porcelain);
	font-family: var(--e73-font-slab);
	box-shadow: var(--e73-shadow-btn-teal);
}

body.ccs-est1973 .header-btn .btn.btn-primary:hover {
	background: #10786F;
}

body.ccs-est1973 .nav-primary a {
	font-family: var(--e73-font-slab);
	color: var(--e73-ink);
}

body.ccs-est1973 .nav-primary a:hover {
	color: var(--e73-red);
}

body.ccs-est1973 .nav-primary .current_page_item > a,
body.ccs-est1973 .nav-primary li.current-page-parent > a {
	color: var(--e73-teal);
}

/* ---- footer shell ---- */
body.ccs-est1973 .page-footer {
	background: var(--e73-dark);
	color: #A79878;
}

body.ccs-est1973 .page-footer h3,
body.ccs-est1973 .page-footer h4 {
	font-family: var(--e73-font-slab);
	color: var(--e73-butter);
}

body.ccs-est1973 .page-footer a {
	color: #C6B694;
}

body.ccs-est1973 .page-footer a:hover {
	color: var(--e73-porcelain);
}

body.ccs-est1973 .footer-bottom {
	border-top: 1px solid #3E3324;
}

body.ccs-est1973 .footer-top__right .btn.btn-primary {
	background: var(--e73-teal);
	border-color: var(--e73-teal);
	color: var(--e73-porcelain);
	font-family: var(--e73-font-slab);
}

body.ccs-est1973 .footer-logo .est1973-flogo {
	width: 220px;
	max-width: 100%;
	height: auto;
}

/* Neutralize the legacy white contrast pill (ccs-cleanup.css "T12-5"): that
   treatment exists because the OLD full-color logo's navy wordmark vanished
   against the navy footer. The vintage mark is already teal-on-transparent
   and reads fine directly on the espresso footer, so the white box is just
   a leftover of the pre-est1973 design. */
body.ccs-est1973 .page-footer .footer-logo__img.est1973-flogo {
	background: none;
	padding: 0;
	border-radius: 0;
}

/* ---- footer SEO links band (ccs-seo-footer-links.php inline <style>) ----
   That block prints its own hardcoded navy background/colors outside the
   theme stylesheet cascade; override at equal-or-higher specificity so the
   band above the footer joins the cream-on-espresso treatment instead of
   reading as an un-reskinned leftover. */
body.ccs-est1973 .footer-seo-services {
	background: var(--e73-dark);
}

body.ccs-est1973 .footer-seo-services h3 {
	color: var(--e73-butter);
	font-family: var(--e73-font-slab);
}

body.ccs-est1973 .footer-seo-services__nav a {
	color: #C6B694;
}

body.ccs-est1973 .footer-seo-services__nav a:hover,
body.ccs-est1973 .footer-seo-services__nav a:focus {
	color: var(--e73-porcelain);
}

/* ── Wave 3.8-QA round 2 (lead, live-verified on staging) ──────────────────
   The est1973 sheets load BEFORE the theme's inline styles, so equal-
   specificity overrides silently lose to source order. Every rule below was
   verified live via injected CSS on stage before landing here. */

/* R2-1: the fixed header kept rgba(...,.95) via an #id rule — beat it. */
body.ccs-est1973 #page-header { background: var(--e73-porcelain, #FFFAEE) !important; }

/* R2-6: header must stack above mid-reveal animated sections. */
body.ccs-est1973 #page-header { z-index: 1200 !important; }

/* R2-7: the legacy white "contrast pill" is painted on the footer logo IMG
   itself; the vintage lockup is transparent and needs none. */
body.ccs-est1973 .footer-logo__img { background: transparent !important; box-shadow: none !important; border-radius: 0; padding: 0; }

/* R2-8: the services/areas band above the footer kept its hardcoded navy. */
body.ccs-est1973 .footer-seo-services { background: var(--e73-espresso, #2B1D12) !important; }
body.ccs-est1973 .footer-seo-services a { color: var(--e73-cream, #F3E9D2); }
body.ccs-est1973 .footer-seo-services a:hover { color: var(--e73-butter, #E8B84B); }

/* ── Brand icon set (Nano-Banana-generated, lead-reviewed 24/24) ──────────
   Maps the hales-icon font classes to the retro emblem art in display
   contexts (menu-board links + icon pullout blocks) while the flag is on.
   Small UI glyphs (arrows, carets, search, menu, social, rating stars)
   deliberately stay on the font. */
body.ccs-est1973 a.a-icon-links i,
body.ccs-est1973 .icon-pullouts .fx-block i[class^="icon-"] {
	width: 34px; height: 34px; flex: 0 0 auto; display: inline-block;
	background-position: center; background-repeat: no-repeat; background-size: contain;
}
body.ccs-est1973 a.a-icon-links i::before,
body.ccs-est1973 .icon-pullouts .fx-block i[class^="icon-"]::before { content: "" !important; }
body.ccs-est1973 a.a-icon-links i.icon-ac-repair, body.ccs-est1973 .icon-pullouts .fx-block i.icon-ac-repair { background-image: url(/wp-content/themes/halesac/assets/est1973/icons/e73-icon-ac-repair.png); }
body.ccs-est1973 a.a-icon-links i.icon-air-condition, body.ccs-est1973 .icon-pullouts .fx-block i.icon-air-condition { background-image: url(/wp-content/themes/halesac/assets/est1973/icons/e73-icon-air-condition.png); }
body.ccs-est1973 a.a-icon-links i.icon-air-duct-system, body.ccs-est1973 .icon-pullouts .fx-block i.icon-air-duct-system { background-image: url(/wp-content/themes/halesac/assets/est1973/icons/e73-icon-air-duct-system.png); }
body.ccs-est1973 a.a-icon-links i.icon-call, body.ccs-est1973 .icon-pullouts .fx-block i.icon-call { background-image: url(/wp-content/themes/halesac/assets/est1973/icons/e73-icon-call.png); }
body.ccs-est1973 a.a-icon-links i.icon-checkmark, body.ccs-est1973 .icon-pullouts .fx-block i.icon-checkmark { background-image: url(/wp-content/themes/halesac/assets/est1973/icons/e73-icon-checkmark.png); }
body.ccs-est1973 a.a-icon-links i.icon-dollar, body.ccs-est1973 .icon-pullouts .fx-block i.icon-dollar { background-image: url(/wp-content/themes/halesac/assets/est1973/icons/e73-icon-dollar.png); }
body.ccs-est1973 a.a-icon-links i.icon-dryer, body.ccs-est1973 .icon-pullouts .fx-block i.icon-dryer { background-image: url(/wp-content/themes/halesac/assets/est1973/icons/e73-icon-dryer.png); }
body.ccs-est1973 a.a-icon-links i.icon-email, body.ccs-est1973 .icon-pullouts .fx-block i.icon-email { background-image: url(/wp-content/themes/halesac/assets/est1973/icons/e73-icon-email.png); }
body.ccs-est1973 a.a-icon-links i.icon-essential, body.ccs-est1973 .icon-pullouts .fx-block i.icon-essential { background-image: url(/wp-content/themes/halesac/assets/est1973/icons/e73-icon-essential.png); }
body.ccs-est1973 a.a-icon-links i.icon-insurance, body.ccs-est1973 .icon-pullouts .fx-block i.icon-insurance { background-image: url(/wp-content/themes/halesac/assets/est1973/icons/e73-icon-insurance.png); }
body.ccs-est1973 a.a-icon-links i.icon-lightbulb, body.ccs-est1973 .icon-pullouts .fx-block i.icon-lightbulb { background-image: url(/wp-content/themes/halesac/assets/est1973/icons/e73-icon-lightbulb.png); }
body.ccs-est1973 a.a-icon-links i.icon-like, body.ccs-est1973 .icon-pullouts .fx-block i.icon-like { background-image: url(/wp-content/themes/halesac/assets/est1973/icons/e73-icon-like.png); }
body.ccs-est1973 a.a-icon-links i.icon-location, body.ccs-est1973 .icon-pullouts .fx-block i.icon-location { background-image: url(/wp-content/themes/halesac/assets/est1973/icons/e73-icon-pin.png); }
body.ccs-est1973 a.a-icon-links i.icon-maintenance, body.ccs-est1973 .icon-pullouts .fx-block i.icon-maintenance { background-image: url(/wp-content/themes/halesac/assets/est1973/icons/e73-icon-maintenance.png); }
body.ccs-est1973 a.a-icon-links i.icon-phone, body.ccs-est1973 .icon-pullouts .fx-block i.icon-phone { background-image: url(/wp-content/themes/halesac/assets/est1973/icons/e73-icon-call.png); }
body.ccs-est1973 a.a-icon-links i.icon-pin, body.ccs-est1973 .icon-pullouts .fx-block i.icon-pin { background-image: url(/wp-content/themes/halesac/assets/est1973/icons/e73-icon-pin.png); }
body.ccs-est1973 a.a-icon-links i.icon-repair, body.ccs-est1973 .icon-pullouts .fx-block i.icon-repair { background-image: url(/wp-content/themes/halesac/assets/est1973/icons/e73-icon-repair.png); }
body.ccs-est1973 a.a-icon-links i.icon-repairing, body.ccs-est1973 .icon-pullouts .fx-block i.icon-repairing { background-image: url(/wp-content/themes/halesac/assets/est1973/icons/e73-icon-repair.png); }
body.ccs-est1973 a.a-icon-links i.icon-schedule, body.ccs-est1973 .icon-pullouts .fx-block i.icon-schedule { background-image: url(/wp-content/themes/halesac/assets/est1973/icons/e73-icon-schedule.png); }
body.ccs-est1973 a.a-icon-links i.icon-setting, body.ccs-est1973 .icon-pullouts .fx-block i.icon-setting { background-image: url(/wp-content/themes/halesac/assets/est1973/icons/e73-icon-maintenance.png); }
body.ccs-est1973 a.a-icon-links i.icon-support, body.ccs-est1973 .icon-pullouts .fx-block i.icon-support { background-image: url(/wp-content/themes/halesac/assets/est1973/icons/e73-icon-support.png); }
body.ccs-est1973 a.a-icon-links i.icon-temperature, body.ccs-est1973 .icon-pullouts .fx-block i.icon-temperature { background-image: url(/wp-content/themes/halesac/assets/est1973/icons/e73-icon-temperature.png); }
body.ccs-est1973 a.a-icon-links i.icon-timer, body.ccs-est1973 .icon-pullouts .fx-block i.icon-timer { background-image: url(/wp-content/themes/halesac/assets/est1973/icons/e73-icon-timer.png); }
body.ccs-est1973 a.a-icon-links i.icon-water-drops, body.ccs-est1973 .icon-pullouts .fx-block i.icon-water-drops { background-image: url(/wp-content/themes/halesac/assets/est1973/icons/e73-icon-water-drops.png); }

/* ═══════════ DESIGN PASS 1 (lead, live-verified 2026-08-13) — header/nav ═══ */
body.ccs-est1973 #page-header .header-wrap { padding: 10px 0; }
body.ccs-est1973 .logo-container img { width: 400px !important; height: auto !important; max-width: 34vw; }
body.ccs-est1973 #page-header a.btn { height: 52px; display: inline-flex; align-items: center; padding: 0 26px; font-size: 14px; letter-spacing: 1.2px; border-radius: 10px; }
body.ccs-est1973 .nav-primary > ul { max-width: 1180px; margin: 0 auto; display: flex; justify-content: space-between; }
body.ccs-est1973 .nav-primary > ul > li { display: inline-flex; align-items: center; gap: 5px; position: relative; }
body.ccs-est1973 .nav-primary > ul > li > a { font-size: 15.5px; font-weight: 600; padding: 16px 8px; display: inline-flex; align-items: center; gap: 6px; }
body.ccs-est1973 .nav-primary .sub-menu-toggle { position: static !important; top: auto !important; right: auto !important; line-height: 1; font-size: 12px; }

/* ═══════════ DESIGN PASS 3 — mobile (lead, live-verified at 390px) ═══ */
@media (max-width: 1023px) {
	body.ccs-est1973 .logo-container img { width: min(46vw, 168px) !important; max-width: 168px !important; height: auto !important; }
	body.ccs-est1973 #page-header .header-wrap { padding: 8px 0; }
	body.ccs-est1973 .ccs-mobile-lead-bar, body.ccs-est1973 [class*="mobile-lead"] { background: #241C14; }
	body.ccs-est1973 .ccs-mobile-lead-bar a:first-child, body.ccs-est1973 [class*="mobile-lead"] a:first-child { background: #B3382C !important; border-radius: 10px; }
	body.ccs-est1973 .ccs-mobile-lead-bar a:last-child, body.ccs-est1973 [class*="mobile-lead"] a:last-child { background: #0E6B63 !important; border-radius: 10px; }
}

/* ═══════════ DESIGN PASS 4 — mobile hero zone (lead, live-verified 390px) ═══
   The review/badges section pulls up with a desktop negative margin that
   landed mid-photo on mobile; the retro offset-print heading shadow
   misaligns across wrapped lines on small screens. */
@media (max-width: 1023px) {
	body.ccs-est1973 section.review { margin-top: 16px !important; }
	body.ccs-est1973 .review__col { transform: none !important; }
	body.ccs-est1973 h1, body.ccs-est1973 h2, body.ccs-est1973 h3 { text-shadow: none !important; line-height: 1.16 !important; }
}

/* ═══════════ DESIGN PASS 6 (lead, live-verified) — nav dropdown ═══
   Pass-1's caret un-positioning leaked into panel arrows; parent label
   inherited an invisible hover color. Proper est1973 dropdown. */
body.ccs-est1973 .nav-primary .sub-menu .sub-menu-toggle { display: none !important; }
body.ccs-est1973 .nav-primary > ul > li:hover > a,
body.ccs-est1973 .nav-primary > ul > li > a:hover { color: #0E6B63 !important; opacity: 1 !important; }
body.ccs-est1973 .nav-primary .sub-menu { background: var(--e73-porcelain) !important; border: 1px solid rgba(43,29,18,.15); border-radius: 12px; box-shadow: 0 10px 24px rgba(36,28,20,.16); padding: 10px !important; min-width: 270px; }
body.ccs-est1973 .nav-primary .sub-menu li { display: block !important; margin: 0 !important; padding: 0 !important; }
body.ccs-est1973 .nav-primary .sub-menu li a { display: block !important; padding: 10px 14px !important; border-radius: 8px; font-size: 15px !important; color: #2B1D12 !important; line-height: 1.35; }
body.ccs-est1973 .nav-primary .sub-menu li a:hover { background: rgba(14,107,99,.09); color: #0E6B63 !important; }
/* Legacy ccs-home-full.css hides ANY hovered nav label (.nav-primary ul li:hover > a
   { visibility:hidden }) — the "menu category vanishes" bug. Keep labels visible. */
body.ccs-est1973 .nav-primary ul li:hover > a { visibility: visible !important; }

/* Owner brief a11y: 44px minimum interactive targets flag-ON. */
body.ccs-est1973 .btn,
body.ccs-est1973 button:not(.sub-menu-toggle):not(.ccsn-pin),
body.ccs-est1973 input[type="submit"] {
	min-height: 44px;
}

/* Shared header offset (promo + bar + nav). Combo/blog/service consume it.
   2026-08-17: the live header measures 276px desktop with the promo bar
   (55px bar + 44px strip + 108px logo row + 68px nav) — the old 199px let
   the nav band overlap the hero kicker on every inner page. */
:root { --ccs-header-offset: 221px; }
body.ccs-est1973:has(.page-header .header-notification-bar) { --ccs-header-offset: 276px; }
@media (max-width: 767px) { :root { --ccs-header-offset: 240px; } }

/* The desktop critical CSS initially leaves the header in normal flow, while
   the deferred bundle later fixes it and adds a shorter 157px hero offset.
   That swap pulled the kicker underneath the navigation after interaction.
   Establish the final header geometry in this eager shell so first paint and
   the fully-loaded state use the same safe offset. */
@media (min-width: 1200px) {
	body.ccs-est1973 .page-header {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		min-height: 235px;
	}

	body.ccs-est1973 .masthead {
		margin-top: var(--ccs-header-offset, 199px);
	}

	body.ccs-est1973 .ccs-trust-bar {
		display: flex;
		align-items: center;
		height: 36px !important;
		min-height: 36px;
		overflow: hidden;
	}
}

body.ccs-est1973 { overflow-x: clip; }

/* Leftover Manrope on unscoped nodes: inherit the shell face, then let
   heading/script/icon rules (higher specificity than :where) win. */
body.ccs-est1973 :where(p, li, td, th, span, a, div, section, article, aside, header, footer, nav, main, label, small, strong, em, blockquote, figcaption, address, time) {
	font-family: inherit;
}

body.ccs-est1973 :where(a, button, input, select, textarea, summary):focus-visible {
	outline: 3px solid var(--e73-teal);
	outline-offset: 3px;
}

/* Promo bar wraps 768–1199; fold budget only covered ≥1200. */
@media (min-width: 768px) and (max-width: 1199px) {
	body.ccs-est1973 .promotional-deals-bar,
	body.ccs-est1973 .has-promotional-deals .promo-bar,
	body.ccs-est1973 .header-notification-bar {
		padding-top: 5px;
		padding-bottom: 5px;
		font-size: var(--e73-fs-xs);
	}
	body.ccs-est1973 .promotional-deals-bar .container,
	body.ccs-est1973 .promo-bar .container,
	body.ccs-est1973 .header-notification-bar .container {
		flex-wrap: nowrap;
		gap: var(--e73-space-xs);
	}
}

/* Legacy navy waves on inner image-text bands. */
body.ccs-est1973 .half-image-text svg path[fill="#042452"],
body.ccs-est1973 .half-image-text svg path[fill="#011635"],
body.ccs-est1973 .home-image-text svg path[fill="#042452"],
body.ccs-est1973 [class*="__wave"] path {
	fill: var(--e73-dark);
}

/* ── Colophon (owner note: the reviewed/updated byline lives under the
   footer). Centered and muted so it reads as a deliberate sign-off,
   not stray debris on the body background. ── */
body.ccs-est1973 aside.ccs-review-meta {
	margin: 0;
	border-top: 0;
	padding: 18px 22px 28px;
	background: var(--e73-cream);
}

body.ccs-est1973 aside.ccs-review-meta .ccs-review-meta__inner {
	justify-content: center;
	text-align: center;
	padding: 0;
}

body.ccs-est1973 aside.ccs-review-meta p {
	color: var(--e73-muted);
	font-size: 12.5px;
}

/* Legacy .btn-icon glyphs are absolutely pinned (left: 20px, top: 50%)
   and relied on a reserved padding gutter; the est1973 button is
   inline-flex + gap, so on every non-home template the pin landed the
   icon on top of the label ("B(icon)OK NOW" — FxAccordion lesson class).
   ccs-home-full.css already neutralizes this on the homepage; this is
   the same neutralizer for the rest of the site. */
body.ccs-est1973 .btn-icon i,
body.ccs-est1973 .btn-primary-icon i {
	position: static;
	transform: none;
}

/* ══════════ Inner-page hero, upgraded (owner note 2026-08-14: "these
   hero sections need a big upgrade — all of the inner page heros").
   Canonical composition for EVERY masthead page: script kicker, slab
   title, meta-description subline, Book Now + call CTAs, quiet
   breadcrumbs. Every inner-page family uses the approved teal
   sunburst, including city pages whose legacy CSS loads later. ═════ */
body.ccs-est1973 .masthead--innerpage {
	position: relative;
	/* Canonical across service, city, blog, offers, and virtual-page layers.
	   Several family sheets load later with their former photo/dark variants. */
	background: var(--e73-teal, #0E6B63) !important;
	border-bottom: 0 !important;
	overflow: hidden;
}

body.ccs-est1973 #main section.masthead.masthead--innerpage,
body.ccs-est1973 #primary section.masthead.masthead--innerpage {
	background: var(--e73-teal, #0E6B63) !important;
}

body.ccs-est1973 #main section.masthead.masthead--innerpage::before,
body.ccs-est1973 #primary section.masthead.masthead--innerpage::before {
	content: "" !important;
	background: repeating-conic-gradient(from 0deg, rgba(255, 250, 238, .05) 0deg 8deg, transparent 8deg 16deg) !important;
}

body.ccs-est1973 #main section.masthead.masthead--innerpage .masthead--innerpage__bg,
body.ccs-est1973 #primary section.masthead.masthead--innerpage .masthead--innerpage__bg {
	display: none !important;
}

body.ccs-est1973 .masthead--innerpage__bg {
	display: none !important;
}

body.ccs-est1973 .masthead--innerpage::before {
	content: "";
	position: absolute;
	inset: -80% -20%;
	background: repeating-conic-gradient(from 0deg, rgba(255, 250, 238, .05) 0deg 8deg, transparent 8deg 16deg);
	pointer-events: none;
}

body.ccs-est1973 .masthead--innerpage__wrapper {
	position: relative;
	z-index: 2;
	padding: clamp(44px, 6vw, 64px) 0 clamp(52px, 7vw, 78px);
}

/* The AC-repair page is the approved composition. Family-specific deferred
   bundles previously changed the hero container from 1180px to 880px and
   swapped 28px padding for 150px after interaction. Lock those dimensions at
   the shared component itself so every template has first/final-frame parity. */
body.ccs-est1973 section.masthead.masthead--innerpage > .masthead--innerpage__wrapper {
	height: auto !important;
	min-height: 0 !important;
	padding: 28px 0 40px !important;
}

body.ccs-est1973 section.masthead.masthead--innerpage .masthead--innerpage__text {
	width: 100%;
	max-width: 820px !important;
	margin-right: auto !important;
	margin-left: auto !important;
	text-align: center;
}

body.ccs-est1973 .masthead--innerpage__text h1 {
	font-family: var(--e73-font-slab);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .015em;
	color: var(--e73-cream);
	text-shadow: 0 2px 0 rgba(43, 29, 18, .3);
	text-wrap: balance;
	margin-bottom: 10px;
}

body.ccs-est1973 section.masthead.masthead--innerpage .masthead--innerpage__text h1 {
	max-width: 18ch;
	margin-right: auto !important;
	margin-left: auto !important;
	font-size: clamp(42px, 4.9vw, 64px) !important;
	line-height: 1.05 !important;
}

body.ccs-est1973 .masthead--innerpage .e73-kicker {
	display: block;
	font-family: var(--e73-font-script);
	/* 24px floor, not 20px: butter on the teal band is 3.45:1, which meets the
	   3:1 large-text threshold only at >=24px. Below that it is held to 4.5:1
	   and fails — the mobile-only failure seen on service/blog/offers/about. */
	font-size: clamp(24px, 2.3vw, 28px);
	color: var(--e73-butter, #E8B84B);
	margin-bottom: 10px;
	transform: rotate(-2deg);
}

body.ccs-est1973 .e73-hero-sub {
	max-width: 720px;
	margin: 0 auto 22px;
	font-family: var(--e73-font-serif);
	font-size: var(--e73-fs-md);
	line-height: 1.6;
	color: rgba(255, 250, 238, .88);
}

body.ccs-est1973 .e73-hero-ctas {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 12px 14px;
	margin: 0 0 20px;
}

body.ccs-est1973 .e73-hero-ctas .btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-height: 50px;
	margin: 0;
	padding: 12px 26px;
	border-radius: var(--e73-radius-sm, 10px);
	font-family: var(--e73-font-slab);
	font-size: 18px;
	font-weight: 700;
	line-height: 1.5;
	text-transform: uppercase;
	letter-spacing: .04em;
}

/* Butter primary on the teal band — the base .btn-primary is teal and
   would sink into the hero background. */
/* !important: est1973-city-unify.css blanket-teals every #main button
   with !important; the hero pair must out-rank it. */
body.ccs-est1973 .masthead--innerpage .e73-hero-ctas .btn-primary,
body.ccs-est1973 #main .masthead--innerpage .e73-hero-ctas .btn-primary,
body.ccs-est1973 #primary .masthead--innerpage .e73-hero-ctas .btn-primary {
	background: var(--e73-butter, #E8B84B) !important;
	color: var(--e73-ink, #2B1D12) !important;
	border: 0 !important;
	box-shadow: 0 6px 0 rgba(43, 29, 18, .35) !important;
}

body.ccs-est1973 .masthead--innerpage .e73-hero-ctas .btn-primary:hover,
body.ccs-est1973 #main .masthead--innerpage .e73-hero-ctas .btn-primary:hover,
body.ccs-est1973 #primary .masthead--innerpage .e73-hero-ctas .btn-primary:hover {
	background: #f0c45f !important;
	color: var(--e73-ink, #2B1D12) !important;
}

body.ccs-est1973 .masthead--innerpage .e73-hero-ctas .e73-hero-call,
body.ccs-est1973 #main .masthead--innerpage .e73-hero-ctas .e73-hero-call,
body.ccs-est1973 #primary .masthead--innerpage .e73-hero-ctas .e73-hero-call {
	background: transparent !important;
	color: var(--e73-cream) !important;
	border: 2px solid rgba(255, 250, 238, .65) !important;
	box-shadow: none !important;
}

body.ccs-est1973 .masthead--innerpage .e73-hero-ctas .e73-hero-call:hover,
body.ccs-est1973 #main .masthead--innerpage .e73-hero-ctas .e73-hero-call:hover,
body.ccs-est1973 #primary .masthead--innerpage .e73-hero-ctas .e73-hero-call:hover {
	border-color: var(--e73-butter, #E8B84B) !important;
	color: var(--e73-butter, #E8B84B) !important;
}

/* Breadcrumbs: quiet slab caps, and the divider becomes a static flex
   bar — the legacy absolutely-pinned divider overlapped the first
   letter of each crumb ("|Offers" read as "bffers"). */
body.ccs-est1973 .masthead--innerpage .breadcrumbs,
body.ccs-est1973 .masthead--innerpage .breadcrumbs a {
	font-family: var(--e73-font-slab);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: rgba(255, 250, 238, .78);
}

body.ccs-est1973 .masthead--innerpage .breadcrumbs a:hover {
	color: var(--e73-butter, #E8B84B);
}

/* The deferred header stylesheet adds 44px breadcrumb tap targets. Ship the
   same dimensions eagerly so those controls do not grow the hero after the
   user's first mouse move or scroll. */
body.ccs-est1973 .masthead--innerpage .breadcrumbs ul li,
body.ccs-est1973 .masthead--innerpage .breadcrumbs ul li a {
	min-height: 44px;
}

body.ccs-est1973 .masthead--innerpage .breadcrumbs {
	max-width: 620px;
	margin-right: auto;
	margin-left: auto;
}

body.ccs-est1973 section.masthead.masthead--innerpage .breadcrumbs,
body.ccs-est1973 section.masthead.masthead--innerpage .breadcrumbs .hidden-md-down,
body.ccs-est1973 section.masthead.masthead--innerpage .breadcrumbs ul {
	display: flex !important;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 6px 10px;
	margin-right: auto !important;
	margin-left: auto !important;
}

body.ccs-est1973 section.masthead.masthead--innerpage .breadcrumbs,
body.ccs-est1973 section.masthead.masthead--innerpage .breadcrumbs .hidden-md-down,
body.ccs-est1973 section.masthead.masthead--innerpage .breadcrumbs ul {
	height: 44px !important;
	min-height: 44px !important;
	padding: 0 !important;
	overflow: hidden;
}

body.ccs-est1973 section.masthead.masthead--innerpage .breadcrumbs ul li,
body.ccs-est1973 section.masthead.masthead--innerpage .breadcrumbs ul li > a,
body.ccs-est1973 section.masthead.masthead--innerpage .breadcrumbs ul li > span {
	display: inline-flex !important;
	align-items: center;
	min-height: 44px !important;
	margin: 0 !important;
	padding: 0 !important;
	line-height: 1.35 !important;
}

body.ccs-est1973 section.masthead.masthead--innerpage .breadcrumbs ul li:last-child > span,
body.ccs-est1973 section.masthead.masthead--innerpage .breadcrumbs ul li:last-child > a {
	max-width: 280px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

body.ccs-est1973 .breadcrumbs ul li + li::before {
	content: "";
	position: static;
	display: inline-block;
	flex: 0 0 auto;
	width: 2px;
	height: 14px;
	background: rgba(255, 250, 238, .55);
	border-radius: 2px;
	margin: 0 4px;
	transform: none;
	vertical-align: middle;
}

body.ccs-est1973 .masthead--innerpage__wave {
	display: block;
	position: absolute;
	z-index: 3;
	bottom: -1px;
	left: 0;
	width: 100%;
	height: auto;
}

body.ccs-est1973 .masthead--innerpage__wave path {
	fill: var(--e73-cream, #F6EFDE);
}

body.ccs-est1973 .e73-seal {
	position: absolute;
	z-index: 4;
	right: clamp(16px, 4vw, 44px);
	bottom: 28px;
	width: 60px;
	height: 60px;
	filter: drop-shadow(0 8px 16px rgba(42, 33, 26, .35));
}

/* AC-repair hero vehicle: a responsive, transparent brand asset that rides
   the lower-right wave without affecting hero measurements or interaction. */
body.ccs-est1973 .e73-hero-van {
	position: absolute;
	z-index: 4;
	right: clamp(12px, 1.8vw, 28px);
	bottom: clamp(12px, 1.5vw, 22px);
	display: none;
	width: clamp(160px, 16vw, 220px);
	max-width: 20%;
	pointer-events: none;
	filter: drop-shadow(0 10px 14px rgba(42, 33, 26, .3));
}

body.ccs-est1973 .e73-hero-van img {
	display: block;
	width: 100%;
	height: auto;
}

body.ccs-est1973 .e73-hero-fine {
	max-width: 720px;
	margin: -4px auto 15px;
	color: rgba(255, 250, 238, .72);
	font-size: 12.5px;
	line-height: 1.5;
}

@media (min-width: 1024px) {
	body.ccs-est1973 .e73-hero-van {
		display: block;
	}
}

/* Virtual renderers historically compensated for the fixed header on their
   own. Once the shared masthead precedes them, that extra top margin becomes
   a blank band and must be neutralized at the shared boundary. */
body.ccs-est1973 .masthead--innerpage + main.ccs-cityhub,
body.ccs-est1973 .masthead--innerpage + main.ccs-city-service,
body.ccs-est1973 .masthead--innerpage + main.ccs-equipment,
body.ccs-est1973 .masthead--innerpage + main.ccs-calc,
body.ccs-est1973 .masthead--innerpage + main.ccs-offer,
body.ccs-est1973 .masthead--innerpage + main.ccs-virtual-guide {
	margin-top: 0 !important;
}

body.ccs-est1973 .masthead--innerpage + main.ccs-virtual-guide .ccs-virtual-guide__wrap {
	padding-top: clamp(38px, 5vw, 64px) !important;
}

/* Compact utility heroes (privacy, sitemap…) keep title + crumbs only. */
body.ccs-est1973 .masthead--compact .masthead--innerpage__wrapper {
	padding: 30px 0 40px;
}

@media (min-width: 768px) and (max-width: 1023px) {
	body.ccs-est1973 .ccs-trust-bar {
		display: none !important;
	}

	body.ccs-est1973 .page-header {
		position: fixed !important;
		top: 0;
		left: 0;
		width: 100%;
		height: 115px !important;
		min-height: 115px;
	}

	body.ccs-est1973 section.masthead.masthead--innerpage {
		margin-top: 115px !important;
	}
}

@media (max-width: 767px) {
	/* The fixed phone header is 131px tall. The legacy trust strip sits behind
	   that fixed chrome (and different family bundles gave it 0–43px of flow
	   height), which made the entire hero jump after deferred CSS activated.
	   Remove the obscured duplicate strip and use the approved AC-repair hero
	   start position consistently on every inner template. */
	body.ccs-est1973 .ccs-trust-bar {
		display: none !important;
	}

	body.ccs-est1973 .page-header {
		position: fixed !important;
		top: 0;
		left: 0;
		width: 100%;
		height: 131px !important;
		min-height: 131px;
	}

	body.ccs-est1973 section.masthead.masthead--innerpage {
		margin-top: 131px !important;
	}

	body.ccs-est1973 .masthead--innerpage {
		height: auto !important;
		min-height: 0 !important;
	}

	body.ccs-est1973 section.masthead.masthead--innerpage > .masthead--innerpage__wrapper,
	body.ccs-est1973 section.masthead.masthead--compact > .masthead--innerpage__wrapper {
		padding: 30px 0 58px !important;
	}

	body.ccs-est1973 .masthead--innerpage .e73-kicker {
		margin-bottom: 6px;
	}

	body.ccs-est1973 section.masthead.masthead--innerpage .masthead--innerpage__text h1 {
		margin-bottom: 9px;
		font-size: clamp(30px, 9.2vw, 40px) !important;
		line-height: 1.08 !important;
	}

	body.ccs-est1973 .e73-hero-sub {
		margin-bottom: 17px;
		font-size: 16px;
		line-height: 1.48;
	}

	body.ccs-est1973 .e73-hero-ctas {
		gap: 10px;
		margin-bottom: 0;
	}

	body.ccs-est1973 .e73-hero-ctas .btn {
		flex: 1 1 100%;
		justify-content: center;
		min-height: 52px;
		padding: 10px 18px;
	}

	/* Phone redesign: the lower hero is intentionally clean. Long Yoast
	   breadcrumb labels and the van are desktop affordances and are removed
	   before either can collide with the lead actions or one another. */
	body.ccs-est1973 section.masthead.masthead--innerpage .breadcrumbs,
	body.ccs-est1973 section.masthead.masthead--innerpage .breadcrumbs-link,
	body.ccs-est1973 section.masthead.masthead--innerpage .e73-hero-van {
		display: none !important;
	}
}

/* ── Photo tile buttons (.image-button — offers grid, promo tiles):
   ink-on-photo labels were unreadable on busy imagery. Scrim + cream
   slab title, clipped to the token radius. ── */
body.ccs-est1973 .image-button {
	position: relative;
	border-radius: var(--e73-radius-md, 14px);
	overflow: hidden;
	display: block;
}

body.ccs-est1973 .image-button::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
	background: linear-gradient(180deg, rgba(43, 29, 18, 0) 18%, rgba(43, 29, 18, .55) 55%, rgba(43, 29, 18, .88) 100%);
	pointer-events: none;
}

body.ccs-est1973 .image-button__hover {
	z-index: 2;
}

body.ccs-est1973 .image-button__title {
	color: var(--e73-cream) !important;
	font-family: var(--e73-font-slab);
	text-shadow: 0 2px 6px rgba(43, 29, 18, .55);
}

/* ═══════ DESIGN.md A4 — tap targets clear 44x44 ══════════════════════
   Verified on a 375px touch viewport: the header call/search/menu
   controls measured 42px wide, the promo arrows 38px, and the carousel
   dots 24px. All sat just under the floor. Sizing is applied to the
   control box only — icon glyphs and layout are untouched. ══ */
body.ccs-est1973 .header-phone > a,
body.ccs-est1973 button.js-search-toggle,
body.ccs-est1973 button.toggle-menu {
	min-width: 44px;
	min-height: 44px;
}

body.ccs-est1973 .e73-promo__arrow {
	min-width: 44px;
	min-height: 44px;
}

/* Carousel dots: the visible dot stays small, the hit area does not. */
body.ccs-est1973 .e73-promo__dots button,
body.ccs-est1973 .slick-dots button {
	min-width: 44px;
	min-height: 44px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

/* ═══════ a11y pairings that must survive every load state ════════════
   These live in the EAGER shell sheet, not the critical block and not
   the deferred home sheet. The homepage swaps critical -> full CSS on a
   loader, and there is a window in which the critical <style> is gone
   and the deferred est1973 sheet has not applied — only legacy CSS. axe
   scores inside that window, which is why it kept reporting ink on teal
   (2.48:1) and 1px of safe clickable space for links that measure
   porcelain-backed and 42px tall in a real browser. The shell is present
   in all three states, so the pairing cannot come apart. ══ */
body.ccs-est1973 a.a-icon-links {
	background: var(--e73-porcelain);
	min-height: 28px;
	padding-top: 4px;
	padding-bottom: 4px;
}

body.ccs-est1973 .accordian-icon-links,
body.ccs-est1973 .accordian-icon-links ul,
body.ccs-est1973 .accordian-icon-links li,
body.ccs-est1973 .accordian-location-links,
body.ccs-est1973 .accordian-location-links__col,
body.ccs-est1973 .fx-accordion__panel__content {
	background: var(--e73-porcelain);
}

body.ccs-est1973 .accordian-icon-links li,
body.ccs-est1973 .accordian-location-links li {
	margin-bottom: 10px;
}

body.ccs-est1973 .accordian-location-links li a {
	display: inline-flex;
	align-items: center;
	min-height: 28px;
	padding-top: 4px;
	padding-bottom: 4px;
	background: var(--e73-porcelain);
}

/* Same reasoning as above, widened: every homepage list link needs the
   AA target floor and real separation in the eager sheet, or axe scores
   the legacy-only window and reports ~1px of safe clickable space. */
body.ccs-est1973.home ul li > a {
	min-height: 24px;
	padding-top: 4px;
	padding-bottom: 4px;
}

body.ccs-est1973.home ul li + li {
	margin-top: 8px;
}

/* ═══════ Header base, owner report 2026-08-14 ════════════════════════
   Two complaints, one cause. The fixed header measured 231px tall while
   the homepage hero was offset only 157px, so 74px of the hero sat
   BEHIND the header and its first line of text landed 2px off the nav.
   The "extra bar" under the menu is this header's own dead space: 8px of
   cream padding below the nav plus a 3px DOUBLE border, which renders as
   two stacked rules. Padding removed, border reduced to a single
   hairline; the hero offset is corrected alongside in est1973-home.css. */
body.ccs-est1973 #page-header {
	padding-bottom: 0 !important;
	border-bottom: 1px solid var(--e73-line) !important;
}

/* Homepage: the cream hairline under the ice-blue nav IS the header
   painting below .navbar (1px line + any leftover padding). Kill it.
   The hero tucks under the opaque nav in est1973-home.css so a taller
   header can never flash porcelain between menu and teal. */
body.ccs-est1973.home #page-header,
body.ccs-est1973.home .page-header {
	border-bottom: none !important;
	box-shadow: none !important;
	padding-bottom: 0 !important;
}

/* ═══════ Homepage hero type + arriving services (first paint) ════════
   Kicker and promise stay one line. The H1 is the canonical sentence
   (E1 — text unchanged) and reads as the quiet county line. The
   dispatch list is a separate element so we can animate the checks
   without rewriting the heading. ══ */
body.ccs-est1973.home .masthead--homepage .sub-heading {
	white-space: nowrap !important;
	max-width: 100% !important;
	overflow: hidden;
	text-overflow: ellipsis;
	transform: none !important;
	font-size: clamp(15px, 1.28vw, 22px) !important;
	line-height: 1.2 !important;
	letter-spacing: 0 !important;
	margin: 0 0 8px !important;
}

body.ccs-est1973.home .masthead--homepage .masthead__text > span {
	white-space: nowrap !important;
	max-width: none !important;
	font-size: clamp(26px, 2.8vw, 40px) !important;
	font-weight: 700 !important;
	line-height: 1.05 !important;
	letter-spacing: -.02em !important;
	margin: 0 0 12px !important;
}

body.ccs-est1973.home .hero-text h1.e73-h1-line,
body.ccs-est1973.home .hero-text h1 {
	display: block;
	max-width: none !important;
	margin: 8px 0 0 !important;
	font-size: 13px !important;
	font-weight: 600 !important;
	line-height: 1.35 !important;
	letter-spacing: .1em !important;
	text-transform: uppercase;
	color: var(--e73-porcelain) !important;
	opacity: .82;
	-webkit-text-stroke: 0 !important;
	text-shadow: none !important;
}

body.ccs-est1973.home .e73-arrive {
	list-style: none;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 5px 16px;
	margin: 2px 0 4px;
	padding: 0;
	max-width: 26rem;
}

body.ccs-est1973.home .e73-arrive li {
	position: relative;
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 0;
	padding: 0;
	min-height: 28px;
	list-style: none;
}

body.ccs-est1973.home .e73-arrive li::before {
	content: "\2713";
	position: static;
	flex: 0 0 auto;
	width: 1.15em;
	height: 1.15em;
	margin: 0;
	background: var(--e73-butter);
	border-radius: 50%;
	color: var(--e73-ink);
	font-size: 11px;
	font-weight: 700;
	line-height: 1.15em;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	transform-origin: center;
}

body.ccs-est1973.home .e73-arrive a {
	color: var(--e73-porcelain);
	font-family: var(--e73-font-slab), Jost, sans-serif;
	font-size: 13.5px;
	font-weight: 600;
	letter-spacing: .06em;
	text-transform: uppercase;
	text-decoration: none;
	line-height: 1.2;
}

body.ccs-est1973.home .e73-arrive a:hover,
body.ccs-est1973.home .e73-arrive a:focus-visible {
	color: var(--e73-butter);
	text-decoration: underline;
	text-underline-offset: 3px;
}

@media (prefers-reduced-motion: no-preference) {
	body.ccs-est1973.home .e73-arrive li::before {
		animation: e73-stamp .48s cubic-bezier(.2, 1.2, .3, 1) both;
		animation-delay: calc(var(--e73-i, 0) * 90ms);
	}
}

@keyframes e73-stamp {
	from { transform: scale(.35) rotate(-18deg); opacity: 0; }
	to { transform: scale(1) rotate(0); opacity: 1; }
}

/* Ticket Stubs shows every service at once — that is why it was chosen —
   but the "panels always open" rule was deferred-only. Before the swap the
   panels stayed collapsed, so their links existed at zero height and axe
   scored them as obscured targets. Opening them in the eager sheet makes
   the first frame match the design and gives the links real geometry. */
body.ccs-est1973.home .half-image-half-accordian-links .fx-accordion__panel__content,
body.ccs-est1973.home .fx-accordion--service-location .fx-accordion__panel__content {
	display: block;
	height: auto;
	overflow: visible;
}

/* WCAG 2.5.8 spacing. axe reported these targets as 32px tall but only
   6px apart (measured rects 12429 -> 12435), which leaves ~6px of
   unobscured space instead of 24px. The earlier spacing rules targeted
   the icon-link lists; these are the location and link-fold lists. */
body.ccs-est1973.home .ccs-linkfold li,
body.ccs-est1973.home .ccs-city-depth li,
body.ccs-est1973.home .ccs-footer-growth-links li {
	margin-bottom: 8px;
}

body.ccs-est1973.home .ccs-linkfold li > a,
body.ccs-est1973.home .ccs-linkfold li > a,
body.ccs-est1973.home .ccs-city-depth li > a,
body.ccs-est1973.home .ccs-footer-growth-links li > a {
	display: inline-flex;
	align-items: center;
	/* !important: the critical payload pins min-height:28px on these same
	   links, which caps them at a 32px box — under the 24px clear-space
	   axe needs once neighbours are 6px away. */
	min-height: 44px !important;
}

/* The location rows are flex (`li{display:flex;align-items:center}`), so a
   min-height on the ANCHOR grew the link past its row and it overlapped the
   neighbours — axe read that as an obscured target. The height belongs on
   the row itself. */
/* Owner 2026-08-14: the city list read as far too airy. Trimmed to the
   smallest row that still satisfies axe's target spacing. */
body.ccs-est1973.home .accordian-location-links .accordian-location-links__col ul li {
	min-height: 32px;
	padding-top: 3px;
	padding-bottom: 3px;
	margin-bottom: 0;
}

body.ccs-est1973.home .accordian-location-links .accordian-location-links__col ul li > a {
	min-height: 0 !important;
}

/* A4 touch: the collapsed 31px city rows (and their inline "AC repair"
   chips) sit under the 44px floor on coarse pointers. Restore full-height
   rows there; desktop keeps the trimmed look. */
@media (max-width: 767px) {
	body.ccs-est1973 .accordian-location-links .accordian-location-links__col ul li a,
	body.ccs-est1973 .ccs-city-depth li a,
	body.ccs-est1973 .ccs-linkfold li a {
		align-items: center;
		display: flex !important;
		min-height: 44px !important;
	}

	body.ccs-est1973 .accordian-location-links .accordian-location-links__col ul li {
		margin-bottom: 0;
	}
}

/* ═══════════════════════════════════════════════════════════════════════════
   Sitewide contrast repairs — measured, not guessed (2026-08-14)

   Found by rendering 14 page families and resolving each text node's ACTUAL
   painted ground (walking ancestors, skipping transparent backgrounds, and
   excluding nodes over a gradient/image where a numeric ratio is meaningless).
   Every pair below was computed against est1973-tokens.css before it was
   written here — an earlier pass that picked colours without checking each
   ground made six templates worse, so nothing in this block is a guess.

   Ratios are stated per rule. Threshold: 4.5:1 body, 3:1 large (>=24px, or
   >=18.66px at 700). DESIGN.md C7 / A3.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ---- Captain Right Away -------------------------------------------------
   The component's dark ground is authored ONLY in the homepage critical CSS,
   so on every other template (offers, schedule, blog, combo, city, equipment)
   its porcelain text landed on the cream page ground at 1.10:1 — effectively
   invisible. Ground restored here for all templates.

   --e73-teal-2 rather than --e73-teal on purpose: butter on teal is 3.45:1,
   which fails the 12px eyebrow. On teal-2 butter is 4.70:1 and clears.
   The homepage's own critical rule carries !important, so the homepage keeps
   its existing teal and is untouched by this. */
body.ccs-est1973 .ccs-captain,
body.ccs-est1973 .ccs-captain--accent-blue,
body.ccs-est1973 .ccs-captain--accent-orange,
body.ccs-est1973 .ccs-captain--footer {
	background: var(--e73-teal-2);
}

/* porcelain on teal-2 = 8.32:1 */
body.ccs-est1973 .ccs-captain .ccs-captain__headline,
body.ccs-est1973 .ccs-captain .ccs-captain__message,
body.ccs-est1973 .ccs-captain h2,
body.ccs-est1973 .ccs-captain p {
	color: var(--e73-porcelain);
}

/* Porcelain, not butter: several templates pin the captain ground to --e73-teal
   with !important in their critical CSS, and butter on teal is only 3.45:1.
   Porcelain clears both grounds (teal 6.11:1, teal-2 8.32:1) and is what the
   homepage critical CSS already uses, so the component reads identically
   everywhere. Was --e73-red on teal at 1.20:1. */
body.ccs-est1973 .ccs-captain .ccs-captain__eyebrow {
	color: var(--e73-porcelain);
}

/* The CTAs were white on a butter fill (1.84:1) on some templates and carried
   the legacy orange fill on others, where ink measured 3.42:1. Fill and text are
   now authored together so the pair cannot drift: butter + ink = 8.56:1, and it
   holds regardless of the ground the captain sits on. */
body.ccs-est1973 .ccs-captain .ccs-captain__cta,
body.ccs-est1973 .ccs-captain .ccs-captain__cta--secondary {
	background: var(--e73-butter);
	border-color: var(--e73-butter);
}

body.ccs-est1973 .ccs-captain .ccs-captain__cta,
body.ccs-est1973 .ccs-captain .ccs-captain__cta span,
body.ccs-est1973 .ccs-captain .ccs-captain__cta--secondary,
body.ccs-est1973 .ccs-captain .ccs-captain__cta--secondary span {
	color: var(--e73-ink);
}

/* ---- Equipment directory ------------------------------------------------
   .ccs-equipment__links is used in two contexts. Its authored #E9DFC8 is a
   light-on-dark colour for the aside; on the /hvac-equipment/ index the same
   links sit on the porcelain page ground at 1.27:1 across 43 brand links.
   Default is now the light-ground colour; the dark aside re-states its own. */
body.ccs-est1973 main.ccs-equipment .ccs-equipment__links a {
	color: var(--e73-teal);          /* on porcelain = 6.11:1 */
}

body.ccs-est1973 main.ccs-equipment .ccs-equipment__aside .ccs-equipment__links a {
	color: var(--e73-line);          /* on --e73-dark = 10.86:1 */
}

/* The ghost button (transparent fill, teal text) reads fine on the porcelain
   article ground at 6.11:1 and fails only inside the dark aside, at 2.64:1.
   !important here is deliberate and narrow: the equipment dispatcher prints its
   own <style> inside <main>, after every stylesheet, and sets this component's
   colour with !important, so specificity alone cannot reach it. */
body.ccs-est1973 .ccs-equipment__aside a.ccs-equipment__button:not(.ccs-equipment__button--primary) {
	color: var(--e73-butter) !important;   /* on --e73-dark = 9.10:1 */
	border-color: var(--e73-butter);
}

/* ---- Review byline ------------------------------------------------------
   --e73-muted on --e73-cream is 4.35:1 — just under the floor at 12.5px.
   Body ink on the same ground is 8.61:1. Foreground-only: the ground does
   not vary for this component. */
body.ccs-est1973 .ccs-review-meta,
body.ccs-est1973 .ccs-review-meta p,
body.ccs-est1973 .ccs-review-meta span,
body.ccs-est1973 .ccs-review-meta time,
body.ccs-est1973 .ccs-review-meta p.ccs-review-meta__byline {
	color: var(--e73-body);
}

/* ---- Legacy pre-est1973 blues -------------------------------------------
   Two survivors of the old palette, both on white and both failing, and both
   banned outright by DESIGN.md C5 (no hex outside the token table).
   Specificity is deliberately above the critical CSS's own `.a .b` rules,
   which print after this sheet and would otherwise win on source order. */
body.ccs-est1973 .testimonial-card-left .sub-heading {
	color: var(--e73-teal);          /* was #8FD0F5 at 1.68:1 -> 6.36:1 */
}

body.ccs-est1973 .ccs-captains-team__card .ccs-captains-team__role {
	color: var(--e73-teal);          /* was #209AD6 at 3.16:1 -> 6.36:1 */
}

/* ---- AEO answer-block links --------------------------------------------
   The pre-est1973 brand orange #CC4A10 measured 4.02:1 on --e73-cream and
   4.43:1 on --e73-porcelain across ~50 in-text links per blog page — under
   the 4.5:1 floor on both grounds, and a non-token literal under C6.
   --e73-teal is the dominant (C1), clears both grounds (5.55:1 / 6.11:1),
   and keeps the underline required by A5. */
body.ccs-est1973 .ccs-answer-block a,
body.ccs-est1973 .ccs-linkfold a,
body.ccs-est1973 .ccs-post-paths a {
	color: var(--e73-teal);
	text-decoration: underline;
	text-underline-offset: 2px;
}

body.ccs-est1973 .ccs-answer-block a:hover,
body.ccs-est1973 .ccs-linkfold a:hover,
body.ccs-est1973 .ccs-post-paths a:hover {
	color: var(--e73-teal-2);
}

/* Primary button label was --e73-line on the teal fill at 4.04:1, just under
   the floor at 18px/700. Porcelain on the same fill is 6.11:1. */
body.ccs-est1973 a.btn.btn-primary,
body.ccs-est1973 a.btn.btn-primary span {
	color: var(--e73-porcelain);
}

/* ---- Dark bands: text was never inverted -------------------------------
   Every container below paints --e73-dark but left its descendants on the
   inherited body ink, so the text rendered near-black on near-black:
   combo's h2 measured 1.06:1 and the city hero subline 1.70:1. These are
   invisible, not merely low-contrast. Porcelain on --e73-dark is 16.11:1.

   `bg-dark-blue` is the ACF background_color modifier the block templates
   emit for a dark band — the name predates est1973; the ground it maps to
   is now --e73-dark. ------------------------------------------------------ */
body.ccs-est1973 .bg-dark-blue p,
body.ccs-est1973 .bg-dark-blue h2,
body.ccs-est1973 .bg-dark-blue h3,
body.ccs-est1973 .bg-dark-blue li,
body.ccs-est1973 .bg-dark-blue .testimonial-card__details,
body.ccs-est1973 .bg-dark-blue .testimonial-card__author,
body.ccs-est1973 .full-width-cta p,
body.ccs-est1973 .full-width-cta h2 {
	color: var(--e73-porcelain);
}

/* City hero: the est1973 masthead re-skin styled the h1 and the kicker but
   never the subline or the trailing breadcrumb, so both kept body ink. */
body.ccs-est1973 .masthead--innerpage .e73-hero-sub,
body.ccs-est1973 .masthead--innerpage .breadcrumbs li,
body.ccs-est1973 .masthead--innerpage li.breadcrumb_last {
	color: var(--e73-porcelain);
}

/* Combo: the dark related-links band is a classless <section> inside the
   layout, and the aside beside it carries the same ground. */
body.ccs-est1973 .ccs-city-service__aside p,
body.ccs-est1973 .ccs-city-service__aside h2,
body.ccs-est1973 .ccs-city-service__aside h3,
body.ccs-est1973 .ccs-city-service__aside li {
	color: var(--e73-porcelain);
}

body.ccs-est1973 .ccs-city-service__aside a {
	color: var(--e73-butter);       /* on --e73-dark = 9.10:1 */
}

/* Calculator captions: --e73-muted on --e73-cream is 4.35:1, under the floor. */
body.ccs-est1973 .ccs-calc__updated,
body.ccs-est1973 main.ccs-calc .ccs-calc__meta,
body.ccs-est1973 main.ccs-calc .ccs-calc__meta span {
	color: var(--e73-body);         /* on --e73-cream = 8.61:1 */
}

/* Primary button label was --e73-line on the teal fill (4.04:1) and needs the
   #main ancestor to outrank the theme's own .btn rules. */
body.ccs-est1973 #main a.btn.btn-primary,
body.ccs-est1973 #main a.btn.btn-primary span,
body.ccs-est1973 #main .btn.btn-primary {
	color: var(--e73-porcelain);    /* on --e73-teal = 6.11:1 */
}

/* ═══ Virtual-page dark bands ════════════════════════════════════════════
   The city-service, virtual-guide and calculator dispatchers render
   <main id="primary">, NOT #main, so the id-specificity exceptions added to
   est1973-city-unify.css do not reach them. They also print their own <style>
   inside <main>, after every stylesheet, so a rule that merely ties on
   specificity loses on source order. Each selector below therefore adds the
   <main> element + its class to outrank the dispatcher's own `.ccs-city-service p`
   (0,2,2) rather than tie it. Verified pairs: porcelain on --e73-dark 16.11:1,
   butter on --e73-dark 9.10:1. ══════════════════════════════════════════ */
body.ccs-est1973 main.ccs-city-service .ccs-city-service__aside p,
body.ccs-est1973 main.ccs-city-service .ccs-city-service__aside li,
body.ccs-est1973 main.ccs-city-service .ccs-city-service__aside h2,
body.ccs-est1973 main.ccs-city-service .ccs-city-service__aside h3,
body.ccs-est1973 main.ccs-city-service .ccs-city-service__aside small,
body.ccs-est1973 main.ccs-city-service section:nth-of-type(5) p,
body.ccs-est1973 main.ccs-city-service section:nth-of-type(5) li,
body.ccs-est1973 main.ccs-city-service section:nth-of-type(5) h2,
body.ccs-est1973 main.ccs-virtual-guide .ccs-virtual-guide__aside p,
body.ccs-est1973 main.ccs-virtual-guide .ccs-virtual-guide__aside li,
body.ccs-est1973 main.ccs-virtual-guide .ccs-virtual-guide__aside h2,
body.ccs-est1973 main.ccs-virtual-guide .ccs-virtual-guide__aside h3 {
	color: var(--e73-porcelain);
}

body.ccs-est1973 main.ccs-city-service .ccs-city-service__aside a:not([class*="__button"]),
body.ccs-est1973 main.ccs-city-service section:nth-of-type(5) a:not([class*="__button"]),
body.ccs-est1973 main.ccs-virtual-guide .ccs-virtual-guide__aside a:not([class*="__button"]) {
	color: var(--e73-butter);
	text-decoration: underline;
	text-underline-offset: 2px;
}

/* Calculator captions: --e73-muted on the cream ground is 4.35:1, under the
   floor. The calculator sheet is enqueued at priority 99990 and so lands after
   everything else — hence the <main> element in the selector. */
body.ccs-est1973 main.ccs-calc p.ccs-calc__updated,
body.ccs-est1973 main.ccs-calc .ccs-calc__intro span,
body.ccs-est1973 main.ccs-calc .ccs-calc__lede span,
body.ccs-est1973 main.ccs-calc em,
body.ccs-est1973 main.ccs-calc > span,
body.ccs-est1973 main.ccs-calc p > span {
	color: var(--e73-body);          /* on --e73-cream = 8.61:1 */
}

/* "Back to top" sits in the dark footer band and kept the light-ground body
   ink: 1.82:1. The footer is outside #main, so it needs its own rule. */
body.ccs-est1973 .footer-bottom .back-to-top button,
body.ccs-est1973 .footer-bottom .back-to-top a,
body.ccs-est1973 .footer-bottom .js-back-to-top button {
	color: var(--e73-porcelain);     /* on the dark footer = 16.11:1 */
	background: transparent;
}

/* The `.external` Book Now variants kept the pre-est1973 orange fill, giving
   4.43:1 with porcelain — under the floor, and a non-token literal (C6). Every
   other primary button on the same page is already teal, so this also removes
   an inconsistency rather than introducing a new colour. */
body.ccs-est1973 a.btn.btn-primary.external,
body.ccs-est1973 a.btn.btn-primary.btn-primary-icon {
	background: var(--e73-teal);
	border-color: var(--e73-teal);
	color: var(--e73-porcelain);     /* on --e73-teal = 6.11:1 */
}

/* ═══ Last four contested pairs ══════════════════════════════════════════
   Each of these loses the cascade to a rule that already carries !important
   or to a dispatcher's inline <style>, so specificity alone cannot reach
   them. !important is used here only where the competing declaration is
   itself !important, and only on a verified failing pair — not as a blanket.
   ════════════════════════════════════════════════════════════════════════ */

/* "Back to top" sits in the dark footer. The rule that colours it
   (#4A4238 !important, light-ground body ink) predates the dark footer. */
body.ccs-est1973 .footer-bottom .back-to-top button,
body.ccs-est1973 .footer-bottom .back-to-top a,
body.ccs-est1973 .footer-bottom .js-back-to-top button {
	color: var(--e73-porcelain) !important;   /* on the dark footer = 16.11:1 */
}

/* The secondary action link in an answer card is teal !important. That is
   6.11:1 on the porcelain card, but the same component also renders inside
   the dark guide aside, where teal is 2.68:1. */
body.ccs-est1973 .ccs-virtual-guide__aside [class*="__actions"] > a:not([class*="__button"]),
body.ccs-est1973 .ccs-virtual-guide__aside [class*="__actions"] > a + a:not([class*="__button"]),
body.ccs-est1973 .ccs-city-service__aside [class*="__actions"] > a:not([class*="__button"]),
body.ccs-est1973 .ccs-city-service__aside [class*="__actions"] > a + a:not([class*="__button"]) {
	color: var(--e73-porcelain) !important;   /* on --e73-dark = 16.11:1 */
}

/* Calculator breadcrumb is --e73-muted on cream: 4.35:1, under the floor. */
body.ccs-est1973 main.ccs-calc .ccs-calc__breadcrumb,
body.ccs-est1973 main.ccs-calc .ccs-calc__breadcrumb span,
body.ccs-est1973 main.ccs-calc nav.ccs-calc__breadcrumb {
	color: var(--e73-body);                   /* on --e73-cream = 8.61:1 */
}

/* Combo's fifth section is the dark related-services band; its own sheet
   already sets the h2 to porcelain but loses to the dispatcher's inline CSS. */
body.ccs-est1973 main.ccs-city-service section:nth-of-type(5) h2,
body.ccs-est1973 .ccs-city-service section:nth-of-type(5) h2 {
	color: var(--e73-porcelain) !important;   /* on --e73-dark = 16.11:1 */
}


/* ═══ Pre-interaction state of the mobile lead bar ═══════════════════════
   The sticky call/book bar is the primary mobile conversion control, and
   before any interaction it rendered the legacy orange (#B8410E) on its own
   red and teal fills — 1.08:1 and 1.15:1, invisible — at 19px tall. It only
   became white and 56px once an interaction-gated sheet loaded. Lighthouse
   never interacts, which is how axe caught this and the scroll-driven sweep
   did not; more importantly it is the state a visitor sees on arrival.

   Authored here because est1973-shell.css is EAGER: a fix in a deferred sheet
   would reproduce exactly the bug it is meant to fix. ═══════════════════ */
body.ccs-est1973 .ccs-mobile-lead-bar__item,
body.ccs-est1973 .ccs-mobile-lead-bar__item strong,
body.ccs-est1973 .ccs-mobile-lead-bar__item small,
body.ccs-est1973 .ccs-mobile-lead-bar__item span {
	color: var(--e73-porcelain);   /* on call red 5.73:1, on teal 6.11:1 */
}

/* 44px is the WCAG 2.5.8 touch floor; the bar was 19px. 56px matches what the
   deferred sheet already applies, so the control no longer changes size when
   that sheet lands. */
body.ccs-est1973 .ccs-mobile-lead-bar__item {
	min-height: 56px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}

/* ═══ Three pairs surfaced by widening the audit to every text-bearing
   element — the earlier tag list skipped div/dt/strong/small entirely. ═══ */

/* The testimonial card sits on the dark band but is itself a porcelain card;
   its body text was porcelain too — 1.00:1, the exact same colour as its
   ground, so the quote was completely invisible. */
body.ccs-est1973 .testimonial-card .testimonial-card__details,
body.ccs-est1973 .testimonial-card .testimonial-card__author,
body.ccs-est1973 .bg-dark-blue .testimonial-card .testimonial-card__details,
body.ccs-est1973 .bg-dark-blue .testimonial-card .testimonial-card__author {
	color: var(--e73-body);        /* on the porcelain card = 9.48:1 */
}

/* Spec-sheet labels used --e73-brass, which is a metal detail token and only
   3.74:1 on porcelain — it does not meet the floor as text at any weight. */
body.ccs-est1973 .ccs-equipment__spec dt,
body.ccs-est1973 main.ccs-equipment dt {
	color: var(--e73-body);        /* on porcelain = 9.48:1 */
}

/* Promo kicker was teal on butter-2: 4.42:1, just under the floor at 13px/700.
   The pressed teal clears it at 6.02:1 and is the same hue family. */
/* The kicker colour is set to teal !important by a shared rule covering several
   pullout components. Teal is correct on their grounds and only fails on this
   one, whose ground is butter-2 — so this overrides with an extra element in
   the selector (0,4,2) rather than weakening the shared rule for everyone. */
body.ccs-est1973.home div.promo-cta__wrap .sub-heading,
body.ccs-est1973 div.promo-cta__wrap .sub-heading {
	color: var(--e73-teal-2) !important;
}

/* ═══ Guide link-list touch targets ══════════════════════════════════════
   The 18 links in .ccs-virtual-guide__links were 17px tall against the 24px
   WCAG 2.5.8 floor. The anchors are display:inline, where min-height has no
   effect at all — the box must come from inline-block plus real padding.

   Scoped to this one list on purpose: an earlier, broader pass that gave every
   list link `display:inline-flex` and a bottom margin regressed the score from
   96 to 92 by breaking footer layout. Nothing here reaches beyond this
   component. ═══════════════════════════════════════════════════════════ */
body.ccs-est1973 .ccs-virtual-guide__links > li > a,
body.ccs-est1973 .ccs-growth-links__list > li > a,
body.ccs-est1973 .ccs-city-depth__grid li > a,
body.ccs-est1973 .ccs-footer-growth-links li > a {
	display: inline-block;
	padding: 5px 0;
	min-height: 24px;
	line-height: 1.45;
}

body.ccs-est1973 .ccs-virtual-guide__links > li,
body.ccs-est1973 .ccs-growth-links__list > li,
body.ccs-est1973 .ccs-city-depth__grid li,
body.ccs-est1973 .ccs-footer-growth-links li {
	margin-bottom: 4px;
}

/* Touch pointers get the full 44px comfort target; mouse keeps the tighter
   24px rhythm so the list does not sprawl on desktop. */
@media (pointer: coarse) {
	body.ccs-est1973 .ccs-virtual-guide__links > li > a,
	body.ccs-est1973 .ccs-growth-links__list > li > a,
	body.ccs-est1973 .ccs-city-depth__grid li > a,
	body.ccs-est1973 .ccs-footer-growth-links li > a {
		min-height: 44px;
		display: flex;
		align-items: center;
	}
}

/* ═══ Guide/aside ground must be eager, not deferred ═════════════════════
   The inverted text for these asides is authored in this (eager) sheet, but
   their dark ground came from a deferred sheet — and ccs-city-growth.css /
   ccs-home-full.css even set it to #fff and #f7fbff. Before interaction the
   aside was therefore cream with porcelain text on it: 1.1:1, invisible.
   axe caught this because Lighthouse never interacts; the scroll-driven sweep
   did not, because by then the deferred sheet had landed.

   Stating the ground here, beside the foreground, means the pair holds in
   BOTH states — which is the only way this component can be correct, since
   a visitor sees the pre-interaction render first. ════════════════════ */
body.ccs-est1973 .ccs-virtual-guide__aside,
body.ccs-est1973 .ccs-city-service__aside {
	background: var(--e73-dark);
	border-color: var(--e73-dark);
}

/* Action buttons inside those asides: the aside link rule painted them
   porcelain, which lands on a white button fill at 1.1:1. Fill and label are
   stated together so neither can drift. */
body.ccs-est1973 .ccs-virtual-guide__aside .ccs-virtual-guide__actions > a,
body.ccs-est1973 .ccs-city-service__aside .ccs-city-service__actions > a {
	background: var(--e73-butter);
	border-color: var(--e73-butter);
	color: var(--e73-ink) !important;   /* ink on butter = 8.56:1 */
	text-decoration: none;
}

/* Promo dismiss + one-line mobile promo. */
body.ccs-est1973.e73-promo-off .header-notification-bar {
	display: none;
}
body.ccs-est1973 .header-notification-bar__dismiss {
	margin-left: 10px;
	background: transparent;
	border: 0;
	color: inherit;
	font-size: 22px;
	line-height: 1;
	min-width: 32px;
	min-height: 32px;
	cursor: pointer;
}
html:has(body.ccs-est1973) {
	scroll-padding-top: var(--ccs-header-offset, 199px);
	scroll-behavior: auto;
}

@media (max-width: 1023px) {
	body.ccs-est1973 .header-notification-bar { padding: 6px 0; }
	body.ccs-est1973 .header-notification-bar .container {
		flex-direction: row;
		flex-wrap: nowrap;
		align-items: center;
		gap: 8px;
		max-width: 100%;
		overflow: hidden;
		padding-left: 12px;
		padding-right: 12px;
	}
	body.ccs-est1973 .header-notification-bar__msg {
		display: block;
		flex: 1 1 auto;
		min-width: 0;
		max-width: calc(100vw - 88px);
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
		font-size: 13px;
	}
	body.ccs-est1973 .header-notification-bar__cta span {
		display: none;
	}
	body.ccs-est1973 #page-header .header-wrap {
		flex-wrap: nowrap;
		align-items: center;
		padding: 6px 0;
		gap: 8px;
	}
	body.ccs-est1973 .logo-container img {
		width: min(52vw, 188px);
		max-width: 188px;
		height: auto;
	}
	body.ccs-est1973 .js-search-toggle {
		display: none;
	}
	body.ccs-est1973 .header-phone.mobile-phone {
		position: static;
		margin: 0;
	}
	body.ccs-est1973 .header-phone.mobile-phone a {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 44px;
		height: 44px;
	}
	body.ccs-est1973 .page-header.e73-header-away {
		transform: translateY(-100%);
	}
	body.ccs-est1973 .page-header {
		transition: transform .2s ease;
	}
	:root { --ccs-header-offset: 118px; }
}

@media (prefers-reduced-motion: reduce) {
	body.ccs-est1973 .page-header {
		transition: none;
	}
}

body.ccs-est1973 .e73-sidebar__legal {
	margin: 14px 0 0;
	font-size: 12.5px;
	line-height: 1.4;
	color: rgba(255, 250, 238, .62);
}
body.ccs-est1973 .e73-sidebar__legal a {
	color: var(--e73-butter);
}

/* ═══ Header micro-polish (visual audit 2026-08-17) ═══
   Nav labels rendered at three near-identical sizes (15/15.5px) and the
   header phone at a non-token 18px; unify on the type scale (T3) and give
   the notification-bar dismiss a full 44px target (A4 touch). */
body.ccs-est1973 .page-header .nav-primary a {
	font-size: 14px;
}

body.ccs-est1973 .page-header .header-phone,
body.ccs-est1973 .page-header .header-phone a {
	font-size: 19px;
}

body.ccs-est1973 .header-notification-bar__dismiss {
	min-width: 44px;
	min-height: 44px;
}

/* Porcelain image-text cards kept white copy from the legacy dark band —
   1:1 on the service-areas index. Pair the card with body ink. */
body.ccs-est1973 .fx-block.image-text .image-text__text,
body.ccs-est1973 #main .fx-block.image-text .image-text__text {
	color: var(--e73-body) !important;
}

body.ccs-est1973 .fx-block.image-text .image-text__text h2,
body.ccs-est1973 .fx-block.image-text .image-text__text h3 {
	color: var(--e73-ink) !important;
}

/* The white LI rule from the legacy dark band out-specifies inheritance. */
body.ccs-est1973 #main .fx-block.image-text .image-text__text ul,
body.ccs-est1973 #main .fx-block.image-text .image-text__text li,
body.ccs-est1973 #main .fx-block.image-text .image-text__text span {
	color: var(--e73-body) !important;
}

/* Footer-growth card summaries (the "Services" / "Service Areas" folds)
   render at 14–16px across families; hold the T2 floor everywhere. */
body.ccs-est1973 .ccs-footer-growth-links__grid summary h3 {
	font-size: var(--e73-fs-base) !important;
	line-height: 1.3;
}

/* ═══ Cross-family T2 floors (2026-08-17) ═══
   Pages outside the city/service stacks (about, reviews, misc) still render
   these shared components at 14–16px. The floors live here so every
   est1973 page gets them. */
body.ccs-est1973 .ccs-about-proof__card h3,
body.ccs-est1973 .ccs-city-depth__grid h3,
body.ccs-est1973 .footer-seo-services h3,
body.ccs-est1973 .ccs-growth-links__grid summary h3 {
	font-size: var(--e73-fs-base) !important;
	line-height: 1.3;
}

/* Logo anchor box ran 3px narrower than its image. */
body.ccs-est1973 .logo-container img {
	max-width: 100%;
}

/* Footer/growth link descenders clipped by the 1.3 line-height. */
body.ccs-est1973 .footer-seo-services a,
body.ccs-est1973 .ccs-growth-links a,
body.ccs-est1973 .ccs-footer-growth-links a {
	line-height: 1.5;
}

/* Guide link pills render on service pages too — hold the wrap fix here. */
body.ccs-est1973 .ccs-virtual-guide__links a {
	white-space: normal !important;
}

/* Two-line card titles need more leading than the 1.16 display floor. */
@media (max-width: 1023px) {
	body.ccs-est1973 .blog-post__title,
	body.ccs-est1973 .blog-post__title a {
		line-height: 1.4 !important;
	}
}

/* Descender clearance for the footer resource links (all families). */
body.ccs-est1973 .footer-seo-services a,
body.ccs-est1973 .ccs-growth-links a,
body.ccs-est1973 .ccs-footer-growth-links a,
body.ccs-est1973 .ccs-post-paths a,
body.ccs-est1973 .ccs-city-depth__grid a {
	line-height: 1.5 !important;
}

/* Inner-page hero CTAs go full-width on touch instead of clipping —
   the row itself must take the column first. */
@media (max-width: 767px) {
	/* The CTA row is a content-tracked grid — collapse it to one full-width
	   track so labels never clip. */
	body.ccs-est1973 .masthead--innerpage .e73-hero-ctas {
		grid-template-columns: minmax(0, 1fr);
		width: 100%;
	}
}

/* Final authority for touch hero-CTA rows (any family stack): one
   full-width track, labels wrap, no clipping. */
@media (max-width: 767px) {
	body.ccs-est1973 .masthead--innerpage .e73-hero-ctas,
	body.ccs-est1973 #main .masthead--innerpage .e73-hero-ctas {
		display: grid !important;
		grid-template-columns: minmax(0, 1fr) !important;
		width: 100% !important;
	}

	body.ccs-est1973 .masthead--innerpage .e73-hero-ctas .btn,
	body.ccs-est1973 #main .masthead--innerpage .e73-hero-ctas .btn {
		justify-self: stretch;
		white-space: normal;
	}
}