/*
Theme Name: Beyond Blue Media — Zaps Pest Control V2
Theme URI: https://beyondbluemedia.com/
Author: Beyond Blue Media
Author URI: https://beyondbluemedia.com/
Description: Custom theme for Zaps Pest and Bug Control (Dallas, TX). Bold, high-contrast pest-control brand — condensed Oswald display type in near-black navy, a hot Zap Red accent and lime-green trust cues, over alternating white and cool-gray bands of crisp bordered cards.
Version: 1.1.0
Requires at least: 6.5
Tested up to: 6.8
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: beyond-blue-media-zaps-v2
Tags: custom-theme, block-patterns, accessibility-ready, one-page
*/

/* =========================================================================
   1. CSS CUSTOM PROPERTIES
   ========================================================================= */
:root {
	/* Brand */
	--color-red:          #B91C1C;
	--color-red-dark:     #7F1D1D;
	--color-red-bright:   #F87171;  /* hero headline + on-navy accents: 4.6:1 worst case over the scrimmed photo */
	--color-green:        #22C55E;
	--color-green-mid:    #16A34A;
	--color-green-dark:   #15803D;
	--color-navy:         #0A0F1E;
	--color-navy-soft:    #111827;
	--color-navy-line:    #1F2937;

	/* Surfaces */
	--color-bg:           #FFFFFF;
	--color-bg-alt:       #F9FAFB;
	--color-border:       #E5E7EB;
	--color-border-soft:  #F3F4F6;

	/* Text */
	--color-text:         #111827;
	--color-text-muted:   #4B5563;
	--color-text-soft:    #6B7280;
	--color-text-invert:  #FFFFFF;
	--color-text-on-dark: #D1D5DB;

	/* Accents */
	--color-gold:         #F59E0B;
	--color-focus:        #22C55E;

	/* Type */
	--font-display: "Oswald", "Arial Narrow", Impact, sans-serif;
	--font-body:    "Open Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;

	--fs-eyebrow:  0.875rem;
	--fs-body-sm:  0.8125rem;
	--fs-body:     1rem;
	--fs-lead:     1.0625rem;
	--fs-h3:       1.375rem;
	--fs-h2:       clamp(1.875rem, 5.2vw, 3rem);
	--fs-h1:       clamp(2.5rem, 8vw, 4.5rem);

	/* Layout */
	--content-width:   1200px;
	--content-narrow:  760px;
	--content-mid:     980px;
	--gutter:          clamp(1rem, 4vw, 2.5rem);
	--section-pad:     clamp(3.5rem, 8vw, 6rem);
	--header-h:        68px;   /* design constant: sticky bar min-height */
	--header-offset:   68px;   /* runtime: the sticky bar's own height (anchor scroll offset) */
	--header-bottom:   102px;  /* runtime: the sticky bar's bottom edge in the viewport */
	--utilitybar-h:    34px;

	/* Shape + depth */
	--radius-sm:   6px;
	--radius:      10px;
	--radius-lg:   14px;
	--radius-pill: 999px;
	--shadow-sm:   0 1px 2px rgba(10, 15, 30, .06);
	--shadow:      0 4px 14px rgba(10, 15, 30, .08);
	--shadow-lg:   0 14px 40px rgba(10, 15, 30, .16);

	--transition:  200ms ease;
}

/* =========================================================================
   2. RESET & BASE
   ========================================================================= */
*, *::before, *::after { box-sizing: border-box; }

html {
	overflow-x: clip;
	scroll-behavior: smooth;
	scroll-padding-top: calc(var(--header-offset) + 1rem);
	-webkit-text-size-adjust: 100%;
}

body {
	overflow-x: clip;
	margin: 0;
	background: var(--color-bg);
	color: var(--color-text);
	font-family: var(--font-body);
	font-size: var(--fs-body);
	line-height: 1.65;
	-webkit-font-smoothing: antialiased;
}

img, svg, video { max-width: 100%; height: auto; display: block; }

a { color: var(--color-red); text-decoration-thickness: 1px; text-underline-offset: 2px; }
a:hover { color: var(--color-red-dark); }

/* Visible focus for every interactive element */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible,
[tabindex]:focus-visible {
	outline: 3px solid var(--color-focus);
	outline-offset: 2px;
	border-radius: var(--radius-sm);
}
a:active, button:active { transform: translateY(1px); }

/* Screen-reader-only helper */
.screen-reader-text,
.visually-hidden {
	position: absolute !important;
	width: 1px; height: 1px;
	padding: 0; margin: -1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}

