/* iFixBasements — front-end styles layered on top of theme.json tokens. */

/* ---- Sticky header ---- */
.site-header{
	position:fixed;top:0;left:0;right:0;z-index:50;
	background:transparent;border-bottom:2px solid transparent;
	transition:background .25s ease,box-shadow .25s ease,border-color .25s ease,padding .25s ease;
	padding-block:18px;
}
/* Offset the fixed header below the WP admin bar for logged-in users */
@media screen and (min-width:783px){ body.admin-bar .site-header{top:32px;} }
@media screen and (max-width:782px){ body.admin-bar .site-header{top:46px;} }
.site-header.is-scrolled,
.site-header.no-hero{
	background:var(--wp--preset--color--black);
	border-bottom-color:var(--wp--preset--color--red);
	box-shadow:0 6px 24px rgba(0,0,0,.25);
	padding-block:10px;
}
.site-header .wp-block-site-logo img,
.site-header .custom-logo,
.site-header .site-logo-img{
	height:46px;width:auto;
	filter:drop-shadow(0 1px 3px rgba(0,0,0,.4));
	transition:height .25s ease;
}
.site-header .site-logo-link{display:inline-flex;align-items:center;line-height:0;}
.site-header.is-scrolled .wp-block-site-logo img,
.site-header.no-hero .wp-block-site-logo img,
.site-header.is-scrolled .site-logo-img,
.site-header.no-hero .site-logo-img{height:38px;}
/* Footer logo (on black) */
.footer-logo{display:inline-flex;line-height:0;margin-bottom:14px;}
.footer-logo .site-logo-img{height:auto;width:200px;}

