/* Settled Sites, rounded theme (Mark, 2026-10-26: "a bit more rounded, like the new pool care one").
   Loaded after site.css when built with THEME=rounded. Borrowed from Total Pool Care v3.1: one friendly sans
   (Albert Sans), sections as rounded panels inset from the page edge, 20px corners on photos and screens,
   12px on small things, pill chips. The big radius and pills are recorded as deliberate in brand-rounded.json. */
@font-face{font-family:"Albert Sans";src:url(fonts/albert-sans.woff2) format("woff2");font-weight:400 800;font-display:swap}

:root{
  --display:"Albert Sans","Helvetica Neue",Arial,sans-serif;
  --serif:"Albert Sans","Helvetica Neue",Arial,sans-serif;
  --sans:"Albert Sans","Helvetica Neue",Arial,sans-serif;
  --mist:#EEF2F8;
  --tint:#E3EBFA;
  --band:#13213F;          /* deep navy-ink, softer than near-black, like the pool footer */
  --on-band:#C7D1E3;
  --r:20px; --r-sm:12px; --r-xl:32px;
  --inset:14px;
}
@media (max-width:700px){:root{--r:16px;--r-xl:24px;--inset:8px}}

body{font-size:18px}
h1{font-weight:700;letter-spacing:-.03em;line-height:1.03}
h2{font-weight:700;letter-spacing:-.025em}
h3{font-weight:700;letter-spacing:-.012em}

/* sections become rounded panels inset from the page edge */
.band-mist,.band-tint,.band-dark,.site-foot{margin-inline:var(--inset);border-radius:var(--r-xl)}
.band-mist+.band,.band+.band-mist,.band-dark+.band,.band+.band-dark,.band-tint+.site-foot{margin-top:0}
.site-foot{margin-bottom:var(--inset)}
.band-tint{margin-block:var(--inset)}
.band-dark+.band-mist,.band-mist+.band-dark,.band-mist+.band-tint,.band-dark+.band-tint{margin-top:var(--inset)}