/* Skip link — first tabbable element, hidden until focused */
.skip-link {
	position: absolute;
	top: 0; left: 50%;
	transform: translate(-50%, -120%);
	z-index: 999;
	padding: .75rem 1.5rem;
	background: var(--color-navy);
	color: #fff;
	font-family: var(--font-display);
	font-weight: 600;
	letter-spacing: .08em;
	text-transform: uppercase;
	text-decoration: none;
	border-radius: 0 0 var(--radius) var(--radius);
	transition: transform var(--transition);
}
.skip-link:focus { transform: translate(-50%, 0); color: #fff; }
/* Logged-in users: clear the WP admin bar so the focused skip link is not hidden behind it. */
.admin-bar .skip-link { top: 32px; }
@media screen and (max-width: 782px) {
	.admin-bar .skip-link { top: 46px; }
}

/* =========================================================================
   3. TYPOGRAPHY
   ========================================================================= */
h1, h2, h3, h4, h5, h6 {
	font-family: var(--font-display);
	font-weight: 700;
	line-height: 1.06;
	color: var(--color-navy);
	margin: 0 0 .6em;
	text-wrap: balance;
}
h1 { font-size: var(--fs-h1); letter-spacing: -.01em; }
h2 { font-size: var(--fs-h2); text-transform: uppercase; }
h3 { font-size: var(--fs-h3); }
h4 { font-size: 1.125rem; }

p { margin: 0 0 1.1em; }
p:last-child { margin-bottom: 0; }

.lead { font-size: var(--fs-lead); color: var(--color-text-muted); }

.section-intro {
	max-width: var(--content-narrow);
	margin-inline: auto;
	text-align: center;
	color: var(--color-text-muted);
}

/* Section heads that keep sentence case (design mixes both) */
.h2-sentence { text-transform: none; }

/* =========================================================================
   4. EYEBROW TEXT
   ========================================================================= */
.eyebrow,
.is-style-eyebrow {
	font-family: var(--font-display);
	font-size: var(--fs-eyebrow);
	font-weight: 700;
	letter-spacing: .2em;
	text-transform: uppercase;
	color: var(--color-red);
	margin: 0 0 .85rem;
	display: flex;
	align-items: center;
	gap: .75rem;
}
.eyebrow::before {
	content: "";
	width: 28px; height: 2px; flex: 0 0 28px;
	background: currentColor;
}
.eyebrow.has-text-align-center,
.eyebrow--centered { justify-content: center; }
.eyebrow.has-text-align-center::after,
.eyebrow--centered::after {
	content: "";
	width: 28px; height: 2px; flex: 0 0 28px;
	background: currentColor;
}
.eyebrow-light { color: #fff; }
.eyebrow-dark  { color: var(--color-navy); }

/* =========================================================================
   5. CARD SURFACES
   ========================================================================= */
.card {
	background: var(--color-bg);
	border: 1px solid var(--color-border);
	border-radius: var(--radius);
	box-shadow: var(--shadow-sm);
}
.glass-card,
.is-style-glass-card {
	background: rgba(255, 255, 255, .82);
	-webkit-backdrop-filter: blur(12px);
	backdrop-filter: blur(12px);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-lg);
	padding: clamp(1.25rem, 3vw, 2rem);
}
.glass-dark {
	background: rgba(10, 15, 30, .72);
	-webkit-backdrop-filter: blur(12px);
	backdrop-filter: blur(12px);
	border: 1px solid rgba(255, 255, 255, .12);
	border-radius: var(--radius-lg);
	color: #fff;
}

/* =========================================================================
   6. BUTTONS
   ========================================================================= */
.wp-block-button__link,
.wp-element-button,
.zaps-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .55rem;
	padding: .9rem 1.6rem;
	border: 2px solid var(--color-red);
	border-radius: var(--radius-sm);
	background: var(--color-red);
	color: #fff;
	font-family: var(--font-display);
	font-size: .875rem;
	font-weight: 600;
	letter-spacing: .1em;
	line-height: 1.1;
	text-transform: uppercase;
	text-decoration: none;
	cursor: pointer;
	transition: background var(--transition), border-color var(--transition), color var(--transition), box-shadow var(--transition);
}
.wp-block-button__link:hover,
.wp-element-button:hover,
.zaps-btn:hover {
	background: var(--color-red-dark);
	border-color: var(--color-red-dark);
	color: #fff;
	box-shadow: var(--shadow);
}
.wp-block-button__link:active,
.zaps-btn:active { background: #651414; border-color: #651414; }

/* Outline */
.is-style-outline > .wp-block-button__link,
.zaps-btn--outline {
	background: transparent;
	border-color: var(--color-navy);
	color: var(--color-navy);
}
.is-style-outline > .wp-block-button__link:hover,
.zaps-btn--outline:hover {
	background: var(--color-navy);
	border-color: var(--color-navy);
	color: #fff;
}
/* Outline on dark backgrounds */
.on-dark .is-style-outline > .wp-block-button__link,
.zaps-btn--outline-light {
	background: transparent;
	border-color: #fff;
	color: #fff;
}
.on-dark .is-style-outline > .wp-block-button__link:hover,
.zaps-btn--outline-light:hover { background: #fff; color: var(--color-navy); }

/* Outline-red (pricing secondary) */
.zaps-btn--outline-red {
	background: transparent;
	border-color: var(--color-red);
	color: var(--color-red);
}
.zaps-btn--outline-red:hover { background: var(--color-red); color: #fff; }

.zaps-btn--block { width: 100%; }
.zaps-btn--lg { padding: 1.05rem 2rem; font-size: .9375rem; }

.zaps-btn__icon { flex: 0 0 auto; }

/* =========================================================================
   7. LAYOUT HELPERS  (classic theme = no theme.json contentSize)
   ========================================================================= */
.entry-content > * {
	max-width: var(--content-width);
	margin-left: auto;
	margin-right: auto;
	padding-left: var(--gutter);
	padding-right: var(--gutter);
}
.entry-content > .alignfull,
.entry-content > .wp-block-cover.alignfull,
.entry-content > .wp-block-columns.alignfull,
.entry-content > .wp-block-group.alignfull {
	max-width: none;
	width: 100%;
	padding-left: 0;
	padding-right: 0;
}
.entry-content > .wp-block-group.alignfull > * {
	max-width: var(--content-width);
	margin-left: auto;
	margin-right: auto;
	padding-left: var(--gutter);
	padding-right: var(--gutter);
}
.wp-block-cover .wp-block-cover__inner-container {
	max-width: var(--content-width);
	margin: 0 auto;
	padding: 0 var(--gutter);
	width: 100%;
}
.entry-content > .wp-block-cover.alignfull { position: relative; }

/* Utilities that must beat the cap rule */
.maxw-narrow { max-width: var(--content-narrow) !important; margin-inline: auto; }
.maxw-mid    { max-width: var(--content-mid) !important;    margin-inline: auto; }

.section-padding    { padding-top: var(--section-pad); padding-bottom: var(--section-pad); }
.section-padding-sm { padding-top: calc(var(--section-pad) * .62); padding-bottom: calc(var(--section-pad) * .62); }
.band-alt   { background: var(--color-bg-alt); }
.band-white { background: var(--color-bg); }
.band-navy  { background: var(--color-navy); color: var(--color-text-on-dark); }
.band-navy h2, .band-navy h3 { color: #fff; }
.band-red   { background: var(--color-red); color: #fff; }
.band-red h2, .band-red h3 { color: #fff; }

.text-center { text-align: center; }

/* =========================================================================
   8. SITE HEADER
   ========================================================================= */
.site-utilitybar {
	background: var(--color-red);
	color: #fff;
	font-size: var(--fs-body-sm);
}
.site-utilitybar__inner {
	max-width: var(--content-width);
	margin: 0 auto;
	padding: .45rem var(--gutter);
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	min-height: var(--utilitybar-h);
}
.site-utilitybar__tagline {
	font-family: var(--font-display);
	font-weight: 600;
	letter-spacing: .04em;
	margin: 0;
}
.site-utilitybar__phone {
	display: inline-flex;
	align-items: center;
	gap: .4rem;
	color: #fff;
	font-weight: 700;
	text-decoration: none;
	white-space: nowrap;
}
.site-utilitybar__phone:hover { color: #fff; text-decoration: underline; }
.site-utilitybar .menu { list-style: none; display: flex; gap: 1.1rem; margin: 0; padding: 0; }
.site-utilitybar .menu a { color: #fff; text-decoration: none; font-weight: 600; }
.site-utilitybar .menu a:hover { text-decoration: underline; color: #fff; }

.site-header {
	position: sticky;
	top: 0;
	z-index: 200;
	background: var(--color-navy);
	border-bottom: 1px solid rgba(255, 255, 255, .08);
}
.site-header__inner {
	max-width: var(--content-width);
	margin: 0 auto;
	padding: 0 var(--gutter);
	min-height: var(--header-h);
	display: flex;
	align-items: center;
	gap: 1.25rem;
}

.site-branding { flex: 0 0 auto; display: flex; align-items: center; }
.site-branding .custom-logo-link,
.site-branding .custom-logo { display: block; }
.site-branding .custom-logo { max-height: 52px; width: auto; }
.site-branding__text {
	font-family: var(--font-display);
	font-size: 1.25rem;
	font-weight: 700;
	letter-spacing: .04em;
	text-transform: uppercase;
	color: #fff;
	text-decoration: none;
	line-height: 1.1;
}
.site-branding__text:hover { color: #fff; }
.site-branding__text span { color: var(--color-red-bright); }

.site-header__nav { margin-left: auto; }
.site-header__cta { flex: 0 0 auto; }
.site-header__cta .zaps-btn { padding: .7rem 1.15rem; }

/* --- Primary nav (3 levels) --- */
.site-nav > ul {
	list-style: none;
	display: flex;
	align-items: center;
	gap: 1.4rem;
	margin: 0;
	padding: 0;
}
.site-nav li { position: relative; }
.site-nav a {
	display: block;
	padding: .55rem 0;
	color: #fff;
	font-family: var(--font-display);
	font-size: .875rem;
	font-weight: 600;
	letter-spacing: .09em;
	text-transform: uppercase;
	text-decoration: none;
	white-space: nowrap;
}
.site-nav a:hover { color: var(--color-red-bright); }
.site-nav > ul > li > a { position: relative; }
.site-nav > ul > li > a::after {
	content: "";
	position: absolute;
	left: 0; right: 0; bottom: .1rem;
	height: 2px;
	background: var(--color-red-bright);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform var(--transition);
}
.site-nav > ul > li > a:hover::after,
.site-nav > ul > li > a:focus-visible::after,
.site-nav > ul > li.current-menu-item > a::after { transform: scaleX(1); }

/* Caret indicators */
.site-nav .menu-item-has-children > a { padding-right: 1.1rem; }
.site-nav .menu-item-has-children > a::before {
	content: "";
	position: absolute;
	right: 0; top: 50%;
	width: .4rem; height: .4rem;
	margin-top: -.28rem;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: rotate(45deg);
}
.site-nav .sub-menu .menu-item-has-children > a::before { transform: rotate(-45deg); right: .55rem; }

/* Sub-menus (desktop) */
.site-nav .sub-menu {
	list-style: none;
	margin: 0;
	padding: .4rem 0;
	position: absolute;
	top: 100%;
	left: 0;
	min-width: 240px;
	background: var(--color-navy-soft);
	border: 1px solid var(--color-navy-line);
	border-radius: var(--radius-sm);
	box-shadow: var(--shadow-lg);
	opacity: 0;
	visibility: hidden;
	transform: translateY(6px);
	transition: opacity var(--transition), transform var(--transition), visibility var(--transition);
	z-index: 10;
}
.site-nav li:hover > .sub-menu,
.site-nav li:focus-within > .sub-menu,
.site-nav li.is-open > .sub-menu {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}
.site-nav .sub-menu a { padding: .6rem 1.1rem; letter-spacing: .05em; }
.site-nav .sub-menu a:hover { background: rgba(255, 255, 255, .06); }
.site-nav .sub-menu .sub-menu { top: -.4rem; left: 100%; }

/* Mobile toggle */
.nav-toggle {
	display: none;
	margin-left: auto;
	width: 44px; height: 44px;
	padding: 0;
	background: transparent;
	border: 1px solid rgba(255, 255, 255, .28);
	border-radius: var(--radius-sm);
	color: #fff;
	cursor: pointer;
}
.nav-toggle__bars,
.nav-toggle__bars::before,
.nav-toggle__bars::after {
	display: block;
	width: 20px; height: 2px;
	margin: 0 auto;
	background: currentColor;
	transition: transform var(--transition), opacity var(--transition);
}
.nav-toggle__bars { position: relative; }
.nav-toggle__bars::before { content: ""; position: absolute; top: -6px; }
.nav-toggle__bars::after  { content: ""; position: absolute; top: 6px; }
.nav-toggle[aria-expanded="true"] .nav-toggle__bars { background: transparent; }
.nav-toggle[aria-expanded="true"] .nav-toggle__bars::before { transform: translateY(6px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] .nav-toggle__bars::after  { transform: translateY(-6px) rotate(-45deg); }

/* =========================================================================
   9. SITE FOOTER
   ========================================================================= */
.site-footer {
	background: var(--color-navy);
	color: var(--color-text-on-dark);
	padding-top: clamp(2.5rem, 6vw, 4rem);
}
.site-footer__inner {
	max-width: var(--content-width);
	margin: 0 auto;
	padding: 0 var(--gutter);
	display: grid;
	gap: clamp(2rem, 5vw, 3rem);
	grid-template-columns: 1.4fr 1fr 1fr;
}
.site-footer h3 {
	color: #fff;
	font-size: 1rem;
	letter-spacing: .14em;
	text-transform: uppercase;
	margin-bottom: 1.1rem;
}
.site-footer p { color: var(--color-text-on-dark); font-size: .9375rem; }
.site-footer__logo { max-height: 64px; width: auto; margin-bottom: 1.1rem; }
.site-footer__brand {
	font-family: var(--font-display);
	font-size: 1.25rem;
	font-weight: 700;
	text-transform: uppercase;
	color: #fff;
	margin-bottom: .75rem;
}
.site-footer ul { list-style: none; margin: 0; padding: 0; }
.site-footer li { margin-bottom: .55rem; }
.site-footer a { color: var(--color-text-on-dark); text-decoration: none; }
.site-footer a:hover { color: #fff; text-decoration: underline; }
.footer-links a { display: inline-flex; align-items: center; gap: .5rem; }
.footer-links a::before { content: "›"; color: var(--color-red-bright); font-weight: 700; }
.footer-areas a::before { content: "◉"; color: var(--color-red-bright); font-size: .7em; }
.footer-areas a { display: inline-flex; align-items: center; gap: .5rem; }
.footer-contact li { display: flex; align-items: flex-start; gap: .6rem; }
.footer-contact svg { flex: 0 0 auto; margin-top: .3rem; color: var(--color-red-bright); }

.site-social { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1.25rem; }
.site-social a {
	width: 38px; height: 38px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: rgba(255, 255, 255, .08);
	border: 1px solid rgba(255, 255, 255, .14);
	border-radius: var(--radius-pill);
	color: #fff;
	transition: background var(--transition), border-color var(--transition);
}
.site-social a:hover { background: var(--color-red); border-color: var(--color-red); }

.site-footer__bottom {
	max-width: var(--content-width);
	margin: clamp(2rem, 5vw, 3rem) auto 0;
	padding: 1.35rem var(--gutter);
	border-top: 1px solid rgba(255, 255, 255, .1);
	display: flex;
	flex-wrap: wrap;
	gap: .5rem 1.5rem;
	justify-content: space-between;
	font-size: .875rem;
}
.site-footer__bottom p { margin: 0; }

/* =========================================================================
   10. WORDPRESS BLOCK OVERRIDES
   ========================================================================= */
.wp-block-cover { position: relative; overflow: hidden; }
.wp-block-cover.alignfull { margin-block: 0; }
.wp-block-columns { gap: clamp(1.25rem, 3vw, 2.5rem); }
.wp-block-buttons { gap: .75rem; }
.wp-block-image.is-style-rounded img,
.is-style-rounded img { border-radius: var(--radius); }
.wp-block-separator { border: 0; border-top: 1px solid var(--color-border); }
.wp-block-group.has-background { padding: var(--section-pad) 0; }

/* =========================================================================
   11. PATTERNS & CUSTOM BLOCKS
   ========================================================================= */

/* ---------- Pattern: home-hero ---------- */
.home-hero { min-height: min(86vh, 820px); align-items: center; }
.home-hero::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
	background: linear-gradient(to right, rgba(10, 15, 30, .90) 0%, rgba(10, 15, 30, .72) 58%, rgba(10, 15, 30, .28) 100%);
	/* Measured against the real photo: the headline's right-hand letters land on
	   the gradient falloff. Contrast is bought with the lighter --color-red-bright
	   rather than a heavier scrim, so the photograph stays visible. */
	pointer-events: none;
}
.home-hero .wp-block-cover__inner-container { z-index: 2; padding-block: clamp(3rem, 8vw, 5.5rem); }
.home-hero__body { max-width: 640px; }
.home-hero h1 { color: #fff; margin-bottom: 1rem; }
.home-hero h1 .hl-red   { color: var(--color-red-bright); }
.home-hero h1 .hl-green { color: var(--color-green); }
.home-hero .eyebrow { color: #fff; letter-spacing: .22em; }
.home-hero .eyebrow::before { display: none; }
.home-hero__lead { color: #E5E7EB; max-width: 34rem; font-size: var(--fs-lead); }
.home-hero .wp-block-buttons { margin-top: 2rem; }
.home-hero .is-style-outline > .wp-block-button__link,
.page-hero .is-style-outline > .wp-block-button__link {
	background: transparent;
	border-color: #fff;
	color: #fff;
}
.home-hero .is-style-outline > .wp-block-button__link:hover,
.page-hero .is-style-outline > .wp-block-button__link:hover { background: #fff; color: var(--color-navy); }

/* ---------- Block: zaps/split-heading ---------- */
.zaps-split-heading { margin: 0 0 1rem; }
.zaps-split-heading .hl-red   { color: var(--color-red-bright); }
.zaps-split-heading .hl-green { color: var(--color-green); }
.zaps-split-heading .hl-white { color: #fff; }
.zaps-split-heading .hl-navy  { color: var(--color-navy); }
/* On light backgrounds the bright red would be too weak — use the base red. */
.band-white .zaps-split-heading .hl-red,
.band-alt .zaps-split-heading .hl-red { color: var(--color-red); }
.band-white .zaps-split-heading .hl-green,
.band-alt .zaps-split-heading .hl-green { color: var(--color-green-dark); }

/* Inline checklist (hero trust ticks) */
.zaps-checklist.zaps-checklist--inline {
	display: flex;
	flex-wrap: wrap;
	gap: .4rem 1.35rem;
	margin-top: 1.4rem;
	font-size: .9375rem;
	color: #fff;
}
.zaps-checklist.zaps-checklist--inline li { align-items: center; }
.zaps-checklist.zaps-checklist--inline svg { margin-top: 0; color: var(--color-green); }

/* ---------- Block: zaps/stat-band + zaps/stat ---------- */
.zaps-stat-band { background: var(--color-red); color: #fff; }
.zaps-stat-band__inner {
	max-width: var(--content-width);
	margin-inline: auto;
	padding: clamp(1.75rem, 4vw, 2.5rem) var(--gutter);
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 1.5rem 1rem;
	text-align: center;
}
.zaps-stat__value {
	font-family: var(--font-display);
	font-size: clamp(1.75rem, 4.4vw, 2.5rem);
	font-weight: 700;
	line-height: 1;
	color: #fff;
	margin: 0 0 .35rem;
}
.zaps-stat__label {
	font-family: var(--font-display);
	font-size: .75rem;
	font-weight: 600;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, .92);
	margin: 0;
}

/* ---------- Block: zaps/step-cards + zaps/step-card ---------- */
.zaps-step-cards {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: clamp(1.75rem, 4vw, 3rem);
	margin-top: clamp(2rem, 5vw, 3.25rem);
}
.zaps-step-card { position: relative; padding-top: 1.9rem; }
.zaps-step-card::before {
	content: "";
	position: absolute;
	top: 0; left: 0;
	width: 30px; height: 3px;
	background: var(--color-red);
}
.zaps-step-card__ghost {
	position: absolute;
	top: .35rem; right: 0;
	font-family: var(--font-display);
	font-size: 4.5rem;
	font-weight: 700;
	line-height: 1;
	color: var(--color-border);
	pointer-events: none;
	user-select: none;
}
.zaps-step-card__icon {
	width: 48px; height: 48px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: var(--color-red);
	color: #fff;
	border-radius: var(--radius-pill);
	margin-bottom: 1.1rem;
}
.zaps-step-card__step {
	font-family: var(--font-display);
	font-size: .75rem;
	font-weight: 600;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--color-red);
	margin: 0 0 .2rem;
}
.zaps-step-card__title { font-size: 1.5rem; margin: 0 0 .25rem; }
.zaps-step-card__kicker {
	font-family: var(--font-display);
	font-size: .75rem;
	font-weight: 600;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--color-text-soft);
	margin: 0 0 .8rem;
}
.zaps-step-card__body { color: var(--color-text-muted); font-size: .9375rem; margin: 0; }

/* ---------- Block: zaps/pest-grid + zaps/pest-card ---------- */
.zaps-pest-grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 1rem;
	margin-top: clamp(2rem, 5vw, 3rem);
}
.zaps-pest-grid--cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(1.25rem, 3vw, 1.75rem); }
.zaps-pest-grid--cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(1.25rem, 3vw, 1.75rem); }
.zaps-pest-card { position: relative; }
.zaps-pest-card__toggle {
	position: relative;
	display: block;
	width: 100%;
	min-height: 168px;
	padding: 1.25rem;
	text-align: left;
	background: var(--color-bg);
	border: 1px solid var(--color-border);
	border-radius: var(--radius);
	color: inherit;
	font: inherit;
	cursor: pointer;
	overflow: hidden;
	transition: box-shadow var(--transition), border-color var(--transition);
}
.zaps-pest-card__toggle:hover,
.zaps-pest-card__toggle:focus-visible {
	border-color: var(--color-green-mid);
	box-shadow: var(--shadow);
}
.zaps-pest-card__toggle:active { transform: none; }
.zaps-pest-card__face { display: block; transition: opacity var(--transition); }
.zaps-pest-card__emoji { display: block; font-size: 1.75rem; line-height: 1; margin-bottom: .7rem; }
.zaps-pest-card__name {
	display: block;
	font-family: var(--font-display);
	font-size: 1rem;
	font-weight: 700;
	color: var(--color-navy);
	margin: 0 0 .3rem;
}
.zaps-pest-card__teaser { display: block; font-size: var(--fs-body-sm); color: var(--color-text-muted); margin: 0; }
.zaps-pest-card__more {
	display: inline-block;
	margin-top: .6rem;
	font-size: var(--fs-body-sm);
	font-weight: 700;
	color: var(--color-red);
}
.zaps-pest-card__back {
	position: absolute;
	inset: 0;
	padding: 1.1rem;
	display: flex;
	flex-direction: column;
	justify-content: center;
	background: var(--color-navy);
	border-radius: calc(var(--radius) - 1px);
	opacity: 0;
	visibility: hidden;
	transition: opacity var(--transition), visibility var(--transition);
	overflow-y: auto;
}
.zaps-pest-card__back-name {
	display: block;
	font-family: var(--font-display);
	font-size: .9375rem;
	font-weight: 700;
	color: #fff;
	margin: 0 0 .45rem;
}
.zaps-pest-card__detail { display: block; font-size: var(--fs-body-sm); color: #D1D5DB; line-height: 1.55; margin: 0; }
/* Reveal on hover, on keyboard focus, and when toggled open */
.zaps-pest-card__toggle:hover .zaps-pest-card__back,
.zaps-pest-card__toggle:focus-visible .zaps-pest-card__back,
.zaps-pest-card__toggle[aria-expanded="true"] .zaps-pest-card__back {
	opacity: 1;
	visibility: visible;
}
.zaps-pest-card__toggle:hover .zaps-pest-card__face,
.zaps-pest-card__toggle:focus-visible .zaps-pest-card__face,
.zaps-pest-card__toggle[aria-expanded="true"] .zaps-pest-card__face { opacity: 0; }

.zaps-pest-grid__note {
	margin-top: clamp(1.75rem, 4vw, 2.5rem);
	text-align: center;
	color: var(--color-text-muted);
}

/* ---------- Centred button rows ---------- */
.wp-block-buttons.buttons-centered { justify-content: center; }

/* ---------- Pattern: about-split ---------- */
.about-split__cols { align-items: flex-start; }
.about-split__cols > .wp-block-column:first-child { flex-basis: 52%; }
.about-split__cols > .wp-block-column:last-child  { flex-basis: 48%; }
.about-split__panel {
	background: var(--color-bg);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-lg);
	padding: clamp(1.25rem, 3vw, 1.75rem);
	box-shadow: var(--shadow-sm);
}
.about-split__panel figure { margin: 0 0 1.35rem; }
.about-split__panel img { border-radius: var(--radius); }
.about-split h2 { margin-bottom: .35rem; }
.about-split__tagline {
	font-family: var(--font-display);
	font-size: 1.0625rem;
	font-weight: 600;
	color: var(--color-red);
	margin: 0 0 1.15rem;
}

/* ---------- Block: zaps/checklist ---------- */
.zaps-checklist { list-style: none; margin: 0; padding: 0; display: grid; gap: .55rem; }
.zaps-checklist li { display: flex; align-items: flex-start; gap: .6rem; font-size: .9375rem; }
.zaps-checklist svg { flex: 0 0 auto; margin-top: .3rem; color: var(--color-green-mid); }
.band-navy .zaps-checklist svg, .on-dark .zaps-checklist svg { color: var(--color-green); }
.zaps-checklist--2col { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .55rem 1.5rem; }

/* ---------- Block: zaps/guarantee-strip ---------- */
.zaps-guarantee {
	display: flex;
	align-items: center;
	gap: 1rem;
	margin-top: 1.5rem;
	padding-top: 1.35rem;
	border-top: 1px solid var(--color-border);
}
.zaps-guarantee__img { width: 58px; height: 58px; flex: 0 0 58px; object-fit: contain; border-radius: var(--radius-sm); }
.zaps-guarantee__meta {
	font-family: var(--font-display);
	font-size: .75rem;
	font-weight: 600;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--color-text-soft);
	margin: 0 0 .1rem;
}
.zaps-guarantee__title { font-family: var(--font-display); font-size: 1.125rem; font-weight: 700; color: var(--color-navy); margin: 0; }
.zaps-guarantee__body { font-size: var(--fs-body-sm); color: var(--color-text-muted); margin: .3rem 0 0; }

/* ---------- Pattern: pest-highlights (feature pest cards) ---------- */
.pest-highlight {
	background: var(--color-bg);
	border: 1px solid var(--color-border);
	border-radius: var(--radius);
	padding: clamp(1.25rem, 3vw, 1.75rem);
	box-shadow: var(--shadow-sm);
	transition: box-shadow var(--transition), transform var(--transition);
}
.pest-highlight:hover { box-shadow: var(--shadow); transform: translateY(-2px); }
.pest-highlight__emoji { font-size: 1.75rem; line-height: 1; margin-bottom: .9rem; }
.pest-highlight h3 { font-size: 1.375rem; margin-bottom: .5rem; }
.pest-highlight p { color: var(--color-text-muted); font-size: .9375rem; margin: 0; }

/* ---------- Pattern: cta-band ---------- */
.cta-band { border-radius: var(--radius-lg); text-align: center; }
.cta-band__inner { padding: clamp(1.75rem, 4.5vw, 2.75rem) clamp(1.25rem, 4vw, 2.5rem); }
.cta-band--navy { background: var(--color-navy); color: var(--color-text-on-dark); }
.cta-band--navy h2, .cta-band--navy h3 { color: #fff; }
.cta-band--red { background: var(--color-red); color: #fff; }
.cta-band--red h2, .cta-band--red h3 { color: #fff; }
.cta-band h3 { font-size: clamp(1.375rem, 3.4vw, 1.75rem); margin-bottom: .5rem; }
.cta-band p { max-width: 46rem; margin-inline: auto; }
.cta-band .wp-block-buttons { justify-content: center; margin-top: 1.5rem; }

/* ---------- Block: zaps/area-chips ---------- */
.zaps-area-chips {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: .6rem;
	list-style: none;
	margin: clamp(2rem, 5vw, 2.75rem) 0 0;
	padding: 0;
}
.zaps-area-chips li {
	display: inline-flex;
	align-items: center;
	gap: .4rem;
	padding: .55rem 1.1rem;
	background: var(--color-bg);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-pill);
	font-size: .9375rem;
	font-weight: 600;
	color: var(--color-navy);
	box-shadow: var(--shadow-sm);
}
.zaps-area-chips svg { flex: 0 0 auto; color: var(--color-red); }

/* ---------- Block: zaps/plan-cards + zaps/plan-card ---------- */
.zaps-plan-cards {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: clamp(1.5rem, 4vw, 2rem);
	max-width: var(--content-mid);
	margin: clamp(2.25rem, 5vw, 3.25rem) auto 0;
}
.zaps-plan-card {
	position: relative;
	display: flex;
	flex-direction: column;
	background: var(--color-bg);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-lg);
	padding: clamp(1.75rem, 4vw, 2.25rem) clamp(1.25rem, 3vw, 1.75rem) clamp(1.5rem, 3vw, 1.75rem);
	box-shadow: var(--shadow-sm);
	text-align: center;
}
.zaps-plan-card--featured {
	border: 2px solid var(--color-green-mid);
	box-shadow: var(--shadow);
}
.zaps-plan-card__badge {
	position: absolute;
	top: 0; left: 50%;
	transform: translate(-50%, -50%);
	padding: .35rem 1.1rem;
	background: var(--color-green-dark);
	color: #fff;
	border-radius: var(--radius-pill);
	font-family: var(--font-display);
	font-size: .6875rem;
	font-weight: 600;
	letter-spacing: .12em;
	text-transform: uppercase;
	white-space: nowrap;
}
.zaps-plan-card__name { font-size: 1.625rem; margin: 0 0 .2rem; }
.zaps-plan-card__kicker {
	font-family: var(--font-display);
	font-size: .75rem;
	font-weight: 600;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--color-text-soft);
	margin: 0 0 1.1rem;
}
.zaps-plan-card__price {
	display: flex;
	align-items: baseline;
	justify-content: center;
	gap: .25rem;
	margin-bottom: .3rem;
	font-family: var(--font-display);
	color: var(--color-navy);
}
.zaps-plan-card__currency { font-size: 1.25rem; font-weight: 600; }
.zaps-plan-card__amount { font-size: clamp(2.5rem, 6vw, 3.25rem); font-weight: 700; line-height: 1; }
.zaps-plan-card__period { font-family: var(--font-body); font-size: .9375rem; font-weight: 400; color: var(--color-text-muted); }
.zaps-plan-card__billing { font-size: var(--fs-body-sm); color: var(--color-text-soft); margin: 0 0 1.35rem; }
.zaps-plan-card .zaps-checklist { text-align: left; margin-bottom: 1.6rem; }
.zaps-plan-card__cta { margin-top: auto; }
.zaps-plan-cards__note { text-align: center; font-size: var(--fs-body-sm); color: var(--color-text-soft); margin: 1.35rem 0 0; }

/* ---------- Block: zaps/rating-summary + zaps/reviews ---------- */
.zaps-rating-summary {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: .6rem;
	margin: .75rem 0 0;
	font-weight: 600;
	color: var(--color-navy);
}
.zaps-stars { display: inline-flex; gap: .1rem; color: var(--color-gold); }
.zaps-stars svg { width: 18px; height: 18px; }
.zaps-reviews {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: clamp(1.25rem, 3vw, 1.75rem);
	margin-top: clamp(2rem, 5vw, 3rem);
}
.zaps-review-card {
	background: var(--color-bg);
	border: 1px solid var(--color-border);
	border-radius: var(--radius);
	padding: clamp(1.25rem, 3vw, 1.6rem);
	box-shadow: var(--shadow-sm);
}
.zaps-review-card__head { display: flex; align-items: center; gap: .75rem; margin-bottom: .9rem; }
.zaps-review-card__initials {
	width: 40px; height: 40px; flex: 0 0 40px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: var(--color-red);
	color: #fff;
	border-radius: var(--radius-pill);
	font-family: var(--font-display);
	font-size: .8125rem;
	font-weight: 700;
	letter-spacing: .04em;
}
.zaps-review-card__name { display: block; font-weight: 700; font-size: .9375rem; margin: 0; color: var(--color-navy); }
.zaps-review-card__meta { display: block; font-size: var(--fs-body-sm); color: var(--color-text-soft); margin: 0; }
.zaps-review-card blockquote { margin: .75rem 0 0; font-style: italic; color: var(--color-text-muted); font-size: .9375rem; line-height: 1.65; }
.zaps-review-card blockquote p { margin: 0; }

/* ---------- Block: zaps/faq ---------- */
.zaps-faq { max-width: var(--content-mid); margin-inline: auto; display: grid; gap: .75rem; margin-top: clamp(2rem, 5vw, 3rem); }
.zaps-faq-item {
	background: var(--color-bg);
	border: 1px solid var(--color-border);
	border-radius: var(--radius);
	box-shadow: var(--shadow-sm);
	overflow: hidden;
}
.zaps-faq-item__heading { margin: 0; font: inherit; color: inherit; }
.zaps-faq-item__trigger {
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	padding: 1.15rem clamp(1rem, 3vw, 1.5rem);
	background: transparent;
	border: 0;
	text-align: left;
	cursor: pointer;
	font-family: var(--font-display);
	font-size: 1.0625rem;
	font-weight: 600;
	color: var(--color-navy);
}
.zaps-faq-item__trigger:hover { color: var(--color-red); }
.zaps-faq-item__trigger:active { transform: none; }
.zaps-faq-item__icon {
	position: relative;
	flex: 0 0 24px;
	width: 24px; height: 24px;
	border-radius: var(--radius-pill);
	background: var(--color-border-soft);
}
.zaps-faq-item__icon::before,
.zaps-faq-item__icon::after {
	content: "";
	position: absolute;
	top: 50%; left: 50%;
	background: var(--color-navy);
	transition: transform var(--transition), opacity var(--transition);
}
.zaps-faq-item__icon::before { width: 10px; height: 2px; margin: -1px 0 0 -5px; }
.zaps-faq-item__icon::after  { width: 2px; height: 10px; margin: -5px 0 0 -1px; }
.zaps-faq-item__trigger[aria-expanded="true"] .zaps-faq-item__icon::after { transform: rotate(90deg); opacity: 0; }
.zaps-faq-item__panel { display: none; padding: 0 clamp(1rem, 3vw, 1.5rem) 1.3rem; }
.zaps-faq-item__panel.is-open { display: block; }
.zaps-faq-item__panel p { color: var(--color-text-muted); font-size: .9375rem; margin: 0; }

/* ---------- Block: zaps/contact-methods ---------- */
.zaps-contact-methods { list-style: none; margin: 2rem 0 0; padding: 0; display: grid; gap: 1.2rem; }
.zaps-contact-methods li { display: flex; align-items: center; gap: .9rem; }
.zaps-contact-methods__icon {
	width: 44px; height: 44px; flex: 0 0 44px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: var(--color-red);
	color: #fff;
	border-radius: var(--radius-pill);
}
.zaps-contact-methods__label {
	display: block;
	font-family: var(--font-display);
	font-size: .6875rem;
	font-weight: 600;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--color-text-soft);
}
.zaps-contact-methods__value { font-weight: 700; color: var(--color-navy); text-decoration: none; }
.zaps-contact-methods a.zaps-contact-methods__value:hover { color: var(--color-red); text-decoration: underline; }

/* ---------- Block: zaps/quote-form ---------- */
.zaps-quote-form {
	background: var(--color-bg);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-lg);
	padding: clamp(1.25rem, 3.5vw, 2rem);
	box-shadow: var(--shadow);
}
.zaps-quote-form__title { font-size: 1.375rem; margin-bottom: 1.35rem; }
.zaps-quote-form__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.zaps-quote-form__field { display: flex; flex-direction: column; gap: .35rem; }
.zaps-quote-form__field--full { grid-column: 1 / -1; }
.zaps-quote-form label {
	font-family: var(--font-display);
	font-size: .75rem;
	font-weight: 600;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--color-navy);
}
.zaps-quote-form .req { color: var(--color-red); }
.zaps-quote-form input,
.zaps-quote-form select,
.zaps-quote-form textarea {
	width: 100%;
	padding: .7rem .85rem;
	font-family: var(--font-body);
	font-size: .9375rem;
	color: var(--color-text);
	background: var(--color-bg);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-sm);
}
.zaps-quote-form input::placeholder,
.zaps-quote-form textarea::placeholder { color: #9CA3AF; }
.zaps-quote-form textarea { min-height: 118px; resize: vertical; }
.zaps-quote-form input:focus-visible,
.zaps-quote-form select:focus-visible,
.zaps-quote-form textarea:focus-visible { border-color: var(--color-green-mid); }
.zaps-quote-form__submit { margin-top: 1.35rem; }
.zaps-quote-form__note { text-align: center; font-size: var(--fs-body-sm); color: var(--color-text-soft); margin: .85rem 0 0; }
.zaps-quote-form__status { margin: 0 0 1rem; padding: .8rem 1rem; border-radius: var(--radius-sm); font-size: .9375rem; }
.zaps-quote-form__status--ok  { background: #ECFDF5; border: 1px solid var(--color-green-mid); color: #065F46; }
.zaps-quote-form__status--err { background: #FEF2F2; border: 1px solid var(--color-red); color: #7F1D1D; }

/* ---------- Pattern: contact-split ---------- */
.contact-split__cols { align-items: flex-start; }
.contact-split__cols > .wp-block-column:first-child { flex-basis: 46%; }
.contact-split__cols > .wp-block-column:last-child  { flex-basis: 54%; }
.contact-split__assurance {
	background: var(--color-navy);
	color: var(--color-text-on-dark);
	border-radius: var(--radius);
	padding: clamp(1.1rem, 3vw, 1.5rem);
	margin-top: 2rem;
}
.contact-split__assurance-head { display: flex; align-items: center; gap: .8rem; margin-bottom: .8rem; }
.contact-split__assurance-head img { width: 48px; height: 48px; flex: 0 0 48px; object-fit: contain; border-radius: var(--radius-sm); }
.contact-split__assurance-title { font-family: var(--font-display); font-weight: 700; color: #fff; margin: 0; }
.contact-split__assurance-meta { font-size: var(--fs-body-sm); color: #9CA3AF; margin: 0 0 .8rem; }
.contact-split__assurance p { font-size: .9375rem; margin: 0; }

/* ---------- Block: zaps/location-grid + zaps/location-card ---------- */
.zaps-location-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: clamp(1.25rem, 3vw, 2rem);
	list-style: none;
	margin: clamp(2rem, 5vw, 3rem) 0 0;
	padding: 0;
}
.zaps-location-grid--cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.zaps-location-grid--cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }

.zaps-location-card {
	position: relative;              /* anchor for the stretched link */
	display: flex;
	flex-direction: column;
	background: var(--color-bg);
	border: 1px solid var(--color-border);
	border-radius: var(--radius);
	overflow: hidden;
	box-shadow: var(--shadow-sm);
	transition: box-shadow var(--transition), transform var(--transition), border-color var(--transition);
}
.zaps-location-card:hover {
	border-color: var(--color-green-mid);
	box-shadow: var(--shadow);
	transform: translateY(-2px);
}
/* Keyboard parity: the card lifts when its link is focused, too. */
.zaps-location-card:focus-within {
	border-color: var(--color-green-mid);
	box-shadow: var(--shadow);
}

.zaps-location-card__media {
	position: relative;
	aspect-ratio: 16 / 10;
	background: var(--color-bg-alt);
	overflow: hidden;
}
.zaps-location-card__img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 320ms ease;
}
.zaps-location-card:hover .zaps-location-card__img { transform: scale(1.04); }
.zaps-location-card__placeholder {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--color-navy);
	color: var(--color-red-bright);
}

.zaps-location-card__body {
	display: flex;
	flex-direction: column;
	gap: .5rem;
	padding: clamp(1.1rem, 3vw, 1.5rem);
}
.zaps-location-card__title { font-size: 1.375rem; margin: 0; }
.zaps-location-card__link {
	color: var(--color-navy);
	text-decoration: none;
}
.zaps-location-card__link:hover { color: var(--color-red); }
/* Stretched link: the whole card is clickable, but there is still only ONE
   link in the accessibility tree, named by the heading. */
.zaps-location-card__link::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
}
.zaps-location-card__link:focus-visible { outline: none; }
.zaps-location-card:focus-within { outline: 3px solid var(--color-focus); outline-offset: 2px; }

.zaps-location-card__excerpt {
	font-size: .9375rem;
	color: var(--color-text-muted);
	margin: 0;
}
.zaps-location-card__cta {
	display: inline-flex;
	align-items: center;
	gap: .4rem;
	margin-top: auto;
	padding-top: .35rem;
	font-family: var(--font-display);
	font-size: .8125rem;
	font-weight: 600;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--color-red);
}
.zaps-location-card:hover .zaps-location-card__cta { color: var(--color-red-dark); }

.zaps-location-grid__empty {
	margin: clamp(2rem, 5vw, 3rem) 0 0;
	padding: 1.25rem;
	text-align: center;
	color: var(--color-text-muted);
	background: var(--color-bg-alt);
	border: 1px dashed var(--color-border);
	border-radius: var(--radius);
}

/* ---------- Pattern: page-hero ---------- */
.page-hero { min-height: min(46vh, 420px); }
.page-hero .wp-block-cover__inner-container { padding-block: clamp(2.75rem, 7vw, 4.5rem); text-align: center; }
.page-hero h1 { color: #fff; }
.page-hero .eyebrow { color: #fff; justify-content: center; }
.page-hero .wp-block-breadcrumbs { font-size: .875rem; }
.page-hero .wp-block-breadcrumbs a { color: #fff; text-decoration: underline; }
.page-hero .wp-block-breadcrumbs a:hover { color: var(--color-green); }

/* =========================================================================
   12. RESPONSIVE
   ========================================================================= */
@media (max-width: 1024px) {
	.zaps-pest-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.zaps-pest-grid--cols-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.zaps-location-grid,
	.zaps-location-grid--cols-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.zaps-reviews { grid-template-columns: 1fr; }
	.site-footer__inner { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 900px) {
	.site-header__nav { margin-left: 0; }
	.nav-toggle { display: inline-flex; align-items: center; justify-content: center; }

	.site-nav {
		position: absolute;
		top: 100%;
		left: 0; right: 0;
		height: calc(100vh - var(--header-bottom));
		height: calc(100dvh - var(--header-bottom));
		overflow-y: auto;
		-webkit-overflow-scrolling: touch;
		background: var(--color-navy);
		border-top: 1px solid rgba(255, 255, 255, .1);
		padding: 1.25rem var(--gutter) 3rem;
		transform: translateX(100%);
		transition: transform 240ms ease;
		z-index: 190;
	}
	.site-nav.is-open { transform: translateX(0); }
	.site-nav > ul { flex-direction: column; align-items: stretch; gap: 0; }
	.site-nav a { padding: .85rem 0; font-size: 1rem; border-bottom: 1px solid rgba(255, 255, 255, .08); }
	.site-nav > ul > li > a::after { display: none; }
	.site-nav .menu-item-has-children > a::before { display: none; }
	.site-nav .sub-menu,
	.site-nav .sub-menu .sub-menu {
		position: static;
		opacity: 1;
		visibility: visible;
		transform: none;
		min-width: 0;
		background: transparent;
		border: 0;
		border-left: 2px solid var(--color-red);
		border-radius: 0;
		box-shadow: none;
		margin-left: 1rem;
		padding: 0;
	}
	.site-nav .sub-menu a { padding-left: .9rem; font-size: .9375rem; }
	.site-header__cta { display: none; }

	.zaps-step-cards { grid-template-columns: 1fr; }
	.zaps-pest-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.zaps-pest-grid--cols-3 { grid-template-columns: 1fr; }
	.zaps-location-grid,
	.zaps-location-grid--cols-2,
	.zaps-location-grid--cols-4 { grid-template-columns: 1fr; }
	.zaps-plan-cards { grid-template-columns: 1fr; }
	.zaps-quote-form__grid { grid-template-columns: 1fr; }
	.zaps-checklist--2col { grid-template-columns: 1fr; }
	.about-split__cols,
	.contact-split__cols { flex-wrap: wrap; }
	.about-split__cols > .wp-block-column,
	.contact-split__cols > .wp-block-column { flex-basis: 100% !important; }
	.home-hero::after {
		background: linear-gradient(to bottom, rgba(10, 15, 30, .84) 0%, rgba(10, 15, 30, .8) 60%, rgba(10, 15, 30, .74) 100%);
	}
}

@media (max-width: 720px) {
	.zaps-stat-band__inner { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.site-footer__inner { grid-template-columns: 1fr; }
	.site-utilitybar__inner { flex-direction: column; align-items: flex-start; gap: .25rem; text-align: left; }
	.site-utilitybar__tagline { font-size: .75rem; }
	.zaps-step-card__ghost { font-size: 3.5rem; }
	.wp-block-columns { flex-wrap: wrap !important; }
	.about-split__cols > .wp-block-column,
	.contact-split__cols > .wp-block-column { flex-basis: 100% !important; }
}

@media (max-width: 420px) {
	.zaps-pest-grid { grid-template-columns: 1fr; }
	.zaps-area-chips { justify-content: flex-start; }
}

/* Hover-reveal is unreliable on touch — always keep the toggle affordance clear */
@media (hover: none) {
	.zaps-pest-card__toggle:hover .zaps-pest-card__back { opacity: 0; visibility: hidden; }
	.zaps-pest-card__toggle:hover .zaps-pest-card__face { opacity: 1; }
	.zaps-pest-card__toggle[aria-expanded="true"] .zaps-pest-card__back { opacity: 1; visibility: visible; }
	.zaps-pest-card__toggle[aria-expanded="true"] .zaps-pest-card__face { opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after {
		animation-duration: .001ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .001ms !important;
	}
	a:active, button:active { transform: none; }
	.pest-highlight:hover { transform: none; }
	.zaps-location-card:hover { transform: none; }
	.zaps-location-card:hover .zaps-location-card__img { transform: none; }
}

@media (forced-colors: active) {
	.zaps-pest-card__back { border: 1px solid CanvasText; }
	.zaps-btn, .wp-block-button__link { border: 2px solid ButtonText; }
}

/* ---------- Structural hooks (targets for JS / nesting, minimal styling) ---------- */
.site-utilitybar__nav { display: flex; align-items: center; }
.nav-toggle__label { /* label text swapped by theme.js; .screen-reader-text hides it */ }
.contact-split { /* section hook for the contact column ratios above */ }
.zaps-plan-cards-wrap { display: block; }
.zaps-stat { min-width: 0; }

/* =========================================================================
   13. UTILITY CLASSES
   ========================================================================= */
.mt-0 { margin-top: 0 !important; }
.mt-1 { margin-top: .5rem !important; }
.mt-2 { margin-top: 1rem !important; }
.mt-3 { margin-top: 1.75rem !important; }
.mt-4 { margin-top: 2.5rem !important; }
.mb-0 { margin-bottom: 0 !important; }
.mb-2 { margin-bottom: 1rem !important; }
.mb-3 { margin-bottom: 1.75rem !important; }
.no-bullets { list-style: none; margin: 0; padding: 0; }
.text-muted { color: var(--color-text-muted); }
.text-soft  { color: var(--color-text-soft); }
.text-red   { color: var(--color-red); }
.text-green { color: var(--color-green-dark); }
.on-dark, .on-dark p { color: var(--color-text-on-dark); }
.on-dark h1, .on-dark h2, .on-dark h3, .on-dark h4 { color: #fff; }
.on-dark a { color: #fff; }

/* Core alignment parity (core block styles normally supply these) */
.has-text-align-center { text-align: center; }
.has-text-align-left   { text-align: left; }
.has-text-align-right  { text-align: right; }

/* Editor canvas parity */
.editor-styles-wrapper .entry-content > * { padding-left: 0; padding-right: 0; }