:root{color-scheme:light;--bg:#f3f8fd;--surface:#fff;--ink:#043561;--muted:#4a6482;--brand:#043561;--brand-ink:#fff;--accent:#0b7cc0;--sun:#f4c542;--line:#cddff0;--tint:#e2eef9;--navy:#043561;
box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
html{scroll-padding-top:env(safe-area-inset-top,0px)}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:400 17px/1.6 Figtree,system-ui,sans-serif}
h1,h2,h3{font-family:"Young Serif",Georgia,serif;font-weight:400;line-height:1.15;margin:0 0 .5em}
h1{font-size:clamp(2.3rem,6vw,4rem)}h2{font-size:clamp(1.7rem,3.5vw,2.4rem)}h3{font-size:1.25rem}
p{margin:0 0 1em;max-width:62ch}
a{color:inherit}
:focus-visible{outline:3px solid var(--sun);outline-offset:3px}
.wrap{max-width:1080px;margin:0 auto;padding:0 20px}
header{position:sticky;top:0;z-index:5;background:var(--bg);border-bottom:1px solid var(--line);padding-top:env(safe-area-inset-top,0px)}
header .wrap{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding-top:12px;padding-bottom:12px}
.logo{display:inline-flex;align-items:center;gap:10px;font-family:"Young Serif",Georgia,serif;font-size:1.35rem;text-decoration:none}
.logo img{display:block;flex:none}.lg-e{height:54px;width:auto}.lg-w{height:40px;width:auto}
.lg-n{fill:var(--navy)}.lg-ns{stroke:var(--navy)}.lg-s0{stop-color:var(--navy)}.lg-m{fill:var(--muted)}
.logo span span{color:var(--brand)}
nav{display:flex;gap:4px;overflow-x:auto}
nav a{padding:8px 14px;border-radius:99px;text-decoration:none;font-weight:500;white-space:nowrap}
nav a[aria-current="page"]{background:var(--brand);color:var(--brand-ink)}
nav a:not([aria-current]):hover{background:var(--tint)}
.page{display:none;padding:48px 0 72px}.page.on{display:block}
.btn{display:inline-block;background:var(--brand);color:var(--brand-ink);padding:13px 24px;border-radius:99px;font:700 1rem Figtree,sans-serif;text-decoration:none;border:0;cursor:pointer}
.btn.alt{background:transparent;color:var(--ink);border:2px solid var(--ink)}
.row{display:flex;gap:12px;flex-wrap:wrap}
.hero{display:grid;grid-template-columns:1.05fr 1fr;gap:40px;align-items:center}
.hero p.lead{font-size:1.2rem;color:var(--muted)}
.badge{display:inline-block;background:var(--sun);color:#043561;font-weight:700;font-size:.9rem;padding:4px 12px;border-radius:99px;margin-bottom:16px}
/* before/after */
.ba{position:relative;aspect-ratio:4/3;border-radius:22px;overflow:hidden;--p:50%;border:1px solid var(--line);user-select:none}
.ba .L{position:absolute;inset:0;display:grid;place-items:center;font-size:4.5rem}
.ba .after{background:linear-gradient(135deg,var(--c1),var(--c2))}
.ba .after::before{content:"✦  ✧      ✦\A\A ✧     ✦   ✧\A\A✦    ✧   ✦";white-space:pre;position:absolute;inset:0;padding:12% 10%;color:#ffffffcc;font-size:1.4rem;line-height:1.1}
.ba .before{background:#8d8a80;clip-path:inset(0 calc(100% - var(--p)) 0 0);
background-image:radial-gradient(circle at 20% 30%,#5f5b52 0 9%,transparent 10%),radial-gradient(circle at 70% 25%,#6d685c 0 7%,transparent 8%),radial-gradient(circle at 55% 75%,#5a564c 0 11%,transparent 12%),radial-gradient(circle at 12% 80%,#6d685c 0 6%,transparent 7%)}
.ba .tag{position:absolute;bottom:12px;font-size:.8rem;font-weight:700;background:#043561cc;color:#fff;padding:3px 10px;border-radius:99px}
.ba .tag.b{left:12px}.ba .tag.a{right:12px}
.ba .bar{position:absolute;top:0;bottom:0;left:var(--p);width:4px;margin-left:-2px;background:#fff;box-shadow:0 0 0 1px #0003}
.ba .bar::after{content:"↔";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:38px;height:38px;border-radius:50%;background:#fff;color:#043561;display:grid;place-items:center;font-weight:700}
.ba input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:ew-resize;margin:0}
.ba:has(input:focus-visible){outline:3px solid var(--sun);outline-offset:3px}
/* sections */
.strip{background:var(--tint);border:1px solid var(--line);border-radius:22px;padding:40px 48px;margin-top:64px}
.three{display:grid;grid-template-columns:repeat(3,1fr);gap:32px}
.three h3{margin-bottom:.3em}.three p{color:var(--muted);margin:0}
.towns{display:flex;flex-wrap:wrap;gap:8px;padding:0;list-style:none;margin:16px 0 0}
.towns li{border:1px solid var(--line);background:var(--surface);border-radius:99px;padding:4px 14px;font-size:.95rem}
.cta{margin-top:64px;background:var(--brand);color:var(--brand-ink);border-radius:26px;padding:40px;display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap}
.cta h2{margin:0}.cta .btn{background:var(--sun);color:#043561}
.svc{border-top:1px solid var(--line)}
.svc>div{display:grid;grid-template-columns:64px 1fr auto;gap:20px;padding:26px 0;border-bottom:1px solid var(--line);align-items:start}
.svc .ic{font-size:2.2rem;line-height:1}
.svc p{color:var(--muted);margin:0}
.svc .from{font-weight:700;color:var(--accent);white-space:nowrap}
.gal{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:24px;margin-top:28px}
.gal figcaption{padding:10px 4px;font-weight:500}
.gal figure{margin:0}
.note{color:var(--muted);font-size:.95rem}
.contact{display:grid;grid-template-columns:1fr 1.2fr;gap:48px;margin-top:24px}
.info dt{font-weight:700;margin-top:18px}.info dd{margin:0;color:var(--muted)}
form{background:var(--surface);border:1px solid var(--line);border-radius:22px;padding:28px}
label{display:block;font-weight:500;margin-bottom:14px}
input[type=text],input[type=email],input[type=tel],select,textarea{display:block;width:100%;margin-top:6px;padding:11px 12px;border:1px solid var(--line);border-radius:10px;background:var(--bg);color:var(--ink);font:inherit}
.two{display:grid;grid-template-columns:1fr 1fr;gap:14px}
footer{border-top:1px solid var(--line);padding:28px 0;color:var(--muted);font-size:.95rem}
footer .wrap{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}
@media (max-width:760px){.hero,.contact,.three,.two{grid-template-columns:1fr}.svc>div{grid-template-columns:48px 1fr}.svc .from{grid-column:2}.cta{padding:28px}.strip{padding:28px 24px}}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}
@media (max-width:760px){.lg-e{height:46px}.lg-w{height:34px}}