/* header: a floating rounded bar */
.site-head{background:transparent;border-bottom:0;padding:var(--inset) var(--inset) 0}
.site-head>.wrap{background:#fff;border:1px solid #DCE3EE;border-radius:var(--r);max-width:none;min-height:66px}
.mark b{font-family:var(--display);font-weight:800;letter-spacing:-.02em}
.nav .btn{border-radius:999px}
.dd .menu{border-radius:var(--r-sm);overflow:hidden;border-color:#DCE3EE;padding:8px}
.dd .menu a{border-radius:8px}
.menu-btn,.panel .close{border-radius:999px}
.panel{border-radius:0}

/* hero: the work sits in a rounded tinted panel */
.stage::before{left:calc(-1 * var(--gutter) + var(--inset) - 0px);right:calc(-1 * var(--gutter) + var(--inset));border-radius:var(--r-xl);left:calc(-50vw + 50% + var(--inset));right:calc(-50vw + 50% + var(--inset))}

/* buttons and links */
.btn{border-radius:12px;padding:15px 24px}
.btn.line{border-width:1.5px}

/* screens */
.browser{border-radius:var(--r-sm);border-color:#D3DBE7}
.browser .bar{height:34px}
.browser .bar span{border-radius:999px;padding:3px 12px}
.phone{border-radius:26px;padding:7px}
.phone img{border-radius:20px}
.shot .browser{transition:transform .35s ease-out,border-color .2s ease-out}
.lb img{border-radius:var(--r-sm)}
.lb .x{border-radius:999px}

/* photos and cards */
.photo img,.page-head .photo img,.place img{border-radius:var(--r)}
.letter .portrait img,.person img{border-radius:var(--r)}
.who img{border-radius:50%}
.firm .browser{border-radius:var(--r)}
.practices a{background:#fff;border:1px solid #DCE3EE;border-radius:var(--r);padding:24px 26px}
.practices a:hover{border-color:var(--cobalt)}
.band-mist .practices a{border-color:transparent}

/* "included" ticks become small round badges */
.inc li{padding-left:34px}
.inc li::before{width:22px;height:22px;top:2px;border-radius:50%;background-color:var(--tint);background-size:13px}
.band-dark .inc li::before,.plan.a .inc li::before{background-color:rgba(157,181,245,.16)}

/* plans, tables, forms */
.plan{border-radius:var(--r-xl)}
.plan.b{background:#fff}
table.data tr.us th:first-child{border-radius:var(--r-sm) 0 0 var(--r-sm)}
table.data tr.us td:last-child{border-radius:0 var(--r-sm) var(--r-sm) 0}
form.review input[type=text],form.review input[type=email],form.review input[type=tel],form.review input[type=url],form.review textarea{border-radius:var(--r-sm);border-color:#B7C0CE}
.choice label{border-radius:999px;border-color:#B7C0CE}
.form-msg{border-radius:var(--r-sm)}
.get-grid>div{background:#fff;border-radius:var(--r);padding:22px 24px}
.band-dark .get-grid>div{background:rgba(255,255,255,.05)}
.qa>div{background:var(--mist);border-radius:var(--r);padding:24px 26px}
.band-mist .qa>div{background:#fff}
.prose .qa>div{background:#fff}
.band-mist .prose .qa>div{background:#fff}

/* letter: a soft panel */
.letter .text{font-family:var(--sans)}
.struck s{text-decoration-thickness:3px}

/* footer inside its own rounded panel */
.site-foot{padding-inline:0}
.foot-legal{border-top-color:rgba(255,255,255,.1)}
.band-tint+.site-foot,.band+.site-foot{margin-top:var(--inset)}
.plan3>div{background:var(--mist);border-radius:var(--r);padding:26px 28px}
.band-mist .plan3>div{background:#fff}

/* header at mid widths: nothing wraps; the menu button takes over before anything has to */
.site-head{background:transparent;pointer-events:none}
.site-head>.wrap{pointer-events:auto;box-shadow:0 10px 28px rgba(19,33,63,.10)}
.nav>a,.nav .dd>button,.nav .btn,.head-phone,.mark b,.mark span{white-space:nowrap}
.nav{gap:clamp(14px,1.6vw,24px)}
.site-head .wrap{gap:clamp(16px,2vw,30px)}
@media (max-width:1380px){.head-phone{display:none}}
/* narrower: the key links stay out (Work, What you get, Pricing, the review), Menu holds the rest */
@media (max-width:1240px){.nav>:not(.key1):not(.key2){display:none}.menu-btn{display:inline-block;margin-left:0}}
@media (max-width:1080px){.nav{display:flex}}
@media (max-width:960px){.nav>.key1{display:none}}
@media (max-width:820px){.nav .long{display:none}.nav>.dd.key2{display:none}}
@media (max-width:640px){.nav>a:not(.btn){display:none}}
@media (max-width:520px){.nav{display:none}.menu-btn{margin-left:auto}}
.table-scroll{border-radius:var(--r)}
table.data tr.us th:first-child,table.data tr.us td:last-child{border-radius:0}
@media (max-width:720px){table.data tbody tr{border-radius:var(--r-sm)}}

.ic{border-radius:14px}

/* icon tiles: contrast against whatever the card is */
.ic{width:52px;height:52px;background:#DCE6FA}
.ic svg{width:27px;height:27px}
.qa>div .ic,.plan3>div .ic{background:#fff}
.band-mist .qa>div .ic,.band-mist .plan3>div .ic,.band-mist .get-grid>div .ic,.get-grid>div .ic{background:#E3EBFA}
.band-dark .get-grid>div .ic{background:rgba(157,181,245,.16);color:#B9CBF7}
.track-nav button{border-radius:50%}
.fact-stat,.fact-card{border-radius:var(--r)}
.chips li{border-radius:999px}
.fact-card .ic{background:#fff}

.county,.statewide{border-radius:var(--r)}
.county .photo img{border-radius:0}
.searches li{border-radius:999px}
.prose>.side{border-radius:var(--r)}
.prose>.side a{border-radius:10px}
.prose>.side li+li a{border-top:0}
.ba{border-radius:var(--r)}
.ba-tag{border-radius:999px}
.seo-card{border-radius:var(--r)}
.firm-links a{border-radius:var(--r)}
.msg{border-radius:var(--r)}.msg.in{border-bottom-left-radius:6px}.msg.out{border-bottom-right-radius:6px}
.band-dark .qa>div{background:rgba(255,255,255,.06)}
.band-dark .qa h3{color:#fff}
.band-dark .qa p{color:#C7D1E3}
.band-dark .qa>div .ic{background:rgba(157,181,245,.16);color:#B9CBF7}
.cmp{border-radius:var(--r)}.cmp-tag{border-radius:999px}
.sm-root,.sm-kids li{border-radius:var(--r)}
.form-card{border-radius:var(--r)}
.contact-portrait img,.contact-card,.contact-two>div{border-radius:var(--r)}.contact-portrait figcaption{border-radius:var(--r-sm)}
.cover{border-radius:var(--r)}
.serp>div{border-radius:var(--r-sm)}.serp-q{border-radius:999px!important}.serp-cite{border-radius:999px}
.bill,.pscale,.counties-head,.duo img,.duo figcaption{border-radius:var(--r)}.pscale-bar,.pscale-fill{border-radius:999px}
.tz{border-radius:var(--r)}
.sw-firm{border-radius:var(--r-sm)}.sw-thumb .browser{border-radius:var(--r-sm)}
.annot-shot{border-radius:var(--r-sm)}.annot-shot picture{border-radius:var(--r-sm)}.pin .pin-t,.annot-list li{border-radius:6px}
.ex-q{border-radius:var(--r-sm)}
.find{border-radius:999px}.annot .annot-shot{border-radius:var(--r-sm)}

/* "Ask Gaston" help button, bottom right (JS only) */
.ask{display:none;position:fixed;right:20px;bottom:20px;z-index:50}
.js .ask{display:block}
.ask-btn{display:flex;align-items:center;gap:0;padding:4px;transition:gap .2s ease,padding .2s ease;background:#fff;border:0;border-radius:999px;box-shadow:0 10px 28px rgba(19,33,63,.18);font:600 15.5px var(--sans);color:var(--ink);cursor:pointer}
/* at rest just his face; the words slide out on hover, keyboard focus, or while the panel is open */
.ask-label{display:block;max-width:0;overflow:hidden;white-space:nowrap;opacity:0;transition:max-width .25s ease,opacity .2s ease}
.ask-btn:hover,.ask-btn:focus-visible,.ask.open .ask-btn{gap:12px;padding-right:20px}
.ask-btn:hover .ask-label,.ask-btn:focus-visible .ask-label,.ask.open .ask-label{max-width:200px;opacity:1}
.ask-btn:hover .ask-label{color:var(--cobalt)}
@media (prefers-reduced-motion:reduce){.ask-btn,.ask-label{transition:none}}
.ask-btn:focus-visible,.ask-x:focus-visible{outline:3px solid var(--cobalt);outline-offset:2px}
.ask-face{display:block;flex:none;width:54px;height:54px;border-radius:50%;overflow:hidden;background:var(--tint)}
.ask-face img{width:100%;height:100%;object-fit:cover;object-position:50% 100%}
.ask-pic{position:relative;display:block;flex:none;padding:3px;border-radius:50%;background:var(--cobalt)}
.ask-pic .ask-face{box-shadow:0 0 0 2px #fff}
.ask-badge{position:absolute;left:-8px;bottom:-5px;display:flex;align-items:center;justify-content:center;width:32px;height:26px;background:var(--cobalt);border:2px solid #fff;border-radius:13px 13px 13px 3px}
.ask-btn:hover .ask-pic,.ask.open .ask-pic{background:var(--ink)}
.ask-panel{position:absolute;right:0;bottom:calc(100% + 12px);width:min(370px,calc(100vw - 32px));max-height:calc(100vh - 120px);overflow-y:auto;background:#fff;border-radius:var(--r);box-shadow:0 18px 48px rgba(19,33,63,.22);padding:20px}
.ask-panel[hidden]{display:none}
.ask-top{display:grid;grid-template-columns:60px 1fr 32px;gap:14px;align-items:start}
.ask-h{margin:2px 0 4px;font-weight:700;font-size:16.5px;color:var(--ink)}
.ask-sub{margin:0;font-size:15px;line-height:1.5;color:var(--muted)}
.ask-x{width:32px;height:32px;display:inline-flex;align-items:center;justify-content:center;background:none;border:0;border-radius:50%;color:var(--ink);cursor:pointer}
.ask-x:hover{background:var(--mist)}
.ask-pick{display:grid;gap:10px;margin-top:18px}
.ask-pick .btn{text-align:center;width:100%}
.ask-pick .btn[hidden]{display:none}
.ask-form{margin-top:18px;gap:14px}
.ask-form[hidden]{display:none}
.ask-form input[type=text],.ask-form input[type=email],.ask-form textarea{font-size:16px;padding:11px 12px}
.ask-form textarea{min-height:90px}
.ask-form .btn{width:100%}
.ask-form .form-note{margin:0;font-size:13.5px}
@media (max-width:700px){.ask{right:14px;bottom:14px}.ask-btn:hover,.ask.open .ask-btn{gap:0;padding-right:4px}.ask-btn:hover .ask-label,.ask.open .ask-label{max-width:0;opacity:0}}
@media print{.js .ask{display:none}}
