/* NOVA Pool Builders — design system */
:root{
  --navy:#0B2E4F; --navy-deep:#082238; --aqua:#1690B4; --aqua-dark:#0E6E8C;
  --sand:#F5EFE4; --ink:#1B2733; --muted:#5A6B7A; --cloud:#F7FAFC; --line:#DFE7EE;
  --radius:10px; --shadow:0 2px 14px rgba(11,46,79,.10);
  --font:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--font);color:var(--ink);line-height:1.65;background:#fff;font-size:17px}
img,svg{max-width:100%}
a{color:var(--aqua-dark)}
h1,h2,h3{color:var(--navy);line-height:1.2;font-weight:700}
h1{font-size:clamp(1.9rem,4.5vw,3rem)}
h2{font-size:clamp(1.45rem,3vw,2rem);margin:2.2rem 0 .8rem}
h3{font-size:1.15rem;margin-bottom:.4rem}
p{margin-bottom:1rem}
ul,ol{margin:0 0 1rem 1.3rem}
li{margin-bottom:.35rem}
.wrap{max-width:1120px;margin:0 auto;padding:0 20px}
.narrow{max-width:780px}

/* header */
.site-header{position:sticky;top:0;z-index:50;background:#fff;border-bottom:1px solid var(--line)}
.header-row{display:flex;align-items:center;justify-content:space-between;min-height:64px;gap:16px}
.brand{display:flex;align-items:center;gap:8px;text-decoration:none;color:var(--navy);font-size:1.15rem;letter-spacing:.2px;white-space:nowrap}
.brand strong{font-weight:800}
.brand-wave{width:30px;height:20px;color:var(--aqua)}
.site-nav{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.site-nav a{text-decoration:none;color:var(--ink);font-size:.95rem}
.site-nav a:hover{color:var(--aqua-dark)}
.site-nav .nav-county{display:none}
.nav-phone{background:var(--navy);color:#fff !important;padding:.5rem .9rem;border-radius:999px;font-weight:700}
.nav-phone:hover{background:var(--aqua-dark)}
.nav-toggle,.nav-burger{display:none}

/* hero */
.hero{background:linear-gradient(160deg,var(--navy) 0%,var(--navy-deep) 55%,var(--aqua-dark) 130%);color:#eaf3f8;padding:4.2rem 0 3.4rem}
.hero h1{color:#fff;max-width:820px}
.hero-sub{font-size:1.15rem;max-width:720px;margin:.9rem 0 0;color:#cfe2ec}
.hero-sub a{color:#fff}
.hero-bullets{list-style:none;margin:1.2rem 0 0;display:flex;gap:1.6rem;flex-wrap:wrap}
.hero-bullets li{padding-left:1.5rem;position:relative;font-weight:600;color:#fff}
.hero-bullets li::before{content:"";position:absolute;left:0;top:.42em;width:.85em;height:.85em;border-radius:50%;background:var(--aqua)}
.hero-cta{margin-top:1.6rem;display:flex;gap:.8rem;flex-wrap:wrap}
.hero-sub-page{padding:3rem 0 2.4rem}
.crumbs{font-size:.85rem;margin-bottom:1rem;color:#9dbccd}
.crumbs a{color:#cfe2ec;text-decoration:none}
.crumbs span{color:#fff}

/* buttons */
.btn{display:inline-block;padding:.72rem 1.4rem;border-radius:999px;text-decoration:none;font-weight:700;font-size:1rem;border:2px solid transparent;cursor:pointer}
.btn-solid{background:var(--aqua);color:#fff}
.btn-solid:hover{background:#1180a2}
.btn-ghost{border-color:#ffffff55;color:#fff}
.btn-ghost:hover{border-color:#fff}
.btn-ghost-light{border-color:#ffffff88;color:#fff}
.btn-ghost-light:hover{background:#ffffff14}

/* bands + cards */
.band{padding:3rem 0}
.band-alt{background:var(--cloud)}
.band-navy{background:var(--navy);color:#d9e7ef}
.band-navy h2{color:#fff;margin-top:0}
.band-navy p{color:#d9e7ef}
.split{display:grid;grid-template-columns:1fr 1fr;gap:3rem}
.cards-3{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem;margin-top:1.4rem}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:1.4rem;box-shadow:var(--shadow)}
.card-link{text-decoration:none;color:inherit;transition:transform .15s}
.card-link:hover{transform:translateY(-3px);border-color:var(--aqua)}
.card-link p{color:var(--muted);font-size:.92rem;margin:0}
.process{list-style:none;margin:1.6rem 0 0;display:grid;grid-template-columns:repeat(4,1fr);gap:1.2rem;counter-reset:step}
.process li{display:flex;gap:.8rem;align-items:flex-start}
.step-n{flex:0 0 2.1rem;height:2.1rem;border-radius:50%;background:var(--aqua);color:#fff;font-weight:800;display:flex;align-items:center;justify-content:center}
.process p{font-size:.95rem;color:var(--muted);margin:0}

/* article content */
.article table,.wrap table{width:100%;border-collapse:collapse;margin:0 0 1.4rem;font-size:.95rem;display:block;overflow-x:auto}
.article th,.article td,.wrap th,.wrap td{border:1px solid var(--line);padding:.6rem .8rem;text-align:left;vertical-align:top}
.article th{background:var(--cloud);color:var(--navy)}
.cost-callout{background:var(--sand);border-left:4px solid var(--aqua);padding:.9rem 1.1rem;border-radius:0 var(--radius) var(--radius) 0;font-weight:600}
.hood-list{list-style:none;margin-left:0}
.hood-list li{padding:.5rem 0;border-bottom:1px solid var(--line)}
.img-todo{background:#EDF4F8;border:1.5px dashed var(--aqua);border-radius:var(--radius);padding:1.1rem;display:flex;gap:1rem;align-items:center;color:var(--muted);font-size:.9rem;margin:1.4rem 0}
.img-todo svg{width:84px;flex:0 0 84px}
.siblings{margin-top:2rem;font-size:.92rem;color:var(--muted)}

/* FAQ */
.faq{border:1px solid var(--line);border-radius:var(--radius);margin-bottom:.7rem;background:#fff}
.faq summary{cursor:pointer;font-weight:700;color:var(--navy);padding:.9rem 1.1rem;list-style:none;position:relative;padding-right:2.4rem}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:1.1rem;top:.7rem;font-size:1.3rem;color:var(--aqua)}
.faq[open] summary::after{content:"\2212"}
.faq div{padding:0 1.1rem 1rem}

/* quote band + form */
.quote-band{background:linear-gradient(160deg,var(--navy) 0%,var(--navy-deep) 100%);padding:3.4rem 0}
.quote-grid{display:grid;grid-template-columns:1fr 1.3fr;gap:3rem;align-items:start}
.quote-pitch h2{color:#fff;margin-top:0}
.quote-pitch p{color:#cfe2ec}
.quote-call a{color:#fff;font-weight:700}
.quote-form{background:#fff;border-radius:var(--radius);padding:1.6rem;display:grid;grid-template-columns:1fr 1fr;gap:.9rem;box-shadow:var(--shadow)}
.ff{display:flex;flex-direction:column;gap:.25rem}
.ff-full{grid-column:1/-1}
.ff label{font-size:.85rem;font-weight:700;color:var(--navy)}
.ff input,.ff select,.ff textarea{padding:.6rem .7rem;border:1.5px solid var(--line);border-radius:7px;font-family:inherit;font-size:.95rem}
.ff input:focus,.ff select:focus,.ff textarea:focus{outline:2px solid var(--aqua);border-color:var(--aqua)}
.consent label{font-weight:400;font-size:.8rem;color:var(--muted);display:flex;gap:.5rem;align-items:flex-start}
.consent input{margin-top:.2rem}
.form-note{grid-column:1/-1;font-size:.9rem;font-weight:600}
.form-note.ok{color:#0a7a43}.form-note.err{color:#b3261e}

/* gallery */
.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-top:1.4rem}
.gallery-2{grid-template-columns:repeat(2,1fr);margin-bottom:1.6rem}
.gallery figure,.city-photo{margin:0}
.gallery img,.city-photo img{width:100%;height:auto;border-radius:var(--radius);display:block;box-shadow:var(--shadow)}
.gallery figure:first-child{grid-column:1/-1}
.city-photo{margin:1.4rem 0}
.city-photo figcaption{font-size:.85rem;color:var(--muted);margin-top:.4rem}
@media (max-width:680px){.gallery{grid-template-columns:1fr 1fr}.gallery figure:first-child{grid-column:1/-1}}

/* footer */
.site-footer{background:var(--navy-deep);color:#b9cdd9;margin-top:0;padding:2.8rem 0 1.4rem;font-size:.92rem}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:2rem}
.foot-grid a{display:block;color:#b9cdd9;text-decoration:none;padding:.16rem 0}
.foot-grid a:hover{color:#fff}
.foot-brand{font-size:1.1rem;color:#fff}
.foot-h{font-weight:800;color:#fff;margin-bottom:.5rem}
.foot-entity{font-size:.8rem;color:#8ba4b4}
.foot-legal{display:flex;gap:1.4rem;margin-top:2.2rem;padding-top:1.2rem;border-top:1px solid #ffffff1c;font-size:.82rem}
.foot-legal a{color:#b9cdd9}

/* responsive */
@media (max-width:900px){
  .cards-3,.process,.split,.quote-grid{grid-template-columns:1fr 1fr}
  .foot-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:680px){
  .cards-3,.process,.split,.quote-grid,.foot-grid,.quote-form{grid-template-columns:1fr}
  .nav-burger{display:flex;flex-direction:column;gap:5px;cursor:pointer;padding:8px}
  .nav-burger span{width:24px;height:2.5px;background:var(--navy);border-radius:2px}
  .site-nav{display:none;position:absolute;top:64px;left:0;right:0;background:#fff;flex-direction:column;align-items:flex-start;padding:1rem 20px 1.4rem;border-bottom:1px solid var(--line);gap:.9rem}
  .nav-toggle:checked ~ .site-nav{display:flex}
  .site-nav .nav-county{display:block}
  .hero{padding:3rem 0 2.6rem}
  .hero-bullets{flex-direction:column;gap:.5rem}
}