:root{
  --cream:#FBF8F2; --cream-2:#F4EFE5; --sand:#E9E1D2; --sage-50:#EEF3EC; --sage-100:#DFE9DB;
  --sage-300:#A9C1A3; --sage-500:#6F9468; --sage-700:#46644A; --sage-900:#25382A;
  --ink:#24302A; --muted:#5F6B63; --line:#E3DDD0; --clay:#C98B6B; --clay-50:#F8EDE6;
  --radius:18px;
  --surface:#fff; --btn-bg:#46644A; --btn-ink:#fff; --btn-hover:#25382A;
  --dark-bg:#25382A; --on-dark:#E8EFE6; --on-dark-muted:#C9D6C6; --on-dark-faint:#9FB39B; --on-dark-strong:#fff; --on-dark-eyebrow:#A9C1A3;
  --on-dark-btn:#fff; --on-dark-btn-ink:#25382A; --dark-panel:rgba(255,255,255,.06); --dark-line:rgba(255,255,255,.12); --dark-line2:rgba(255,255,255,.1); --dark-card:rgba(255,255,255,.95);
  --header-bg:rgba(251,248,242,.88); --filters-bg:rgba(251,248,242,.94); --shadow-c1:rgba(37,56,42,.05); --shadow-c2:rgba(37,56,42,.18); --pin-shadow:rgba(0,0,0,.2);
  --accent-ink:#9A5D3F; --gap-ink:#6E4532; --gap-line:#EBD3C4; --nc:#6F6F66; --np-line:#CFC6B4;
  --hero-glow-1:#EEF3EC; --hero-glow-2:#F8EDE6;
  --art-sky1:#F7EBDD; --art-sky2:#EEF3EC; --art-sun:#F2CDB4; --art-hill1:#C9D9C3; --art-hill2:#A9C1A3; --art-hill3:#6F9468;
  --art-tree1:#6F9468; --art-tree2:#46644A; --art-tree3:#587C55; --art-trunk:#5B4A3A; --art-bird:#7E8A80; --art-figure:#25382A;
  --guide1:#DFE9DB; --guide2:#F8EDE6; --guide3:#EFE9DC; --icon-ink:#46644A; --icon-light:#A9C1A3; --map-river:#BCD0E0; --map-park:#C9D9C3;
  --link:#46644A; --shadow:0 1px 2px var(--shadow-c1),0 8px 24px -12px var(--shadow-c2);

}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:Inter,system-ui,sans-serif;color:var(--ink);background:var(--cream);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:var(--link);text-decoration-thickness:1px;text-underline-offset:3px}
h1,h2,h3{font-family:Fraunces,Georgia,serif;font-weight:500;letter-spacing:-.01em;line-height:1.15;margin:0 0 .5em;color:var(--sage-900)}
h1{font-size:clamp(2.3rem,4.6vw,3.6rem)} h2{font-size:clamp(1.7rem,3vw,2.4rem)} h3{font-size:1.25rem}
p{margin:0 0 1em}
.wrap{max-width:1180px;margin:0 auto;padding:0 28px}
.eyebrow{font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;font-weight:600;color:var(--sage-500);margin-bottom:.8rem}
.lede{font-size:1.15rem;color:var(--muted);max-width:40em}
.muted{color:var(--muted)} .small{font-size:.875rem}
section{padding:88px 0}
.mock-flag{background:var(--dark-bg);color:var(--on-dark-muted);font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;text-align:center;padding:6px 12px;font-weight:600}
/* header */
.top{position:sticky;top:0;z-index:20;background:var(--header-bg);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.top .wrap{display:flex;align-items:center;justify-content:space-between;height:72px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--sage-900);font-family:Fraunces,serif;font-size:1.25rem;font-weight:500}
.brand svg{flex:none}
.nav{display:flex;gap:28px;align-items:center}
.nav a{color:var(--ink);text-decoration:none;font-size:.95rem;font-weight:500}
.nav a:hover{color:var(--sage-700)}
.btn{display:inline-flex;align-items:center;gap:8px;border:0;border-radius:999px;padding:12px 22px;font:600 .95rem Inter,sans-serif;cursor:pointer;text-decoration:none;white-space:nowrap}
.btn-primary{background:var(--btn-bg);color:var(--btn-ink)}
.btn-primary:hover{background:var(--btn-hover)}
.btn-ghost{background:var(--surface);color:var(--sage-900);border:1px solid var(--line)}
.menu-btn{display:none}
/* hero */
.hero{padding:72px 0 64px;position:relative;overflow:hidden;background:radial-gradient(1100px 500px at 85% 10%,var(--hero-glow-1),transparent 60%),radial-gradient(700px 400px at 0% 100%,var(--hero-glow-2),transparent 60%)}
.hero .wrap{display:grid;grid-template-columns:1.1fr .9fr;gap:56px;align-items:center}
.hero h1 em{font-style:italic;color:var(--sage-700)}
.search{margin-top:30px;display:flex;background:var(--surface);border:1px solid var(--line);border-radius:999px;padding:7px;box-shadow:var(--shadow);max-width:560px}
.search label{display:flex;align-items:center;gap:10px;flex:1;padding:0 14px;color:var(--muted)}
.search input{border:0;outline:0;font:500 1.02rem Inter,sans-serif;width:100%;background:transparent;color:var(--ink)}
.quick{margin-top:16px;font-size:.9rem;color:var(--muted)}
.quick a{margin-right:12px}
.hero-stats{display:flex;gap:28px;margin-top:34px;flex-wrap:wrap}
.hero-stats div{font-size:.88rem;color:var(--muted)}
.hero-stats strong{display:block;font-family:Fraunces,serif;font-size:1.7rem;font-weight:500;color:var(--sage-900)}
.hero-art{position:relative}
.hero-art svg{width:100%;height:auto;display:block}
.hero-card{position:absolute;left:-28px;bottom:26px;background:var(--surface);border-radius:16px;padding:14px 16px;box-shadow:var(--shadow);font-size:.85rem;max-width:260px;border:1px solid var(--line)}
.hero-card b{display:block;color:var(--sage-900)}
/* trust */
.trust{padding:0 0 24px}
.trust-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.trust-item{display:flex;gap:16px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:22px}
.icon{flex:none;width:44px;height:44px;border-radius:12px;background:var(--sage-50);display:grid;place-items:center;color:var(--sage-700)}
.trust-item h3{font-family:Inter,sans-serif;font-size:1rem;font-weight:600;margin:0 0 4px}
.trust-item p{margin:0;font-size:.92rem;color:var(--muted)}
/* vet vs direct */
.vvd{background:var(--dark-bg);color:var(--on-dark);border-radius:28px;padding:56px;display:grid;grid-template-columns:1.05fr .95fr;gap:48px;position:relative;overflow:hidden}
.vvd h2{color:var(--on-dark-strong)}
.vvd .eyebrow{color:var(--on-dark-eyebrow)}
.vvd p{color:var(--on-dark-muted)}
.vvd ul{padding:0;margin:0 0 24px;list-style:none}
.vvd li{display:flex;gap:10px;margin-bottom:10px;color:var(--on-dark)}
.vvd li svg{flex:none;margin-top:4px}
.vvd .btn-primary{background:var(--on-dark-btn);color:var(--on-dark-btn-ink)}
.stat-panel{background:var(--dark-panel);border:1px solid var(--dark-line);border-radius:20px;padding:26px}
.stat-row{display:flex;gap:18px;align-items:baseline;padding:14px 0;border-bottom:1px solid var(--dark-line2)}
.stat-row:last-of-type{border-bottom:0}
.stat-row strong{font-family:Fraunces,serif;font-size:2.4rem;font-weight:500;color:var(--on-dark-strong);min-width:96px}
.stat-row span{font-size:.92rem;color:var(--on-dark-muted)}
.src{font-size:.75rem;color:var(--on-dark-faint);margin-top:10px}
.price-ex{margin-top:16px;background:var(--dark-card);border-radius:14px;padding:16px 18px;color:var(--ink);font-size:.88rem}
.price-ex table{width:100%;border-collapse:collapse}
.price-ex td{padding:6px 0;border-bottom:1px solid var(--line)}
.price-ex tr:last-child td{border:0}
.price-ex td:last-child{text-align:right;font-weight:600;white-space:nowrap}
/* regions */
.section-head{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:34px}
.section-head p{margin:0}
.region-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.region{display:flex;justify-content:space-between;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:18px 20px;text-decoration:none;color:var(--ink);transition:.15s}
.region:hover{border-color:var(--sage-300);transform:translateY(-1px)}
.region b{font-weight:600;font-size:.98rem}
.region small{display:block;color:var(--muted);font-size:.82rem}
.region .arrow{color:var(--sage-500)}
.towns{margin-top:22px;display:flex;flex-wrap:wrap;gap:8px}
.chip{display:inline-flex;align-items:center;gap:6px;padding:7px 14px;border-radius:999px;background:var(--cream-2);border:1px solid var(--line);font-size:.88rem;color:var(--ink);text-decoration:none;font-weight:500}
.chip.on{background:var(--btn-bg);border-color:var(--btn-bg);color:var(--btn-ink)}
.chip .n{font-size:.75rem;opacity:.7}
/* guides */
.guides{background:var(--cream-2)}
.guide-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.guide{background:var(--surface);border-radius:var(--radius);overflow:hidden;border:1px solid var(--line);display:flex;flex-direction:column}
.guide .art{height:150px;display:grid;place-items:center}
.guide .body{padding:22px 24px 26px}
.guide h3{margin-bottom:8px}
.guide p{font-size:.93rem;color:var(--muted);margin-bottom:14px}
.tag{display:inline-block;font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;font-weight:600;color:var(--sage-700);background:var(--sage-50);padding:4px 9px;border-radius:999px;margin-bottom:10px}
/* steps */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;counter-reset:s}
.step{padding:28px;border-radius:var(--radius);background:var(--surface);border:1px solid var(--line);position:relative}
.step .num{font-family:Fraunces,serif;font-size:2.6rem;color:var(--step-num,var(--sage-300));line-height:1;margin-bottom:12px}
.step p{color:var(--muted);font-size:.95rem;margin:0}
/* faq */
.faq-wrap{display:grid;grid-template-columns:.8fr 1.2fr;gap:56px}
details{border-bottom:1px solid var(--line);padding:20px 0}
summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:20px;font-weight:600;font-size:1.05rem;color:var(--sage-900)}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";font-family:Inter;font-weight:400;font-size:1.4rem;line-height:1;color:var(--sage-500)}
details[open] summary::after{content:"–"}
details p{margin:12px 0 0;color:var(--muted)}
/* footer */
footer{background:var(--dark-bg);color:var(--on-dark-muted);padding:64px 0 34px;font-size:.92rem}
footer .grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:40px}
footer h4{color:var(--on-dark-strong);font-size:.85rem;letter-spacing:.08em;text-transform:uppercase;margin:0 0 14px}
footer a{color:var(--on-dark-muted);text-decoration:none;display:block;margin-bottom:8px}
footer .brand{color:var(--on-dark-strong);margin-bottom:12px}
footer .legal{border-top:1px solid var(--dark-line);margin-top:44px;padding-top:22px;display:flex;justify-content:space-between;gap:20px;font-size:.8rem;color:var(--on-dark-faint)}
/* ===== town page ===== */
.crumbs{font-size:.86rem;color:var(--muted);padding:22px 0 0}
.crumbs a{color:var(--muted);text-decoration:none}
.crumbs span{margin:0 8px;opacity:.5}
.town-hero{padding:26px 0 40px}
.town-hero .wrap{display:grid;grid-template-columns:1.3fr .7fr;gap:48px;align-items:end}
.checked{display:inline-flex;align-items:center;gap:8px;background:var(--sage-50);color:var(--sage-700);border:1px solid var(--sage-100);font-size:.85rem;font-weight:600;padding:6px 12px;border-radius:999px;margin-bottom:16px}
.glance{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:22px 24px;box-shadow:var(--shadow)}
.glance dl{margin:0;display:grid;grid-template-columns:1fr auto;gap:10px 16px;font-size:.92rem}
.glance dt{color:var(--muted)} .glance dd{margin:0;font-weight:600;text-align:right}
.filters{position:sticky;top:72px;z-index:10;background:var(--filters-bg);backdrop-filter:blur(8px);border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:14px 0}
.filters .wrap{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.filters .lbl{font-size:.85rem;color:var(--muted);margin-right:4px}
.filters .sort{margin-left:auto;font-size:.88rem;color:var(--muted)}
.cmp{width:100%;border-collapse:separate;border-spacing:0;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;font-size:.92rem}
.cmp th{text-align:left;font-size:.75rem;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);font-weight:600;background:var(--cream-2);padding:14px 16px;border-bottom:1px solid var(--line)}
.cmp td{padding:16px;border-bottom:1px solid var(--line);vertical-align:top}
.cmp tr:last-child td{border-bottom:0}
.cmp td.name b{display:block;color:var(--sage-900)}
.cmp td.name small{color:var(--muted)}
.yes{color:var(--sage-700);font-weight:600;display:inline-flex;gap:6px;align-items:center}
.no{color:var(--ink)}
.nc{color:var(--nc);font-style:italic}
.np{display:inline-block;background:var(--cream-2);border:1px dashed var(--np-line);color:var(--muted);border-radius:8px;padding:3px 9px;font-size:.84rem}
.price{font-weight:600;color:var(--sage-900)}
.layout{display:grid;grid-template-columns:1fr 360px;gap:36px;align-items:start}
.cards{display:grid;gap:18px}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:26px 28px;display:grid;grid-template-columns:1fr 250px;gap:28px}
.card h3{margin-bottom:4px}
.card .meta{font-size:.88rem;color:var(--muted);margin-bottom:14px}
.pill{display:inline-block;font-size:.72rem;font-weight:600;letter-spacing:.05em;text-transform:uppercase;padding:3px 9px;border-radius:999px;margin-right:6px;vertical-align:middle}
.pill.ind{background:var(--sage-50);color:var(--sage-700)} .pill.chain{background:var(--clay-50);color:var(--accent-ink)}
.svc{display:grid;grid-template-columns:1fr 1fr;gap:6px 18px;font-size:.9rem;margin:0;padding:0;list-style:none}
.svc li{display:flex;gap:8px;align-items:flex-start}
.svc li i{font-style:normal;flex:none;width:18px;text-align:center}
.pricebox{background:var(--cream);border:1px solid var(--line);border-radius:14px;padding:16px 18px;font-size:.88rem}
.pricebox h4{margin:0 0 8px;font-size:.75rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.pricebox table{width:100%;border-collapse:collapse}
.pricebox td{padding:3px 0}
.pricebox td:last-child{text-align:right;font-weight:600;color:var(--sage-900)}
.pricebox .foot{margin-top:10px;font-size:.76rem;color:var(--muted)}
.card .actions{display:flex;gap:10px;margin-top:18px;flex-wrap:wrap}
.card .actions .btn{padding:9px 16px;font-size:.88rem}
.note{font-size:.86rem;color:var(--muted);margin-top:12px}
.side{display:grid;gap:18px;position:sticky;top:150px}
.map{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.map .canvas{position:relative;aspect-ratio:1.25;background:linear-gradient(180deg,var(--sage-50),var(--cream-2))}
.map .canvas svg{position:absolute;inset:0;width:100%;height:100%}
.pin{position:absolute;transform:translate(-50%,-100%);display:flex;flex-direction:column;align-items:center}
.pin b{background:var(--btn-bg);color:var(--btn-ink);font-size:.72rem;font-weight:700;width:24px;height:24px;border-radius:50% 50% 50% 0;transform:rotate(-45deg);display:grid;place-items:center;box-shadow:0 2px 6px var(--pin-shadow)}
.pin b span{transform:rotate(45deg)}
.pin.centre b{background:var(--clay)}
.map .cap{padding:14px 18px;font-size:.8rem;color:var(--muted)}
.callout{background:var(--dark-bg);color:var(--on-dark);border-radius:var(--radius);padding:26px}
.callout h3{color:var(--on-dark-strong);font-size:1.3rem}
.callout p{font-size:.92rem;color:var(--on-dark-muted)}
.callout .btn{background:var(--on-dark-btn);color:var(--on-dark-btn-ink);padding:10px 18px;font-size:.9rem}
.box{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:22px}
.box h4{margin:0 0 10px;font-size:1rem}
.box ul{margin:0;padding-left:18px;font-size:.9rem;color:var(--muted)}
.gaps{background:var(--clay-50);border:1px solid var(--gap-line);border-radius:14px;padding:16px 18px;font-size:.88rem;color:var(--gap-ink)}
/* responsive */
@media (max-width:980px){
  .hero .wrap,.town-hero .wrap,.vvd,.faq-wrap,.layout,.card{grid-template-columns:1fr}
  .region-grid{grid-template-columns:repeat(2,1fr)}
  .guide-grid,.steps,.trust-grid{grid-template-columns:1fr}
  footer .grid{grid-template-columns:1fr 1fr}
  .side{position:static}
}
@media (max-width:640px){
  .wrap{padding:0 20px}
  section{padding:60px 0}
  .nav{display:none} .menu-btn{display:inline-flex}
  .hero{padding:40px 0 48px}
  .hero-art{display:none}
  .search{flex-direction:column;border-radius:18px;gap:6px}
  .search label{padding:10px 12px}
  .search .btn{justify-content:center}
  .hero-stats{gap:20px}
  .vvd{padding:32px 24px;border-radius:22px}
  .region-grid{grid-template-columns:1fr}
  .section-head{flex-direction:column;align-items:flex-start}
  footer .grid{grid-template-columns:1fr}
  footer .legal{flex-direction:column}
  .stat-row strong{font-size:2rem;min-width:80px}
  .cmp-wrap{overflow-x:auto}
}

.nav a.btn-primary{color:var(--btn-ink)}
@media (max-width:640px){
  .brand{font-size:1.08rem} .brand svg{width:30px;height:30px}
  .hero-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
  .hero-stats strong{font-size:1.25rem}
  .hero-stats div{font-size:.78rem;line-height:1.35}
}
/* v2 fixes */
.chip.on .n{opacity:1}
.pricebox{align-self:start}
.yes{color:var(--yes,var(--sage-700))}
.swipe-hint{display:none}
@media (max-width:640px){
  .cmp{min-width:860px}
  .cmp-wrap{position:relative;margin-right:-20px;padding-right:20px}
  .swipe-hint{display:flex;align-items:center;gap:6px;font-size:.84rem;color:var(--muted);margin:-6px 0 10px}
  .svc{grid-template-columns:1fr}
}