/* Canonical ClrWtrCo palette shared by all secondary pages. */
:root {
 --bg: #fff; --surface: #f8fafc; --surface-strong: #fff; --line: #e2e8f0;
 --text: #0f252c; --ink: #0f252c; --muted: #475569;
 --accent-deep: #0e7490; --accent-dark: #075f72; --accent-hover: #075f72;
 --hw-navy: #071920; --hw-navy-mid: #0c232d; --hw-brand: #0e7490;
 --hw-brand-dark: #075f72; --hw-aqua: #bfeef6; --hw-aqua-soft: #e6f6f9;
 --hw-sand: #f8fafc; --hw-body: #475569; --hw-line: #e2e8f0;
}
body { background: #fff; color: #0f252c; }
body::before, body::after, .page-shell::before, .page-shell::after { background: none; }
.site-header { background: rgba(7,25,32,.97); border-bottom-color: rgba(191,238,246,.14); color: #f0fdfa; }
.site-header .brand, .site-header .brand-lockup { color: #f0fdfa; }
.site-header .brand-mark { background: #e0f7fa; color: #075f72; }
.site-header .brand-mark svg { stroke: #075f72; }
.site-header .contact-phone, .site-header .header-phone, .site-header .header-cta,
.site-header .btn-header-call { color: #bfeef6; }
.site-header .contact-phone { background: #0c232d; border-color: rgba(191,238,246,.2); }
.site-header .btn-secondary { background: #112d38; color: #f0fdfa; border-color: rgba(191,238,246,.3); }
.site-header .header-actions > a:not([class]) { color: #bfeef6; }
.announcement-bar { background: #075f72; color: #fff; }
.hero, .hero-section, .blog-hero {
 --text: #f0fdfa; --ink: #f0fdfa; --muted: #cbd5e1;
 background: #071920; color: #f0fdfa;
}
.hero h1, .hero-section h1, .blog-hero h1 { color: #f0fdfa; font-family: var(--sans, 'Poppins', sans-serif); font-weight: 700; }
.hero h1 em, .hero-section h1 em { color: #bfeef6; }
.hero .eyebrow, .hero-section .eyebrow, .blog-hero .eyebrow { color: #bfeef6; border-color: rgba(191,238,246,.3); background: #112d38; }
.hero .hero-benefits li::before, .hero .breadcrumb a { color: #bfeef6; }
.hero :is(.panel,.form-panel,.form-card,.lookup-card,.value-stack-card),
.hero-section :is(.panel,.form-panel,.form-card,.lookup-card,.value-stack-card) {
 --text: #0f252c; --ink: #0f252c; --muted: #475569;
 background: #fff; color: #0f252c;
}
.hero-copy .aeo-extraction-block { background: #0c232d; color: #e2f3f6; border-left-color: #0891b2; }
.hero-copy .trust-pill { background: #112d38; color: #d0dde3; border-color: rgba(191,238,246,.2); }
.btn-primary, .lookup-btn, .btn-submit, .submit-btn { background: linear-gradient(135deg,#0891b2,#0e7490); color: #fff; }
.btn-primary:hover, .lookup-btn:hover, .btn-submit:hover, .submit-btn:hover { background: #0e7490; }
.section { background-color: #fff; }
.section.alt, .section:nth-of-type(even), .stage-card { background-color: #f8fafc; }
.blog-hero { padding: 3rem 1.5rem; margin-top: 2rem; border-radius: 20px; }
.post-header { background: #071920; padding: 1.5rem; border-radius: 20px; }
.post-header .post-title { color: #f0fdfa; }
.post-header .post-meta { color: #cbd5e1; }
.post-header .post-category { background: #112d38; color: #bfeef6; }
.site-footer { --text: #f0fdfa; --muted: #cbd5e1; background: #071920; color: #cbd5e1; border-top-color: rgba(191,238,246,.14); }
.site-footer :is(h2,h3,h4,strong) { color: #f0fdfa; }
.site-footer a { color: #bfeef6; }
.site-footer .brand-mark { background: #e0f7fa; }
:focus-visible { outline: 3px solid #0891b2; outline-offset: 4px; }
/* Interactive tools retain their layout while sharing the brand palette. */
body[data-brand-tool] {
 --bg-primary: #071920; --bg-secondary: #0c232d;
 --accent-cyan: #bfeef6; --accent-teal: #0891b2;
 --text-primary: #f0fdfa; --text-secondary: #cbd5e1;
 --bg1: #071920; --bg2: #0c232d; --accent: #0891b2; --accent2: #bfeef6;
 --text: #f0fdfa; --muted: #cbd5e1;
 background: #071920; color: #f0fdfa;
}

.site-header .header-cta { background: #0c232d; border-color: rgba(191,238,246,.2); }
.hero .btn-secondary, .hero-section .btn-secondary { background: #112d38; color: #f0fdfa; border-color: rgba(191,238,246,.3); }
.hero-section .offer-panel { background: transparent; color: #f0fdfa; }

/* Campaign accents also use the common teal, with semantic alerts retained. */
:root { --accent-warm: #0e7490; }
.promo-badge { background: #0e7490; animation: none; }
.btn-primary, .btn-primary:hover { box-shadow: 0 8px 20px rgba(8,145,178,.2); }
.site-header a[href^="tel:"] { color: #bfeef6 !important; }
.hero-section .scarcity-meter { --text: #0f252c; --muted: #475569; color: #0f252c; }
.hero > .wrap > div[style*="color: #47656f"] { color: #cbd5e1 !important; }

.site-footer { background: #071920 !important; }
.site-footer p, .site-footer .footer-bottom { color: #cbd5e1 !important; }
.site-footer a { color: #bfeef6 !important; }

/* One canonical outlined droplet and circular badge across the site. */
.brand-mark {
 background: linear-gradient(180deg, #fff, #bfeef6) !important;
 border: 1px solid rgba(255,255,255,.8) !important;
 flex-shrink: 0;
}
.brand-mark svg, .brand-lockup > svg {
 width: 1.25rem; height: 1.25rem;
 fill: none !important; stroke: #072e38 !important;
 stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round;
}
.brand-lockup > svg { stroke: #072e38 !important; background: linear-gradient(180deg, #fff, #bfeef6); border-radius: 50%; padding: .6rem; box-sizing: content-box; flex-shrink: 0; }

body[data-brand-tool] .logo > svg { width: 1.25rem; height: 1.25rem; fill: none; stroke: #072e38; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }