/* =====================================================================
   H2 Shield — LIGHT WATER TEMPLATE (loads only on /h2-shield/)
   ---------------------------------------------------------------------
   Stone-approved alternate design (2026-07-11): light + water-centric,
   distinct from the site's red/black system. iFixBasements is the brand
   (standard header/footer, restyled light here); H2 Shield is the product.
   Palette picked up from h2shield.com: deep water navy, aqua, gold badges.
   TWO instances of the same lead form: hero "contact" + guide form.
   ===================================================================== */

body.h2w-page{
	--h2w-navy:#0A2E4E;
	--h2w-navy-2:#0D3A61;
	--h2w-ocean:#0E6BA8;
	--h2w-aqua:#17A2D6;
	--h2w-sky:#BEE3F5;
	--h2w-ice:#EAF6FC;
	--h2w-foam:#F7FBFE;
	--h2w-gold:#C7A12C;
	--h2w-text:#20364A;
	--h2w-muted:#5A7186;
	--h2w-line:#D9EAF4;
	color:var(--h2w-text);
}
body.h2w-page main{background:#fff;}

/* ---- Light header override (shared header part, this page only) ----
   Beats app.css's transparent/black header states incl. its !importants. */
body.h2w-page .site-header,
body.h2w-page .site-header.is-scrolled,
body.h2w-page .site-header.no-hero{
	background:rgba(255,255,255,.94);
	border-bottom-color:var(--h2w-aqua);
	box-shadow:0 2px 14px rgba(10,46,78,.08);
}
body.h2w-page .site-header .site-logo-img{
	content:url("../images/logo-dark-3.svg");
	filter:none;
}
body.h2w-page .site-header .wp-block-navigation a,
body.h2w-page .site-header .wp-block-navigation .wp-block-navigation-item__content,
body.h2w-page .site-header .wp-block-navigation .wp-block-navigation-item__content:link,
body.h2w-page .site-header .wp-block-navigation .wp-block-navigation-item__content:visited{
	color:var(--h2w-navy) !important;text-shadow:none;
}
body.h2w-page .site-header .wp-block-navigation a:hover,
body.h2w-page .site-header .wp-block-navigation .wp-block-navigation-item__content:hover{
	color:var(--h2w-aqua) !important;
}
/* Dropdown panel keeps the theme's dark card — its items must stay WHITE on
   the light H2 Shield header (navy-on-dark was invisible until hover). These
   come AFTER the navy rules and match their specificity + !important. */
body.h2w-page .site-header .wp-block-navigation .wp-block-navigation__submenu-container a,
body.h2w-page .site-header .wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content,
body.h2w-page .site-header .wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content:link,
body.h2w-page .site-header .wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content:visited{
	color:#fff !important;
}
body.h2w-page .site-header .wp-block-navigation .wp-block-navigation__submenu-container a:hover,
body.h2w-page .site-header .wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover{
	color:var(--h2w-aqua) !important;
}

/* The header's "Book An Estimate" BUTTON lives inside the navigation block —
   the navy nav-text rules above were painting its letters navy on red.
   Buttons keep white text everywhere, light page included. */
body.h2w-page .site-header .wp-block-navigation .wp-block-button__link,
body.h2w-page .site-header .wp-block-navigation .wp-block-button__link:link,
body.h2w-page .site-header .wp-block-navigation .wp-block-button__link:visited{
	color:#fff !important;
}

/* Hamburger icon dark on light header */
body.h2w-page .site-header .wp-block-navigation__responsive-container-open{color:var(--h2w-navy);}

/* ---- Page headings: navy, not the global uppercase red/black look ---- */
body.h2w-page main :is(h1,h2,h3){color:var(--h2w-navy);}
.h2w-eyebrow{
	font-family:var(--wp--preset--font-family--display);font-weight:700;
	letter-spacing:.18em;text-transform:uppercase;font-size:.8rem;color:var(--h2w-aqua);margin:0;
}
.h2w-eyebrow.is-gold{color:var(--h2w-gold);}

/* =====================  HERO: offers + contact form  ===================== */
.h2w-hero{
	position:relative;
	/* v0.7.1 (Stone: "needs a hero header w image"): the faucet photo was
	   buried under a ~95% white veil. Text side stays frosted for
	   legibility; the right side now SHOWS the glass-at-the-tap shot. */
	background:
		linear-gradient(90deg,rgba(247,251,254,.985) 0%,rgba(247,251,254,.97) 46%,rgba(240,249,253,.72) 60%,rgba(234,246,252,.30) 78%,rgba(234,246,252,.12) 100%),
		url("../images/hero-h2shield.webp?v=50") right center/cover no-repeat,
		var(--h2w-ice);
	padding-block:calc(var(--wp--preset--spacing--70) + 3.5rem) var(--wp--preset--spacing--70);
}
@media (max-width:700px){
	/* Stacked mobile hero: photo band on top, copy below on ice. */
	.h2w-hero{background:var(--h2w-ice);padding-block-start:0;}
	.h2w-hero::before{
		content:"";display:block;width:100%;aspect-ratio:16/10;
		background:url("../images/hero-h2shield.webp?v=50") center/cover no-repeat;
		margin-bottom:1.4rem;
	}
}
.h2w-hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:3rem;align-items:start;}
.h2w-kicker{
	display:inline-block;background:#fff;border:1px solid var(--h2w-line);border-radius:50px;
	padding:.35em 1em;font-family:var(--wp--preset--font-family--display);font-weight:700;
	font-size:.85rem;letter-spacing:.1em;text-transform:uppercase;color:var(--h2w-ocean);
	box-shadow:0 2px 10px rgba(10,46,78,.06);margin:0 0 1rem;
}
.h2w-hero h1{font-size:clamp(2.1rem,4.4vw,3.2rem);text-transform:none;line-height:1.12;margin:0 0 .5rem;}
.h2w-hero h1 em{font-style:normal;color:var(--h2w-aqua);}
.h2w-hero .h2w-sub{font-size:1.15rem;color:var(--h2w-muted);max-width:52ch;margin:0 0 1.6rem;}