.site-header .wp-block-navigation{
	font-family:var(--wp--preset--font-family--display);
	font-weight:600;text-transform:uppercase;letter-spacing:.05em;font-size:1.1rem;
}
.site-header .wp-block-navigation a,
.site-header .wp-block-navigation .wp-block-navigation-item__content,
.site-header .wp-block-navigation .wp-block-navigation-item__content:link,
.site-header .wp-block-navigation .wp-block-navigation-item__content:visited{
	color:#fff !important;text-shadow:0 1px 3px rgba(0,0,0,.5);
}
.site-header .wp-block-navigation a:hover,
.site-header .wp-block-navigation .wp-block-navigation-item__content:hover{color:#ffb3b6 !important;}
/* Keep nav links dark inside the mobile overlay (light background) */
.site-header .wp-block-navigation__responsive-container.is-menu-open a,
.site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content{
	color:var(--wp--preset--color--black) !important;text-shadow:none;
}

/* ---- Hero ---- */
.has-hero{
	position:relative;min-height:88vh;display:flex;align-items:center;
	background-image:url(../images/Stone_Lawrence-hero-desktop.webp);
	background-size:cover;background-position:center;
	border-bottom:6px solid var(--wp--preset--color--red);
}
.has-hero::after{
	content:"";position:absolute;inset:0;z-index:1;
	background:linear-gradient(90deg,rgba(17,20,24,0) 36%,rgba(17,20,24,.55) 60%,rgba(17,20,24,.74) 100%);
}
.has-hero > .wp-block-group{position:relative;z-index:2;}
.hero-content{color:#fff;margin-left:auto;width:55%;}
.hero-content :is(h1,h2,p){color:#fff;}
.hero-kicker{
	font-family:var(--wp--preset--font-family--display);font-weight:600;
	letter-spacing:.2em;text-transform:uppercase;font-size:.95rem;color:#ffb3b6;
}
/* v0.7.9: kicker moved BELOW the h1 (owner decision 2026-08-03). It used to
   sit above the headline where the h1's own top margin spaced it; underneath
   it needs its own breathing room, and it must not inherit the body-copy
   margin that the intro paragraph carries. Mobile is untouched — the
   max-width:600px block orders the hero explicitly (kicker order:2), so DOM
   order has no effect there and the above-the-fold CTA is unaffected. */
.hero-inner .hero-kicker{margin-top:.85rem;margin-bottom:0;}

/* ---- Section helpers ---- */
.section-pad{padding-block:var(--wp--preset--spacing--70);}
.bg-concrete{background:var(--wp--preset--color--concrete);}
.bg-black{background:var(--wp--preset--color--black);color:#fff;}
.bg-black :is(h1,h2,h3,h4,p){color:#fff;}
.eyebrow{
	font-family:var(--wp--preset--font-family--display);font-weight:700;
	letter-spacing:.16em;text-transform:uppercase;font-size:.85rem;color:var(--wp--preset--color--red);
}
/* Dark sections: the .bg-black p rule above was whiting out the eyebrow —
   near-invisible (Stone, 2026-07-13). Soft red pops on black. */
.bg-black p.eyebrow{color:#ff9ca0;}
/* Section headline must DOMINATE its card sub-heads (Stone): big display H2
   on dark sections, matching the process panel's scale. */
.bg-black h2.wp-block-heading{
	font-size:clamp(2rem,3.8vw,2.8rem);line-height:1.08;
	font-family:var(--wp--preset--font-family--display);font-weight:800;
	text-transform:uppercase;letter-spacing:.01em;margin-top:.2rem;
}

/* ---- Service cards ---- */
.service-card{
	background:#fff;border-top:4px solid var(--wp--preset--color--red);
	border-radius:10px;padding:1.6rem;box-shadow:0 2px 12px rgba(0,0,0,.06);height:100%;
}
.service-card.is-dark{background:var(--wp--preset--color--black);}
.service-card.is-dark :is(h3,h4,p){color:#fff;}

/* ---- Conditions ticker (Concept A — "market ticker") ---- */
/* Directly under the hero. Near-black tape, red top/bottom
   borders, red ▲ (call-now) / gold ● (address-soon) severity markers.
   Animates for everyone by owner decision (marquee is the feature);
   pause on hover/focus retained. */
.cond-tape{
	position:relative;overflow:hidden;
	background:#0b0d10;
	border-top:3px solid var(--wp--preset--color--red);
	border-bottom:3px solid var(--wp--preset--color--red);
	/* Sit flush under the hero's red bottom border — kill WP's default block gap. */
	margin-top:0 !important;
}
.cond-track{
	display:inline-flex;white-space:nowrap;
	animation:cond-roll 46s linear infinite;
	padding:.8rem 0;
}
@keyframes cond-roll{to{transform:translateX(-50%)}}
.cond-tape:hover .cond-track,
.cond-tape:focus-within .cond-track{animation-play-state:paused;}
.cond-it{
	display:inline-flex;align-items:center;gap:.5rem;
	color:#e8eaed;text-decoration:none;
	font-family:var(--wp--preset--font-family--display);font-weight:600;
	text-transform:uppercase;letter-spacing:.05em;font-size:1.02rem;
	padding:0 1.4rem;border-right:1px solid rgba(255,255,255,.14);
}
.cond-it:hover{color:#fff;background:rgba(215,40,47,.18);}
.cond-it .up{color:var(--wp--preset--color--red);font-weight:800;}
.cond-it .mid{color:#fbbc04;font-weight:800;}
@media (max-width:600px){
	.cond-it{font-size:.85rem;padding:0 .95rem;}
	.cond-track{animation-duration:34s;}
}

/* ---- Floating Save Contact button (vCard) ---- */
.save-contact-fab{
	position:fixed;right:20px;bottom:20px;z-index:60;
	display:inline-flex;align-items:center;gap:.55em;
	background:var(--wp--preset--color--red);color:#fff;
	font-family:var(--wp--preset--font-family--display);font-weight:700;
	text-transform:uppercase;letter-spacing:.04em;font-size:1.05rem;
	padding:.75em 1.25em;border-radius:50px;text-decoration:none;
	box-shadow:0 8px 24px rgba(17,20,24,.28), 0 0 0 0 rgba(215,40,47,.55);
	transition:transform .15s ease,background .2s ease,box-shadow .2s ease,padding .2s ease;
	animation:fab-glow 2.4s ease-in-out infinite;
}
/* Collapse to icon-only circle once the visitor scrolls past the hero
   (header.js toggles this class at scrollY > 300); expands back at top. */
.save-contact-fab.fab-mini{padding:.85em;}
.save-contact-fab.fab-mini .fab-label{display:none;}
/* Pulsing glow halo to draw the eye (HiHello-style). */
@keyframes fab-glow{
	0%{box-shadow:0 8px 24px rgba(17,20,24,.28), 0 0 0 0 rgba(215,40,47,.55), 0 0 14px 2px rgba(215,40,47,.45);}
	50%{box-shadow:0 8px 24px rgba(17,20,24,.28), 0 0 0 12px rgba(215,40,47,0), 0 0 26px 8px rgba(215,40,47,.75);}
	100%{box-shadow:0 8px 24px rgba(17,20,24,.28), 0 0 0 0 rgba(215,40,47,0), 0 0 14px 2px rgba(215,40,47,.45);}
}
.save-contact-fab:hover{background:var(--wp--preset--color--red-dark);transform:translateY(-2px);color:#fff;animation-play-state:paused;box-shadow:0 10px 28px rgba(17,20,24,.34), 0 0 30px 10px rgba(215,40,47,.85);}
.save-contact-fab svg{width:1.15em;height:1.15em;flex:0 0 auto;}
@media (prefers-reduced-motion:reduce){
	.save-contact-fab{animation:none;box-shadow:0 8px 24px rgba(17,20,24,.28), 0 0 18px 4px rgba(215,40,47,.55);}
}
@media (max-width:600px){
	.save-contact-fab{left:16px;right:16px;bottom:16px;justify-content:center;font-size:1.1rem;}
}

/* ---- Hero inner (content pushed right, matches approved preview) ---- */
.hero-inner{position:relative;z-index:2;margin-left:auto !important;margin-right:0 !important;width:55%;max-width:620px;padding-right:6%;color:#fff;}
.hero-inner :is(h1,h2,p){color:#fff;}
.hero-kicker{display:block;}

/* ---- "Talk to Stone" rollover: reveals the phone number on hover ---- */
/* Temporary: dials Stone's cell (914-355-6362) until a tracking/rollover line exists. */
.tts-rollover .tts-number{display:none;}
.tts-rollover:hover .tts-label,
.tts-rollover:focus .tts-label{display:none;}
.tts-rollover:hover .tts-number,
.tts-rollover:focus .tts-number{display:inline;}
/* On hover/focus the button fills black — the click-to-call state. */
.tts-rollover:hover,
.tts-rollover:focus{
	background:var(--wp--preset--color--black) !important;
	border-color:var(--wp--preset--color--black) !important;
	color:#fff !important;
}

/* ---- Instagram: hero follow pill (highlighted) + reviews highlight card ---- */
.ig-follow{
	display:inline-flex;align-items:center;gap:12px;margin-top:1.4rem;
	padding:9px 9px 9px 15px;border-radius:50px;text-decoration:none;color:#fff;
	background:linear-gradient(95deg,#515BD4 0%,#8134AF 30%,#DD2A7B 62%,#F58529 100%);
	box-shadow:0 6px 22px rgba(221,42,123,.5);
	transition:transform .15s ease,box-shadow .2s ease;
}
.ig-follow:hover{transform:translateY(-2px);box-shadow:0 10px 30px rgba(221,42,123,.7);color:#fff;}
.ig-follow-glyph svg{width:26px;height:26px;display:block;}
.ig-follow-meta{font-size:.98rem;line-height:1.15;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.25);}
.ig-follow-meta .ig-count{font-family:var(--wp--preset--font-family--display);font-weight:800;font-size:1.2rem;margin-right:.3em;}
.ig-follow-cta{
	background:#fff;color:#C32AA3;font-family:var(--wp--preset--font-family--display);
	font-weight:700;text-transform:uppercase;letter-spacing:.04em;font-size:.82rem;
	padding:7px 15px;border-radius:50px;white-space:nowrap;
}
.ig-reviews-card{
	display:flex;align-items:center;gap:16px;max-width:520px;margin:2rem auto 0;
	padding:14px 18px;border-radius:12px;text-decoration:none;
	background:var(--wp--preset--color--black);color:#fff;box-shadow:0 4px 18px rgba(17,20,24,.18);
	transition:transform .15s ease,box-shadow .2s ease;
}
.ig-reviews-card:hover{transform:translateY(-2px);box-shadow:0 8px 26px rgba(17,20,24,.3);color:#fff;}
.ig-reviews-play{flex:0 0 auto;width:46px;height:46px;border-radius:50%;background:var(--wp--preset--color--red);display:flex;align-items:center;justify-content:center;}
.ig-reviews-play svg{width:20px;height:20px;color:#fff;margin-left:2px;}
.ig-reviews-copy{display:flex;flex-direction:column;line-height:1.3;flex:1;text-align:left;}
.ig-reviews-copy strong{font-family:var(--wp--preset--font-family--display);font-weight:700;font-size:1.1rem;color:#fff;}
.ig-reviews-copy span{font-size:.85rem;color:#b9bdc2;}
.ig-reviews-glyph svg{width:26px;height:26px;color:#fff;opacity:.85;flex:0 0 auto;}

/* ---- "Book An Estimate" popup modal ---- */
body.estimate-open{overflow:hidden;}
.estimate-modal{position:fixed;inset:0;z-index:9000;display:flex;align-items:center;justify-content:center;padding:20px;}
.estimate-modal[hidden]{display:none;}
.estimate-modal-overlay{position:absolute;inset:0;background:rgba(17,20,24,.66);}
.estimate-modal-card{position:relative;z-index:1;width:100%;max-width:440px;background:var(--wp--preset--color--black);
	border:2px solid var(--wp--preset--color--red);border-radius:14px;
	box-shadow:0 24px 60px rgba(0,0,0,.5);padding:2rem 1.8rem 1.9rem;max-height:90vh;overflow:auto;}
.estimate-modal-x{position:absolute;top:8px;right:12px;border:0;background:none;font-size:1.9rem;line-height:1;
	color:#9aa0a6;cursor:pointer;padding:4px 8px;}
.estimate-modal-x:hover{color:#fff;}
.estimate-eyebrow{font-family:var(--wp--preset--font-family--display);font-weight:700;text-transform:uppercase;
	letter-spacing:.08em;font-size:.78rem;color:var(--wp--preset--color--red);margin:0 0 .25rem;}
.estimate-modal-card h3{margin:0 0 .35rem;font-size:1.7rem;color:var(--wp--preset--color--black);}
.estimate-desc{color:var(--wp--preset--color--steel);font-size:.95rem;margin:0 0 1.2rem;}
.estimate-form{display:grid;gap:.75rem;}
.estimate-form[hidden]{display:none;} /* display:grid otherwise beats the hidden attribute */
.estimate-form label{display:block;font-size:.8rem;font-weight:600;color:var(--wp--preset--color--slate);}
.estimate-form input[type=text],.estimate-form input[type=email],.estimate-form input[type=tel]{
	box-sizing:border-box !important;display:block;width:100%;margin-top:.25rem;padding:.7rem .8rem;
	border:1.5px solid #d4d4cf !important;border-radius:8px;font-size:1rem;
	font-family:var(--wp--preset--font-family--body);background:#fff !important;color:var(--wp--preset--color--black) !important;transition:border-color .15s,box-shadow .15s;}
.estimate-form input:focus{outline:none;border-color:var(--wp--preset--color--red) !important;box-shadow:0 0 0 3px rgba(215,40,47,.15);}
.estimate-form .hp-field{position:absolute !important;left:-9999px;width:1px;height:1px;overflow:hidden;}
/* ---- Step 2: "Tell us about the project" ---- */
.estimate-form select,.estimate-form textarea{
	box-sizing:border-box !important;display:block;width:100%;margin-top:.25rem;padding:.7rem .8rem;
	border:1.5px solid #d4d4cf !important;border-radius:8px;font-size:1rem;
	font-family:var(--wp--preset--font-family--body);background:#fff !important;color:var(--wp--preset--color--black) !important;transition:border-color .15s,box-shadow .15s;}
.estimate-form select{appearance:none;-webkit-appearance:none;cursor:pointer;
	background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' fill='none'%3E%3Cpath d='M1 1l6 6 6-6' stroke='%23111418' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
	background-repeat:no-repeat !important;background-position:right .85rem center !important;padding-right:2.4rem;}
.estimate-form textarea{resize:vertical;min-height:96px;line-height:1.45;}
.estimate-form select:focus,.estimate-form textarea:focus{outline:none;border-color:var(--wp--preset--color--red) !important;box-shadow:0 0 0 3px rgba(215,40,47,.15);}
.estimate-step-ind{font-family:var(--wp--preset--font-family--display);font-weight:700;text-transform:uppercase;
	letter-spacing:.09em;font-size:.72rem;margin:0;}
.estimate-step2-title{font-family:var(--wp--preset--font-family--display);font-weight:700;font-size:1.35rem;margin:0 0 .35rem;}
.estimate-optional{font-weight:400;text-transform:none;opacity:.65;}
.estimate-modal-card .estimate-step-ind{color:#ff9ca0;}
.estimate-modal-card .estimate-step2-title{color:#fff;}
/* !important overrides WordPress 6.9 core button styles (which otherwise
   render this bare <button> with a transparent background). */
.estimate-submit{margin-top:.35rem;cursor:pointer;border:0 !important;border-radius:8px;background:var(--wp--preset--color--red) !important;
	color:#fff !important;font-family:var(--wp--preset--font-family--display);font-weight:700;text-transform:uppercase;
	letter-spacing:.04em;font-size:1.05rem;padding:.85rem 1rem;transition:background .15s;}
.estimate-submit:hover{background:var(--wp--preset--color--red-dark) !important;}
.estimate-submit:disabled{opacity:.65;cursor:wait;}
.estimate-status{min-height:1.1em;font-size:.88rem;margin:.2rem 0 0;}
.estimate-thanks{font-size:1.05rem;line-height:1.5;text-align:center;margin:.5rem 0;}
/* The modal renders inside the .bg-black footer — re-assert text colors so
   the global ".bg-black :is(p,h3)" rule doesn't white them out. The extra
   class raises specificity above .bg-black (no !important needed). */
.estimate-modal-card .estimate-eyebrow{color:#ff9ca0;}
.estimate-modal-card h3,
.estimate-modal-card .estimate-thanks{color:#fff;}
.estimate-modal-card .estimate-desc,
.estimate-modal-card .estimate-status{color:#d7d9dc;}
.estimate-modal-card .estimate-status.is-error{color:#ff9ca0;font-weight:600;}
.estimate-modal-card .estimate-form label{color:#fff;}

/* ---- Contact page inline form (#contact-inline-form) ---- */
.contact-form-section{background:#fff;}
.contact-form-section .eyebrow{text-align:center;}
.contact-form-section h2{text-align:center;}
.contact-inline-form{display:grid;gap:.75rem;max-width:560px;margin:1.6rem auto 0;
	background:#fff;border:1px solid #e7e7e3;border-radius:14px;
	box-shadow:0 18px 50px rgba(17,20,24,.10);padding:2rem 1.8rem 2.1rem;}
.contact-inline-form label{display:block;font-size:.82rem;font-weight:600;color:var(--wp--preset--color--slate);}
/* !important overrides WordPress 6.9 core form styles (see .estimate-form
   above — same fix, same reason). */
.contact-inline-form input[type=text],.contact-inline-form input[type=email],.contact-inline-form input[type=tel]{
	box-sizing:border-box !important;display:block;width:100%;margin-top:.25rem;padding:.7rem .8rem;
	border:1.5px solid #d4d4cf !important;border-radius:8px;font-size:1rem;
	font-family:var(--wp--preset--font-family--body);background:#fff !important;color:var(--wp--preset--color--black) !important;transition:border-color .15s,box-shadow .15s;}
.contact-inline-form textarea{
	box-sizing:border-box !important;display:block;width:100%;margin-top:.25rem;padding:.7rem .8rem;
	border:1.5px solid #d4d4cf !important;border-radius:8px;font-size:1rem;resize:vertical;min-height:96px;line-height:1.45;
	font-family:var(--wp--preset--font-family--body);background:#fff !important;color:var(--wp--preset--color--black) !important;transition:border-color .15s,box-shadow .15s;}
.contact-inline-form input:focus,.contact-inline-form textarea:focus{outline:none;border-color:var(--wp--preset--color--red) !important;box-shadow:0 0 0 3px rgba(215,40,47,.15);}
.contact-inline-form .hp-field{position:absolute !important;left:-9999px;width:1px;height:1px;overflow:hidden;}
.contact-inline-form .estimate-optional{font-weight:400;text-transform:none;opacity:.65;}
.contact-inline-form input[readonly].is-prefilled{background:#f1f1ee;color:#555;cursor:not-allowed;}
.form-subhead{font-family:var(--wp--preset--font-family--display);font-size:.78rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;margin:1.4rem 0 -.15rem;color:var(--wp--preset--color--slate);}
/* ---- v0.6.3: form headings LOUD ("Your Info" must be unmissable) ---- */
.form-subhead{
	font-family:var(--wp--preset--font-family--display);font-weight:800;text-transform:uppercase;
	font-size:1.35rem;color:var(--wp--preset--color--black);margin:1.2rem 0 .2rem;
	padding-top:.6rem;border-top:3px solid var(--wp--preset--color--red);width:fit-content;padding-right:2rem;
}
.contact-inline-form .form-subhead:first-of-type{margin-top:.2rem;}
/* ---- v0.6.3: prefill helper note (Refer & Earn "Your name" auto-fill) ---- */
.prefill-note{font-size:.78rem;color:var(--wp--preset--color--steel);margin-top:.2rem;display:block;}
.contact-submit{margin-top:.35rem;cursor:pointer;border:0 !important;border-radius:8px;background:var(--wp--preset--color--red) !important;
	color:#fff !important;font-family:var(--wp--preset--font-family--display);font-weight:700;text-transform:uppercase;
	letter-spacing:.04em;font-size:1.05rem;padding:.85rem 1rem;transition:background .15s;}
.contact-submit:hover{background:var(--wp--preset--color--red-dark) !important;}
.contact-submit:disabled{opacity:.65;cursor:wait;}
.contact-form-status{min-height:1.1em;font-size:.88rem;margin:.2rem 0 0;color:var(--wp--preset--color--steel);}
.contact-form-status.is-error{color:var(--wp--preset--color--red-dark);font-weight:600;}
/* Success state: fields are hidden, the confirmation line (a child of the
   form, so it can't be hidden along with everything else) stays visible. */
.contact-inline-form.is-sent>*:not(.contact-form-status){display:none;}
.contact-inline-form.is-sent{padding-bottom:2rem;}
.contact-inline-form.is-sent .contact-form-status{font-size:1.05rem;line-height:1.5;text-align:center;color:var(--wp--preset--color--black);}

/* ---- v0.6.3: Refer & Earn layout — copy left, form right (desktop);
   WP columns stack naturally on mobile (copy first, form second). ---- */
.refer-cols{align-items:flex-start;}
.refer-cols .contact-inline-form{max-width:none;margin-top:0;}

/* ---- Contact page portrait + intro columns ---- */
.contact-portrait img{border-radius:12px;}
.contact-intro-cols{align-items:center;}
@media (max-width:781px){
	.contact-portrait{max-width:260px;margin-inline:auto;}
}

/* ---- Ara chat (inside the estimate modal — black card, red border) ---- */
.ara-chat{display:flex;flex-direction:column;gap:16px;min-height:200px;justify-content:space-between;}
.ara-message{color:#fff;font-size:1.08rem;line-height:1.55;min-height:4.5em;padding-top:.4rem;white-space:pre-wrap;}
.ara-input-row{display:flex;gap:8px;align-items:center;}
.ara-input{flex:1;box-sizing:border-box !important;padding:.7rem .85rem;border:1.5px solid #d4d4cf !important;border-radius:8px;font-size:1rem;font-family:var(--wp--preset--font-family--body);background:#fff !important;color:var(--wp--preset--color--black) !important;}
.ara-input:focus{outline:none;border-color:var(--wp--preset--color--red) !important;box-shadow:0 0 0 3px rgba(215,40,47,.15);}
.ara-send{flex:0 0 auto;width:46px;height:46px;border:0 !important;border-radius:8px;background:var(--wp--preset--color--red) !important;color:#fff !important;cursor:pointer;display:flex;align-items:center;justify-content:center;}
.ara-send:hover{background:var(--wp--preset--color--red-dark) !important;}
.ara-send:disabled{opacity:.55;cursor:default;}
.ara-options{display:flex;flex-direction:column;gap:8px;}
.ara-options:empty{display:none;}
.ara-option{display:flex;align-items:center;gap:10px;text-align:left;cursor:pointer;
	border:1.5px solid var(--wp--preset--color--red) !important;border-radius:10px;
	background:transparent !important;color:#fff !important;font-size:.98rem;line-height:1.35;
	font-family:var(--wp--preset--font-family--body);padding:.6rem .75rem;transition:background .15s;}
.ara-option:hover{background:rgba(215,40,47,.22) !important;}
.ara-option-key{flex:0 0 auto;width:26px;height:26px;border-radius:50%;background:var(--wp--preset--color--red);
	color:#fff;display:flex;align-items:center;justify-content:center;
	font-family:var(--wp--preset--font-family--display);font-weight:700;font-size:.85rem;}
.ara-link{color:#ff9ca0;text-decoration:underline;word-break:break-all;}
.ara-link:hover{color:#fff;}
.ara-patience{display:block;margin-top:.7rem;font-size:.85rem;color:#9aa0a6;font-style:italic;}
.ara-close-chat{display:block;width:100%;cursor:pointer;text-align:center;
	border:1.5px solid rgba(255,255,255,.35) !important;border-radius:10px;
	background:transparent !important;color:#fff !important;
	font-family:var(--wp--preset--font-family--display);font-weight:700;text-transform:uppercase;
	letter-spacing:.05em;font-size:.95rem;padding:.65rem .8rem;transition:background .15s,border-color .15s;}
.ara-close-chat:hover{background:rgba(255,255,255,.12) !important;border-color:#fff !important;}
.ara-typing{display:inline-flex;gap:5px;align-items:center;}
.ara-typing i{width:8px;height:8px;border-radius:50%;background:#ff9ca0;display:inline-block;animation:ara-blink 1.2s infinite ease-in-out;}
.ara-typing i:nth-child(2){animation-delay:.18s;}
.ara-typing i:nth-child(3){animation-delay:.36s;}
@keyframes ara-blink{0%,70%,100%{opacity:.3;transform:translateY(0);}35%{opacity:1;transform:translateY(-4px);}}

/* ---- Reviews wall (scrolling Google-review bubbles) ---- */
.reviews-wall-section{padding-bottom:4rem;}
.reviews-wall{display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem;
	max-height:640px;overflow:hidden;position:relative;}
.reviews-wall::before,.reviews-wall::after{content:"";position:absolute;left:0;right:0;height:56px;z-index:2;pointer-events:none;}
.reviews-wall::before{top:0;background:linear-gradient(180deg,#fff,rgba(255,255,255,0));}
.reviews-wall::after{bottom:0;background:linear-gradient(0deg,#fff,rgba(255,255,255,0));}
.reviews-col{overflow:hidden;}
.reviews-track{display:flex;flex-direction:column;gap:1.25rem;
	animation:reviews-scroll var(--marquee-dur,60s) linear infinite;}
.reviews-wall:hover .reviews-track{animation-play-state:paused;}
@keyframes reviews-scroll{from{transform:translateY(0);}to{transform:translateY(-50%);}}
@media (prefers-reduced-motion:reduce){
	.reviews-track{animation:none;}
	.reviews-wall{max-height:none;}
	.reviews-wall::before,.reviews-wall::after{display:none;}
}
.review-bubble{background:#fff;border:1px solid rgba(17,20,24,.09);border-radius:16px;
	padding:1.15rem 1.2rem 1.05rem;box-shadow:0 8px 26px rgba(17,20,24,.08);}
.review-head{display:flex;align-items:center;gap:.7rem;margin-bottom:.55rem;}
.review-avatar{flex:0 0 auto;width:42px;height:42px;border-radius:50%;display:flex;align-items:center;justify-content:center;
	background:var(--wp--preset--color--red);color:#fff;font-family:var(--wp--preset--font-family--display);
	font-weight:800;font-size:1.15rem;}
.review-who{display:flex;flex-direction:column;line-height:1.2;}
.review-who strong{font-family:var(--wp--preset--font-family--display);font-weight:700;font-size:1.02rem;color:var(--wp--preset--color--black);}
.review-stars{color:#f5a623;font-size:.85rem;letter-spacing:.1em;}
.review-bubble p{margin:0;font-size:.95rem;line-height:1.55;color:#3a4048;}
.reviews-more{text-align:center;margin:1.6rem 0 0;}
.reviews-more a{font-family:var(--wp--preset--font-family--display);font-weight:700;color:var(--wp--preset--color--red);text-decoration:none;}
.reviews-more a:hover{text-decoration:underline;}

/* ---- v0.6.3: "100+ Five-Star Reviews" badge band, top of Reviews page ---- */
.reviews-badge-band{background:#fff;padding-block:1.6rem;}
.reviews-badge{display:flex;align-items:center;justify-content:center;gap:1rem;}
.reviews-badge .stars{color:#fbbc04;font-size:2rem;letter-spacing:.12em;line-height:1;}
.reviews-badge-text{display:flex;flex-direction:column;line-height:1.15;}
.reviews-badge-text strong{font-family:var(--wp--preset--font-family--display);font-weight:800;text-transform:uppercase;font-size:1.5rem;color:var(--wp--preset--color--black);}
.reviews-badge-text span{color:var(--wp--preset--color--steel);font-size:.95rem;}
@media (max-width:600px){.reviews-badge{flex-direction:column;gap:.3rem;text-align:center;}}

/* ---- v0.6.2: full readable review list below the marquee ---- */
.reviews-all{background:#fff;}
.reviews-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:1.1rem;margin-top:1.6rem;}
.reviews-grid > *{width:auto;max-width:none;flex:none;}
@media (max-width:820px){
	.reviews-wall{grid-template-columns:1fr 1fr;max-height:560px;}
	.reviews-col--mid{display:none;}
	.reviews-wall-section{padding-left:20px;padding-right:20px;}
}
@media (max-width:600px){
	.reviews-wall{grid-template-columns:1fr;max-height:520px;}
}

/* ---- Editable page copy (post-content) — inherits the .prose look ----
   Pages now render their copy from the WP editor (Stone, 2026-07-13:
   "for me to edit my own site I need to be able to use the functionality
   of wordpress editor"). Style the post-content area exactly like .prose. */
.page-copy .wp-block-post-content{max-width:840px;}
.page-copy .wp-block-post-content>h2{font-family:var(--wp--preset--font-family--display);font-weight:800;
	text-transform:uppercase;font-size:1.7rem;color:var(--wp--preset--color--black);
	margin:2.2rem 0 .8rem;letter-spacing:.01em;}
.page-copy .wp-block-post-content>h2::before{content:"";display:block;width:44px;height:4px;border-radius:2px;
	background:var(--wp--preset--color--red);margin-bottom:.55rem;}
.page-copy .wp-block-post-content>h2:first-child{margin-top:0;}
.page-copy .wp-block-post-content p{line-height:1.7;color:#2f353d;}
.page-copy .wp-block-post-content ul{padding-left:0;list-style:none;}
.page-copy .wp-block-post-content ul li{position:relative;padding-left:1.9rem;margin:.55rem 0;line-height:1.65;color:#2f353d;}
.page-copy .wp-block-post-content ul li::before{content:"";position:absolute;left:0;top:.42em;width:18px;height:18px;
	border-radius:50%;background:var(--wp--preset--color--red);
	-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20Zm-1.2 13.5-3.6-3.6 1.4-1.4 2.2 2.2 4.6-4.6 1.4 1.4-6 6Z'/%3E%3C/svg%3E") center/contain no-repeat;
	mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20Zm-1.2 13.5-3.6-3.6 1.4-1.4 2.2 2.2 4.6-4.6 1.4 1.4-6 6Z'/%3E%3C/svg%3E") center/contain no-repeat;}
.page-copy .wp-block-post-content .prose-intro{font-size:1.12rem;line-height:1.7;border-left:4px solid var(--wp--preset--color--red);
	padding-left:1.1rem;color:#2f353d;}
@media (max-width:820px){.page-copy{padding-left:20px;padding-right:20px;}}

/* ---- Certification logos row (About) ---- */
.cert-logos{display:flex;align-items:center;gap:1.1rem;flex-wrap:wrap;margin:1.4rem 0 .6rem;}
.cert-logos img{height:44px;width:auto;display:block;}
@media (max-width:600px){
	.cert-logos{gap:.8rem;}
	.cert-logos img{height:32px;}
}

/* ---- Guarantee pages (warranty / price assurance) ---- */
.guarantee-layout{display:flex;gap:2.5rem;align-items:flex-start;}
.guarantee-badge{flex:0 0 auto;width:120px;height:120px;color:var(--wp--preset--color--red);}
.guarantee-badge svg{width:100%;height:100%;display:block;}
@media (max-width:820px){
	.guarantee-layout{flex-direction:column;gap:1.25rem;padding-left:20px;padding-right:20px;}
	.guarantee-badge{width:88px;height:88px;}
}

/* ---- Process steps (dark jobsite panel — Stone picked Concept B) ---- */
.process-dark{background:var(--wp--preset--color--black);position:relative;overflow:hidden;}
.process-dark::before{content:"";position:absolute;inset:0;opacity:.05;pointer-events:none;
	background-image:repeating-linear-gradient(45deg,#fff 0 2px,transparent 2px 22px);}
.process-head{position:relative;z-index:1;max-width:760px;margin:0 auto 3rem;text-align:center;}
.process-dark .eyebrow{color:#ff9ca0;text-align:center;}
.process-head h2{font-family:var(--wp--preset--font-family--display);font-weight:800;text-transform:uppercase;
	color:#fff;font-size:clamp(2rem,4vw,2.9rem);margin:.3rem 0 .5rem;letter-spacing:.01em;}
.process-sub{color:#b9bdc2;line-height:1.6;margin:0;}
.process-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.2rem;position:relative;z-index:1;}
.process-step{background:linear-gradient(160deg,#1b2027,#14181d);border:1px solid rgba(255,255,255,.08);
	border-top:4px solid var(--wp--preset--color--red);border-radius:14px;padding:1.7rem 1.4rem 1.6rem;
	position:relative;transition:transform .18s ease,border-color .18s ease;}
.process-step:hover{transform:translateY(-6px);border-color:rgba(215,40,47,.6);}
.process-num{display:inline-flex;align-items:baseline;gap:.5rem;margin-bottom:1rem;}
.process-num b{font-family:var(--wp--preset--font-family--display);font-weight:800;font-size:3rem;line-height:1;
	color:var(--wp--preset--color--red);}
.process-num span{font-family:var(--wp--preset--font-family--display);font-weight:700;text-transform:uppercase;
	letter-spacing:.14em;font-size:.7rem;color:#7d848d;}
.process-step h4{font-family:var(--wp--preset--font-family--display);font-weight:800;text-transform:uppercase;
	font-size:1.28rem;color:#fff;margin:0 0 .55rem;}
.process-step p{font-size:.93rem;line-height:1.62;color:#aeb4bb;margin:0;}
.process-check{position:absolute;top:1.4rem;right:1.3rem;width:26px;height:26px;color:rgba(255,255,255,.18);
	transition:color .18s ease;}
.process-step:hover .process-check{color:var(--wp--preset--color--red);}
@media (max-width:860px){.process-grid{grid-template-columns:1fr 1fr;}}
@media (max-width:560px){
	.process-grid{grid-template-columns:1fr;}
	.process-dark{padding-left:20px;padding-right:20px;}
}

/* (legacy .step styles kept for any other template using them) */
.step .step-num{font-family:var(--wp--preset--font-family--display);font-weight:800;font-size:2.4rem;color:var(--wp--preset--color--red);line-height:1;}

/* ---- Stats / social proof (card KPIs) ---- */
.stat{background:#fff;border-radius:16px;padding:1.7rem 1.15rem 1.5rem;text-align:center;
	border:1px solid rgba(17,20,24,.07);border-top:4px solid var(--wp--preset--color--red);
	box-shadow:0 8px 26px rgba(17,20,24,.09);transition:transform .18s ease,box-shadow .18s ease;}
.stat:hover{transform:translateY(-4px);box-shadow:0 16px 36px rgba(17,20,24,.15);}
.stat .stat-num{font-family:var(--wp--preset--font-family--display);font-weight:800;font-size:3.1rem;
	color:var(--wp--preset--color--red);line-height:1;letter-spacing:-.01em;}
.stat .stat-num::after{content:"";display:block;width:36px;height:3px;border-radius:2px;
	background:var(--wp--preset--color--red);opacity:.85;margin:.75rem auto .6rem;}
.stat .stat-label{text-transform:uppercase;letter-spacing:.055em;color:var(--wp--preset--color--ink,#272C33);
	font-weight:700;font-size:.85rem;line-height:1.3;}

/* ---- Badge ---- */
.badge{display:inline-block;background:var(--wp--preset--color--red);color:#fff;font-family:var(--wp--preset--font-family--display);font-weight:700;text-transform:uppercase;letter-spacing:.05em;font-size:.8rem;padding:5px 12px;border-radius:4px;}

/* ---- Final CTA ---- */
.final-cta{background:var(--wp--preset--color--red);color:#fff;text-align:center;}
.final-cta :is(h2,p){color:#fff;}
.final-cta .phone{font-family:var(--wp--preset--font-family--display);font-weight:800;font-size:2rem;color:#fff;text-decoration:none;}

/* ---- Mobile ---- */
.nav-toggle{display:none;}
@media (max-width:820px){
	.hero-content,.hero-inner{width:100%;padding-right:0;}
	.has-hero::after{background:linear-gradient(180deg,rgba(17,20,24,.25),rgba(17,20,24,.78));}
}

/* =====================================================================
   H2 Shield — Water Filter Buyer's Guide landing page (/h2-shield/)
   ===================================================================== */

/* Smooth in-page scroll to the form, offset so the sticky header doesn't
   cover the heading when the anchor lands. */
html{scroll-behavior:smooth;}
#guide-form{scroll-margin-top:96px;}

/* Headings on the light (concrete/form) bands must stay dark, never white —
   override any global heading color. Swap to --red here to make them red. */
.bg-concrete h2,
.lp-form-section h2{color:var(--wp--preset--color--black) !important;}

/* ---- Lead-magnet hero (dark) ---- */
.lp-hero{
	background:var(--wp--preset--color--black);
	color:#fff;
	background-image:radial-gradient(120% 90% at 80% -10%,rgba(215,40,47,.30),transparent 60%);
	padding-block:calc(var(--wp--preset--spacing--70) + 2.5rem) var(--wp--preset--spacing--70);
}
.lp-hero :is(h1,h2,p){color:#fff;}
.lp-hero .lp-kicker{
	display:inline-block;font-family:var(--wp--preset--font-family--display);font-weight:700;
	text-transform:uppercase;letter-spacing:.14em;font-size:.85rem;color:#ff9ca0;margin-bottom:.6rem;
}
.lp-hero h1{margin:0 0 .6rem;}
.lp-hero .lp-sub{font-size:1.15rem;color:#d7d9dc !important;max-width:46ch;}
.lp-trust{
	font-family:var(--wp--preset--font-family--display);font-weight:600;text-transform:uppercase;
	letter-spacing:.08em;font-size:.85rem;color:#aeb2b8 !important;margin-top:.4rem;
}

/* ---- Responsive video ---- */
.lp-video{position:relative;width:100%;aspect-ratio:16/9;border-radius:12px;overflow:hidden;
	box-shadow:0 18px 50px rgba(0,0,0,.45);border:1px solid rgba(255,255,255,.08);background:#000;}
.lp-video iframe{position:absolute;inset:0;width:100%;height:100%;border:0;}
/* Click-to-play facade — no YouTube chrome until the visitor presses play. */
.lp-video-facade{position:absolute;inset:0;width:100%;height:100%;border:0;padding:0;margin:0;cursor:pointer;
	background-color:#000;background-size:cover;background-position:center;background-repeat:no-repeat;}
.lp-video-facade::after{content:"";position:absolute;inset:0;background:rgba(17,20,24,.22);transition:background .15s;}
.lp-video-facade:hover::after{background:rgba(17,20,24,.10);}
.lp-video-play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:2;
	width:80px;height:80px;border-radius:50%;background:var(--wp--preset--color--red);
	box-shadow:0 8px 24px rgba(0,0,0,.45);transition:background .15s,transform .15s;}
.lp-video-play::before{content:"";position:absolute;top:50%;left:54%;transform:translate(-50%,-50%);
	border-style:solid;border-width:14px 0 14px 24px;border-color:transparent transparent transparent #fff;}
.lp-video-facade:hover .lp-video-play{background:var(--wp--preset--color--red-dark);transform:translate(-50%,-50%) scale(1.06);}

/* ---- Benefit row ---- */
.lp-benefits{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;}
.lp-benefit{display:flex;gap:.65rem;align-items:flex-start;font-size:.98rem;line-height:1.4;}
.lp-benefit::before{content:"";flex:0 0 auto;width:1.35rem;height:1.35rem;margin-top:.1rem;border-radius:50%;
	background:var(--wp--preset--color--red) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center/0.85rem no-repeat;}

/* ---- "Inside the guide" tips ---- */
.lp-tips{display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem;margin-top:2.5rem;}
.lp-tip{background:#fff;border:1px solid #e7e7e3;border-left:4px solid var(--wp--preset--color--red);
	border-radius:10px;padding:1.4rem 1.5rem;box-shadow:0 6px 18px rgba(17,20,24,.05);}
.lp-tip .tip-num{font-family:var(--wp--preset--font-family--display);font-weight:800;text-transform:uppercase;
	letter-spacing:.05em;font-size:.8rem;color:var(--wp--preset--color--red);display:block;margin-bottom:.5rem;}
.lp-tip p{margin:0;font-size:1.02rem;line-height:1.45;}
.lp-tip.is-alert{background:var(--wp--preset--color--black);border-left-color:#fff;}
.lp-tip.is-alert :is(p,.tip-num){color:#fff;}
.lp-tip.is-alert .tip-num{color:#ff9ca0;}

/* ---- Form section ---- */
.lp-form-section{background:var(--wp--preset--color--black);}
/* Section heading/intro sit on the black bg → white. The white form card's
   own text colors are set on .lp-form-card* selectors and are unaffected. */
.lp-form-section > .wp-block-group :is(h2,p){color:#fff !important;}
.lp-form-section > .wp-block-group .eyebrow{color:#ff9ca0 !important;}
.lp-form-card{background:#fff;border:1px solid #e7e7e3;border-radius:14px;
	box-shadow:0 24px 60px rgba(0,0,0,.45);padding:2rem 2rem 2.2rem;max-width:560px;margin-inline:auto;}
.lp-form-card .lp-form-label{font-family:var(--wp--preset--font-family--display);font-weight:700;
	text-transform:uppercase;letter-spacing:.06em;font-size:.8rem;color:var(--wp--preset--color--red);}
.lp-form-card h3{margin:.2rem 0 .3rem;font-size:1.7rem;color:var(--wp--preset--color--black);}
.lp-form-card .lp-form-desc{color:var(--wp--preset--color--steel);margin:0 0 1.3rem;}
.lp-form{display:grid;gap:.9rem;}
.lp-form .row-2{display:grid;grid-template-columns:1fr 1fr;gap:.9rem;}
.lp-form label{display:block;font-size:.82rem;font-weight:600;color:var(--wp--preset--color--slate);margin-bottom:.3rem;}
/* !important overrides WordPress 6.9 core form styles, which target form
   fields with very high specificity using the default palette slugs
   (--base/--contrast) this theme doesn't define — otherwise inputs render
   transparent and borderless. */
.lp-form input[type="text"],.lp-form input[type="email"],.lp-form input[type="tel"]{
	box-sizing:border-box !important;width:100%;padding:.8rem .9rem;border:1.5px solid #d4d4cf !important;border-radius:8px;font-size:1rem;
	font-family:var(--wp--preset--font-family--body);background:#fff !important;color:var(--wp--preset--color--black) !important;transition:border-color .15s,box-shadow .15s;}
.lp-form input[type="text"]:focus,.lp-form input[type="email"]:focus,.lp-form input[type="tel"]:focus{outline:none;border-color:var(--wp--preset--color--red) !important;box-shadow:0 0 0 3px rgba(215,40,47,.15);}
.lp-form .hp-field{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden;}
.lp-consent{display:flex;gap:.6rem;align-items:flex-start;font-size:.82rem;color:var(--wp--preset--color--steel);line-height:1.45;}
.lp-consent input{margin-top:.2rem;flex:0 0 auto;}
.lp-form .submit-btn{
	width:100%;margin-top:.3rem;cursor:pointer;border:0 !important;border-radius:8px;
	background:var(--wp--preset--color--red) !important;color:#fff !important;
	font-family:var(--wp--preset--font-family--display);font-weight:700;text-transform:uppercase;
	letter-spacing:.04em;font-size:1.1rem;padding:.95rem 1.2rem;transition:background .15s;}
.lp-form .submit-btn:hover{background:var(--wp--preset--color--red-dark) !important;}
.lp-form .submit-btn:disabled{opacity:.65;cursor:wait;}
.lp-form-status{min-height:1.2em;font-size:.9rem;margin-top:.2rem;color:var(--wp--preset--color--steel);}
.lp-form-status.is-error{color:var(--wp--preset--color--red-dark);font-weight:600;}
.lp-form-success{background:#fff;border:1px solid #e7e7e3;border-top:4px solid var(--wp--preset--color--red);
	border-radius:14px;box-shadow:0 18px 50px rgba(17,20,24,.10);padding:2.4rem 2rem;max-width:560px;
	margin-inline:auto;text-align:center;}
.lp-form-success h3{font-size:1.8rem;margin:.3rem 0 .5rem;}
.lp-form-success p{color:var(--wp--preset--color--steel);margin:0 auto;max-width:42ch;}

@media (max-width:820px){
	.lp-benefits{grid-template-columns:1fr 1fr;}
	.lp-tips{grid-template-columns:1fr;}
	.lp-form .row-2{grid-template-columns:1fr;}
	.lp-form-card{padding:1.5rem 1.25rem 1.7rem;}
}
@media (max-width:480px){
	.lp-benefits{grid-template-columns:1fr;}
}

/* =====================================================================
   Interior pages (v0.3.0) — services hub, service pages, service areas
   ===================================================================== */

/* ---- Interior hero (dark band under fixed header) ---- */
.int-hero{
	background:var(--wp--preset--color--black);color:#fff;
	background-image:radial-gradient(120% 90% at 80% -10%,rgba(215,40,47,.30),transparent 60%);
	border-bottom:6px solid var(--wp--preset--color--red);
	padding-block:calc(var(--wp--preset--spacing--70) + 3.5rem) var(--wp--preset--spacing--70);
}
.int-hero :is(h1,p){color:#fff;}
/* Kicker/h1/sub must share ONE left edge (the 1180px content column).
   Kicker was inline-block → WP's constrained margin:auto resolves to 0 on
   inline boxes → it pinned to the viewport edge. Block + max-width rides
   the same centering as the h1. */
.int-hero .int-kicker{
	display:block;max-width:1180px;margin-inline:auto;
	font-family:var(--wp--preset--font-family--display);font-weight:700;
	text-transform:uppercase;letter-spacing:.14em;font-size:.85rem;color:#ff9ca0;margin-bottom:.6rem;
}
.int-hero h1{margin:0 0 .6rem;}
/* Sub: full content-column box (WP's margin:auto !important centers it, so a
   62ch max-width used to CENTER the line instead of left-aligning it). Box =
   1180 column; line length capped via padding-right instead. */
.int-hero .int-sub{font-size:1.15rem;color:#d7d9dc !important;box-sizing:border-box;max-width:1180px;margin-inline:auto;padding-right:max(0px,calc(100% - 62ch));}
.int-hero .wp-block-buttons{margin-top:1.4rem;}

/* ---- Reviews hero: glowing 5-star badge + giant background stars (v0.6.9,
   Stone: "this should be in the hero background as a graphic, make it more
   exciting") ---- */
.reviews-hero{position:relative;overflow:hidden;}
.reviews-hero::after{content:"★★★★★";position:absolute;right:-3%;bottom:-5rem;
	font-size:13rem;color:rgba(251,188,4,.09);letter-spacing:.6rem;
	transform:rotate(-7deg);pointer-events:none;line-height:1;}
/* Row wrapper rides WP's constrained centering (max-width + auto margins) so
   the badge's LEFT edge sits on the content column like the h1 — the badge
   itself was inline-flex, so auto margins resolved to 0 and it pinned to the
   viewport edge (Stone: "alignment off"). */
.hero-badge-row{display:block;}
.hero-review-badge{display:inline-flex;align-items:center;gap:1.1rem;margin:.5rem 0 1.2rem;
	padding:1rem 1.7rem;border:1px solid rgba(251,188,4,.4);border-radius:70px;
	background:rgba(251,188,4,.09);box-shadow:0 0 40px rgba(251,188,4,.22);}
.hero-review-badge .g-logo{display:flex;flex:0 0 auto;}
.hero-review-badge .g-logo svg{width:38px;height:38px;}
.hero-review-badge .stars{color:#fbbc04;font-size:2.1rem;letter-spacing:.12em;line-height:1;
	text-shadow:0 0 18px rgba(251,188,4,.6);}
.hero-review-badge .txt{display:flex;flex-direction:column;line-height:1.15;}
.hero-review-badge .txt strong{font-family:var(--wp--preset--font-family--display);font-weight:800;
	text-transform:uppercase;font-size:1.4rem;color:#fff;}
.hero-review-badge .txt span{color:#d7d9dc;font-size:1rem;}
@media (max-width:600px){
	.hero-review-badge{gap:.8rem;padding:.8rem 1.2rem;}
	.hero-review-badge .stars{font-size:1.5rem;}
	.hero-review-badge .txt strong{font-size:1.05rem;}
	.hero-review-badge .g-logo svg{width:30px;height:30px;}
}

/* ---- Refer page: tighter hero + first-section spacing (Stone: "too much
   white space before body copy") ---- */
.refer-hero{padding-block:calc(var(--wp--preset--spacing--60) + 3.2rem) var(--wp--preset--spacing--50);}
.refer-layout.section-pad{padding-block-start:2.4rem;}
/* Form headline lives INSIDE the card frame (Stone). */
.contact-inline-form .form-title{text-align:center;margin:0 0 .5rem;font-size:1.6rem;}

/* ---- Long-form prose ---- */
.prose{max-width:760px;margin-inline:auto;}
.prose h2{
	font-size:1.9rem;margin:2.6rem 0 .9rem;position:relative;padding-top:.9rem;
	color:var(--wp--preset--color--black);
}
.prose h2::before{content:"";position:absolute;top:0;left:0;width:56px;height:4px;background:var(--wp--preset--color--red);border-radius:2px;}
.prose h3{font-size:1.25rem;margin:1.8rem 0 .5rem;color:var(--wp--preset--color--black);}
.prose p{line-height:1.7;margin:0 0 1.05rem;color:#2c3138;}
.prose strong{color:var(--wp--preset--color--black);}
.prose a{color:var(--wp--preset--color--red-dark);font-weight:600;}
.prose ul{list-style:none;padding:0;margin:0 0 1.2rem;}
.prose ul li{
	position:relative;padding-left:1.9rem;margin-bottom:.55rem;line-height:1.55;color:#2c3138;
}
.prose ul li::before{
	content:"";position:absolute;left:0;top:.28em;width:1.15rem;height:1.15rem;border-radius:50%;
	background:var(--wp--preset--color--red) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center/0.72rem no-repeat;
}
.prose ol{counter-reset:step;list-style:none;padding:0;margin:0 0 1.2rem;}
.prose ol li{
	counter-increment:step;position:relative;padding-left:2.6rem;margin-bottom:.9rem;line-height:1.6;color:#2c3138;
}
.prose ol li::before{
	content:counter(step);position:absolute;left:0;top:0;width:1.8rem;height:1.8rem;border-radius:50%;
	background:var(--wp--preset--color--black);color:#fff;font-family:var(--wp--preset--font-family--display);
	font-weight:700;font-size:.95rem;display:flex;align-items:center;justify-content:center;
}
.prose .phone-inline{font-family:var(--wp--preset--font-family--display);font-weight:800;white-space:nowrap;}

/* ---- FAQ accordions ---- */
.faq{max-width:760px;margin-inline:auto;}
.faq details{
	background:#fff;border:1px solid #e7e7e3;border-left:4px solid var(--wp--preset--color--red);
	border-radius:10px;margin-bottom:.8rem;box-shadow:0 4px 14px rgba(17,20,24,.05);
}
.faq summary{
	cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:space-between;gap:1rem;
	padding:1.05rem 1.25rem;font-family:var(--wp--preset--font-family--display);
	font-weight:700;font-size:1.12rem;color:var(--wp--preset--color--black);
}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::after{
	content:"+";flex:0 0 auto;width:1.6rem;height:1.6rem;border-radius:50%;
	background:var(--wp--preset--color--red);color:#fff;font-weight:700;font-size:1.2rem;
	display:flex;align-items:center;justify-content:center;transition:transform .2s;
}
.faq details[open] summary::after{content:"–";}
.faq details > p{padding:0 1.25rem 1.15rem;margin:0;line-height:1.65;color:#2c3138;}

/* ---- Services hub cards ---- */
.svc-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.4rem;margin-top:2.2rem;}
.svc-card{
	display:flex;flex-direction:column;background:#fff;border:1px solid #e7e7e3;
	border-top:4px solid var(--wp--preset--color--red);border-radius:12px;
	padding:1.7rem 1.7rem 1.5rem;box-shadow:0 6px 18px rgba(17,20,24,.05);
	text-decoration:none;transition:transform .15s ease,box-shadow .2s ease;
}
.svc-card:hover{transform:translateY(-3px);box-shadow:0 14px 34px rgba(17,20,24,.12);}
.svc-card h3{margin:0 0 .5rem;font-size:1.45rem;color:var(--wp--preset--color--black);}
.svc-card p{margin:0 0 1rem;line-height:1.6;color:#2c3138;flex:1;}
.svc-card .svc-more{
	font-family:var(--wp--preset--font-family--display);font-weight:700;text-transform:uppercase;
	letter-spacing:.05em;font-size:.9rem;color:var(--wp--preset--color--red-dark);
}
.svc-card.is-own{background:var(--wp--preset--color--black);}
.svc-card.is-own :is(h3,p){color:#fff;}
.svc-card.is-own p{color:#d7d9dc;}
.svc-card.is-own .svc-more{color:#ff9ca0;}
.svc-own-badge{
	align-self:flex-start;background:var(--wp--preset--color--red);color:#fff;
	font-family:var(--wp--preset--font-family--display);font-weight:700;text-transform:uppercase;
	letter-spacing:.06em;font-size:.72rem;padding:4px 10px;border-radius:4px;margin-bottom:.7rem;
}

/* ---- Service area map ---- */
.area-map-section{background:var(--wp--preset--color--black);color:#fff;}
.area-map-section :is(h1,h2,p){color:#fff;}
.area-map-section .eyebrow{color:#ff9ca0 !important;}
.area-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:2.5rem;align-items:center;margin-top:2rem;}
.area-mapwrap{position:relative;background:linear-gradient(180deg,#15181d,#111418);
	border:1px solid #272C33;border-radius:12px;padding:1rem;}
#ifix-area-map{width:100%;height:auto;display:block;}
#ifix-area-map .st{fill:#1b1f26;stroke:#272C33;stroke-width:.75;}
#ifix-area-map .stateline{stroke:#454c55;stroke-width:1;}
#ifix-area-map .c{fill:var(--wp--preset--color--red);stroke:#111418;stroke-width:.6;cursor:pointer;transition:fill .15s;}
#ifix-area-map .c:hover,#ifix-area-map .c:focus{fill:#ff4048;outline:none;}
#ifix-area-map .lbl text{font-family:var(--wp--preset--font-family--display);font-weight:700;letter-spacing:.14em;font-size:15px;fill:#8b929b;}
#ifix-area-map .lbl .sub{font-size:10px;letter-spacing:.1em;fill:#6b727b;}
.area-tip{position:fixed;z-index:80;background:#fff;color:var(--wp--preset--color--black);font-weight:600;
	font-size:.85rem;padding:.35rem .6rem;border-radius:6px;pointer-events:none;display:none;
	box-shadow:0 4px 14px rgba(0,0,0,.4);}
.area-tip::after{content:"";position:absolute;left:12px;top:100%;border:5px solid transparent;border-top-color:#fff;}
.area-chips{display:flex;flex-direction:column;gap:1rem;}
.area-chip{border:1px solid #272C33;border-left:4px solid var(--wp--preset--color--red);
	border-radius:8px;padding:1rem 1.2rem;background:#15181d;}
.area-chip b{font-family:var(--wp--preset--font-family--display);font-size:1.5rem;font-weight:700;
	letter-spacing:.04em;text-transform:uppercase;display:block;color:#fff;}
.area-chip span{color:#c7cbd1;font-size:.9rem;line-height:1.45;display:block;margin-top:.2rem;}
.area-counties{margin-top:3rem;display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1.5rem;}
.area-counties h3{font-family:var(--wp--preset--font-family--display);text-transform:uppercase;
	letter-spacing:.08em;color:var(--wp--preset--color--red);font-size:1.2rem;margin:0 0 .5rem;}
.area-counties p{color:#c7cbd1;font-size:.9rem;line-height:1.7;margin:0;}

@media (max-width:860px){
	.svc-grid{grid-template-columns:1fr;}
	.area-grid{grid-template-columns:1fr;}
}

/* =====================================================================
   Mobile hardening pass (v0.3.0) — phones ≤600px
   ===================================================================== */
@media (max-width:820px){
	.section-pad{padding-block:var(--wp--preset--spacing--60);}
	.int-hero{padding-block:calc(var(--wp--preset--spacing--60) + 3.2rem) var(--wp--preset--spacing--60);}
	.int-hero h1{font-size:clamp(2rem,9vw,2.8rem);line-height:1.05;}
	.int-hero .int-sub{font-size:1.02rem;}
	.prose h2{font-size:1.55rem;}
	.area-mapwrap{padding:.6rem;}
}
@media (max-width:600px){
	/* v0.7.4: dropped min-height:72vh here — it was already dead (overridden
	   by the later .has-hero{min-height:0} rule in the same cascade), and
	   conflicted with the "black area = auto/content height" fold fix. */
	.hero-inner :is(h1,h2){font-size:clamp(1.9rem,10vw,2.5rem);line-height:1.05;}
	.faq summary{font-size:1rem;padding:.9rem 1rem;}
	.faq details > p{padding:0 1rem .95rem;}
	.svc-card{padding:1.3rem 1.2rem 1.2rem;}
	.svc-card h3{font-size:1.25rem;}
	.lp-hero h1{font-size:clamp(1.9rem,9vw,2.4rem);}
	.final-cta .phone{font-size:1.6rem;}
	.stat .stat-num{font-size:2.3rem;}
	.wp-block-buttons .wp-block-button{width:100%;}
	.wp-block-buttons .wp-block-button__link{width:100%;text-align:center;}
	.area-counties{gap:1.1rem;}
	.prose{font-size:.98rem;}
	/* Give tapped counties a visible state on touch (no hover) */
	#ifix-area-map .c:active{fill:#ff4048;}
}

/* =====================================================================
   v0.3.1 — photo heroes for interior pages + hero text alignment fix
   ===================================================================== */
/* (Old margin-left:0 hack removed — WP's constrained margin:auto carries
   !important and always won; the padding-right approach above replaces it.) */

/* Photo hero variant: real jobsite/field photo + dark scrim.
   Add .has-photo + a per-page modifier that supplies the image. */
.int-hero.has-photo{
	position:relative;min-height:62vh;display:flex;align-items:center;
	background-size:cover;background-position:center;
}
.int-hero.has-photo::after{
	content:"";position:absolute;inset:0;z-index:1;
	background:linear-gradient(90deg,rgba(17,20,24,.06) 34%,rgba(17,20,24,.62) 58%,rgba(17,20,24,.82) 100%);
}
.int-hero.has-photo > *{position:relative;z-index:2;}
/* Copy sits right, clear of Stone (photo subject stands left). */
.int-hero.has-photo .int-right{margin-left:auto !important;margin-right:0 !important;width:55%;max-width:640px;}
.int-hero--services{background-image:url(../images/Stone_Lawrence-hero-wide.webp);}
@media (max-width:820px){
	.int-hero.has-photo{min-height:56vh;}
	.int-hero.has-photo::after{background:linear-gradient(180deg,rgba(17,20,24,.30),rgba(17,20,24,.84));}
	.int-hero.has-photo .int-right{width:100%;}
}

/* =====================================================================
   v0.3.2 — service-area section: white background, black map + chips
   (Stone 2026-07-07: "too much black — background white, map black")
   ===================================================================== */
.area-map-section{background:#fff;color:var(--wp--preset--color--black);}
.area-map-section :is(h1,h2,p){color:var(--wp--preset--color--black);}
.area-map-section .eyebrow{color:var(--wp--preset--color--red) !important;}
.area-mapwrap{background:var(--wp--preset--color--black);border:1px solid var(--wp--preset--color--black);
	box-shadow:0 14px 40px rgba(17,20,24,.18);}
.area-chip{background:var(--wp--preset--color--black);border-color:var(--wp--preset--color--black);}
.area-counties p{color:#2c3138;}
.area-tip{background:var(--wp--preset--color--black);color:#fff;}
.area-tip::after{border-top-color:var(--wp--preset--color--black);}

/* =====================================================================
   v0.3.3 — mobile redesign per Stone (2026-07-07 phone review)
   Header: small logo + phone icon + hamburger. Hero: face photo, copy
   BELOW (no overlay). Buttons right-sized. IG pill compact.
   ===================================================================== */

/* Phone icon: hidden on desktop, shown in the mobile header row. */
.header-phone{display:none;}

@media (max-width:820px){
	/* --- Compact header row: logo · phone · hamburger --- */
	.site-header{padding-block:8px;}
	.site-header .site-logo-img,
	.site-header.is-scrolled .site-logo-img,
	.site-header.no-hero .site-logo-img{height:30px;}
	.header-phone{
		display:inline-flex;align-items:center;justify-content:center;
		width:38px;height:38px;border-radius:50%;flex:0 0 auto;
		background:var(--wp--preset--color--red);color:#fff;
		margin-left:auto;margin-right:2px;
	}
	.header-phone svg{width:19px;height:19px;}
	/* Collapse the nav to the hamburger at 820px (core only does 600px),
	   and make the hamburger white so it's visible on the black header. */
	.site-header .wp-block-navigation__responsive-container:not(.is-menu-open){display:none;}
	.site-header .wp-block-navigation__responsive-container-open{
		display:flex !important;color:#fff;
	}
	.site-header .wp-block-navigation__responsive-container-open svg{width:28px;height:28px;}
	.site-header .wp-block-navigation__responsive-container.is-menu-open{display:flex;}
}

@media (max-width:600px){
	/* --- Homepage hero: Stone's face on top, copy below on black --- */
	.has-hero{
		display:block;min-height:0;
		background:var(--wp--preset--color--black);background-image:none;
	}
	.has-hero::after{content:none;}
	.has-hero::before{
		/* full photo frame, owner decision 2026-07-23 — do NOT re-crop or
		   height-cap; fold intentionally sacrificed for full photo.
		   aspect-ratio matches Stone_Lawrence-face-c.webp's native 464x720
		   exactly, so the entire source frame renders with zero cropping;
		   no viewport-height cap and no off-center background-position are
		   needed since there's no overflow to crop away. */
		content:"";display:block;width:100%;aspect-ratio:464/720;
		background:url(../images/Stone_Lawrence-face-c.webp) center center/cover no-repeat;
	}
	.has-hero > .wp-block-group{padding-top:0;}
	.hero-inner{
		width:100% !important;max-width:none !important;
		margin:0 !important;padding:.7rem 0 1.4rem !important;
		display:flex;flex-direction:column;
	}
	/* Required above-the-fold order: headline → CTA immediately under the
	   photo; kicker demoted to a lead-in for the intro paragraph below the
	   fold (owner decision — kicker not wanted above the fold). */
	.hero-inner h1{order:0;margin-top:0;}
	.hero-inner .wp-block-buttons{order:1;}
	.hero-inner .hero-kicker{order:2;margin-top:.9rem;}
	.hero-inner p:not(.hero-kicker){order:3;}
	.hero-inner .ig-follow{order:4;}
	.hero-kicker{font-size:.72rem;letter-spacing:.12em;}

	/* --- Interior photo heroes: same stacked treatment ---
	   v0.6.2 fix: relative url()s inside a custom property (--hero-photo)
	   resolve against the PAGE url, not this stylesheet, so they 404'd on
	   every phone (black 4:5 block, no photo). ::before is now display:none
	   by default; each modifier below flips it back on with a direct,
	   stylesheet-relative background-image. Note the compound selector
	   (.int-hero.has-photo.int-hero--X) — it's required so each modifier
	   out-specifies the generic rule above; a bare .int-hero--X::before
	   has lower specificity than .int-hero.has-photo::before and would
	   lose the display fight. */
	.int-hero.has-photo{display:block;min-height:0;background-image:none !important;background-color:var(--wp--preset--color--black);padding-bottom:1.6rem !important;}
	.int-hero.has-photo::after{content:none;}
	.int-hero.has-photo::before{content:"";display:none;width:100%;aspect-ratio:4/5;
		background-position:center;background-size:cover;background-repeat:no-repeat;}
	.int-hero.has-photo.int-hero--services::before{display:block;background-image:url(../images/Stone_Lawrence-face-c.webp);}
	.int-hero.has-photo.int-hero--agents::before{display:block;background-image:url(../images/hero-agents.webp?v=46);}
	.int-hero.has-photo.int-hero--waterproofing::before{display:block;background-image:url(../images/hero-waterproofing.webp?v=46);}
	.int-hero.has-photo.int-hero--foundation::before{display:block;background-image:url(../images/hero-foundation.webp?v=46);}
	.int-hero.has-photo.int-hero--crawl::before{display:block;background-image:url(../images/hero-crawl.webp?v=46);}
	.int-hero.has-photo.int-hero--about::before{display:block;background-image:url(../images/Stone_Lawrence-face-c.webp);}
	.int-hero.has-photo .int-right{width:100% !important;max-width:none !important;margin:0 !important;}

	/* --- Buttons: right-sized, side by side, not screaming --- */
	.wp-block-buttons .wp-block-button{width:auto;}
	.wp-block-buttons .wp-block-button__link{width:auto;text-align:center;}
	.has-hero .wp-block-buttons,
	.int-hero .wp-block-buttons{display:flex;flex-wrap:wrap;gap:.6rem;}
	.has-hero .wp-block-button__link,
	.int-hero .wp-block-button__link{font-size:.95rem;padding:.62em 1.15em;}

	/* --- IG pill: compact chip, not a banner --- */
	.ig-follow{
		display:inline-flex;width:auto;gap:8px;margin-top:1.1rem;
		padding:5px 6px 5px 11px;
		box-shadow:0 4px 14px rgba(221,42,123,.38);
	}
	.ig-follow-glyph svg{width:18px;height:18px;}
	.ig-follow-meta{font-size:.78rem;}
	.ig-follow-meta .ig-count{font-size:.92rem;margin-right:.25em;}
	.ig-follow-cta{padding:4px 10px;font-size:.68rem;}

	/* --- Save Contact FAB: compact pill bottom-right, not a full bar --- */
	.save-contact-fab{
		left:auto;right:14px;bottom:14px;justify-content:flex-start;
		font-size:.9rem;padding:.6em 1.05em;
	}
}

/* =====================================================================
   v0.3.4 — kill the white gap above the hero
   WP core adds block-gap margin between wp-site-blocks children; the
   fixed header occupies no flow height, so body bg (white) showed
   through above <main>. Zero it out and paint the shell black so any
   future sliver can never flash white.
   ===================================================================== */
.wp-site-blocks{padding-top:0;}
.wp-site-blocks > *{margin-block-start:0 !important;}
html,body{background:var(--wp--preset--color--black);}

/* =====================================================================
   v0.3.5 — mobile round 2 (Stone's phone review #2)
   ===================================================================== */
@media (max-width:820px){
	/* Header at rest: TRANSPARENT, no logo — just phone + hamburger right.
	   On scroll: black banner appears WITH the logo, padded off the edge. */
	.site-header > .wp-block-group{padding-inline:16px;}
	.site-header .site-logo-link{display:none;}
	.site-header.is-scrolled .site-logo-link,
	.site-header.no-hero .site-logo-link{display:inline-flex;}
	.site-header.is-scrolled,
	.site-header.no-hero{background:var(--wp--preset--color--black);border-bottom-color:var(--wp--preset--color--red);}

	/* Hamburger overlay: black panel, white links, red on tap/hover. */
	.site-header .wp-block-navigation__responsive-container.is-menu-open{
		background:var(--wp--preset--color--black) !important;color:#fff;
		padding-top:64px;
	}
	.site-header .wp-block-navigation__responsive-container.is-menu-open a,
	.site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content{
		color:#fff !important;text-shadow:none;font-size:1.35rem;
	}
	.site-header .wp-block-navigation__responsive-container.is-menu-open a:hover,
	.site-header .wp-block-navigation__responsive-container.is-menu-open a:active,
	.site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content:hover{
		color:var(--wp--preset--color--red) !important;
	}
	.site-header .wp-block-navigation__responsive-container-close{color:#fff;}
	.site-header .wp-block-navigation__responsive-container-close svg{width:26px;height:26px;}
}

@media (max-width:600px){
	/* v0.7.4: ordering + kicker spacing/size now owned by the single
	   .hero-inner order block above (avoids two same-specificity
	   .hero-inner .X{order:...} rules fighting across media-query blocks). */
	.hero-inner .ig-follow{align-self:flex-start;}

	/* Kill click-to-call button; one strong Book An Estimate CTA. */
	.has-hero .wp-block-button.is-style-outline{display:none;}
	.has-hero .wp-block-buttons .wp-block-button{width:100%;}
	.has-hero .wp-block-buttons .wp-block-button__link{
		width:100%;font-size:1.15rem;padding:.9em 1.2em;
	}

	/* Save Contact: centered pill. */
	.save-contact-fab{
		left:0;right:0;margin-inline:auto;width:max-content;
		justify-content:center;
	}
}

/* v0.3.5 hotfix: v0.3.4 painted body black (to kill the top band), which
   un-backgrounded every plain content section. Content default = white on
   <main>; dark/red/concrete sections all declare their own backgrounds. */
main.wp-block-group{background:#fff;}

/* =====================================================================
   v0.3.6 — phone icon hugs the hamburger, both right-justified.
   The nav block was stretching, parking the phone mid-header; stop it
   from growing so phone + hamburger sit together on the right.
   ===================================================================== */
@media (max-width:820px){
	.site-header .wp-block-navigation{flex:0 0 auto;width:auto;}
	.site-header .wp-block-navigation__responsive-container-open{margin-left:0;}
	.header-phone{margin-left:auto;margin-right:12px;}
}

/* =====================================================================
   v0.4.0 — UI upgrade round (Stone 2026-07-07 evening)
   1. Map: normal light state map, covered counties red, BIG state labels
   2. Mobile gutters: no text/cells bleeding to the screen edge
   3. Hero paragraphs moved to the white sections (prose-intro lead style)
   ===================================================================== */

/* ---- 1. Light map ---- */
.area-mapwrap{
	background:#f7f7f4;border:1px solid #e2e2dc;
	box-shadow:0 10px 30px rgba(17,20,24,.10);
}
#ifix-area-map .st{fill:#e9e9e3;stroke:#cfcfc7;stroke-width:.75;}
#ifix-area-map .stateline{stroke:#9a9a92;stroke-width:1.4;}
#ifix-area-map .c{fill:var(--wp--preset--color--red);stroke:#fff;stroke-width:.7;}
#ifix-area-map .c:hover,#ifix-area-map .c:focus{fill:var(--wp--preset--color--red-dark);}
#ifix-area-map .lbl text{
	font-size:26px;fill:#3c4148;letter-spacing:.12em;
	paint-order:stroke;stroke:#f7f7f4;stroke-width:4px;
}
#ifix-area-map .lbl .sub{font-size:14px;fill:#5B6168;}

/* ---- 2. Mobile gutters (nothing bleeds to the edge) ---- */
@media (max-width:820px){
	.int-hero,
	.section-pad,
	.area-map-section{padding-inline:20px;}
	.hero-inner{padding-inline:20px !important;}
	.final-cta{padding-inline:20px;}
}

/* ---- 3. Lead paragraph in the white content area ---- */
.prose .prose-intro{
	font-size:1.18rem;line-height:1.7;color:#1e2329;
	border-left:4px solid var(--wp--preset--color--red);
	padding-left:1.1rem;margin:0 0 1.6rem;
}
.area-intro{
	max-width:760px;margin:0 auto 2rem;font-size:1.15rem;line-height:1.65;
	border-left:4px solid var(--wp--preset--color--red);padding-left:1.1rem;
}
/* Tighter hero now that the paragraph moved out */
.int-hero{padding-block:calc(var(--wp--preset--spacing--70) + 3.5rem) calc(var(--wp--preset--spacing--70) - 1rem);}
.int-hero h1{margin-bottom:.9rem;}

/* =====================================================================
   v0.4.1 — phone icon truly right (WP flex containers emit a
   `> * { margin: 0 }` reset that beat the auto margin) + bigger
   Save Contact on mobile (Stone).
   ===================================================================== */
@media (max-width:820px){
	.site-header .header-phone{margin-left:auto !important;margin-right:12px !important;}
}
@media (max-width:600px){
	.save-contact-fab{font-size:1.08rem;padding:.8em 1.5em;gap:.6em;}
	.save-contact-fab svg{width:1.25em;height:1.25em;}
	/* Mobile bar version doesn't collapse — keep the label visible even
	   once .fab-mini is toggled on. */
	.save-contact-fab.fab-mini{padding:.8em 1.5em;}
	.save-contact-fab.fab-mini .fab-label{display:inline;}
}

/* =====================================================================
   v0.4.2 — photo headers, card rollovers, nav submenu, hamburger, CTAs
   ===================================================================== */

/* ---- 3-line hamburger ---- */
.site-header .wp-block-navigation__responsive-container-open svg{display:none;}
.site-header .wp-block-navigation__responsive-container-open::before{
	content:"";display:block;width:26px;height:19px;
	border-top:3px solid #fff;border-bottom:3px solid #fff;
	background:linear-gradient(#fff,#fff) center/100% 3px no-repeat;
}

/* ---- Nav: Services dropdown (desktop) + indented sub pages (overlay) ---- */
.site-header .wp-block-navigation .wp-block-navigation__submenu-container{
	background:var(--wp--preset--color--black);border:1px solid #272C33;
	border-radius:8px;padding:.35rem 0;min-width:260px;
}
.site-header .wp-block-navigation .wp-block-navigation__submenu-container a{
	font-size:.95rem;padding:.5rem 1rem;
}
.site-header .wp-block-navigation-submenu__toggle,
.site-header .wp-block-navigation .wp-block-navigation-submenu__toggle svg{color:#fff;}
.site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container{
	background:transparent;border:0;padding:.2rem 0 .2rem 1.2rem;min-width:0;
}
.site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container a{
	font-size:1.05rem;opacity:.92;
}
/* Belt & suspenders: the overlay is ALWAYS black, sitewide. */
body .site-header .wp-block-navigation__responsive-container.is-menu-open{
	background:var(--wp--preset--color--black) !important;
}

/* ---- Subpage photo heroes (text left, dark scrim on the left) ---- */
.int-hero.has-photo.scrim-left::after{
	background:linear-gradient(90deg,rgba(17,20,24,.85) 0%,rgba(17,20,24,.6) 46%,rgba(17,20,24,.18) 100%);
}
/* These heroes put kicker + h1 + button as DIRECT children, so the parent's
   `display:flex` (used to vertically center .int-right photo heroes) was laying
   them out in a horizontal ROW. Force a vertical stack, left-aligned. The
   .int-hero--services hero uses an .int-right wrapper and has no .scrim-left,
   so it is unaffected. (Fix: 2026-07-12, Stone — "estimate button and pink
   locations should be stacked, not in a line".) */
.int-hero.has-photo.scrim-left{
	flex-direction:column;
	align-items:flex-start;
	justify-content:center;
}
.int-hero--agents{background-image:url(../images/hero-agents.webp?v=46);}
.int-hero--about{background-image:url(../images/Stone_Lawrence-hero-desktop.webp);}
/* About page: certification checklist + inline connect links. */
.prose ul.cert-list{list-style:none;padding-left:0;margin:1rem 0 0;}
.prose ul.cert-list li{position:relative;padding-left:2rem;margin:.55rem 0;font-weight:600;}
.prose ul.cert-list li::before{content:"";position:absolute;left:0;top:.1em;width:1.25rem;height:1.25rem;
	background:var(--wp--preset--color--red);border-radius:50%;
	-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='white' d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/%3E%3C/svg%3E") center/78% no-repeat;
	mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='white' d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/%3E%3C/svg%3E") center/78% no-repeat;}
.about-links{text-align:center;margin-top:1.1rem;color:var(--wp--preset--color--steel);font-size:.98rem;}
.about-links a{color:var(--wp--preset--color--red);text-decoration:none;font-weight:600;}
.about-links a:hover{text-decoration:underline;}
/* Footer trust seals (Stone's own guarantees). */
.footer-seals{display:flex;justify-content:center;gap:2.75rem;flex-wrap:wrap;
	margin:.5rem 0 1.4rem;padding-top:1.7rem;border-top:1px solid rgba(255,255,255,.12);}
.footer-seals .seal{display:flex;align-items:center;gap:.9rem;text-decoration:none;border-radius:10px;transition:transform .15s ease;}
a.seal:hover{transform:translateY(-2px);}
a.seal:hover .seal-text strong{color:var(--wp--preset--color--red);}
.footer-seals .seal-badge{flex:0 0 auto;width:56px;height:56px;color:var(--wp--preset--color--red);}
.footer-seals .seal-badge svg{width:100%;height:100%;display:block;}
.footer-seals .seal-text{display:flex;flex-direction:column;line-height:1.22;}
.footer-seals .seal-text strong{font-family:var(--wp--preset--font-family--display);font-weight:800;
	font-size:1.02rem;color:#fff;text-transform:uppercase;letter-spacing:.02em;}
.footer-seals .seal-text span{font-size:.83rem;color:var(--wp--preset--color--steel);}
@media (max-width:600px){.footer-seals{gap:1.5rem;}.footer-seals .seal{flex:1 1 100%;justify-content:center;}}
.int-hero--waterproofing{background-image:url(../images/hero-waterproofing.webp?v=46);}
.int-hero--foundation{background-image:url(../images/hero-foundation.webp?v=46);}
.int-hero--crawl{background-image:url(../images/hero-crawl.webp?v=46);}

/* ---- Homepage service cards: hover swaps copy for the condition photo ---- */
.svc-flip{position:relative;overflow:hidden;}
.svc-flip::before{
	content:"";position:absolute;inset:0;z-index:1;opacity:0;
	background-image:var(--card-photo,none);background-size:cover;background-position:center;
	transition:opacity .3s ease;
}
.card-waterproofing{--card-photo:url(../images/hero-waterproofing.webp?v=46);}
.card-foundation{--card-photo:url(../images/hero-foundation.webp?v=46);}
.card-crawl{--card-photo:url(../images/hero-crawl.webp?v=46);}

/* ---- Bigger white CTA on the red band (desktop AND mobile) ---- */
.final-cta .wp-block-button__link{font-size:1.35rem;padding:1em 2.4em;font-weight:700;}

/* ---- Mobile: kill the black gap above photo heroes; fix H2 Shield hero ---- */
@media (max-width:600px){
	.int-hero.has-photo{padding-top:0 !important;padding-inline:0 !important;}
	.int-hero.has-photo .int-kicker,
	.int-hero.has-photo h1,
	.int-hero.has-photo .wp-block-buttons,
	.int-hero.has-photo .int-right{padding-inline:20px;}
	.lp-hero{padding-top:5.5rem;padding-bottom:2rem;}
	.final-cta .wp-block-button__link{font-size:1.2rem;padding:.95em 1.6em;}
}

/* ---- v0.4.2b: card behavior per Stone — DEFAULT photo + headline,
   HOVER white card w/ copy (no image), CLICK -> service page.
   No photo yet = dark card, same hover. ---- */
.svc-flip{
	display:flex;flex-direction:column;justify-content:flex-end;
	min-height:250px;text-decoration:none;
	background:var(--wp--preset--color--black);
	transition:background .3s ease;
}
.svc-flip::before{opacity:1;}
.svc-flip::after{
	content:"";position:absolute;inset:0;z-index:1;
	background:linear-gradient(180deg,rgba(17,20,24,0) 40%,rgba(17,20,24,.86) 100%);
	transition:opacity .3s ease;
}
.svc-flip :is(h3,p,.card-cta){position:relative;z-index:2;}
.svc-flip h3{color:#fff;opacity:1;margin:0;font-size:1.45rem;transition:color .25s ease;}
.svc-flip p{opacity:0;color:#2c3138;margin:.5rem 0 0;transition:opacity .25s ease;}
.svc-flip .card-cta{
	opacity:0;margin-top:.8rem;font-family:var(--wp--preset--font-family--display);
	font-weight:700;text-transform:uppercase;letter-spacing:.05em;font-size:.9rem;
	color:var(--wp--preset--color--red-dark);transition:opacity .25s ease;
}
.svc-flip:hover,.svc-flip:focus-visible{background:#fff;}
.svc-flip:hover::before,.svc-flip:focus-visible::before,
.svc-flip:hover::after,.svc-flip:focus-visible::after{opacity:0;}
.svc-flip:hover h3,.svc-flip:focus-visible h3{color:var(--wp--preset--color--black);}
.svc-flip:hover :is(p,.card-cta),.svc-flip:focus-visible :is(p,.card-cta){opacity:1;}
.svc-flip.is-dark:hover :is(h3,p){color:var(--wp--preset--color--black);}

/* svc-flip base (anchor cards) */
.svc-flip{border-top:4px solid var(--wp--preset--color--red);border-radius:10px;
	padding:1.6rem;box-shadow:0 2px 12px rgba(0,0,0,.12);height:100%;}

/* v0.4.4 — card titles top-justified */
.svc-flip{justify-content:flex-start;}
.svc-flip p,.svc-flip .card-cta{margin-top:.6rem;}

/* v0.4.5 — H2 Shield card gets its photo; uniform card alignment */
.card-h2shield{--card-photo:url(../images/hero-h2shield.webp);}
.svc-flip.is-dark{background:var(--wp--preset--color--black);}

/* v0.4.7 — titles are top-aligned, so the readability scrim goes on TOP */
.svc-flip::after{
	background:linear-gradient(180deg,rgba(17,20,24,.82) 0%,rgba(17,20,24,.35) 45%,rgba(17,20,24,0) 75%);
}
