/* Quad City Waterproofing — site styles
   Palette: river navy, rain-slicker yellow, pool aqua. Coral is reserved for emergency actions only. */
:root{
  --navy:#0A2540; --navy2:#12385F; --navy3:#1B4A78;
  --yellow:#FFCE1F; --yellow-d:#EDB900;
  --aqua:#19B5D6; --aqua-d:#0B7F9B; --tint:#DDF4FA;
  --coral:#FF5A3C; --coral-d:#E8421F;
  --chalk:#F4F8FA; --white:#fff;
  --text:#12263B; --muted:#4A5F73; --line:#CFDDE6; --field:#8CA6B8;
  --soil:#7A5230; --err:#B3261E;
  --font-d:'Bricolage Grotesque','Segoe UI',system-ui,sans-serif;
  --font-b:'Instrument Sans','Segoe UI',system-ui,sans-serif;
  --wrap:1180px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:96px;-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;font-family:var(--font-b);font-size:1.0625rem;line-height:1.6;color:var(--text);background:var(--chalk);-webkit-font-smoothing:antialiased}
img,svg{max-width:100%}
a{color:var(--navy);text-underline-offset:3px}
a:hover{color:var(--aqua-d)}
h1,h2,h3,h4{font-family:var(--font-d);color:var(--navy);margin:0 0 .5em;letter-spacing:-.015em}
h1{font-size:clamp(2.35rem,5.2vw,4rem);line-height:1.02;font-weight:800;letter-spacing:-.025em}
h2{font-size:clamp(1.75rem,3.2vw,2.6rem);line-height:1.1;font-weight:700}
h3{font-size:1.3rem;line-height:1.2;font-weight:700}
h4{font-size:1.05rem;font-weight:700}
p{margin:0 0 1em}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 24px}
.narrow{max-width:760px}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:12px;top:-60px;background:var(--yellow);color:var(--navy);padding:10px 16px;border-radius:8px;font-weight:700;z-index:100}
.skip:focus{top:12px}
:focus-visible{outline:3px solid var(--aqua);outline-offset:3px;border-radius:4px}
.on-dark :focus-visible,.band-navy :focus-visible{outline-color:var(--yellow)}
[hidden]{display:none!important}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5em;font-family:var(--font-b);font-weight:700;font-size:1rem;line-height:1;padding:.95em 1.5em;border-radius:999px;border:2px solid transparent;text-decoration:none;cursor:pointer;transition:background .15s,transform .1s,box-shadow .15s;min-height:48px}
.btn:active{transform:translateY(1px)}
.btn-primary{background:var(--yellow);color:var(--navy);border-color:var(--yellow)}
.btn-primary:hover{background:var(--yellow-d);border-color:var(--yellow-d);color:var(--navy)}
.btn-dark{background:var(--navy);color:#fff;border-color:var(--navy)}
.btn-dark:hover{background:var(--navy3);border-color:var(--navy3);color:#fff}
.btn-line{background:transparent;color:var(--navy);border-color:var(--navy)}
.btn-line:hover{background:var(--navy);color:#fff}
.btn-line-light{background:transparent;color:#fff;border-color:rgba(255,255,255,.6)}
.btn-line-light:hover{background:#fff;color:var(--navy)}
.btn-alert{background:var(--coral);color:var(--navy);border-color:var(--coral)}
.btn-alert:hover{background:var(--coral-d);border-color:var(--coral-d);color:var(--navy)}
.btn-lg{font-size:1.1rem;padding:1.05em 1.8em}
.btn-block{display:flex;width:100%}
.btn[disabled]{opacity:.55;cursor:not-allowed}

/* ---------- rain/flood alert bar ---------- */
.alertbar{background:var(--coral);color:var(--navy);font-weight:600;font-size:.95rem}
.alertbar .wrap{display:flex;gap:16px;align-items:center;justify-content:space-between;padding-top:10px;padding-bottom:10px}
.alertbar p{margin:0}
.alertbar a{color:var(--navy);font-weight:800}
.alertbar button{background:none;border:0;font:inherit;font-weight:700;color:var(--navy);cursor:pointer;text-decoration:underline;padding:6px}

/* ---------- header ---------- */
.site-header{background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:50}
.site-header .wrap{display:flex;align-items:center;gap:24px;height:76px}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--navy);font-family:var(--font-d);font-weight:800;font-size:1.2rem;letter-spacing:-.02em;line-height:1.05}
.logo:hover{color:var(--navy)}
.logo svg{flex:none}
.primary-nav{margin-left:auto}
.primary-nav ul{display:flex;gap:6px;list-style:none;margin:0;padding:0}
.primary-nav a{display:block;white-space:nowrap;padding:10px 12px;border-radius:999px;text-decoration:none;font-weight:600;font-size:.98rem;color:var(--navy)}
.primary-nav a:hover,.primary-nav a[aria-current="page"]{background:var(--tint);color:var(--navy)}
.header-actions{display:flex;align-items:center;gap:14px}
.header-phone{font-family:var(--font-d);font-weight:700;color:var(--navy);text-decoration:none;white-space:nowrap}
.nav-toggle{display:none;margin-left:auto;background:var(--tint);border:0;border-radius:999px;padding:10px 16px;font:inherit;font-weight:700;color:var(--navy);cursor:pointer}
@media (max-width:1340px){
  .header-phone{display:none}
  .primary-nav a{padding:10px 9px;font-size:.93rem}
}
@media (max-width:960px){
  .nav-toggle{display:block}
  .primary-nav{position:absolute;left:0;right:0;top:76px;background:#fff;border-bottom:1px solid var(--line);margin:0;display:none;padding:8px 24px 20px}
  .primary-nav.open{display:block}
  .primary-nav ul{flex-direction:column}
  .primary-nav a{padding:14px 12px;font-size:1.05rem}
  .header-actions .btn{display:none}
}

/* ---------- hero ---------- */
.hero{background:var(--navy);color:#fff;position:relative;padding:56px 0 120px;overflow:hidden}
.hero h1{color:#fff;max-width:16ch}
.hero .lede{font-size:1.2rem;color:#CFE0EE;max-width:34rem}
.hero-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.08fr);gap:48px;align-items:center}
.hero-wave{position:absolute;left:0;right:0;bottom:-1px;line-height:0;color:var(--chalk)}
.hero-wave svg{display:block;width:100%;height:70px}
.zip-check{margin-top:28px;max-width:30rem}
.zip-check label{display:block;font-weight:600;margin-bottom:8px;color:#fff}
.zip-row{display:flex;background:#fff;border-radius:999px;padding:6px;gap:6px}
.zip-row input{flex:1;min-width:0;border:0;background:transparent;font:inherit;font-size:1.1rem;padding:0 18px;color:var(--navy);outline-offset:0}
.zip-row input::placeholder{color:#6A8195}
.zip-row input:focus{outline:none}
.zip-row:focus-within{box-shadow:0 0 0 4px var(--aqua)}
.hero-alt{margin-top:18px;color:#CFE0EE;font-size:1rem}
.hero-alt a{color:#fff;font-weight:700}
@media (max-width:900px){
  .hero{padding:36px 0 96px}
  .hero-grid{grid-template-columns:minmax(0,1fr);gap:32px}
  .hero h1{max-width:none}
}

/* ---------- the underground scene ---------- */
.scene-card{background:var(--navy2);border-radius:28px;overflow:hidden;box-shadow:0 18px 50px rgba(0,0,0,.28)}
.scene-card svg{display:block;width:100%;height:auto}
.scene-controls{display:flex;flex-wrap:wrap;gap:14px 20px;align-items:center;padding:16px 20px;background:var(--navy2);color:#fff}
.seg{display:inline-flex;background:rgba(255,255,255,.12);border-radius:999px;padding:4px}
.seg button{border:0;background:transparent;color:#fff;font:inherit;font-weight:600;font-size:.92rem;padding:9px 14px;border-radius:999px;cursor:pointer}
.seg button[aria-pressed="true"]{background:var(--yellow);color:var(--navy)}
.rain-ctl{display:flex;align-items:center;gap:12px;flex:1 1 200px;font-weight:600;font-size:.95rem}
.rain-ctl input[type=range]{flex:1;min-width:110px;accent-color:var(--yellow);height:32px}
@media (max-width:560px){
  .scene-controls{padding:14px 14px}
  .seg{display:flex;width:100%}
  .seg button{flex:1 1 0;min-width:0;padding:9px 8px;font-size:.88rem;line-height:1.2}
  .rain-ctl{flex:1 1 100%}
}
.scene-controls .reset{border:0;background:none;color:#CFE0EE;font:inherit;font-weight:600;text-decoration:underline;cursor:pointer;padding:6px}
.scene-status{margin:0;padding:0 20px 18px;color:#E7F1F8;font-size:.98rem;min-height:3.2em;background:var(--navy2)}
.scene-status strong{color:var(--yellow)}
.scene-big .scene-card{border-radius:32px}

/* scene internals */
.scene .drop{stroke:#CFEFFA;stroke-width:1.6;stroke-linecap:round;opacity:0}
.scene.has-rain .drop{opacity:1;animation:fall var(--d,.7s) linear infinite;animation-delay:var(--dl,0s)}
@keyframes fall{from{transform:translateY(-70px)}to{transform:translateY(70px)}}
.scene .lbl{font:600 15px var(--font-b);fill:#fff;opacity:0;transition:opacity .25s;paint-order:stroke;stroke:var(--navy);stroke-width:4px}
.scene.labels-on .lbl{opacity:1}
.scene .ring{fill:none;stroke:var(--yellow);stroke-width:4;stroke-dasharray:9 7;opacity:0;transition:opacity .25s}
.scene[data-focus~="tile"] .ring[data-for="tile"],
.scene[data-focus~="pit"] .ring[data-for="pit"],
.scene[data-focus~="valve"] .ring[data-for="valve"],
.scene[data-focus~="discharge"] .ring[data-for="discharge"],
.scene[data-focus~="cut"] .ring[data-for="cut"]{opacity:1}
.scene[data-focus~="tile"] .lbl[data-for="tile"],
.scene[data-focus~="pit"] .lbl[data-for="pit"],
.scene[data-focus~="valve"] .lbl[data-for="valve"],
.scene[data-focus~="discharge"] .lbl[data-for="discharge"],
.scene[data-focus~="cut"] .lbl[data-for="cut"]{opacity:1}
.scene #sys{opacity:0;transition:opacity .4s}
.scene.sys-on #sys{opacity:1}
.scene .flow{stroke-dasharray:8 10;opacity:0}
.scene.tile-active .flow{opacity:1;animation:dash 1s linear infinite}
.scene.pumping .flow-out{opacity:1;animation:dash .5s linear infinite}
.scene .flow-out{stroke-dasharray:8 10;opacity:0}
@keyframes dash{to{stroke-dashoffset:-18}}
.scene .splash{opacity:0}
.scene.pumping .splash{opacity:1;animation:spurt .5s ease-in-out infinite alternate}
@keyframes spurt{from{transform:translateY(0)}to{transform:translateY(-6px)}}
.scene .pump-glow{opacity:0}
.scene.pumping .pump-glow{opacity:.9}
.scene .seep{opacity:0}
.scene.seeping .seep{opacity:1;animation:drip 1.1s ease-in infinite}
@keyframes drip{0%{transform:translateY(-3px);opacity:0}30%{opacity:1}100%{transform:translateY(12px);opacity:0}}
@media (prefers-reduced-motion:reduce){
  .scene.has-rain .drop,.scene.tile-active .flow,.scene.pumping .flow-out,.scene.pumping .splash,.scene.seeping .seep{animation:none}
}

/* ---------- sections ---------- */
.section{padding:84px 0}
.section-tight{padding:56px 0}
.band-white{background:#fff}
.band-chalk{background:var(--chalk)}
.band-tint{background:var(--tint)}
.band-yellow{background:var(--yellow)}
.band-navy{background:var(--navy);color:#E7F1F8}
.band-navy h2,.band-navy h3{color:#fff}
.section-head{max-width:40rem;margin-bottom:40px}
.section-head p{color:var(--muted);font-size:1.12rem}
.band-navy .section-head p{color:#CFE0EE}

/* facts strip */
.facts{background:var(--yellow);color:var(--navy)}
.facts ul{list-style:none;margin:0;padding:22px 0;display:grid;grid-template-columns:repeat(3,1fr);gap:20px 32px}
.facts li{font-weight:600;line-height:1.35}
.facts strong{display:block;font-family:var(--font-d);font-size:1.25rem}
@media (max-width:760px){.facts ul{grid-template-columns:1fr}}

/* services */
.svc-grid{display:grid;grid-template-columns:1.25fr 1fr;grid-template-rows:auto auto;gap:20px}
.svc{border-radius:24px;padding:32px;background:#fff;border:1px solid var(--line);display:flex;flex-direction:column;gap:6px}
.svc h3{margin-bottom:.2em}
.svc p{color:var(--muted);margin-bottom:1em}
.svc .more{margin-top:auto;font-weight:700}
.svc-main{grid-row:span 2;background:var(--aqua);border-color:var(--aqua);color:var(--navy);padding:40px;border-radius:32px 32px 32px 8px}
.svc-main p{color:var(--navy)}
.svc-main h3{font-size:2rem}
.svc-main ul{padding-left:1.2em;margin:0 0 1.2em}
.svc-main li{margin-bottom:.35em}
.svc-main .more{color:var(--navy)}
.svc-main a.btn-dark,.svc-main a.btn-dark:hover{color:#fff}
.svc-alert{border-radius:8px 24px 24px 24px;background:#FFE9E3;border-color:#FFC9BD}
@media (max-width:860px){.svc-grid{grid-template-columns:minmax(0,1fr)}.svc-main{grid-row:auto;border-radius:28px}}

/* checker teaser */
.teaser{display:grid;grid-template-columns:1.1fr 1fr;gap:48px;align-items:center}
.meter{background:#fff;border-radius:28px;padding:28px;border:1px solid var(--line)}
.meter h3{margin-bottom:16px}
.meter-bar{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin:18px 0 8px}
.meter-bar span{height:16px;border-radius:8px;background:#CFDDE6}
.meter-bar span:nth-child(1){background:#7DD3E8}
.meter-bar span:nth-child(2){background:var(--aqua)}
.meter-bar span:nth-child(3){background:var(--yellow)}
.meter-bar span:nth-child(4){background:var(--coral)}
.meter-scale{display:flex;justify-content:space-between;font-size:.85rem;color:var(--muted);font-weight:600}
.chips{display:flex;flex-wrap:wrap;gap:8px;padding:0;margin:20px 0;list-style:none}
.chips li{background:#fff;border:2px solid var(--navy);border-radius:999px;padding:6px 14px;font-weight:600;font-size:.95rem}
@media (max-width:860px){.teaser{grid-template-columns:1fr;gap:28px}}

/* how a visit works */
.visit{display:grid;grid-template-columns:repeat(4,1fr);gap:0;counter-reset:s;list-style:none;padding:0;margin:0}
.visit li{counter-increment:s;padding:0 22px 0 0;position:relative}
.visit li::before{content:counter(s);display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--yellow);color:var(--navy);font-family:var(--font-d);font-weight:800;font-size:1.2rem;margin-bottom:14px}
.visit li::after{content:"";position:absolute;left:52px;right:8px;top:21px;border-top:3px dotted var(--aqua)}
.visit li:last-child::after{display:none}
.visit h3{font-size:1.15rem}
.visit p{color:var(--muted);font-size:.98rem}
@media (max-width:860px){.visit{grid-template-columns:1fr;gap:20px}.visit li::after{display:none}}

/* areas */
.area-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.area-grid a{display:block;background:var(--navy2);color:#fff;border-radius:16px;padding:16px 18px;text-decoration:none;font-weight:700;font-family:var(--font-d)}
.area-grid a span{display:block;font-family:var(--font-b);font-weight:500;font-size:.88rem;color:#B7CCE0}
.area-grid a:hover{background:var(--navy3);color:#fff}
@media (max-width:700px){.area-grid{grid-template-columns:1fr 1fr}}

/* CTA band */
.cta-band{background:var(--yellow);padding:64px 0}
.cta-band .wrap{display:flex;gap:28px 48px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.cta-band h2{margin:0;max-width:22ch}
.cta-band p{margin:.5em 0 0;font-weight:500}
.cta-actions{display:flex;gap:12px;flex-wrap:wrap}

/* ---------- inner pages ---------- */
.page-hero{background:var(--navy);color:#fff;padding:56px 0 84px;position:relative;overflow:hidden}
.page-hero h1{color:#fff;font-size:clamp(2.1rem,4.4vw,3.3rem);max-width:20ch}
.page-hero p{font-size:1.18rem;color:#CFE0EE;max-width:40rem;margin-bottom:0}
.page-hero .btn-row{margin-top:26px}
.page-hero.tint{background:var(--aqua)}
.page-hero.tint h1,.page-hero.tint p{color:var(--navy)}
.crumbs{font-size:.9rem;margin-bottom:18px;color:#B7CCE0}
.crumbs a{color:#fff}
.btn-row{display:flex;gap:12px;flex-wrap:wrap}
.prose{max-width:46rem}
.prose h2{margin-top:1.6em;font-size:clamp(1.5rem,2.6vw,2rem)}
.prose h3{margin-top:1.4em}
.prose ul{padding-left:1.2em}
.prose li{margin-bottom:.4em}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:start}
.two-col.book{grid-template-columns:1.5fr 1fr}
@media (max-width:860px){.two-col,.two-col.book{grid-template-columns:minmax(0,1fr);gap:28px}}
.callout{background:var(--tint);border-left:8px solid var(--aqua);border-radius:6px 20px 20px 6px;padding:20px 24px;margin:1.6em 0}
.callout p:last-child{margin:0}
.callout.alert{background:#FFE9E3;border-left-color:var(--coral)}
.callout.warn{background:#FFF4CC;border-left-color:var(--yellow)}
.warranty{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:28px 0}
.warranty div{background:var(--navy);color:#CFE0EE;border-radius:20px;padding:24px 26px}
.warranty b{display:block;font-family:var(--font-d);font-size:1.7rem;color:#fff;line-height:1.1;margin-bottom:6px}
@media (max-width:640px){.warranty{grid-template-columns:1fr}}

/* install steps beside scene */
.walk{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr);gap:40px;align-items:start}
.walk-list{list-style:none;margin:0;padding:0;counter-reset:w}
.walk-list li{counter-increment:w;margin-bottom:10px}
.walk-list button{width:100%;text-align:left;font:inherit;background:#fff;border:2px solid var(--line);border-radius:18px;padding:16px 18px 16px 62px;cursor:pointer;position:relative;color:var(--text)}
.walk-list button::before{content:counter(w);position:absolute;left:16px;top:14px;width:32px;height:32px;display:grid;place-items:center;border-radius:50%;background:var(--tint);font-family:var(--font-d);font-weight:800;color:var(--navy)}
.walk-list button[aria-pressed="true"]{border-color:var(--navy);background:#FFF9DB}
.walk-list button[aria-pressed="true"]::before{background:var(--yellow)}
.walk-list strong{display:block;font-family:var(--font-d);color:var(--navy);font-size:1.08rem}
.walk-list span{display:block;color:var(--muted);font-size:.96rem;margin-top:2px}
@media (max-width:900px){.walk{grid-template-columns:minmax(0,1fr)}}

/* FAQ */
.faq details{background:#fff;border:1px solid var(--line);border-radius:16px;margin-bottom:10px;padding:0 22px}
.faq summary{cursor:pointer;font-family:var(--font-d);font-weight:700;font-size:1.1rem;color:var(--navy);padding:18px 0;list-style:none;display:flex;justify-content:space-between;gap:16px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-size:1.6rem;line-height:1;color:var(--aqua-d)}
.faq details[open] summary::after{content:"\2212"}
.faq details p{color:var(--muted);padding-bottom:6px}

/* ---------- forms ---------- */
.form-card{background:#fff;border:1px solid var(--line);border-radius:28px;padding:32px}
.form-card.dark{background:var(--navy2);border-color:var(--navy2);color:#fff}
.form-card h2,.form-card h3{margin-bottom:.3em}
.field{margin-bottom:16px}
.field label,.field .lab{display:block;font-weight:600;margin-bottom:6px;font-size:.98rem}
.field .hint{font-weight:400;color:var(--muted);font-size:.9rem}
.field input[type=text],.field input[type=tel],.field input[type=email],.field input[type=number],.field select,.field textarea{width:100%;font:inherit;font-size:1rem;padding:12px 14px;border:2px solid var(--field);border-radius:12px;background:#fff;color:var(--text);min-height:48px}
.field textarea{min-height:110px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--navy);box-shadow:0 0 0 4px rgba(25,181,214,.45)}
.field.bad input,.field.bad select,.field.bad textarea{border-color:var(--err)}
.err{color:var(--err);font-weight:600;font-size:.92rem;margin:4px 0 0}
.row-2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media (max-width:640px){.row-2{grid-template-columns:1fr}}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form-note{font-size:.88rem;color:var(--muted);margin-top:12px}
.form-ok{background:#E6F7EC;border:2px solid #2E9E5B;border-radius:20px;padding:24px}
.form-ok h3{margin-bottom:.3em}
.form-fail{background:#FDECEA;border:2px solid var(--err);border-radius:14px;padding:14px 16px;margin-bottom:14px;font-weight:600}

/* checker */
.check-shell{max-width:760px;margin:0 auto}
.progress{display:flex;gap:8px;margin-bottom:24px}
.progress span{flex:1;height:8px;border-radius:4px;background:var(--line)}
.progress span.done{background:var(--aqua)}
.progress span.now{background:var(--yellow)}
.opts{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px;margin:0 0 20px;padding:0;border:0}
.opts legend{font-weight:700;margin-bottom:10px;font-family:var(--font-d);font-size:1.15rem;padding:0}
.opt{position:relative;display:block}
.opt input{position:absolute;opacity:0;inset:0;width:100%;height:100%;cursor:pointer;margin:0}
.opt span{display:flex;align-items:center;min-height:56px;padding:12px 16px;border:2px solid var(--field);border-radius:16px;background:#fff;font-weight:600;line-height:1.25}
.opt input:checked + span{background:var(--navy);border-color:var(--navy);color:#fff;box-shadow:inset 0 0 0 2px var(--yellow)}
.opt input:focus-visible + span{outline:3px solid var(--aqua);outline-offset:3px}
.opt.wide{grid-column:1/-1}
.check-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:8px}
.result{border-radius:28px;padding:32px;color:var(--navy)}
.result.r-low{background:#DDF4FA}
.result.r-moderate{background:#C6EBF5}
.result.r-elevated{background:#FFE9A3}
.result.r-high{background:#FFC7B9}
.result.r-urgent{background:var(--coral)}
.result .level{font-family:var(--font-d);font-weight:800;font-size:clamp(2rem,4vw,2.8rem);line-height:1;margin:0 0 .3em}
.result ul{padding-left:1.2em}
.why{background:#fff;border-radius:20px;padding:20px 24px;margin:18px 0}
.why h3{font-size:1.05rem}
.why li{margin-bottom:.3em}
.fine{font-size:.9rem;color:var(--muted)}

/* booking */
.days{display:grid;grid-template-columns:repeat(auto-fill,minmax(88px,1fr));gap:8px}
.day{border:2px solid var(--field);background:#fff;border-radius:16px;padding:10px 6px;text-align:center;font:inherit;cursor:pointer;color:var(--text)}
.day small{display:block;font-weight:600;color:var(--muted)}
.day b{display:block;font-family:var(--font-d);font-size:1.25rem;line-height:1.1}
.day[aria-pressed="true"]{background:var(--yellow);border-color:var(--navy)}
.day[aria-pressed="true"] small{color:var(--navy)}
.windows{display:flex;gap:8px;flex-wrap:wrap}
.windows button{border:2px solid var(--field);background:#fff;border-radius:999px;padding:12px 18px;font:inherit;font-weight:600;cursor:pointer;color:var(--text)}
.windows button[aria-pressed="true"]{background:var(--yellow);border-color:var(--navy)}

/* proof wall */
.filters{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:24px}
.filters button{border:2px solid var(--navy);background:#fff;color:var(--navy);border-radius:999px;padding:8px 16px;font:inherit;font-weight:600;cursor:pointer}
.filters button[aria-pressed="true"]{background:var(--navy);color:#fff}
.proj-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:24px}
.proj{background:#fff;border-radius:24px;overflow:hidden;border:1px solid var(--line)}
.proj .cap{padding:16px 20px 20px}
.proj .cap h3{font-size:1.1rem;margin-bottom:.2em}
.proj .cap p{margin:0;color:var(--muted);font-size:.95rem}
.ba{position:relative;aspect-ratio:4/3;background:var(--navy2);overflow:hidden;--pos:50%;user-select:none;touch-action:pan-y}
.ba img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ba .after{clip-path:inset(0 0 0 var(--pos))}
.ba .tag{position:absolute;top:12px;background:var(--navy);color:#fff;font-weight:700;font-size:.85rem;padding:4px 12px;border-radius:999px}
.ba .tag.b{left:12px}.ba .tag.a{right:12px;background:var(--yellow);color:var(--navy)}
.ba .handle{pointer-events:none;position:absolute;top:0;bottom:0;left:var(--pos);width:4px;margin-left:-2px;background:#fff}
.ba .handle::after{content:"";position:absolute;top:50%;left:50%;width:44px;height:44px;margin:-22px 0 0 -22px;border-radius:50%;background:var(--yellow);border:3px solid #fff;box-shadow:0 2px 8px rgba(0,0,0,.35)}
.ba input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:ew-resize;margin:0}
.ba input:focus-visible ~ .handle::after{outline:3px solid var(--aqua);outline-offset:3px}
.demo-flag{display:inline-block;background:var(--yellow);color:var(--navy);font-weight:700;font-size:.8rem;padding:2px 10px;border-radius:999px;margin-left:6px}
.reviews{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(280px,360px);gap:18px;overflow-x:auto;padding-bottom:12px;scroll-snap-type:x mandatory}
.review{background:#fff;border-radius:22px;padding:24px;border:1px solid var(--line);scroll-snap-align:start}
.review p{font-size:1.02rem}
.review footer{font-weight:700;color:var(--navy)}
.review footer span{display:block;font-weight:500;color:var(--muted);font-size:.9rem}
.empty{background:#fff;border:2px dashed var(--field);border-radius:24px;padding:40px;text-align:center;color:var(--muted)}

/* about / misc */
.photo-slot{aspect-ratio:4/3;border-radius:28px 28px 28px 6px;background:var(--aqua);display:grid;place-items:center;color:var(--navy);overflow:hidden}
.photo-slot img{width:100%;height:100%;object-fit:cover}
.link-list{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:10px}
.link-list a{display:block;background:#fff;border:1px solid var(--line);border-radius:14px;padding:14px 16px;text-decoration:none;font-weight:600}
.link-list a:hover{background:var(--tint)}
.card-link{display:block;background:#fff;border:1px solid var(--line);border-radius:22px;padding:26px;text-decoration:none;color:var(--text)}
.card-link:hover{background:var(--tint);color:var(--text)}
.card-link h3{margin-bottom:.3em}
.card-link p{color:var(--muted);margin:0}
.card-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:18px}

/* ---------- footer ---------- */
.site-footer{background:var(--navy);color:#B7CCE0;padding:64px 0 100px}
.site-footer a{color:#E7F1F8}
.site-footer a:hover{color:var(--yellow)}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:36px}
.foot-grid h2{font-size:1.02rem;color:#fff;margin-bottom:.8em}
.foot-grid ul{list-style:none;padding:0;margin:0}
.foot-grid li{margin-bottom:.45em}
.foot-brand{font-family:var(--font-d);font-weight:800;color:#fff;font-size:1.35rem;margin-bottom:.4em}
.foot-bottom{border-top:1px solid rgba(255,255,255,.15);margin-top:40px;padding-top:20px;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:.92rem}
@media (max-width:860px){.foot-grid{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.foot-grid{grid-template-columns:minmax(0,1fr)}}

/* ---------- emergency button + dialog + mobile bar ---------- */
.sos{position:fixed;right:20px;bottom:20px;z-index:60;background:var(--coral);color:var(--navy);border:3px solid var(--navy);border-radius:999px;padding:14px 22px;font:inherit;font-weight:800;cursor:pointer;box-shadow:0 8px 24px rgba(10,37,64,.35)}
.sos:hover{background:var(--coral-d)}
.mbar{display:none}
@media (max-width:760px){
  .sos{display:none}
  .mbar{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;position:fixed;left:0;right:0;bottom:0;z-index:60;background:#fff;border-top:1px solid var(--line);padding:10px 12px calc(10px + env(safe-area-inset-bottom))}
  .mbar a,.mbar button{font:inherit;font-weight:800;font-size:.95rem;border-radius:999px;padding:13px 6px;text-align:center;text-decoration:none;border:2px solid var(--navy);color:var(--navy);background:#fff;cursor:pointer;min-height:48px}
  .mbar .m-call{background:var(--yellow);border-color:var(--yellow)}
  .mbar .m-sos{background:var(--coral);border-color:var(--coral)}
}
dialog.sos-dialog{border:0;border-radius:28px;padding:0;max-width:560px;width:calc(100% - 32px);color:var(--text);box-shadow:0 30px 80px rgba(0,0,0,.45)}
dialog.sos-dialog::backdrop{background:rgba(10,37,64,.72)}
.sos-head{background:var(--coral);color:var(--navy);padding:24px 28px}
.sos-head h2{margin:0;font-size:1.7rem;color:var(--navy)}
.sos-body{padding:24px 28px 28px}
.sos-body ol{padding-left:1.2em;margin:0 0 18px}
.sos-body li{margin-bottom:.5em}
.sos-close{float:right;background:var(--navy);color:#fff;border:0;border-radius:999px;padding:8px 14px;font:inherit;font-weight:700;cursor:pointer}
.after-hours{background:#FFF4CC;border-radius:12px;padding:12px 14px;margin-bottom:16px;font-weight:600}

@media print{.site-header,.sos,.mbar,.alertbar,.site-footer,.cta-band{display:none}}

#check{scroll-margin-top:96px}

@media (max-width:360px){
  .site-header .wrap{gap:12px}
  .logo{font-size:1.05rem;gap:8px}
  .nav-toggle{padding:10px 14px}
}

/* ---------- more services, family, map ---------- */
.ico{display:block;margin-bottom:12px}
.more-svcs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:20px}
.svc-link{text-decoration:none;color:var(--text)}
.svc-link:hover{background:var(--tint);color:var(--text)}
@media (max-width:860px){.more-svcs{grid-template-columns:minmax(0,1fr)}}
.family{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:40px;align-items:center}
.family h2{margin-bottom:.3em}
.family-card{display:flex;flex-direction:column;gap:4px;background:#fff;border:1px solid var(--line);border-radius:24px;padding:28px;text-decoration:none;color:var(--text)}
.family-card:hover{background:var(--tint);color:var(--text)}
.family-card h3{margin-bottom:.2em}
.family-card p{color:var(--muted);margin-bottom:.8em}
.family-card .more{font-weight:700;color:var(--navy);text-decoration:underline}
@media (max-width:860px){.family{grid-template-columns:minmax(0,1fr);gap:24px}}
.card-link .ico{margin-bottom:10px}

.svcmap{margin:0;border-radius:28px;overflow:hidden;background:var(--tint);box-shadow:0 18px 50px rgba(0,0,0,.22)}
.svcmap-canvas{aspect-ratio:1/1;background:var(--tint)}
.svcmap-canvas svg{display:block;width:100%;height:100%}
.svcmap figcaption{display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px 16px;background:var(--navy2);color:#E7F1F8;padding:12px 18px;font-size:.88rem}
.svcmap figcaption a{color:#CFE0EE}
.mp-label{font:700 19px var(--font-b);fill:#0A2540;paint-order:stroke;stroke:#fff;stroke-width:5px;stroke-linejoin:round}
.mp-office{font-size:21px}
.mp-cluster{font-size:20px}
.mp-pill{font:700 22px var(--font-b);fill:#FFCE1F}
.svcmap a:focus-visible circle{stroke:var(--aqua);stroke-width:5}
.area-split{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:36px;align-items:center}
.area-split .area-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.area-more{margin-top:18px}.area-more a{color:#fff;font-weight:700}
@media (max-width:900px){.area-split{grid-template-columns:minmax(0,1fr)}}
.map-row{align-items:start}
.card-grid.compact{grid-template-columns:repeat(auto-fill,minmax(210px,1fr))}
.card-grid.compact .card-link{padding:18px 20px}
.card-grid.compact .card-link h3{font-size:1.05rem}

.header-actions .btn{white-space:nowrap}
.header-actions{flex:none}


.logo img{display:block;height:64px;width:auto;max-width:none}
.foot-logo{display:inline-block;background:#fff;border-radius:10px;padding:6px 10px;margin-bottom:10px}
.foot-logo img{display:block;height:70px;width:auto}
@media (max-width:560px){.logo img{height:52px}}
@media (max-width:360px){.logo img{height:46px}}
.sos,.mbar{transition:opacity .2s ease,transform .2s ease}
body.scene-clear .sos{opacity:0;pointer-events:none}
@media (max-width:760px){body.scene-clear .mbar{transform:translateY(100%);pointer-events:none}}
.site-footer{padding-bottom:120px}
@media (max-width:760px){.site-footer{padding-bottom:calc(150px + env(safe-area-inset-bottom))}}

.mp-attr-t{font:600 15px var(--font-b);fill:#0A2540}
.svcmap-canvas image{image-rendering:auto}

/* project photo story + lightbox */
.proj-story{grid-column:1/-1}
.story{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;padding:6px;background:var(--chalk)}
.shot{position:relative;border:0;padding:0;margin:0;cursor:zoom-in;background:var(--navy2);aspect-ratio:3/4;overflow:hidden;border-radius:14px;font:inherit;color:#fff;text-align:left}
.shot.lead{grid-column:span 2;grid-row:span 2;aspect-ratio:auto}
.shot img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .3s}
.shot:hover img{transform:scale(1.04)}
.shot span{position:absolute;left:0;right:0;bottom:0;padding:26px 10px 9px;font-size:.82rem;font-weight:600;line-height:1.25;background:linear-gradient(transparent,rgba(10,37,64,.88))}
.shot:focus-visible{outline:3px solid var(--aqua);outline-offset:2px}
.shot.lead span{font-size:1rem;padding:40px 16px 14px}
@media(max-width:760px){.story{grid-template-columns:repeat(2,1fr)}.shot.lead{grid-column:span 2;grid-row:auto;aspect-ratio:4/3}}
.lightbox{border:0;padding:0;background:transparent;max-width:100vw;max-height:100vh;width:100%;height:100%}
.lightbox::backdrop{background:rgba(10,37,64,.92)}
.lightbox figure{margin:0;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:56px 64px 24px}
.lightbox img{max-width:100%;max-height:calc(100vh - 150px);border-radius:12px;object-fit:contain}
.lightbox figcaption{color:#fff;font-weight:600;text-align:center}
.lb-x,.lb-n{position:absolute;border:0;background:var(--yellow);color:var(--navy);font-size:30px;line-height:1;width:48px;height:48px;border-radius:50%;cursor:pointer;z-index:2}
.lb-x{top:12px;right:12px}.lb-n{top:50%;margin-top:-24px}.lb-prev{left:10px}.lb-next{right:10px}
@media(max-width:600px){.lightbox figure{padding:60px 8px 20px}.lb-n{top:auto;bottom:14px;margin:0}}