.h2w-offers{display:grid;grid-template-columns:1fr 1fr;gap:1rem;}
.h2w-offer{
	background:#fff;border:1px solid var(--h2w-line);border-radius:16px;padding:1.35rem 1.4rem;
	box-shadow:0 10px 30px rgba(10,46,78,.07);position:relative;
}
.h2w-offer .oicon{
	width:44px;height:44px;border-radius:12px;display:grid;place-items:center;
	background:linear-gradient(135deg,var(--h2w-aqua),var(--h2w-ocean));margin-bottom:.8rem;
}
.h2w-offer .oicon svg{width:24px;height:24px;}
.h2w-offer h3{margin:0 0 .3rem;font-size:1.18rem;text-transform:none;}
.h2w-offer p{margin:0;font-size:.95rem;color:var(--h2w-muted);line-height:1.5;}
.h2w-offer .tag{
	position:absolute;top:1.1rem;right:1.1rem;font-family:var(--wp--preset--font-family--display);
	font-weight:700;font-size:.66rem;letter-spacing:.08em;text-transform:uppercase;
	color:var(--h2w-ocean);background:var(--h2w-ice);border-radius:4px;padding:3px 8px;
}
.h2w-hero-proof{display:flex;gap:1.6rem;flex-wrap:wrap;margin-top:1.6rem;font-size:.88rem;color:var(--h2w-muted);}
.h2w-hero-proof span{display:inline-flex;align-items:center;gap:.45rem;}
.h2w-hero-proof svg{width:1.05rem;height:1.05rem;flex:0 0 auto;}

/* ---- Form cards (both instances) ---- */
.h2w-form-card{
	background:#fff;border:1px solid var(--h2w-line);border-radius:18px;
	box-shadow:0 24px 60px rgba(10,46,78,.14);padding:1.8rem 1.8rem 1.6rem;
}
.h2w-form-card .fc-label{
	font-family:var(--wp--preset--font-family--display);font-weight:700;letter-spacing:.12em;
	text-transform:uppercase;font-size:.72rem;color:var(--h2w-aqua);margin:0;
}
.h2w-form-card .fc-label.is-gold{color:var(--h2w-gold);}
.h2w-form-card h3{margin:.25rem 0;font-size:1.45rem;text-transform:none;color:var(--h2w-navy) !important;}
.h2w-form-card .fc-desc{color:var(--h2w-muted);font-size:.95rem;margin:0 0 1.2rem;}
.h2w-form-card.is-guide{border-top:5px solid var(--h2w-gold);}
/* Hero "water form": same deep-water navy as the Buyer's Guide section
   (Stone, 2026-07-13 — "needs to use the blue background like the buyers
   guide form"). Card goes navy, text flips white, inputs stay light. */
#water-form{
	background:linear-gradient(160deg,var(--h2w-navy) 0%,var(--h2w-navy-2) 60%,#0F4A79 100%);
	border:1px solid rgba(255,255,255,.14);
	box-shadow:0 24px 50px rgba(10,46,78,.35);
}
#water-form .fc-label{color:var(--h2w-aqua);}
#water-form h3{color:#fff !important;}
#water-form .fc-desc{color:#CFE5F2;}
#water-form .lp-form label{color:#fff;}
#water-form .lp-consent{color:#B9D2E2;}
#water-form .lp-consent input{accent-color:var(--h2w-aqua);}
#water-form .lp-form-status{color:#CFE5F2;}

/* Form fields — override app.css .lp-form red theme with water blue */
.h2w-form-card .lp-form{display:grid;gap:.85rem;}
.h2w-form-card .lp-form .row-2{display:grid;grid-template-columns:1fr 1fr;gap:.85rem;}
.h2w-form-card .lp-form label{display:block;font-size:.8rem;font-weight:600;color:var(--h2w-navy);margin-bottom:.28rem;}
.h2w-form-card .lp-form input[type="text"],
.h2w-form-card .lp-form input[type="email"],
.h2w-form-card .lp-form input[type="tel"],
.h2w-form-card .lp-form select{
	width:100%;padding:.75rem .85rem;border:1.5px solid var(--h2w-line);border-radius:10px;
	font-size:1rem;font-family:var(--wp--preset--font-family--body);background:var(--h2w-foam);
	color:var(--h2w-text);transition:border-color .15s,box-shadow .15s;
}
.h2w-form-card .lp-form input:focus,
.h2w-form-card .lp-form select:focus{
	outline:none;border-color:var(--h2w-aqua);background:#fff;box-shadow:0 0 0 3px rgba(23,162,214,.16);
}
.h2w-form-card .lp-consent{color:var(--h2w-muted);font-size:.78rem;}
.h2w-form-card .lp-consent input{accent-color:var(--h2w-aqua);}
/* !important needed: app.css sets .lp-form .submit-btn background red !important */
.h2w-form-card .submit-btn{
	width:100%;cursor:pointer;border:0;border-radius:10px;
	background:linear-gradient(135deg,var(--h2w-aqua),var(--h2w-ocean)) !important;color:#fff !important;
	font-family:var(--wp--preset--font-family--display);font-weight:700;letter-spacing:.03em;
	font-size:1.05rem;padding:.95rem 1.2rem;transition:filter .15s;
	box-shadow:0 10px 24px rgba(14,107,168,.3);text-transform:none;
}
.h2w-form-card .submit-btn:hover{filter:brightness(1.07);}
.h2w-form-card .submit-btn:disabled{opacity:.65;cursor:wait;}
.h2w-form-card .submit-btn.is-gold{
	background:linear-gradient(135deg,#D9B33A,var(--h2w-gold)) !important;color:var(--h2w-navy) !important;
	box-shadow:0 10px 24px rgba(0,0,0,.22);
}
.h2w-form-card .lp-form-status{color:var(--h2w-muted);}
.h2w-form-card .lp-form-status.is-error{color:#B4232A;font-weight:600;}
.h2w-form-card .fine{font-size:.8rem;color:var(--h2w-muted);text-align:center;margin:.8rem 0 0;}

/* Success panel (JS swaps card content for this) */
.h2w-success{text-align:center;padding:1.6rem .4rem;}
.h2w-success h3{font-size:1.6rem;margin:0 0 .5rem;text-transform:none;color:var(--h2w-navy) !important;}
.h2w-success p{color:var(--h2w-muted);margin:0 auto;max-width:40ch;}

/* =====================  Gold trust strip  ===================== */
.h2w-trust{background:var(--h2w-navy);}
.h2w-trust-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.2rem;padding-block:1.4rem;}
.h2w-trust .t{
	display:flex;align-items:center;gap:.7rem;font-family:var(--wp--preset--font-family--display);
	font-weight:600;font-size:.88rem;line-height:1.3;color:#DCEBF7;
}
.h2w-trust .t b{color:var(--h2w-gold);display:block;font-size:.95rem;}
.h2w-trust svg{width:30px;height:30px;flex:0 0 auto;}

/* =====================  Systems  ===================== */
.h2w-systems{background:#fff;}
.h2w-sys-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.6rem;margin-top:2.4rem;}
.h2w-sys{
	border:1px solid var(--h2w-line);border-radius:20px;overflow:hidden;background:var(--h2w-foam);
	box-shadow:0 12px 34px rgba(10,46,78,.07);
}
.h2w-sys .sys-head{background:linear-gradient(135deg,var(--h2w-navy),var(--h2w-ocean));color:#fff;padding:1.5rem 1.7rem;}
.h2w-sys .sys-head .sh-kick{
	font-family:var(--wp--preset--font-family--display);font-weight:700;letter-spacing:.14em;
	text-transform:uppercase;font-size:.72rem;color:var(--h2w-sky);margin:0;
}
.h2w-sys .sys-head h3{color:#fff !important;margin:.25rem 0 0;font-size:1.5rem;text-transform:none;}
.h2w-sys .sys-body{padding:1.5rem 1.7rem 1.7rem;}
.h2w-sys ul{list-style:none;margin:0 0 1.3rem;padding:0;display:grid;gap:.65rem;}
.h2w-sys li{display:flex;gap:.6rem;align-items:flex-start;font-size:.98rem;}
.h2w-sys li::before{
	content:"";flex:0 0 auto;width:1.25rem;height:1.25rem;margin-top:.15rem;border-radius:50%;
	background:var(--h2w-aqua) 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/.8rem no-repeat;
}
.h2w-sys .sys-cta{
	display:inline-block;font-family:var(--wp--preset--font-family--display);font-weight:700;
	font-size:.95rem;color:#fff;background:var(--h2w-navy);border-radius:50px;padding:.6em 1.4em;text-transform:none;
}
.h2w-sys .sys-cta:hover{background:var(--h2w-ocean);color:#fff;}
.h2w-sys .fit{font-size:.85rem;color:var(--h2w-muted);margin:.9rem 0 0;}
.h2w-sys .fit b{color:var(--h2w-navy);}

/* =====================  What's in your water  ===================== */
.h2w-danger{background:var(--h2w-ice);}
.h2w-stat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem;margin-top:2.4rem;}
.h2w-stat{
	background:#fff;border:1px solid var(--h2w-line);border-radius:16px;padding:1.5rem 1.5rem 1.4rem;
	box-shadow:0 8px 22px rgba(10,46,78,.06);
}
.h2w-stat .num{
	font-family:var(--wp--preset--font-family--display);font-weight:800;font-size:2.2rem;
	color:var(--h2w-ocean);line-height:1;display:block;
}
.h2w-stat p{margin:.5rem 0 0;font-size:.95rem;color:var(--h2w-muted);}
.h2w-quote{
	max-width:760px;margin:2.6rem auto 0;text-align:center;font-size:1.12rem;font-style:italic;
	color:var(--h2w-navy);border-top:2px solid var(--h2w-sky);padding-top:1.6rem;
}
.h2w-quote small{display:block;font-style:normal;color:var(--h2w-muted);margin-top:.4rem;font-size:.82rem;}

/* =====================  Guide section (form #2)  ===================== */
.h2w-guide{
	background:linear-gradient(160deg,var(--h2w-navy) 0%,var(--h2w-navy-2) 60%,#0F4A79 100%);
	position:relative;overflow:hidden;
}
.h2w-guide::after{
	content:"";position:absolute;right:-140px;bottom:-160px;width:480px;height:480px;border-radius:50%;
	background:radial-gradient(circle,rgba(23,162,214,.28),transparent 65%);
}
.h2w-guide-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:3rem;align-items:center;position:relative;z-index:1;}
.h2w-guide h2{color:#fff !important;text-transform:none;}
.h2w-guide .gsub{color:#C6DCEE;max-width:50ch;}
.h2w-guide ul{list-style:none;margin:1.3rem 0 0;padding:0;display:grid;gap:.7rem;}
.h2w-guide li{display:flex;gap:.65rem;align-items:flex-start;font-size:.98rem;color:#E4F0F9;}
.h2w-guide li::before{
	content:"";flex:0 0 auto;width:1.25rem;height:1.25rem;margin-top:.15rem;border-radius:50%;
	background:var(--h2w-gold) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230A2E4E' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center/.8rem no-repeat;
}
.h2w-guide .h2w-form-card{border:none;box-shadow:0 30px 70px rgba(0,0,0,.4);}
/* Book mock */
.h2w-book{
	width:190px;height:258px;margin-top:2rem;border-radius:6px 14px 14px 6px;position:relative;
	background:linear-gradient(150deg,#F2FAFF 0%,#D9EFFB 100%);
	box-shadow:20px 26px 50px rgba(0,0,0,.45),0 0 0 1px rgba(255,255,255,.15);transform:rotate(-3deg);
}
.h2w-book::before{content:"";position:absolute;left:8px;top:0;bottom:0;width:3px;background:rgba(10,46,78,.18);}
.h2w-book .bk-band{position:absolute;top:26px;left:0;right:0;height:56px;background:var(--h2w-navy);display:grid;place-items:center;}
.h2w-book .bk-band span{
	font-family:var(--wp--preset--font-family--display);font-weight:800;color:#fff;font-size:.78rem;
	letter-spacing:.06em;text-transform:uppercase;text-align:center;line-height:1.3;padding-inline:14px;
}
.h2w-book .bk-title{
	position:absolute;top:96px;left:16px;right:16px;text-align:center;
	font-family:var(--wp--preset--font-family--display);font-weight:800;color:var(--h2w-navy);
	font-size:1.02rem;line-height:1.2;
}
.h2w-book .bk-free{
	position:absolute;top:8px;right:12px;background:var(--h2w-gold);color:var(--h2w-navy);
	font-family:var(--wp--preset--font-family--display);font-weight:800;font-size:.62rem;
	letter-spacing:.1em;border-radius:4px;padding:3px 9px;
}
.h2w-book .bk-drop{position:absolute;bottom:36px;left:50%;transform:translateX(-50%);width:48px;height:48px;}
.h2w-book .bk-foot{
	position:absolute;bottom:12px;left:0;right:0;text-align:center;
	font-family:var(--wp--preset--font-family--display);font-weight:600;font-size:.58rem;
	letter-spacing:.14em;text-transform:uppercase;color:var(--h2w-muted);
}

/* =====================  Cred (family photo + trust copy)  ===================== */
.h2w-cred{background:#fff;}
.h2w-cred-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:3rem;align-items:center;}
.h2w-cred img{
	width:100%;height:auto;border-radius:20px;display:block;
	box-shadow:0 24px 60px rgba(10,46,78,.18);
}
.h2w-cred .big{font-size:1.2rem;max-width:62ch;margin:1rem 0 0;}
.h2w-cred .who{margin-top:1.4rem;font-family:var(--wp--preset--font-family--display);font-weight:700;color:var(--h2w-navy);}
.h2w-cred .who small{display:block;font-weight:500;color:var(--h2w-muted);font-size:.85rem;margin-top:.15rem;}

.h2w-final{background:linear-gradient(135deg,var(--h2w-aqua) 0%,var(--h2w-ocean) 100%);text-align:center;}
.h2w-final h2{color:#fff !important;text-transform:none;}
.h2w-final p{color:#E2F3FB;max-width:56ch;margin-inline:auto;}
.h2w-final .fbtn{
	display:inline-block;margin:1.4rem .4rem 0;background:#fff;color:var(--h2w-ocean);
	font-family:var(--wp--preset--font-family--display);font-weight:800;font-size:1.1rem;
	border-radius:50px;padding:.9em 2em;box-shadow:0 14px 34px rgba(10,46,78,.25);text-transform:none;
}
.h2w-final .fbtn.ghost{background:transparent;color:#fff;border:2px solid rgba(255,255,255,.7);box-shadow:none;}
.h2w-final .fbtn.ghost:hover{background:rgba(255,255,255,.12);color:#fff;}
.h2w-final .fphone{
	display:block;margin-top:1.2rem;font-family:var(--wp--preset--font-family--display);
	font-weight:800;font-size:1.7rem;color:#fff;
}

/* Smooth scroll to anchors, clear of sticky header */
#water-form,#guide-form{scroll-margin-top:110px;}

/* =====================  Mobile  ===================== */
@media (max-width:960px){
	.h2w-hero-grid,.h2w-guide-grid,.h2w-cred-grid{grid-template-columns:1fr;gap:2.4rem;}
	.h2w-trust-grid{grid-template-columns:1fr 1fr;}
	.h2w-sys-grid,.h2w-stat-grid{grid-template-columns:1fr;}
	.h2w-hero{background:
		linear-gradient(180deg,rgba(247,251,254,.97) 0%,rgba(234,246,252,.9) 100%),
		url("../images/hero-h2shield.webp?v=50") center/cover no-repeat,var(--h2w-ice);}
}
@media (max-width:560px){
	.h2w-offers{grid-template-columns:1fr;}
	.h2w-form-card .lp-form .row-2{grid-template-columns:1fr;}
	.h2w-trust-grid{grid-template-columns:1fr;}
	.h2w-form-card{padding:1.4rem 1.2rem 1.4rem;}
}