/* ==========================================================================
   VINEYARD — the LivingIn network design system.
   ONE stylesheet for every page on every town site.
   Change a color or a font here and it changes everywhere.
   Per-town theming happens through the variables in the :root block below.
   ========================================================================== */

:root{
  --ivory:#FFFFFF;
  --cream:#F1EFE9;
  --char:#1C1A18;
  --ink:#26221E;
  --ink-soft:#6B645E;   /* darkened from #77706A: 4.24:1 on cream failed WCAG AA; now 5.06:1 */
  --wine:#26221E;          /* per-town accent lives here */
  --wine-deep:#000;
  --sand:#CFC9BF;
  --delta:#8B6B3D;        /* secondary note / delta figures */
  /* Hero backdrop tint — one line per town. Crozet: Blue Ridge greens. */
  --hero-a:#3E4A42; --hero-b:#252E28; --hero-c:#5A6858; --hero-d:#1C2420;
  --hairline:#DDD8CD;
  --hairline-d:rgba(255,255,255,.14);
  --serif:'Cormorant Garamond',serif;
  --sans:'Manrope',sans-serif;
  --mono:'IBM Plex Mono',monospace;
  --data:'Cormorant Garamond',serif;   /* all market numbers sitewide */
}

/* ---------- base ---------- */
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:var(--sans);color:var(--ink);background:var(--ivory);line-height:1.7;font-size:15.5px;-webkit-font-smoothing:antialiased}
a{color:inherit}
img{max-width:100%;display:block}
.wrap{max-width:1140px;margin:0 auto;padding:0 28px}
.wrap-n{max-width:880px;margin:0 auto;padding:0 28px}
h1,h2,h3{font-family:var(--serif);font-weight:600;line-height:1.08;letter-spacing:-.01em;color:var(--ink)}
h2{font-size:clamp(32px,4.4vw,50px)}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.hr{border:none;border-top:1px solid var(--hairline)}

/* ---------- shared bits ---------- */
.label{font-family:var(--mono);font-size:10.5px;letter-spacing:.26em;text-transform:uppercase;color:var(--wine);font-weight:500}
.btn{display:inline-flex;align-items:center;gap:10px;background:var(--char);color:var(--ivory);text-decoration:none;font-weight:600;font-size:13px;letter-spacing:.06em;text-transform:uppercase;padding:16px 30px;border-radius:0;transition:background .25s;border:none;cursor:pointer;font-family:var(--sans)}
.btn:hover{background:var(--wine)}
.btn.wine{background:var(--wine)}
.btn.wine:hover{background:var(--wine-deep)}
.btn.ivory{background:var(--ivory);color:var(--char)}
.btn.ivory:hover{background:#fff}
.btn.line{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.55)}
.btn.line:hover{background:rgba(255,255,255,.12)}
.btn:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid var(--wine);outline-offset:2px}
.textlink{font-size:13px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;text-decoration:none;color:var(--wine);border-bottom:1px solid var(--wine);padding-bottom:3px}
.textlink:hover{color:var(--wine-deep)}
.tag{display:inline-block;font-family:var(--mono);font-size:9px;letter-spacing:.18em;text-transform:uppercase;padding:5px 10px;border:1px solid var(--sand);color:var(--ink-soft);white-space:nowrap}
.tag.pub{background:var(--char);color:#fff;border-color:var(--char)}

/* ---------- header ---------- */
header{position:fixed;top:0;left:0;right:0;z-index:60;padding:24px 0;transition:.3s}
header.scrolled{background:rgba(250,248,244,.95);backdrop-filter:blur(12px);padding:14px 0;border-bottom:1px solid var(--hairline)}
header.scrolled .logo,header.scrolled .nav-links a{color:var(--ink)}
.nav{display:flex;align-items:center;justify-content:space-between}
.logo{font-family:var(--serif);font-weight:700;font-size:21px;color:#fff;text-decoration:none;letter-spacing:.01em}
.nav-links{display:flex;gap:30px;list-style:none;font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase}
.nav-links a{text-decoration:none;color:rgba(255,255,255,.8)}
.nav-links a:hover{color:#fff}
.nav-links a[aria-current="page"]{color:#fff;border-bottom:1px solid var(--sand);padding-bottom:3px}
header.scrolled .nav-links a:hover{color:var(--wine)}
header.scrolled .nav-links a[aria-current="page"]{border-bottom-color:var(--wine)}
.nav .btn{padding:11px 20px;font-size:11px}
header:not(.scrolled) .nav .btn{background:rgba(255,255,255,.14);backdrop-filter:blur(6px)}
header:not(.scrolled) .nav .btn:hover{background:var(--wine)}
@media(max-width:940px){.nav-links{display:none}}

/* ---------- hero: bottom-aligned (home, hub pages) ---------- */
.hero{position:relative;min-height:100svh;display:flex;align-items:flex-end;color:#fff;
  /* Placeholder backdrop until real photography lands. The dark overlay is what makes
     the white hero text legible — do NOT remove it when swapping in a photo, layer the
     photo underneath it instead. Per-town tint comes from --hero-a / --hero-b. */
  background:
    linear-gradient(180deg,rgba(28,26,24,.30) 0%,rgba(28,26,24,.08) 40%,rgba(28,26,24,.78) 88%),
    linear-gradient(160deg,var(--hero-a) 0%,var(--hero-b) 30%,var(--hero-c) 55%,var(--hero-d) 100%);
  background-size:cover;background-position:center}
.hero.short{min-height:68svh}
.hero-inner{position:relative;z-index:2;width:100%;padding:0 28px 90px;max-width:1140px;margin:0 auto}
.hero .label{color:var(--sand);margin-bottom:22px;display:block}
.hero h1,.hero .hero-h{color:#fff;font-size:clamp(46px,8vw,104px);font-weight:600;max-width:980px;margin-bottom:22px;line-height:1}
.hero-sub{font-size:clamp(15px,1.9vw,19px);color:rgba(255,255,255,.84);max-width:600px;margin-bottom:40px}
.hero-ctas{display:flex;gap:14px;flex-wrap:wrap}
.hero-note{position:absolute;top:44%;left:50%;transform:translate(-50%,-50%);font-family:var(--mono);font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.34);text-align:center;pointer-events:none;width:90%}

/* ---------- hero: real-photo crossfade (home page, when hero.slideshowImages is set) ----------
   Photos + overlay are separate layers stacked BEFORE hero-inner, so hero's own
   background (the tint gradient other pages still use) is simply turned off via
   .photo-bg rather than touched — every other .hero usage is untouched. */
.hero.photo-bg{background:var(--hero-b)}
.hero-slideshow{position:absolute;inset:0;z-index:0;overflow:hidden}
.hero-slideshow .slide{position:absolute;inset:0;background-size:cover;background-position:center;opacity:0;animation:heroSlideFade 12s infinite ease-in-out}
.hero-overlay{position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(28,26,24,.30) 0%,rgba(28,26,24,.08) 40%,rgba(28,26,24,.78) 88%)}
@keyframes heroSlideFade{0%{opacity:0}4%{opacity:1}33%{opacity:1}37%{opacity:0}100%{opacity:0}}
@media (prefers-reduced-motion: reduce){.hero-slideshow .slide{animation:none;opacity:0}.hero-slideshow .slide:first-child{opacity:1}}


/* ---------- hero: centered (school + detail pages) ---------- */
.hero.center{align-items:center;justify-content:center;text-align:center}
.hero.center .hero-inner{padding:120px 28px;max-width:900px}
.hero.center h1{font-size:clamp(44px,7.6vw,98px);margin-bottom:24px}
.hero.center .hero-sub{max-width:620px;margin:0 auto 40px}
.hero.center .hero-ctas{justify-content:center}
.hero.center .hero-note{top:auto;bottom:26px;transform:translateX(-50%);font-size:10px}

/* hero data strip */
.hero-meta{margin-top:42px;display:flex;justify-content:center;flex-wrap:wrap;border-top:1px solid rgba(255,255,255,.22);padding-top:26px}
.hm{padding:0 24px;border-right:1px solid rgba(255,255,255,.22);text-align:center}
.hm:last-child{border-right:none}
.hm b{display:block;font-family:var(--data);font-size:clamp(22px,2.6vw,30px);font-weight:600;color:#fff;line-height:1;margin-bottom:8px;font-variant-numeric:tabular-nums;font-feature-settings:'lnum' 1,'tnum' 1}
.hm span{font-family:var(--mono);font-size:9px;letter-spacing:.18em;text-transform:uppercase;color:var(--sand)}
@media(max-width:760px){.hm{padding:14px 16px;border-right:none;min-width:50%}}

/* ---------- breadcrumb ---------- */
.crumb{background:var(--cream);border-bottom:1px solid var(--hairline);font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft)}
.crumb .wrap{padding-top:14px;padding-bottom:14px}
.crumb a{text-decoration:none;color:var(--ink-soft)}
.crumb a:hover{color:var(--wine)}
.crumb span{color:var(--ink)}

/* ---------- answer block ---------- */
.answer{padding-top:92px;padding-bottom:78px}
.answer-grid{display:grid;grid-template-columns:340px 1fr;gap:70px;align-items:start}
.answer .label{display:block;margin-bottom:18px}
.answer h2{font-size:clamp(36px,4.6vw,56px);line-height:1.04}
.answer .lede{font-size:19.5px;line-height:1.62;font-weight:700;color:var(--ink);border-top:1px solid var(--char);padding-top:28px}
.answer .sub{margin-top:18px;font-size:16px;font-weight:500;color:var(--ink-soft);line-height:1.75}
.answer.centered{text-align:center;padding-top:88px;padding-bottom:76px}
.answer.centered h2{margin-bottom:26px}
.answer.centered .lede,.answer.centered .sub{text-align:left}
.byline{margin-top:30px;display:flex;align-items:center;gap:14px;font-size:13.5px;color:var(--ink-soft)}
.byline .dot{flex:0 0 40px;width:40px;height:40px;border-radius:50%;background:var(--wine);display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;font-size:12px;font-family:var(--sans)}
.byline a{color:var(--ink);font-weight:700;text-decoration:none;border-bottom:1px solid var(--wine)}
@media(max-width:860px){.answer-grid{grid-template-columns:1fr;gap:34px}}

/* ---------- section scaffold ---------- */
section.blk{padding-top:96px;padding-bottom:96px}
.sec-top{text-align:center;max-width:780px;margin:0 auto 20px}
.sec-top .label{display:block;margin-bottom:16px}
.sec-answer{font-size:16.5px;font-weight:600;color:var(--ink);max-width:720px;margin:0 auto 52px;text-align:center}

/* ---------- market stats bar (generator block) ---------- */
.statsbar{background:var(--cream);border-top:1px solid var(--hairline);border-bottom:1px solid var(--hairline)}
.statsbar .wrap{display:flex;flex-wrap:wrap}
.sb{padding:36px 24px;flex:1;min-width:160px;border-right:1px solid var(--hairline);text-align:center}
.sb:last-of-type{border-right:none}
.sb b{display:block;font-family:var(--data);font-size:clamp(28px,3.2vw,40px);font-weight:600;line-height:1;font-variant-numeric:tabular-nums;font-feature-settings:'lnum' 1,'tnum' 1}
.sb span{display:block;margin-top:6px;font-family:var(--mono);font-size:10.5px;font-weight:600;color:var(--ink);text-transform:uppercase;letter-spacing:.18em}
.sb-meta{width:100%;display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;padding-bottom:26px;font-family:var(--mono);font-size:10.5px;color:var(--ink-soft);letter-spacing:.04em}
.sb-meta a{color:var(--wine);text-decoration:none;font-weight:600}
@media(max-width:760px){.sb{min-width:calc(50% - 24px);padding:24px 16px}}

/* ---------- school directory table (/schools) ---------- */
.directory{background:var(--cream);border-top:1px solid var(--hairline);border-bottom:1px solid var(--hairline)}
.dir-hold{border-top:1px solid var(--char);background:var(--ivory)}
table.dir{width:100%;border-collapse:collapse}
table.dir thead th{font-family:var(--mono);font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-soft);font-weight:500;text-align:left;padding:18px 20px 14px;border-bottom:1px solid var(--hairline)}
table.dir thead th.num,table.dir td.num{text-align:center}
tr.tier th{background:var(--char);color:#fff;padding:14px 20px;text-align:left;font-family:var(--mono);font-size:10px;letter-spacing:.22em;text-transform:uppercase;font-weight:500}
tr.tier th .tier-note{color:var(--sand);letter-spacing:.1em;margin-left:14px;text-transform:none;font-size:10px}
tr.row{border-bottom:1px solid var(--hairline);transition:background .2s}
tr.row:hover{background:var(--cream)}
tr.row td,tr.row th{padding:20px;vertical-align:middle}
tr.row th{text-align:left;font-weight:400}
.s-name{font-family:var(--serif);font-size:24px;font-weight:600;color:var(--ink);text-decoration:none;display:inline-block;line-height:1.1;border-bottom:1px solid transparent}
tr.row:hover .s-name{border-bottom-color:var(--wine)}
.s-note{display:block;font-family:var(--sans);font-size:13px;font-weight:500;color:var(--ink-soft);margin-top:7px;max-width:360px;line-height:1.5}
.accolade{display:block;font-family:var(--mono);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--wine);margin-top:9px;max-width:360px;line-height:1.6}
td.num{font-family:var(--data);font-size:16px;font-weight:600;color:var(--ink);white-space:nowrap;font-variant-numeric:tabular-nums;font-feature-settings:'lnum' 1,'tnum' 1}
td.go{text-align:right;white-space:nowrap}
td.go a{font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;text-decoration:none;color:var(--wine);font-weight:500;border-bottom:1px solid var(--sand);padding-bottom:3px}
td.go a:hover{border-bottom-color:var(--wine)}
.dir-meta,.tbl-meta{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:16px;font-family:var(--mono);font-size:10.5px;letter-spacing:.06em;color:var(--ink-soft)}
.dir-meta a,.tbl-meta a{color:var(--wine);font-weight:600;text-decoration:none}
@media(max-width:820px){
  table.dir,table.dir tbody,table.dir tr,table.dir td,table.dir th{display:block;width:100%}
  table.dir thead{display:none}
  tr.tier th .tier-note{display:block;margin:6px 0 0}
  tr.row{padding:22px 20px;border-bottom:1px solid var(--hairline)}
  tr.row td,tr.row th{padding:0}
  .s-note,.accolade{max-width:none}
  tr.row td.meta-cell{margin-top:14px}
  td.num{margin-top:10px;text-align:left}
  td.num::before{content:attr(data-label) ' ';font-family:var(--mono);font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-soft)}
  td.go{text-align:left;margin-top:14px}
}

/* ---------- feeder convergence diagram (signature) ---------- */
.converge{display:grid;grid-template-columns:1.15fr auto 1fr;gap:0;align-items:center;border-top:1px solid var(--char);padding-top:34px}
.conv-col{display:flex;flex-direction:column;gap:1px}
.conv-el{background:var(--cream);border:1px solid var(--hairline);padding:15px 18px;display:flex;justify-content:space-between;align-items:baseline;gap:14px}
.conv-el b{font-family:var(--serif);font-size:20px;font-weight:600}
.conv-el em{font-family:var(--mono);font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-soft);font-style:normal;white-space:nowrap}
.conv-arm{width:78px;height:100%;min-height:230px;position:relative}
.conv-arm svg{width:100%;height:100%;display:block;overflow:visible}
.conv-out{display:flex;flex-direction:column;gap:14px}
.conv-node{background:var(--char);color:#fff;padding:22px 24px}
.conv-node span{font-family:var(--mono);font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--sand);display:block;margin-bottom:8px}
.conv-node b{font-family:var(--serif);font-size:clamp(22px,2.6vw,29px);font-weight:600;line-height:1.1;display:block}
.conv-caption{font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);margin-top:22px;text-align:center}
@media(max-width:880px){.converge{grid-template-columns:1fr;gap:22px}.conv-arm{display:none}}

/* ---------- "A look at" dark photo section ---------- */
.look{background:var(--char);color:#fff;padding:110px 0}
.look .label{color:var(--sand)}
.look h2{color:#fff}
.look .sec-answer{color:rgba(255,255,255,.82)}
.look-grid{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:1fr;gap:14px}
.lk{position:relative;overflow:hidden;display:flex;align-items:flex-end;aspect-ratio:4/3}
.lk.tall{grid-row:span 2;aspect-ratio:auto}
.lk.wide{grid-column:span 2}
.lk::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent 52%,rgba(20,18,16,.8) 100%)}
.lk .ph{position:absolute;inset:0;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.lk:hover .ph{transform:scale(1.045)}
.lk i{position:relative;z-index:2;padding:16px 18px;font-family:var(--sans);font-size:12.5px;font-weight:600;font-style:normal}
.video-slot{margin-top:16px;border:1px solid rgba(255,255,255,.25);aspect-ratio:16/9;display:flex;align-items:center;justify-content:center;text-align:center;font-family:var(--mono);font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.45);padding:20px}
.look-foot{margin-top:46px;text-align:center}
.look-foot p{font-size:15.5px;font-weight:500;color:rgba(255,255,255,.82);max-width:680px;margin:0 auto 28px}
.look .textlink{color:var(--sand);border-color:var(--sand)}
@media(max-width:880px){
  .look-grid{grid-template-columns:repeat(2,1fr)}
  .lk.tall{grid-row:span 1;aspect-ratio:4/3}
  .lk.wide{grid-column:span 2}
}

/* ---------- zone table (school pages) ---------- */
.tbl-hold{overflow-x:auto;border-top:1px solid var(--char)}
table.zt{width:100%;border-collapse:collapse;min-width:680px}
table.zt thead th{font-family:var(--mono);font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-soft);font-weight:500;text-align:left;padding:18px 18px 14px 0;border-bottom:1px solid var(--hairline)}
table.zt tbody th{font-family:var(--serif);font-size:21px;font-weight:600;text-align:left;padding:18px 18px 18px 0;border-bottom:1px solid var(--hairline);width:30%}
table.zt tbody th a{text-decoration:none;border-bottom:1px solid transparent}
table.zt tbody tr:hover th a{border-bottom-color:var(--wine)}
table.zt td{font-size:14px;font-weight:500;padding:18px 18px 18px 0;border-bottom:1px solid var(--hairline);vertical-align:middle}
table.zt td.mono{font-family:var(--mono);font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-soft)}
table.zt tbody tr:hover th,table.zt tbody tr:hover td{background:var(--cream)}
.zone-note{margin:34px 0 0;padding:24px 26px;background:var(--cream);border-left:3px solid var(--wine);font-size:14.5px;color:var(--ink-soft)}
.zone-note.wide{margin:38px auto 0;max-width:860px}
.zone-note strong{color:var(--ink)}
.zone-note .btn{margin-top:18px}

/* ---------- feeder path cards ---------- */
.path{background:var(--cream);border-top:1px solid var(--hairline);border-bottom:1px solid var(--hairline)}
.path-row{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;border-top:1px solid var(--char);padding-top:30px}
.pnode{background:var(--ivory);border:1px solid var(--hairline);padding:26px 24px;text-decoration:none;display:block;transition:border-color .2s,transform .25s}
.pnode:hover{border-color:var(--char);transform:translateY(-3px)}
.pnode.here{background:var(--char);color:#fff;border-color:var(--char)}
.pnode em{font-family:var(--mono);font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-soft);font-style:normal;display:block;margin-bottom:10px}
.pnode.here em{color:var(--sand)}
.pnode b{font-family:var(--serif);font-size:24px;font-weight:600;line-height:1.12;display:block;margin-bottom:8px}
.pnode.here b{color:#fff}
.pnode p{font-size:13.5px;font-weight:500;color:var(--ink-soft)}
.pnode.here p{color:rgba(255,255,255,.75)}
.pnode .textlink{font-size:11px;margin-top:14px;display:inline-block}
@media(max-width:820px){.path-row{grid-template-columns:1fr}}

/* ---------- trade-offs ---------- */
.tradeoffs{display:grid;grid-template-columns:1fr 1fr;gap:0;border-top:1px solid var(--char)}
.to{padding:34px 38px 38px 0}
.to:last-child{padding-left:38px;padding-right:0;border-left:1px solid var(--hairline)}
.to h3{font-size:27px;margin-bottom:20px}
.to ul{list-style:none}
.to li{font-size:15px;font-weight:500;padding:13px 0;border-bottom:1px solid var(--hairline);display:flex;gap:14px}
.to li::before{content:'+';font-family:var(--mono);color:var(--wine);flex-shrink:0}
.to.watch li::before{content:'–'}
@media(max-width:820px){
  .tradeoffs{grid-template-columns:1fr}
  .to{padding:30px 0}
  .to:last-child{padding-left:0;border-left:none;border-top:1px solid var(--hairline)}
}

/* ---------- neighborhood cards (home) ---------- */
.hood-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.hood{text-decoration:none;display:block}
.hood .frame{aspect-ratio:16/10;overflow:hidden;position:relative}
.hood .ph{position:absolute;inset:0;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.hood:hover .ph{transform:scale(1.045)}
.hood-cap{border-top:1px solid var(--char);margin-top:18px;padding-top:14px;display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.hood-cap h3{font-size:25px}
.hood-cap .band{font-family:var(--mono);font-size:11px;color:var(--wine);white-space:nowrap;letter-spacing:.04em}
.hood p{padding-top:6px;font-size:14px;font-weight:500;color:var(--ink)}
.hood-more{margin-top:56px;text-align:center}
@media(max-width:880px){.hood-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.hood-grid{grid-template-columns:1fr}}
/* Phones: the homepage grid is a preview, not a directory. Below 560px only the
   neighborhoods flagged `featured: true` in the fact sheet are shown; the button
   underneath carries the rest. The hub grid (/neighborhoods/) has no .hood-preview
   class and always shows everything. :has() is the guard — a town that flags none
   of its neighborhoods still gets the full grid rather than an empty one. */
@media(max-width:560px){
  .hood-preview:has(.hood-featured) .hood:not(.hood-featured){display:none}
}

/* Phones, the hub (/neighborhoods/): two cards per row rather than one. Fifteen
   full-width cards is a very long scroll; two-up lets someone take in the whole
   town in a few flicks. The caption stacks and the type steps down because the
   column is ~157px at 390px wide — name beside price band does not fit there.
   The homepage preview is excluded: it is showing three cards, not fifteen, so
   it keeps the full-width treatment. */
@media(max-width:560px){
  .hood-grid:not(.hood-preview){grid-template-columns:repeat(2,1fr);gap:22px}
  .hood-grid:not(.hood-preview) .hood-cap{flex-direction:column;align-items:flex-start;
    gap:3px;margin-top:12px;padding-top:10px}
  .hood-grid:not(.hood-preview) .hood-cap h3{font-size:17.5px;line-height:1.14}
  .hood-grid:not(.hood-preview) .hood-cap .band{font-size:10px}
  .hood-grid:not(.hood-preview) .hood p{padding-top:5px;font-size:12.5px;line-height:1.45}
}

/* ---------- movers / nearby / zone cards ---------- */
.mover-grid,.near-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:40px}
.mover,.near{border-top:1px solid var(--char);padding-top:22px;text-decoration:none;display:block;transition:border-color .2s}
.mover:hover,.near:hover{border-top-color:var(--wine)}
.mover h3,.near h3{font-size:25px;margin-bottom:10px}
.near em{font-family:var(--mono);font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-soft);font-style:normal;display:block;margin-bottom:10px}
.mover p,.near p{font-size:14px;font-weight:500;color:var(--ink);margin-bottom:16px}
.mover .textlink,.near .textlink{font-size:11px}
@media(max-width:820px){.mover-grid,.near-grid{grid-template-columns:1fr;gap:32px}}

.zones{background:var(--cream);border-top:1px solid var(--hairline);border-bottom:1px solid var(--hairline)}
.zone-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.zone-card{background:var(--ivory);border:1px solid var(--hairline);padding:28px 26px;text-decoration:none;display:block;transition:border-color .2s,transform .25s}
.zone-card:hover{border-color:var(--char);transform:translateY(-3px)}
.zone-card em{font-family:var(--mono);font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-soft);font-style:normal;display:block;margin-bottom:10px}
.zone-card h3{font-size:24px;margin-bottom:8px}
.zone-card p{font-size:14px;font-weight:500;color:var(--ink);margin-bottom:16px}
.zone-card .textlink{font-size:12px}
@media(max-width:880px){.zone-grid{grid-template-columns:1fr}}

/* ---------- schools split (home) ---------- */
.schools{background:var(--cream);border-top:1px solid var(--hairline);border-bottom:1px solid var(--hairline)}
.school-split{display:grid;grid-template-columns:1.05fr 1fr;gap:70px;align-items:center}
.school-split .label{display:block;margin-bottom:16px}
.school-split h2{margin-bottom:18px}
.school-split .lead-p{font-size:16.5px;font-weight:600;color:var(--ink);max-width:500px}
.feeder{border-top:1px solid var(--char)}
.feeder-step{display:flex;align-items:baseline;gap:20px;padding:22px 2px;border-bottom:1px solid var(--hairline)}
.feeder-step .n{font-family:var(--mono);font-size:10px;color:var(--wine);letter-spacing:.2em;text-transform:uppercase;width:100px;flex-shrink:0}
.feeder-step b{font-family:var(--serif);font-size:22px;font-weight:600}
.schools .btn{margin-top:28px}
@media(max-width:840px){.school-split{grid-template-columns:1fr;gap:40px}}

/* ---------- private school cards ---------- */
.school-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:44px 40px}
.school{border-top:1px solid var(--char);padding-top:22px;transition:border-color .2s}
.school:hover{border-top-color:var(--wine)}
.school-head{display:flex;justify-content:space-between;align-items:baseline;gap:14px}
.school-head h3{font-size:27px}
.school-head h3 a{text-decoration:none;border-bottom:1px solid transparent}
.school:hover .school-head h3 a{border-bottom-color:var(--wine)}
.school p{font-size:14.5px;font-weight:500;color:var(--ink);margin:10px 0 16px}
.school .meta{font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft);border-top:1px solid var(--hairline);padding-top:12px;margin-bottom:14px}
.school .textlink{font-size:12px}
@media(max-width:820px){.school-grid{grid-template-columns:1fr;gap:38px}}

/* ---------- FAQ ---------- */
.faq details{border-bottom:1px solid var(--hairline)}
.faq details:first-of-type{border-top:1px solid var(--char)}
.faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:26px 4px;font-family:var(--serif);font-weight:600;font-size:22px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:'+';font-family:var(--mono);font-size:20px;color:var(--wine);flex-shrink:0;font-weight:400}
.faq details[open] summary::after{content:'–'}
.faq .a{padding:0 4px 28px;font-size:15px;font-weight:500;color:var(--ink);max-width:740px}
.faq .a a{color:var(--wine);font-weight:700;text-decoration:none}
.faq .a a:hover{text-decoration:underline}
.faq-foot{margin-top:30px;text-align:center}

/* ---------- author ---------- */
.author{border-top:1px solid var(--char);padding-top:30px;display:grid;grid-template-columns:96px 1fr;gap:28px;align-items:start}
.author .avatar{width:96px;height:96px;border-radius:50%;background:linear-gradient(150deg,#5A6858,#252E28);display:flex;align-items:center;justify-content:center;color:#fff;font-family:var(--serif);font-size:30px;font-weight:700}
.author h3{font-size:25px;margin-bottom:8px}
.author p{font-size:15px;font-weight:500;color:var(--ink-soft);max-width:660px;margin-bottom:14px}
@media(max-width:640px){.author{grid-template-columns:1fr}}

/* ---------- lead capture ---------- */
.capture{background:var(--wine);color:#fff;padding:110px 0}
.cap-split{display:grid;grid-template-columns:1.05fr 1fr;gap:80px;align-items:center}
.capture .label{color:#D8D3CA}
.capture h2{color:#fff;margin:16px 0 18px}
.capture .lead-p{color:rgba(255,255,255,.78);font-size:16px;max-width:460px;margin-bottom:28px}
.cap-points{list-style:none;display:flex;flex-direction:column;gap:13px}
.cap-points li{display:flex;gap:14px;font-size:14.5px;font-weight:600;color:rgba(255,255,255,.92)}
.cap-points li::before{content:'—';color:#D8D3CA}
.cap-form{background:var(--ivory);color:var(--ink);padding:44px 42px}
.cap-form h3{font-size:26px;margin-bottom:4px}
.cap-form .fine{font-size:12.5px;color:var(--ink-soft);margin-bottom:26px}
.field{margin-bottom:16px}
.field label{display:block;font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:8px}
/* "(optional …)" hint inside a field label — lower-case and lighter so the label
   still scans as a label and the hint reads as an aside, not a second label. */
.field label .opt{text-transform:none;letter-spacing:.02em;color:var(--ink-soft);opacity:.72;font-size:10.5px}
.field input,.field select,.field textarea{width:100%;background:transparent;border:none;border-bottom:1px solid #C9C2B6;padding:10px 2px;color:var(--ink);font-family:var(--sans);font-size:15px;border-radius:0}
.field input:focus,.field select:focus,.field textarea:focus{border-bottom-color:var(--wine);outline:none}
/* Textarea inherits the underline field styling above; these are the only differences.
   Vertical-only resize so a visitor can't drag it wider than the form column. */
.field textarea{border:1px solid #C9C2B6;padding:12px;min-height:110px;resize:vertical;line-height:1.55}
.field textarea:focus{border-color:var(--wine)}
.field textarea::placeholder{color:#A79F95}
.cap-form .btn{width:100%;justify-content:center;margin-top:14px}
.cap-form .privacy{margin-top:16px;font-size:11.5px;color:var(--ink-soft);text-align:center}
.cap-form .privacy a{color:var(--ink-soft)}
@media(max-width:880px){.cap-split{grid-template-columns:1fr;gap:46px}.cap-form{padding:34px 26px}}

/* ---- TOGGLE FIELDS -------------------------------------------------------
   Radio and checkbox groups rendered as tap targets, used by the budget,
   must-haves and timeline questions in partials/capture-ask.njk.

   The input is visually hidden but is still the real control: it keeps
   keyboard focus, :checked state and form submission, so the whole thing
   works with no JavaScript. The label must stay the input's IMMEDIATE next
   sibling or .tgl-in:checked + .tgl-lab stops matching — do not wrap the
   pairs in per-option divs.

   .tgl-in is absolutely positioned, so it is out of flow and never becomes a
   flex item in .tgl-row.

   44px minimum height is the tap-target floor, not a look. Town-agnostic:
   the options come from <town>.json, this styling is shared by the network.
   ------------------------------------------------------------------------- */
.cap-tall .cap-split{align-items:start}
.tgl-set{border:none;padding:0;margin:0 0 22px;min-width:0}
.tgl-set legend{display:block;padding:0;font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:9px}
.tgl-hint{font-size:12.5px;line-height:1.5;color:var(--ink-soft);margin:-2px 0 10px}
.tgl-sub{font-family:var(--mono);font-size:9.5px;letter-spacing:.18em;text-transform:uppercase;color:#A79F95;margin:15px 0 7px}
.tgl-sub:first-of-type{margin-top:2px}
.tgl-row{display:flex;flex-wrap:wrap;gap:8px;position:relative}
.tgl-in{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.tgl-lab{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 15px;background:var(--ivory);border:1px solid #C9C2B6;color:var(--ink);font-family:var(--sans);font-size:14.5px;font-weight:600;line-height:1.25;text-align:center;cursor:pointer;transition:background .18s,border-color .18s,color .18s}
.tgl-lab:hover{border-color:var(--wine)}
.tgl-in:checked + .tgl-lab{background:var(--wine);border-color:var(--wine);color:#fff}
.tgl-in:focus-visible + .tgl-lab{outline:2px solid var(--wine);outline-offset:2px}
@media(prefers-reduced-motion:reduce){.tgl-lab{transition:none}}

/* ---------- footer ---------- */
footer{background:var(--char);color:rgba(255,255,255,.55);padding:64px 0 40px;font-size:13.5px}
.foot-top{display:grid;grid-template-columns:2fr 1fr 1fr;gap:40px;padding-bottom:40px;border-bottom:1px solid var(--hairline-d);margin-bottom:26px}
.foot-top h4{font-family:var(--mono);font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:var(--sand);margin-bottom:16px;font-weight:500}
.foot-top ul{list-style:none}
.foot-top li{margin-bottom:9px}
.foot-top a{text-decoration:none;color:rgba(255,255,255,.55)}
.foot-top a:hover{color:#fff}
.foot-brand{font-family:var(--serif);font-size:24px;font-weight:700;color:#fff;margin-bottom:12px}
.foot-bottom{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;align-items:center}
footer strong{color:#fff;font-weight:600}
.eho{font-family:var(--mono);font-size:10.5px;letter-spacing:.08em}
@media(max-width:760px){.foot-top{grid-template-columns:1fr}}

/* ---------- things to do strip (home) ---------- */
.life{background:var(--char);color:#fff;padding:110px 0}
.life .label{color:var(--sand)}
.life h2{color:#fff}
.life .sec-answer{color:rgba(255,255,255,.82)}
.life-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin:0 0 46px}
.life-card{position:relative;aspect-ratio:4/3;overflow:hidden;display:flex;align-items:flex-end}
.life-card::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(20,18,16,.75) 100%)}
.life-card .ph{position:absolute;inset:0;transition:transform .6s}
.life-card:hover .ph{transform:scale(1.04)}
.life-card span{position:relative;z-index:2;padding:18px 20px;font-size:13px;font-weight:600;letter-spacing:.02em}
.life-foot{text-align:center}
.life-foot p{font-size:15.5px;font-weight:500;color:rgba(255,255,255,.82);max-width:620px;margin:0 auto 30px}
.life .textlink{color:var(--sand);border-color:var(--sand)}
@media(max-width:880px){.life-strip{grid-template-columns:repeat(2,1fr)}}

/* ---------- neighbourhood pages (Old Trail pattern) ---------- */
/* amenity look — dark band, photo grid + video slot */
.look-card{position:relative;aspect-ratio:4/3;overflow:hidden;display:flex;align-items:flex-end}
.look-card::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(20,18,16,.75) 100%)}
.look-card .ph{position:absolute;inset:0;transition:transform .6s}
.look-card:hover .ph{transform:scale(1.04)}
.look-card span{position:relative;z-index:2;padding:16px 18px;font-size:13px;font-weight:600}
@media(max-width:820px){.look-grid{grid-template-columns:repeat(2,1fr)}}

/* market snapshot — cream stat strip */
.statband{background:var(--cream);border-top:1px solid var(--hairline);border-bottom:1px solid var(--hairline);padding:84px 0}
.statband .sec-top{margin-bottom:12px}
.takeaway{font-size:16px;color:var(--ink);max-width:680px;margin:0 auto 44px;text-align:center}
.stats{display:flex;flex-wrap:wrap}
.source{font-family:var(--mono);font-size:10.5px;color:var(--ink-soft);margin-top:30px;text-align:center;letter-spacing:.04em}
@media(max-width:760px){.sb{min-width:calc(50% - 30px);padding:22px 20px 22px 0}}

/* budget tiers */
.tier-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:40px}
.tier .t-label{font-family:var(--mono);font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-soft);display:block;margin-bottom:10px}
@media(max-width:820px){.tier-grid{grid-template-columns:1fr;gap:32px}}

/* trade-offs — two columns */
.trade{background:var(--cream);border-top:1px solid var(--hairline);border-bottom:1px solid var(--hairline)}
.trade-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px}
.trade-col h3{font-size:28px;margin-bottom:22px;padding-bottom:14px;border-bottom:1px solid var(--char)}
.trade-col ul{list-style:none;display:flex;flex-direction:column;gap:16px}
.trade-col li{display:flex;gap:14px;font-size:15px}
.trade-col li::before{content:'—';color:var(--ink-soft);flex-shrink:0}
.trade-col li b{font-weight:700}
@media(max-width:820px){.trade-grid{grid-template-columns:1fr;gap:44px}}

/* nearby */
.schools-cta{text-align:center;margin-top:36px}
.near-cap{border-top:1px solid var(--char);margin-top:16px;padding-top:12px;display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.near-cap h3{font-size:22px}
.near-cap .band{font-family:var(--mono);font-size:11px;color:var(--ink-soft);white-space:nowrap}
@media(max-width:820px){.near-grid{grid-template-columns:1fr}}

/* CTA band */
.cta-band{background:var(--char);color:#fff;text-align:center;padding:100px 20px}
.cta-band .label{color:var(--sand);display:block;margin-bottom:16px}
.cta-band h2{color:#fff;margin-bottom:16px}
.cta-band p{color:rgba(255,255,255,.68);max-width:520px;margin:0 auto 34px}
.cta-band .ctas{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}

@media(max-width:820px){.look-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:820px){.tier-grid{grid-template-columns:1fr;gap:32px}}
@media(max-width:820px){.trade-grid{grid-template-columns:1fr;gap:44px}}
@media(max-width:820px){.near-grid{grid-template-columns:1fr}}

/* ---------- budget tier cards ---------- */
.tier{border-top:1px solid var(--char);padding-top:22px}
.tier h3{font-size:30px;margin-bottom:12px}
.tier p{font-size:14.5px;color:var(--ink-soft)}

/* ---------- feeder rows with a note under the school name ---------- */
.feeder-step div b{font-family:var(--serif);font-size:23px;font-weight:600;display:block}
.feeder-step div p{font-size:13.5px;color:var(--ink-soft);margin-top:4px}

/* ---------- stats strip: last cell drops its divider ---------- */
.sb:last-child{border:none;margin:0}

/* Sub-page heroes sit slightly shorter than the home hero so the answer card peeks. */
.hero.sub-page{min-height:92svh}

/* ---------- answer card variant (neighbourhood pages) ---------- */
/* The home page answer is a two-column grid. Neighbourhood pages use the
   centred serif card from the approved Old Trail layout. Same block, two looks. */
.answer.card{padding:96px 0 84px;text-align:center}
.answer.card .label{display:block;margin-bottom:24px}
.answer.card .lede{font-family:var(--serif);font-size:clamp(24px,3.4vw,38px);line-height:1.32;font-weight:500;color:var(--ink);max-width:900px;margin:0 auto;border-top:none;padding-top:0}
.answer.card .sub{margin:26px auto 0;font-size:16px;font-weight:400;color:var(--ink-soft);max-width:620px}

/* ---------- nearby neighbourhood cards ---------- */
.near{text-decoration:none;display:block}
.near .frame{aspect-ratio:16/10;overflow:hidden;position:relative}
.near .ph{position:absolute;inset:0;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.near:hover .ph{transform:scale(1.045)}

/* ---------- motion preference ---------- */
@media (prefers-reduced-motion: reduce){
  *{transition:none!important;scroll-behavior:auto}
  .lk:hover .ph,.hood:hover .ph,.life-card:hover .ph,.look-card:hover .ph,.near:hover .ph,.pnode:hover,.zone-card:hover{transform:none}
}


/* ==========================================================================
   NEIGHBORHOOD PAGE v2 (July 2026 approved layout)
   New, namespaced components — nothing below overrides existing pages.
   ========================================================================== */

/* data table — first thing after the hero */
.statsbar5{background:var(--cream);border-top:1px solid var(--hairline);border-bottom:1px solid var(--hairline)}
.statsbar5 .wrap{padding-top:0;padding-bottom:0}
.stats5{display:grid;grid-template-columns:repeat(5,1fr)}
.stats5 .st{padding:36px 24px;text-align:center;border-right:1px solid var(--hairline)}
.stats5 .st:last-child{border-right:none}
.stats5 .st b{display:block;font-family:var(--data);font-size:clamp(28px,3.2vw,40px);font-weight:600;line-height:1;color:var(--char);font-variant-numeric:tabular-nums;font-feature-settings:'lnum' 1,'tnum' 1}
.stats5 .st span{display:block;margin-top:6px;font-family:var(--mono);font-size:10.5px;font-weight:600;color:var(--ink);text-transform:uppercase;letter-spacing:.18em}
.stats5-meta{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;padding-bottom:26px;font-family:var(--mono);font-size:10.5px;color:var(--ink-soft);letter-spacing:.04em}
.stats5-meta a{color:var(--wine);text-decoration:none;font-weight:600}
@media(max-width:860px){.stats5{grid-template-columns:repeat(2,1fr)}.stats5 .st{padding:24px 16px}.stats5 .st:nth-child(2n){border-right:none}.stats5 .st:last-child{grid-column:span 2;border-right:none}}

/* budget tiers — card style, data-font prices */
.tier-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.tierc{border:1px solid var(--hairline);background:#fff;padding:32px 30px}
.tierc .band{font-family:var(--data);font-size:25px;font-weight:500;color:var(--char);display:block;margin-bottom:6px}
.tierc h3{font-family:var(--sans);font-size:13px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:16px}
.tierc p{font-size:15px;font-weight:500;color:var(--ink);line-height:1.65}
@media(max-width:820px){.tier-grid{grid-template-columns:1fr}}

/* what it's like — icon bank inside the existing dark .look section */
.icon-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.icon-card{border:1px solid var(--hairline-d);padding:34px 28px;text-align:center;transition:border-color .25s,background .25s}
.icon-card:hover{border-color:rgba(255,255,255,.35);background:rgba(255,255,255,.03)}
.icon-card svg{width:44px;height:44px;stroke:var(--sand);stroke-width:1.4;fill:none;stroke-linecap:round;stroke-linejoin:round;margin:0 auto 18px;display:block}
.icon-card h3{font-family:var(--sans);color:#fff;font-size:16px;font-weight:700;margin-bottom:8px;letter-spacing:.01em}
.icon-card p{font-size:13.5px;font-weight:500;color:rgba(255,255,255,.65);line-height:1.6}
@media(max-width:820px){.icon-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:540px){.icon-grid{grid-template-columns:1fr}}

/* comparison picker + table */
.compare-pick{display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap;margin-bottom:28px}
.compare-pick label{font-family:var(--sans);font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft)}
.compare-pick select{font-family:var(--sans);font-size:15px;font-weight:600;color:var(--ink);background:#fff;border:1px solid var(--char);padding:12px 16px;border-radius:0;cursor:pointer}
.compare-pick select:focus{outline:3px solid var(--wine);outline-offset:2px}
.table-scroll{overflow-x:auto}
.compare-table{width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--hairline)}
.compare-table th{font-family:var(--sans);font-size:14px;font-weight:700;letter-spacing:.02em;padding:20px 22px;text-align:center;background:#fff;border-bottom:1px solid var(--hairline)}
.compare-table th:first-child{width:24%;background:transparent}
.compare-table th.hl{background:var(--char);color:var(--ivory)}
.compare-table td{padding:16px 22px;font-size:15px;font-weight:500;border-bottom:1px solid var(--hairline);vertical-align:middle;text-align:center;font-variant-numeric:tabular-nums;line-height:1.55}
.compare-table td:first-child{font-size:10.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);text-align:left;background:transparent}
.compare-table tbody tr:nth-child(even) td{background:#FBFAF6}
.compare-table td.hl{background:var(--cream);font-family:var(--data);font-size:17px;font-weight:600;border-left:1px solid var(--hairline);border-right:1px solid var(--hairline);font-variant-numeric:tabular-nums;font-feature-settings:'lnum' 1,'tnum' 1}
.compare-table tbody tr:nth-child(even) td.hl{background:#EFEBE2}
.compare-table tr:last-child td{border-bottom:none;font-family:var(--serif);font-size:16.5px;font-style:italic;font-weight:500;color:var(--ink)}
.compare-table tr:last-child td:first-child{font-family:var(--sans);font-size:10.5px;font-style:normal;color:var(--ink-soft)}
.compare-table small{font-size:11px;font-weight:600;color:var(--ink-soft)}
.cmp-note{font-size:13px;font-weight:500;color:var(--ink-soft);text-align:center;margin-top:14px;max-width:640px;margin-left:auto;margin-right:auto}

/* schools strip — full-size band */
.school-strip{background:var(--cream);border-top:1px solid var(--hairline);border-bottom:1px solid var(--hairline);padding:90px 0}
.school-line{display:flex;align-items:center;justify-content:center;gap:24px;flex-wrap:wrap;margin-bottom:24px}
.school-line .step{font-family:var(--sans);font-size:19px;font-weight:700;color:var(--ink)}
.school-line .step small{display:block;font-size:10px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:2px}
.school-line .arrow{color:var(--sand);font-size:24px}
.school-strip .fine{text-align:center;font-size:15px;font-weight:500;color:var(--ink-soft);max-width:660px;margin:0 auto}
.school-strip .fine strong{color:var(--ink);font-weight:700}
.school-strip .fine a{color:var(--wine);font-weight:700;text-decoration:none}
.school-strip .fine a:hover{text-decoration:underline}

/* new-construction buyer note */
.buynote{background:var(--ivory);border-top:1px solid var(--hairline)}
.buynote .sec-answer{margin-bottom:0}

/* ===== COST OF LIVING ===== */
/* ============================================================
   COST OF LIVING — additions to site.css (matches preview v4)
   Paste at the bottom of src/css/site.css.
   Token-based (--serif/--sans/--mono/--ink/etc.) so it inherits
   the live design system. The --data token is defined once at the
   top of this file; do not redeclare it here.
   ============================================================ */

/* ---- Page hero (skip if an identical .page-hero already exists) ---- */
.page-hero{background:var(--cream);border-bottom:1px solid var(--hairline);padding:88px 0 64px}
.page-hero h1{font-size:clamp(42px,6.4vw,74px);max-width:820px;margin:18px 0 20px}
.page-hero .hero-sub{font-size:clamp(15px,1.9vw,17.5px);color:var(--ink-soft);max-width:560px}

/* ---- Answer card (prose variant) ---- */
.answer-card{padding:56px 28px 0}
.answer-card .lede{font-size:20px;line-height:1.6;font-weight:700;color:var(--ink);border-top:1px solid var(--char);padding-top:26px;max-width:820px}
.answer-card .sub{margin-top:18px;font-size:16px;font-weight:500;color:var(--ink-soft);line-height:1.75;max-width:760px}

/* ---- Stats strip with even 3-line cells ---- */
.col-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:0;background:var(--cream);border-top:1px solid var(--hairline);border-bottom:1px solid var(--hairline)}
.col-stat{padding:36px 24px 30px;border-right:1px solid var(--hairline);text-align:center}
.col-stat:last-child{border-right:none}
.col-stat b{display:block;font-family:var(--data);font-size:clamp(28px,3.2vw,40px);font-weight:600;line-height:1;color:var(--ink);font-variant-numeric:tabular-nums;font-feature-settings:'lnum' 1,'tnum' 1}
.col-stat span{display:block;margin-top:6px;font-family:var(--mono);font-size:10.5px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--ink)}
.col-stat .yoy{display:block;margin-top:10px;font-family:var(--mono);font-style:normal;font-size:11px;letter-spacing:.04em;color:var(--ink-soft)}
.col-stat .yoy.up{color:#3E6B4F}
.col-stat .yoy.down{color:#8A5A3A}
@media(max-width:760px){.col-stats{grid-template-columns:repeat(2,1fr)}.col-stat{padding:24px 16px 20px}.col-stat:nth-child(2n){border-right:none}}

/* ---- Datelines & caveats ---- */
.dateline{margin-top:16px;font-family:var(--mono);font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-soft)}
.table-caveat{margin-top:12px;font-size:13.5px;color:var(--ink-soft);max-width:640px}

/* ---- Comparison bar scale ---- */
.cmp{border-top:1px solid var(--char);max-width:860px}
.cmp-row{padding:24px 0;border-bottom:1px solid var(--hairline)}
.cmp-head{display:flex;justify-content:space-between;align-items:baseline;gap:16px;margin-bottom:10px}
.cmp-name{font-size:15px;font-weight:700;letter-spacing:.02em}
.cmp-val{font-family:var(--data);font-size:31px;font-weight:600}
.cmp-track{height:10px;background:var(--cream)}
.cmp-track i{display:block;height:100%;background:var(--sand)}
.cmp-row.is-crozet .cmp-track i{background:var(--wine)}
.cmp-row.is-crozet .cmp-name{font-family:var(--mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--wine)}
.cmp-note{margin-top:10px;font-size:13.5px;color:var(--ink-soft);max-width:640px}

/* ---- Price-tier bars with counts ---- */
.tier-bars{border-top:1px solid var(--char)}
.tier-row{display:grid;grid-template-columns:170px 1fr 64px;grid-template-rows:auto auto;align-items:center;column-gap:22px;padding:22px 0;border-bottom:1px solid var(--hairline)}
.tier-band{font-family:var(--data);font-size:23px;font-weight:600;color:var(--ink)}
.tier-count{display:block;font-style:normal;font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);margin-top:2px}
.tier-track{height:6px;background:var(--cream);position:relative}
.tier-fill{height:100%;background:var(--wine)}
.tier-pct{font-family:var(--mono);font-size:14px;font-weight:600;color:var(--ink);text-align:right}
.tier-row .tier-note{grid-column:1/-1;margin-top:8px;font-size:14px;color:var(--ink-soft)}
@media(max-width:640px){.tier-row{grid-template-columns:1fr 56px;row-gap:10px}.tier-band{grid-column:1/-1}}

/* ---- Data tables (neighborhood + HOA) ---- */
.col-table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
.col-table{width:100%;border-collapse:collapse;min-width:620px}
.col-table th{font-family:var(--mono);font-size:10.5px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-soft);text-align:left;padding:0 18px 12px 0;border-bottom:1px solid var(--char)}
.col-table td{font-family:var(--data);font-size:21px;font-weight:600;color:var(--ink);font-variant-numeric:tabular-nums;font-feature-settings:'lnum' 1,'tnum' 1;padding:16px 18px 16px 0;border-bottom:1px solid var(--hairline);white-space:nowrap;vertical-align:middle;line-height:1.3}
.col-table td.num,.col-table th.num{text-align:center;padding-right:18px;padding-left:18px}
.col-table td:first-child{font-family:var(--sans);font-size:15px;font-weight:600;white-space:normal}
.col-table td.txt{font-family:var(--sans);font-size:14px;font-weight:500;white-space:normal;color:var(--ink-soft)}
.col-table td a{color:var(--ink);text-decoration:none}
.col-table td a:hover{color:var(--wine)}
.col-table tr.low-sample td{color:var(--ink-soft)}
.ls-flag{display:block;width:max-content;margin-top:5px;font-family:var(--mono);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);border:1px solid var(--hairline);padding:3px 8px}

/* ---- True monthly cost chart ---- */
.monthly-grid{border-top:1px solid var(--char);max-width:760px}
.monthly-line{display:grid;grid-template-columns:1fr auto;column-gap:24px;align-items:baseline;padding:20px 0;border-bottom:1px solid var(--hairline)}
.monthly-line span{font-size:15px;font-weight:700;color:var(--ink)}
.monthly-line b{font-family:var(--data);font-size:29px;font-weight:600;color:var(--ink);text-align:right;font-variant-numeric:tabular-nums;font-feature-settings:'lnum' 1,'tnum' 1}
.monthly-line b.pend{color:var(--ink-soft);font-weight:500;font-style:italic}
.monthly-line em{grid-column:1/-1;font-style:normal;font-size:12.5px;color:var(--ink-soft);margin-top:5px;max-width:560px}
.monthly-line.total{border-bottom:2px solid var(--char)}
.monthly-line.total b{font-size:38px}
.monthly-bar{grid-column:1/-1;height:6px;background:var(--cream);margin-top:10px}
.monthly-bar i{display:block;height:100%;background:var(--wine)}

/* ---- HOA Q&A + shared bits ---- */
.body-p{max-width:720px;font-size:15.5px;color:var(--ink);margin:0 0 18px}
.mover-links{display:flex;gap:28px;flex-wrap:wrap;margin-top:26px}
.hoa-q{max-width:760px;margin-top:34px}
.hoa-q h3{margin-top:38px;margin-bottom:10px;font-size:24px}
.hoa-q h3:first-child{margin-top:0}
.hoa-q p{font-size:15px;color:var(--ink);max-width:720px}

/* ==========================================================================
   SECONDARY SCHOOL PAGES (middle / high / private)
   Ported verbatim from the approved Western, Henley, Field School and Miller
   drafts. Every rule here is town-agnostic — a new town reuses all of it and
   supplies only the values in its own <town>.json under schools.secondary[].
   ========================================================================== */

/* ---- hero variant: content bottom-anchored AND centered, stats baked in ----
   The shared .hero above is bottom-LEFT. Secondary school pages are
   bottom-CENTER with a stat row inside the green. This is a modifier, not a
   rewrite, so the home page and hub heroes are untouched. */
.hero.stat-hero{display:flex;flex-direction:column;align-items:stretch;justify-content:flex-end;overflow:hidden}
.hero.stat-hero .hero-inner{padding:0 28px 46px;max-width:1140px;margin:0 auto;text-align:center}
.hero.stat-hero h1{font-size:clamp(44px,7.6vw,96px);max-width:900px;margin:0 auto 22px}
.hero.stat-hero .hero-sub{font-size:clamp(15px,1.9vw,18px);color:rgba(255,255,255,.82);max-width:620px;margin:0 auto 34px}
.hero.stat-hero .hero-ctas{justify-content:center;margin-bottom:44px}
.hero.stat-hero .hero-note{position:static;transform:none;width:auto;pointer-events:auto;
  padding:22px 28px 0;font-size:10.5px;letter-spacing:.18em;color:rgba(255,255,255,.35);margin:0}
.hero-rule{border:none;border-top:1px solid rgba(255,255,255,.22);max-width:1140px;margin:0 auto}

/* stat row baked directly into the green — data-font numbers, mono caps labels */
.hero-stats{display:flex;flex-wrap:wrap;justify-content:center;padding-top:44px}
.hero-stats .stat{flex:0 1 200px;padding:0 28px;border-right:1px solid rgba(255,255,255,.18)}
.hero-stats .stat:last-child{border-right:none}
.hero-stats .stat b{display:block;font-family:var(--data);font-weight:600;font-size:clamp(27px,2.9vw,37px);color:#fff;line-height:1;margin-bottom:8px}
.hero-stats .stat span{display:block;font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.55)}
@media(max-width:760px){.hero-stats .stat{flex:0 1 45%;padding:0 16px 20px}}

/* ---- "The Short Version": centered head, left-aligned body ---- */
.short-version{padding-top:80px;padding-bottom:80px;text-align:center}
.short-version .label{display:block;margin-bottom:16px}
.short-version h2{margin-bottom:26px}
.short-version .sv-rule{border:none;border-top:1.5px solid var(--char);margin-bottom:36px}
.short-version .body{text-align:left;max-width:960px;margin:0 auto}
.short-version .lede{font-size:18px;font-weight:700;color:var(--ink);margin-bottom:18px}
.short-version .sub{font-size:16px;color:var(--ink-soft)}

/* ---- data block + facts table (academics, program details) ---- */
.datablock{background:#fff;border:1px solid var(--hairline);padding:30px 32px;margin-bottom:14px}
.datablock .takeaway{font-size:15.5px;font-weight:700;color:var(--ink);margin-bottom:20px;text-align:left;max-width:none}
table.factstable{width:100%;border-collapse:collapse;font-size:14.5px}
table.factstable th,table.factstable td{text-align:left;padding:12px 14px 12px 0;border-bottom:1px solid var(--hairline)}
table.factstable th:last-child,table.factstable td:last-child{text-align:center}
table.factstable th{font-family:var(--sans);font-size:12px;letter-spacing:.03em;text-transform:uppercase;color:var(--ink-soft);font-weight:700}
table.factstable td b{font-family:var(--data);font-size:21px;font-weight:600;font-variant-numeric:tabular-nums;font-feature-settings:'lnum' 1,'tnum' 1}

/* ---- feeder pipeline / "where it fits": 3 identical white cards.
   No card gets a dark highlight — "you are here" is carried by the eyebrow
   text alone. Do not add a .current background variant here. ---- */
.pipeline{background:var(--cream);border-top:1px solid var(--hairline);border-bottom:1px solid var(--hairline);text-align:center}
.pipeline .sec-top,.pipeline .sec-answer{margin-left:auto;margin-right:auto;text-align:center}
.pipeline-rule{border:none;border-top:1.5px solid var(--char);margin:0 0 2px}
.pipeline-grid{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--hairline)}
.pcard{background:#fff;padding:30px 26px;text-align:left;border-right:1px solid var(--hairline)}
.pcard:last-child{border-right:none}
.pcard .peyebrow{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);display:block;margin-bottom:10px}
.pcard h3{font-size:22px;margin-bottom:10px}
.pcard p{font-size:14px;color:var(--ink-soft);margin-bottom:14px}
.pcard .textlink{font-size:11.5px}
@media(max-width:820px){.pipeline-grid{grid-template-columns:1fr}.pcard{border-right:none;border-bottom:1px solid var(--hairline)}.pcard:last-child{border-bottom:none}}

/* ---- headline stat row on light background (athletics) ---- */
.stats-row{display:flex;flex-wrap:wrap;justify-content:center;padding-top:44px;border-top:2px solid var(--char)}
.stats-row .stat{flex:0 1 240px;padding:0 34px;border-right:1px solid var(--hairline)}
.stats-row .stat:last-child{border-right:none}
.stats-row .stat b{display:block;font-family:var(--data);font-weight:600;font-size:clamp(28px,3vw,41px);color:var(--ink);line-height:1;margin-bottom:10px}
.stats-row .stat > span{display:block;font-family:var(--sans);font-weight:700;font-size:13.5px;letter-spacing:.02em;text-transform:uppercase;color:var(--ink);margin-bottom:6px}
.stats-row .stat em{display:block;font-style:normal;font-size:13px;color:var(--delta)}
.stats-meta{font-family:var(--mono);font-size:11px;letter-spacing:.04em;color:var(--ink-soft);text-transform:uppercase;padding-top:18px;border-top:1px solid var(--hairline);text-align:center}
@media(max-width:760px){.stats-row .stat{flex:0 1 45%;padding:0 18px 20px}}

/* ---- tag row (clubs, sports offered) ---- */
.tag-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}

/* ---- trailing note paragraph under a section (replaces inline styles) ---- */
.sec-note{margin-top:22px;font-size:15.5px;color:var(--ink-soft);max-width:700px}
.datablock + .sec-note{margin-top:26px}

/* ==========================================================================
   THINGS TO DO — hub (/things-to-do/) + 4 season pages (Aug 2026)
   New, namespaced components. Reuses existing shared blocks where possible:
   .hero.center, .crumb (breadcrumb.njk), .short-version, .faq, .capture,
   .byline — none of those are redefined here.
   Renamed .tier -> .td-tier: a ".tier" class already exists (budget-tier
   cards, schools-hub table row header) with a different, incompatible
   definition — reusing it here would have broken one of those two pages.
   ========================================================================== */

/* ---- season doors (hub) ---- */
.td-seasons{padding-top:92px;padding-bottom:92px}
.season-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:22px}
.season{position:relative;display:flex;align-items:flex-end;aspect-ratio:16/10;overflow:hidden;text-decoration:none;color:#fff}
.season .ph{position:absolute;inset:0;transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.season::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,18,16,.10) 30%,rgba(20,18,16,.82) 100%)}
.season:hover .ph{transform:scale(1.045)}
.season-body{position:relative;z-index:2;padding:34px 36px;width:100%}
.season-body .k{font-family:var(--mono);font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:rgba(255,255,255,.7);display:block;margin-bottom:10px}
.season-body h3{font-family:var(--serif);font-size:clamp(30px,3.4vw,42px);color:#fff;font-weight:600;margin-bottom:8px}
.season-body p{font-size:14.5px;color:rgba(255,255,255,.85);max-width:420px;margin-bottom:16px}
.season-body .go{font-family:var(--sans);font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;border-bottom:1px solid rgba(255,255,255,.6);padding-bottom:3px}
@media(max-width:720px){.season-grid{grid-template-columns:1fr}.season{aspect-ratio:4/3}.season-body{padding:26px 24px}}

/* ---- listing sections: wineries / restaurants / outdoors (hub), and the
   "what to do this season" grid (season pages) ---- */
.td-sec{padding-top:84px;padding-bottom:84px}
.td-sec.alt{background:var(--cream);border-top:1px solid var(--hairline);border-bottom:1px solid var(--hairline)}
.td-head{text-align:center;max-width:780px;margin:0 auto 14px}
.td-head .label{display:block;margin-bottom:14px}
.td-head h2{font-size:clamp(30px,4vw,46px)}
.td-intro{max-width:720px;margin:22px auto 56px;text-align:center;font-size:16.5px;font-weight:600}

/* tier header — label / rule / count above a card grid */
.td-tier{display:flex;align-items:baseline;gap:18px;margin:0 0 30px}
.td-tier h3{font-family:var(--mono);font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--wine);font-weight:500;white-space:nowrap}
.td-tier .rule{flex:1;border-top:1px solid var(--char)}
.td-tier .n{font-family:var(--mono);font-size:11px;color:var(--ink-soft);letter-spacing:.1em;white-space:nowrap}

/* full cards — winery/restaurant/park/season-activity photo cards */
.td-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px 26px}
.td-card{display:flex;flex-direction:column}
.td-frame{aspect-ratio:4/3;overflow:hidden;position:relative;background:var(--sand)}
.td-frame .ph{position:absolute;inset:0}
.td-cap{border-top:1px solid var(--char);margin-top:16px;padding-top:13px}
.td-cap h3{font-size:24px;margin-bottom:6px}
.td-addr{font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--delta);margin-bottom:11px}
.td-card p{font-size:14.5px;line-height:1.65}
.td-note{margin-top:10px;padding-left:12px;border-left:2px solid var(--delta);font-size:13.5px;color:var(--ink-soft)}
@media(max-width:900px){.td-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:580px){.td-grid{grid-template-columns:1fr}}

/* collapsible tiers below the card grid, and the spring/summer/fall/winter
   calendar table — native <details>/<summary>, not JS-hidden */
.drop{margin-top:22px;border-top:1px solid var(--char)}
.drop summary{cursor:pointer;list-style:none;display:flex;align-items:baseline;gap:16px;padding:22px 2px;font-family:var(--mono);font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--wine)}
.drop summary::-webkit-details-marker{display:none}
.drop summary .n{margin-left:auto;color:var(--ink-soft);letter-spacing:.1em}
.drop summary::after{content:'+';font-size:18px;line-height:1;color:var(--wine);width:14px;text-align:right}
.drop[open] summary::after{content:'–'}
.drop summary:hover{color:var(--delta)}
.drop .inner{padding:4px 0 34px}
.drop+.drop{margin-top:0}

.td-table{width:100%;border-collapse:collapse;font-size:14.5px}
.td-table th{font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-soft);font-weight:500;text-align:left;padding:0 14px 12px 0;border-bottom:1px solid var(--char)}
.td-table td{padding:13px 14px 13px 0;border-bottom:1px solid var(--hairline);vertical-align:top}
.td-table td:first-child{font-weight:600;white-space:nowrap}
.td-table .town{font-family:var(--mono);font-size:12px;color:var(--ink-soft);letter-spacing:.04em}
.td-table .when{font-family:var(--data);font-size:15px;color:var(--ink);white-space:nowrap}
@media(max-width:640px){.td-table td:first-child{white-space:normal}.td-table th:nth-child(2),.td-table td:nth-child(2){display:none}}

.sec-foot{margin-top:30px;font-size:14px;color:var(--ink-soft);max-width:820px}
.src-line{margin-top:34px;font-family:var(--mono);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft);text-align:center}

/* ---- what it costs (season pages): three columns, free / a few dollars / where it adds up ---- */
.cost{padding-top:88px;padding-bottom:88px}
.cost-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0 34px;margin-top:8px}
.cost-col{border-top:1px solid var(--char);padding-top:18px}
.cost-col h3{font-family:var(--mono);font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--wine);font-weight:500;margin-bottom:6px}
.cost-col .cap{font-size:13.5px;color:var(--ink-soft);margin-bottom:20px}
.cost-row{border-top:1px solid var(--hairline);padding:14px 0;display:flex;gap:14px;align-items:baseline}
.cost-row:first-of-type{border-top:none}
.cost-row .what{flex:1;font-size:14.5px;line-height:1.55}
.cost-row .amt{font-family:var(--data);font-size:17px;font-weight:600;color:var(--ink);white-space:nowrap;text-align:right}
.cost-row .amt.free{color:var(--delta)}
.cost-note{margin-top:30px;padding:22px 24px;background:var(--cream);border-left:3px solid var(--delta);font-size:14.5px;max-width:860px}
.cost-note strong{color:var(--ink)}
@media(max-width:860px){.cost-grid{grid-template-columns:1fr;gap:0}.cost-col{margin-bottom:26px}}

/* ---- season switcher (season pages): the other three seasons ---- */
.switch{padding-top:80px;padding-bottom:80px}
.switch-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.sw{position:relative;display:flex;align-items:flex-end;aspect-ratio:16/10;overflow:hidden;text-decoration:none;color:#fff}
.sw .ph{position:absolute;inset:0;transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.sw::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,18,16,.10) 30%,rgba(20,18,16,.80) 100%)}
.sw:hover .ph{transform:scale(1.05)}
.sw-body{position:relative;z-index:2;padding:24px 26px;width:100%}
.sw-body .k{font-family:var(--mono);font-size:9.5px;letter-spacing:.24em;text-transform:uppercase;color:rgba(255,255,255,.7);display:block;margin-bottom:8px}
.sw-body h3{font-family:var(--serif);font-size:28px;color:#fff;font-weight:600}
@media(max-width:720px){.switch-grid{grid-template-columns:1fr}}

@media (prefers-reduced-motion: reduce){.season:hover .ph,.sw:hover .ph{transform:none}}

/* ==========================================================================
   ABOUT — /about/ (Aug 2026)
   Deliberately its own visual pattern: no .hero, no dark video band, no
   stats bar. A quiet portrait intro + reading column + two photos + a
   plain credentials line + a simple CTA. All new selectors are prefixed
   "about-" — nothing here redefines a shared class. Everything else on
   this page (.wrap, .crumb, .label, .btn) is the site's existing shared
   CSS, unchanged.
   ========================================================================== */

/* body.no-hero — a reusable structural fix, not About-specific styling.
   header{} is position:fixed with white text everywhere, because on every
   existing page it sits transparently over a tall, dark .hero. About is
   the first page with no hero at all, so the fixed header floated over
   the breadcrumb with unreadable near-white text. Any future hero-less
   page (e.g. a plain FAQ page) should reuse body.no-hero rather than
   reinventing this. */
body.no-hero header{background:rgba(250,248,244,.95);backdrop-filter:blur(12px);border-bottom:1px solid var(--hairline)}
body.no-hero .logo,body.no-hero .nav-links a{color:var(--ink)}
body.no-hero .nav-links a:hover{color:var(--wine)}
body.no-hero .nav-links a[aria-current="page"]{border-bottom-color:var(--wine)}
body.no-hero header:not(.scrolled) .nav .btn{background:var(--char);color:var(--ivory)}
body.no-hero header:not(.scrolled) .nav .btn:hover{background:var(--wine-deep)}
body.no-hero .crumb{padding-top:96px}

.about-intro{padding:56px 0 70px}
.about-intro-grid{display:grid;grid-template-columns:260px 1fr;gap:52px;align-items:center}
.about-portrait{position:relative;aspect-ratio:4/5}
.about-portrait .ph{display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.6);text-align:center;padding:20px;width:100%;height:100%}
.about-intro-text .label{margin-bottom:14px;display:block}
.about-intro-text h1{font-family:var(--serif);font-weight:600;line-height:1.08;letter-spacing:-.01em;font-size:clamp(38px,5.4vw,56px);margin-bottom:10px;color:var(--ink)}
.about-role{font-size:15.5px;color:var(--ink-soft);font-weight:600;margin-bottom:20px}
.about-quote{font-family:var(--serif);font-size:22px;font-weight:600;color:var(--ink);line-height:1.4;border-left:3px solid var(--wine);padding-left:20px}
@media(max-width:700px){.about-intro-grid{grid-template-columns:1fr;gap:28px}.about-portrait{max-width:220px}}

.about-bio{padding:0 0 60px}
.about-bio-col{max-width:680px}
.about-bio-col p{font-size:16px;color:var(--ink);margin-bottom:20px}
.about-bio-col p:last-child{margin-bottom:0}
.about-placeholder{background:var(--cream);border-left:3px solid var(--sand);padding:10px 14px}
.about-quote.about-placeholder{border-left-color:var(--wine)}

.about-photos{padding:0 0 70px}
.about-photo-row{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.about-photo-row .ph{aspect-ratio:4/3;display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.55);text-align:center;padding:14px}
@media(max-width:640px){.about-photo-row{grid-template-columns:1fr}}

.about-creds{border-top:1px solid var(--hairline);border-bottom:1px solid var(--hairline);padding:26px 0}
.about-creds-row{display:flex;flex-wrap:wrap;gap:34px 44px}
.about-cred b{display:block;font-family:var(--serif);font-size:15px;color:var(--ink);font-weight:600;margin-bottom:2px}
.about-cred span{font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft)}

.about-cta{padding:64px 0;text-align:center}
.about-cta h2{font-family:var(--serif);font-weight:600;line-height:1.08;letter-spacing:-.01em;color:var(--ink);font-size:clamp(26px,3.4vw,34px);margin-bottom:12px}
.about-cta p{color:var(--ink-soft);max-width:440px;margin:0 auto 26px;font-size:15.5px}

/* ============================================================
   PLAIN PAGE — utility pages with no photo hero
   Applied via bodyClass: page-plain in front matter.
   Used by: /thank-you/. Reusable for /privacy/ and any future
   confirmation or legal page.

   Why this exists: the site header is white text sized to sit
   over a dark photo hero. On an ivory page that header is
   invisible. This block flips it to solid, and pins the footer
   to the bottom so a short page never looks half-loaded.
   ============================================================ */

body.page-plain{
  display:flex;
  flex-direction:column;
  min-height:100vh;
}

/* Header: solid ivory instead of transparent-over-photo.
   Mirrors the .scrolled state rather than inventing a new look. */
body.page-plain header{
  position:static;
  background:var(--ivory);
  border-bottom:1px solid var(--hairline);
  padding:18px 0;
  backdrop-filter:none;
}
body.page-plain header .logo{color:var(--ink)}
body.page-plain header .nav-links a{color:var(--ink-soft)}
body.page-plain header .nav-links a:hover{color:var(--ink)}
body.page-plain header .nav .btn{
  background:var(--char);
  backdrop-filter:none;
  padding:11px 20px;
  font-size:11px;
}
body.page-plain header .nav .btn:hover{background:var(--wine)}

/* The message. flex:1 on main pushes the footer down. */
.plain-main{
  flex:1;
  display:flex;
  align-items:center;
  padding:88px 0;
}
.plain-msg{max-width:600px}
.plain-msg h1{
  font-size:clamp(42px,6vw,64px);
  margin-bottom:22px;
}
.plain-msg p{
  font-size:18px;
  color:var(--ink);
  margin-bottom:16px;
}
.plain-msg .quiet{
  font-size:15px;
  color:var(--ink-soft);
}
.plain-msg .onward{
  margin-top:38px;
  padding-top:24px;
  border-top:1px solid var(--hairline);
  font-size:14px;
  color:var(--ink-soft);
}
.plain-msg .onward a{
  color:var(--ink);
  font-weight:600;
  text-decoration:none;
  border-bottom:1px solid var(--sand);
}
.plain-msg .onward a:hover{border-bottom-color:var(--ink)}

@media(max-width:600px){
  .plain-main{padding:60px 0}
}

/* ============ end plain page ============ */

/* ==========================================================================
   MOBILE NAVIGATION — added 1 Sep 2026. Town-agnostic.
   Above 940px nothing here applies; the desktop nav is untouched.
   At/below 940px the inline links and the header CTA hide, the toggle button
   appears, and the panel below the bar carries the whole menu.
   The toggle and logo inherit their color from the header's existing states
   (over-hero = white, scrolled / no-hero / page-plain = ink).
   ========================================================================== */

/* The panel is a sibling AFTER </header>, deliberately not inside it: a scrolled
   header carries backdrop-filter, which makes it the containing block for any
   fixed-position descendant and collapses the panel to the height of the bar. */

/* ---- toggle button ---- */
.nav-toggle{display:none;align-items:center;justify-content:center;width:44px;height:44px;
  margin-right:-10px;padding:0;background:none;border:none;cursor:pointer;color:#fff}
.nav-toggle-box{display:block;width:24px;height:14px;position:relative}
.nav-toggle-bar{position:absolute;left:0;width:24px;height:1.5px;background:currentColor;
  transition:transform .28s ease,opacity .18s ease,top .28s ease}
.nav-toggle-bar:first-child{top:0}
.nav-toggle-bar:last-child{top:12.5px}
header.nav-open .nav-toggle-bar:first-child{top:6px;transform:rotate(45deg)}
header.nav-open .nav-toggle-bar:last-child{top:6px;transform:rotate(-45deg)}

/* Match the logo's color in every header state. */
header.scrolled .nav-toggle,
body.no-hero .nav-toggle,
body.page-plain header .nav-toggle,
header.nav-open .nav-toggle,
header.nav-open .logo{color:var(--ink)}

/* ---- panel ---- */
.mobile-nav{display:none}
.mobile-nav-inner{width:100%;max-width:520px;margin:0 auto;padding:0 28px 48px}
.mobile-nav-links{list-style:none}
.mobile-nav-links li{border-bottom:1px solid var(--hairline)}
.mobile-nav-links li:first-child{border-top:1px solid var(--hairline)}
.mobile-nav-links a{display:block;padding:20px 0;min-height:44px;text-decoration:none;
  font-family:var(--serif);font-weight:600;font-size:clamp(26px,7.4vw,32px);
  line-height:1.15;letter-spacing:-.01em;color:var(--ink)}
.mobile-nav-links a[aria-current="page"]{color:var(--wine)}
.mobile-nav-links a[aria-current="page"]::after{content:"";display:inline-block;
  width:7px;height:7px;margin-left:12px;vertical-align:middle;background:var(--sand)}
.mobile-nav-cta{width:100%;justify-content:center;margin-top:32px;padding:19px 24px;font-size:12px}
.mobile-nav-note{margin-top:22px;text-align:center;font-family:var(--mono);font-size:10px;
  letter-spacing:.2em;text-transform:uppercase;color:var(--ink-soft)}

/* ---- the 940px switch ---- */
@media(max-width:940px){
  .nav-toggle{display:inline-flex}
  .nav .btn.nav-cta{display:none}
  .mobile-nav:not([hidden]){display:flex;position:fixed;inset:0;z-index:55;
    flex-direction:column;justify-content:flex-start;overflow-y:auto;
    padding:128px 0 32px;background:var(--ivory);
    animation:navIn .26s ease both}
}
@keyframes navIn{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion: reduce){
  .mobile-nav:not([hidden]){animation:none}
  .nav-toggle-bar{transition:none}
}

/* Panel open: freeze the page behind it. */
body.nav-lock{overflow:hidden}

/* ==========================================================================
   LEGAL PAGE — long-form utility text (/privacy/, and any future /terms/).
   Sits on top of the .page-plain body class, which already solves the
   invisible-header problem. This block only handles reading a wall of text:
   a narrower measure, real heading hierarchy, and generous section spacing.
   Town-agnostic.
   ========================================================================== */

.legal-main{align-items:flex-start;padding:64px 0 88px}
.legal{max-width:64ch}
.legal-head{padding-bottom:26px;border-bottom:1px solid var(--hairline)}
.legal-head h1{font-size:clamp(38px,5.4vw,54px);line-height:1.02;margin-bottom:14px}
.legal-updated{font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--ink-soft);margin-bottom:20px}
.legal-lede{font-size:18px;line-height:1.6;color:var(--ink)}
.legal-sec{margin-top:42px}
.legal-sec h2{font-size:26px;line-height:1.12;margin-bottom:12px}
.legal-sec p{font-size:15.5px;line-height:1.72;color:var(--ink-soft)}
.legal-sec p + p{margin-top:13px}
.legal-sec p strong{color:var(--ink);font-weight:700}
.legal-contact{border-top:1px solid var(--hairline);padding-top:34px}
.legal-contact address{font-style:normal;margin-top:14px;font-size:15.5px;line-height:1.75}
.legal-contact address strong{font-family:var(--serif);font-size:18px;font-weight:600;color:var(--ink)}
.legal-contact a{color:var(--ink);border-bottom:1px solid var(--sand)}
@media(max-width:640px){.legal-main{padding:44px 0 64px}.legal-sec{margin-top:34px}}

/* Plain pages set `position:static` on the header, so once the page is
   scrolled the toggle button scrolls away with it — leaving the open menu
   with no visible close control. Pin the header for as long as it is open. */
body.nav-lock header{position:fixed;top:0;left:0;right:0}

/* MLS compliance attribution — sitewide footer. Quiet by design: it is a legal
   notice, not a design element, but it must stay legible. Town-agnostic. */
.foot-compliance{
  margin-top:22px;padding-top:18px;
  border-top:1px solid rgba(255,255,255,.12);
  font-size:11.5px;line-height:1.7;color:rgba(255,255,255,.55);
  max-width:78ch;
}

/* ---------------------------------------------------------------------------
   HONEYPOT (spam trap on every capture form)
   Pairs with the .hp-wrap block in partials/capture.njk.

   The input must stay in the DOM and stay submittable, so this hides it by
   moving it off-screen rather than with display:none — a bot that checks for
   display:none would skip the trap, which defeats the point.

   Negative `left` does not create horizontal overflow in LTR, so this is safe
   against the 390px audit. Do not "tidy" this into display:none.
   --------------------------------------------------------------------------- */
.hp-wrap{
  position:absolute !important;
  left:-9999px !important;
  top:auto !important;
  width:1px !important;
  height:1px !important;
  overflow:hidden !important;
}

/* ==========================================================================
   ATTENDANCE ZONES — the zone section of /schools/  (September 2026)
   Town-agnostic. A new town reuses every rule here and supplies only the values
   in its own <town>.json under schoolZones{} and neighborhoods[].zone{}.
   Deliberately small: the page is built almost entirely from shared components
   already in this file (.hero.sub-page, .answer-grid, .converge, table.dir,
   table.zt, .zone-note, .cta-band, .faq). Only the pieces with no existing
   home are below.
   ========================================================================== */

/* The shared .conv-arm draws one curve per elementary box, spaced evenly down a
   240-unit viewBox at (2i+1)/2n of the height. Those endpoints only meet the
   boxes if the boxes fill the column, so .conv-fill stretches them — which makes
   the diagram line up for ANY number of elementary schools, not just four.
   partials/feeder-diagram.njk always emits this modifier. The hard-coded 4-box
   diagram on /schools/ does not use the partial and is untouched by this. */
.converge.conv-fill .conv-col{flex:1}
.converge.conv-fill .conv-el{flex:1;align-items:center}

/* Zone table cells. The zone name is the column the page exists for, so it gets
   serif weight; the feeder ladder beside it is identical on every row and is
   deliberately quiet rather than repeated at full strength fourteen times. */
.az-zone{font-family:var(--serif);font-size:19px;font-weight:600;color:var(--ink);
  text-decoration:none;border-bottom:1px solid transparent}
tr.row:hover .az-zone{border-bottom-color:var(--wine)}
.az-ladder{font-family:var(--mono);font-size:10px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--ink-soft);line-height:1.7}

/* Pull quote — the county's own wording about its own boundaries. This is the
   sentence that earns the "verify your address" CTA rather than making it look
   like hedging, so it is set as a quote and not as body copy. */
.az-quote{max-width:820px;margin:52px auto 0;border-top:1px solid var(--char);padding-top:30px}
.az-quote blockquote{font-family:var(--serif);font-size:clamp(20px,2.8vw,30px);
  line-height:1.34;font-weight:500;color:var(--ink)}
.az-quote cite{display:block;margin-top:18px;font-family:var(--mono);font-size:10px;
  letter-spacing:.18em;text-transform:uppercase;color:var(--ink-soft);font-style:normal}

/* The ACPS disclaimer under the CTA. Required wording, so it must stay legible;
   quiet, because it is a legal notice and not a design element. */
.az-authority{max-width:620px;margin:34px auto 0;padding-top:22px;
  border-top:1px solid rgba(255,255,255,.18);
  font-family:var(--mono);font-size:11px;line-height:1.9;letter-spacing:.04em;
  color:rgba(255,255,255,.5)}
.az-authority a{color:var(--sand)}

/* The zone table's "Then" column carries no information the tier header above it
   has not already given. On a phone, where every cell becomes its own line, that
   makes it pure noise — so it drops out and the tier header does the work. */
@media(max-width:820px){
  .az-ladder{display:none}
  .az-quote blockquote{font-size:20px}
}

/* Second link inside .zone-note (added with the attendance-zones page). The .btn
   above it has no bottom margin of its own, so the spacing lives here. */
.zone-note .zn-more{margin-top:20px}

/* .hero.legible — for a photo hero whose upper half is bright sky.
   The shared .hero overlay thins to .08 alpha at 40% height, which is exactly
   where .hero .label sits, so a bright photo drops that eyebrow to ~1.3:1
   contrast. This keeps the overlay from ever falling below .34 and lifts the
   sand eyebrow to 4.6:1 — WCAG AA — without touching .hero itself or the
   heroes on any existing page. The photo comes in through --hero-photo so the
   template carries the image and this file keeps the gradient.
   Town-agnostic: reuse it on any hero with a bright photo. */
.hero.legible{
  background-image:
    linear-gradient(180deg,rgba(28,26,24,.42) 0%,rgba(28,26,24,.34) 38%,rgba(28,26,24,.82) 88%),
    var(--hero-photo,none);
  background-size:cover;
  background-position:center;
}

/* .az-stack — phone treatment for table.zt in the attendance-zones section.
   table.zt normally scrolls sideways inside .tbl-hold, which at 390px pushed the
   Branch points column — the whole point of that table — off screen with no
   affordance that it was there. Same block-stacking mechanics table.dir already
   uses, scoped so the school pages' zone tables are unaffected. */
@media(max-width:820px){
  .az-stack,.az-stack tbody,.az-stack tr,.az-stack td,.az-stack th{display:block;width:100%}
  table.az-stack{min-width:0}
  table.az-stack .s-note{max-width:none}
  .az-stack thead{display:none}
  .az-stack tbody tr{padding:22px 0;border-bottom:1px solid var(--hairline)}
  .az-stack tbody tr:last-child{border-bottom:none}
  table.az-stack tbody th,table.az-stack tbody td{padding:0;border-bottom:none;width:auto}
  .az-stack tbody td{margin-top:12px}
  .az-stack tbody td::before{content:attr(data-label);display:block;margin-bottom:3px;
    font-family:var(--mono);font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-soft)}
  .az-stack tbody tr:hover th,.az-stack tbody tr:hover td{background:none}
}

/* The ACPS phone number is one token — never break it across lines. */
.az-authority a{white-space:nowrap}

/* A .sec-note centred under a centred section (the feeder diagram's footnote on
   /schools/). The default .sec-note is a left-aligned aside; this is the same
   type at the same size, centred to match the block above it. */
.sec-note.centered{margin-left:auto;margin-right:auto;text-align:center}

/* ==========================================================================
   SCHOOL GUIDE PAGES — /schools/<guide>/  (September 2026)
   Town-agnostic. A new town supplies schoolGuides[] in its own <town>.json and
   inherits the whole page type; nothing here is Crozet-specific.

   The shape is built for answer extraction: a question as a real heading, then
   one paragraph that stands alone if it is quoted without the question, then the
   specific facts, then the source. Nothing is hidden behind JS or an accordion.
   ========================================================================== */

.qa{padding:38px 0;border-top:1px solid var(--hairline)}
.qa:first-child{border-top:1px solid var(--char)}
.qa h2{font-size:clamp(25px,3.2vw,34px);line-height:1.14;margin-bottom:18px}

/* The answer. Heavier than body copy because it IS the page — everything else
   on the block supports it. */
.qa-a{font-size:17.5px;line-height:1.66;font-weight:600;color:var(--ink);max-width:68ch}

.qa-src{margin-top:22px}
.qa-src a{font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;
  text-decoration:none;color:var(--wine);border-bottom:1px solid var(--sand);padding-bottom:3px}
.qa-src a:hover{border-bottom-color:var(--wine)}

.qa-onward{margin-top:30px}

@media(max-width:640px){
  .qa{padding:30px 0}
  .qa-a{font-size:16.5px}
}

/* .hero.legible .label — the eyebrow crosses the photo, not a flat backdrop.
   Measured on /schools/enrolling-and-transfers/: within ONE line of 10.5px mono
   the background runs from luminance .004 (black leaf canopy) to .587 (blown-out
   sky). Against --sand that is 9.21:1 at the dark end and 1.01:1 at the bright
   end — the word literally disappears mid-sentence. A heavier hero overlay can't
   fix a range that wide without killing the photograph, so the eyebrow carries
   its own scrim: a near-white fill plus a stacked dark halo that travels with the
   glyphs. Reads over sky, foliage or anything else.
   Town-agnostic: applies to every .hero.legible on every LivingIn site. */
.hero.legible .label{
  color:#F7F3EC;
  text-shadow:
    0 0 2px  rgba(20,18,16,.98),
    0 0 6px  rgba(20,18,16,.92),
    0 0 14px rgba(20,18,16,.80),
    0 1px 2px rgba(20,18,16,.95);
}

/* .zone-grid.quad — the four school guides as one tidy 2x2 square.
   The base .zone-grid is a 3-across row, which left a lone orphan card once the
   fourth guide landed. A 2x2 reads as one object instead of a row plus a remainder.
   The block is capped at 720px and centred rather than filling the 1140px wrap:
   full-width squares came out 528px on a side, which read as four posters instead
   of a compact index. At this cap each card is ~350px — close to the 3-across card
   size the rest of the page already uses, so the square sits inside the page's
   existing rhythm instead of shouting over it.
   aspect-ratio (not height) keeps them square: if a longer summary ever needs more
   room the box grows rather than clipping, because no fixed height is set. The read
   link is pinned to the card floor with margin-top:auto so all four align.
   Town-agnostic: any LivingIn site with an even number of guides gets this free. */
@media(min-width:881px){
  .zone-grid.quad{
    grid-template-columns:repeat(2,1fr);
    gap:20px;
    max-width:720px;
    margin-inline:auto;
  }
  .zone-grid.quad .zone-card{
    display:flex;flex-direction:column;
    aspect-ratio:1/1;
    padding:30px 28px;
  }
  .zone-grid.quad .zone-card em{margin-bottom:11px}
  .zone-grid.quad .zone-card h3{font-size:23px;line-height:1.16;margin-bottom:10px}
  .zone-grid.quad .zone-card p{font-size:13.5px;line-height:1.58;margin-bottom:0}
  .zone-grid.quad .zone-card .textlink{margin-top:auto;padding-top:16px}
}

/* ==========================================================================
   NAV DROPDOWN + FRESHNESS + SIBLING GUIDES  (Sept 2026)
   ========================================================================== */

/* .has-sub / .subnav — the Schools dropdown.
   The submenu markup is always in the HTML; this only governs visibility, so
   crawlers see the four guide links on every page of the site. That sitewide
   link is the point — it closes the topic cluster without a link block on
   every template. Opens on hover AND on :focus-within so keyboard users reach
   it. The 10px bridge (padding-top on .subnav) keeps the menu from closing
   when the pointer crosses the gap between the label and the panel.
   Town-agnostic: driven by nav[].submenu, so a town with no guides gets nothing. */
@media(min-width:941px){
  .nav-links .has-sub{position:relative}
  .nav-links .subnav{
    position:absolute;top:100%;left:50%;transform:translateX(-50%) translateY(4px);
    min-width:268px;margin:0;padding:10px 0 0;list-style:none;
    opacity:0;visibility:hidden;pointer-events:none;
    transition:opacity .16s ease,transform .16s ease;
    z-index:60;
  }
  .nav-links .has-sub:hover .subnav,
  .nav-links .has-sub:focus-within .subnav{
    opacity:1;visibility:visible;pointer-events:auto;transform:translateX(-50%) translateY(0);
  }
  .nav-links .subnav::before{
    content:"";display:block;background:var(--ivory);
    border:1px solid var(--hairline);border-bottom:none;height:0;
  }
  .nav-links .subnav li{
    background:var(--ivory);border:1px solid var(--hairline);border-bottom:none;
  }
  .nav-links .subnav li:last-child{border-bottom:1px solid var(--hairline)}
  .nav-links .subnav a{
    display:block;padding:13px 20px;
    font-family:var(--sans);font-size:13.5px;font-weight:500;line-height:1.35;
    color:var(--ink);text-decoration:none;border:none;white-space:normal;
  }
  .nav-links .subnav a:hover{background:var(--cream);color:var(--char)}
  .nav-links .subnav li:first-child a{font-weight:600}
}

/* Mobile panel: no hover on touch, so the guides are simply always listed. */
.mobile-subnav{list-style:none;margin:10px 0 4px;padding:0 0 0 18px;
  border-left:1px solid var(--hairline)}
.mobile-subnav li{margin:0}
.mobile-subnav a{font-size:15px;font-weight:500;opacity:.82;padding:7px 0;display:block}

/* .updated — the visible freshness stamp under the byline. Its machine-readable
   twin is dateModified in the Article schema; the <time datetime> attribute ties
   the two together so they can never silently disagree. */
.updated{margin-top:10px;font-family:var(--mono);font-size:10px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--ink-soft)}
.updated time{font-family:inherit;letter-spacing:inherit}

/* .sib — sibling guide links at the foot of every guide page. Closes the cluster:
   four pages that belong together now point at each other. Count-agnostic. */
.sib{border-top:1px solid var(--hairline)}
.sib-list{list-style:none;margin:0;padding:0;display:grid;gap:0}
.sib-list li{border-bottom:1px solid var(--hairline);padding:22px 0}
.sib-list li:first-child{border-top:1px solid var(--char)}
.sib-list a{display:block;font-family:var(--serif);font-size:21px;font-weight:600;
  color:var(--char);text-decoration:none;line-height:1.25;margin-bottom:6px}
.sib-list a:hover{color:var(--wine)}
.sib-list span{display:block;font-size:14px;color:var(--ink);max-width:62ch}

/* .qa-tbl — a table inside a Q&A block on a guide page.
   Plain, ruled, no zebra: this is reference matter a reader scans for one row,
   not a dataset to browse. Ruled rows and a hairline under the head are enough.
   Under 700px the table block-stacks — each row becomes a labelled card — because
   a 3-column table inside a text column cannot scroll sideways gracefully on a
   phone, and the columns here carry meaning that a cut-off column destroys. */
.qa-tblwrap{margin:26px 0 0;padding:0}
.qa-tbl{width:100%;border-collapse:collapse;font-size:14px}
.qa-tbl caption{caption-side:top;text-align:left;font-family:var(--mono);font-size:9.5px;
  letter-spacing:.18em;text-transform:uppercase;color:var(--ink-soft);padding-bottom:12px}
.qa-tbl thead th{text-align:left;font-family:var(--mono);font-size:9.5px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--ink-soft);font-weight:500;
  padding:0 16px 9px 0;border-bottom:1px solid var(--char)}
.qa-tbl tbody th{text-align:left;font-weight:600;color:var(--char);
  padding:14px 16px 14px 0;border-bottom:1px solid var(--hairline);vertical-align:top;width:27%}
.qa-tbl tbody td{padding:14px 16px 14px 0;border-bottom:1px solid var(--hairline);
  vertical-align:top;color:var(--ink);line-height:1.5}
.qa-tbl tbody tr:last-child th,.qa-tbl tbody tr:last-child td{border-bottom:none}
.qa-tbl th:last-child,.qa-tbl td:last-child{padding-right:0}
@media(max-width:700px){
  .qa-tbl,.qa-tbl tbody,.qa-tbl tr,.qa-tbl th,.qa-tbl td{display:block;width:100%}
  .qa-tbl thead{display:none}
  .qa-tbl tbody tr{padding:18px 0;border-bottom:1px solid var(--hairline)}
  .qa-tbl tbody tr:last-child{border-bottom:none}
  .qa-tbl tbody th,.qa-tbl tbody td{padding:0;border-bottom:none;width:auto}
  .qa-tbl tbody td{margin-top:11px}
  .qa-tbl tbody td::before{content:attr(data-label);display:block;margin-bottom:3px;
    font-family:var(--mono);font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-soft)}
}
/* A Q&A block may cite two county pages when two pages carry the two halves of
   the answer. The second sits on its own line so neither reads as the primary. */
.qa-src a + a{display:block;margin-top:5px}

/* ==========================================================================
   SOURCED QUOTE BLOCKS — the attendance-zones rebuild, September 2026.
   The section's rule is that anything a buyer could act on is the county's own
   sentence, shown as a quote with a link to where it lives. These styles make
   that visible at a glance: quoted matter is set apart, our own reasoning is not.
   ========================================================================== */

.srcq{margin:0 0 30px;padding:26px 28px;background:var(--ivory);border:1px solid var(--hairline);
  border-left:2px solid var(--char)}
.srcq-label{display:block;font-family:var(--mono);font-size:9.5px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--ink-soft);margin-bottom:13px}
.srcq blockquote{margin:0;font-family:'Lora',Georgia,serif;font-weight:500;font-size:18.5px;
  line-height:1.66;color:var(--char);quotes:"\201C" "\201D"}
.srcq blockquote::before{content:open-quote}
.srcq blockquote::after{content:close-quote}
.srcq figcaption,.srcq-src{margin-top:16px;display:flex;flex-direction:column;gap:4px}
.srcq figcaption a,.srcq-src a{font-family:var(--sans);font-size:12.5px;font-weight:600;
  color:var(--wine);text-decoration:none}
.srcq figcaption a:hover,.srcq-src a:hover{text-decoration:underline}
.srcq-date{font-family:var(--mono);font-size:9.5px;letter-spacing:.11em;color:var(--ink-soft);line-height:1.5}

/* Two short quotes read better side by side; they stack under 860px. */
.srcq-pair{display:grid;grid-template-columns:1fr 1fr;gap:22px;align-items:start}
.srcq-pair .srcq{margin-bottom:30px}
@media(max-width:860px){.srcq-pair{grid-template-columns:1fr;gap:0}}

/* The "unofficial" warning. Loudest thing in the section, deliberately — it is the
   one sentence that protects a buyer, and it is the county's own word. */
.srcq.alert{border-left-color:var(--wine);background:var(--cream)}
.srcq.alert blockquote{font-size:18px}
.srcq-cta{display:flex;gap:12px;flex-wrap:wrap;margin:22px 0 0}

/* Our own reasoning. No quote marks, no rule down the side — it must not look like
   the blocks above it, because nobody official said it. */
.zone-note.ours{background:none;border:1px dashed var(--hairline)}

.tbl-top{margin-top:54px}
.tbl-top h3{font-size:26px}
.table-caveat.lead{margin-bottom:22px}

/* Per-zone listings link, in the table's group header. */
.tier-listings{display:block;margin-top:7px;font-family:var(--sans);font-size:12px;font-weight:600;
  letter-spacing:0;text-transform:none;color:var(--wine);text-decoration:none}
.tier-listings:hover{text-decoration:underline}

/* The two places the county's own sources disagree with each other. */
.zone-qa{margin-top:38px;border-top:1px solid var(--char);padding-top:8px}
.zone-qa .zq{padding:22px 0;border-bottom:1px solid var(--hairline)}
.zone-qa .zq h4{font-family:var(--serif);font-size:19px;font-weight:600;margin:0 0 8px}
.zone-qa .zq p{font-size:14.5px;line-height:1.62;color:var(--ink);margin:0;max-width:74ch}
.zq-src{margin-top:16px}
.zq-src a{font-family:var(--sans);font-size:12.5px;font-weight:600;color:var(--wine);text-decoration:none}

/* --------------------------------------------------------------------------
   ZONES SECTION — legibility pass, September 2026.
   Two real faults: the quote type was falling back to Cormorant Garamond (a light
   display serif that goes thin at body sizes) because it asked for an undefined
   --lora variable; and .btn.line is a white-on-transparent button built for dark
   hero photos, so on the cream alert panel it was white text on near-white.
   -------------------------------------------------------------------------- */

/* The "Call …" button sits on a light panel, so it needs dark ink and a dark rule.
   Scoped to .srcq-cta so the hero version of .btn.line is untouched. */
.srcq-cta .btn.line{
  background:transparent;
  color:var(--char);
  border:1.5px solid var(--char);
}
.srcq-cta .btn.line:hover{background:var(--char);color:var(--ivory)}

/* Everything in this section a notch more present. The quotes are the substance of
   the page; they should not read like footnotes. */
.srcq{padding:30px 32px}
.srcq-label{font-size:10.5px;letter-spacing:.18em;color:var(--ink);font-weight:500;margin-bottom:15px}
.srcq figcaption a,.srcq-src a{font-size:13.5px}
.srcq-date{font-size:10.5px;letter-spacing:.09em;color:var(--ink-soft);line-height:1.55}
.srcq.alert{border-left-width:3px}
.srcq.alert blockquote{font-size:19.5px;line-height:1.62}

/* The one word that protects a buyer gets to look like it matters. */
.srcq.alert blockquote strong,.srcq blockquote em{font-style:normal;font-weight:600;
  box-shadow:inset 0 -.5em 0 rgba(139,107,61,.18)}

.zone-note.ours{padding:26px 28px}
.zone-note.ours strong{display:block;margin-bottom:9px;font-size:15.5px}
.zone-qa .zq h4{font-size:20.5px}
.zone-qa .zq p{font-size:15.5px;line-height:1.66}
.table-caveat.lead{font-size:15.5px;line-height:1.66;color:var(--ink)}
.tbl-top h3{font-size:28px}
.tier-listings{font-size:12.5px}

/* --------------------------------------------------------------------------
   ZONES SECTION — one type system, September 2026.
   Before this the section used three body faces, two heading faces and two
   alignments. The rule now, top to bottom:
     · section header + intro      centred (matches every other section on the page)
     · everything inside           left, on one left edge
     · every block opens with      the same mono eyebrow
     · quoted matter               Lora 500 — and ONLY quoted matter
     · our own prose               Manrope 15.5 — and only ours
     · block sub-heads             Cormorant 600 at one size
     · source links                Manrope 600 / 13.5
     · date lines                  mono 10.5
   The face tells the reader who is talking. That is the whole point of the section,
   so it has to be consistent or it says nothing.
   -------------------------------------------------------------------------- */

/* Shared block opener — same eyebrow on every block in the section. */
#zones .blk-top{margin:54px 0 18px;text-align:left}
#zones .blk-top .srcq-label{display:block;margin-bottom:12px}
#zones .blk-top h3{font-family:var(--serif);font-size:30px;font-weight:600;line-height:1.16;
  color:var(--char);max-width:22ch}

/* Our own prose — one face, one size, everywhere in this section. */
#zones .zone-note.ours,
#zones .table-caveat.lead,
#zones .zone-qa .zq p,
#zones .sec-note{font-family:var(--sans);font-size:15.5px;line-height:1.7;color:var(--ink);
  max-width:74ch}

/* The "in our own words" lead-in becomes the same eyebrow as every other block,
   instead of a bold sans heading that read as a different level entirely. */
#zones .zone-note.ours strong{display:block;margin-bottom:12px;
  font-family:var(--mono);font-size:10.5px;font-weight:500;letter-spacing:.18em;
  text-transform:uppercase;color:var(--ink)}

/* Conflict questions match the block sub-heads, one step down. */
#zones .zone-qa .zq h4{font-family:var(--serif);font-size:23px;font-weight:600;line-height:1.2;
  color:var(--char);margin-bottom:10px}

/* The zones section's own intro stays centred with the rest of the page; every
   block below it shares one left edge. */
#zones .srcq,#zones .zone-note.ours,#zones .zone-qa,#zones .dir-hold,
#zones .table-caveat,#zones .sec-note{margin-left:0;margin-right:0}

/* FIX: the per-zone listings link sat in the table's black group header using the
   near-black accent — the same white-on-white class of error as the Call button,
   inverted. On a dark row it takes the sand rule the tier-note already uses. */
.dir tr.tier th .tier-listings{
  color:var(--ivory);
  border-bottom:1px solid var(--sand);
  padding-bottom:2px;
  display:inline-block;
  margin-top:9px;
  text-transform:none;
  letter-spacing:.01em;
}
.dir tr.tier th .tier-listings:hover{border-bottom-color:var(--ivory);text-decoration:none}

/* The buyer block is our commentary, same dashed treatment as the interpretation
   box so a reader can tell at a glance it is us talking, not the county. */
#zones .zone-note.ours.buyer{margin-top:34px}

/* --------------------------------------------------------------------------
   ZONES — one card, two voices. September 2026.
   Every block is the same object: eyebrow, title, body, attribution. The reader
   should be able to scan the section and see one consistent unit repeating.
   What distinguishes the county from us is NOT the shape — it is the left rule,
   the body face, and the attribution line:
     sourced  solid rule · Lora (quoted) · outbound link + retrieval date
     ours     dashed rule · Manrope      · LivingInCrozet byline
   Same format, unmistakable difference, which is what the section is for.
   -------------------------------------------------------------------------- */

#zones .srcq{background:var(--ivory);border:1px solid var(--hairline);
  border-left:2px solid var(--char);padding:30px 32px;margin:0 0 26px}

/* The title is the clear, specific line — what this card actually answers. */
#zones .srcq-title{font-family:var(--serif);font-size:25px;font-weight:600;line-height:1.2;
  color:var(--char);margin:0 0 16px;max-width:30ch}
#zones .srcq-pair .srcq-title{font-size:22px}

/* Our prose in the card. */
#zones .srcq-body{font-family:var(--sans);font-size:15.5px;line-height:1.7;color:var(--ink);
  margin:0;max-width:74ch}

/* Attribution. A byline, not a link — it is us. */
#zones .srcq-by{margin:16px 0 0;font-family:var(--mono);font-size:10px;letter-spacing:.11em;
  color:var(--ink-soft);line-height:1.6}

/* Ours: dashed rule instead of solid. The one visual tell, and it is enough. */
#zones .srcq.ours{border-left:2px dashed var(--sand);background:none}
#zones .srcq.ours.lead{border-left-color:var(--char);background:var(--ivory)}
#zones .srcq.ours.lead .srcq-title{font-size:29px}
#zones .srcq.ours.lead .srcq-body{font-size:16.5px}

/* The unofficial warning stays the loudest card in the set. */
#zones .srcq.alert{border-left:3px solid var(--wine);background:var(--cream);margin-bottom:0}
#zones .srcq-cta{display:flex;gap:12px;flex-wrap:wrap;margin:0 0 26px;
  padding:22px 32px 26px;background:var(--cream);border:1px solid var(--hairline);border-top:none}

/* The table sits inside a card like everything else. */
#zones .srcq.tblcard .dir-hold{margin-top:22px}
#zones .srcq.tblcard .table-caveat{margin-top:14px;max-width:74ch}

/* Conflict pairs inside their card. */
#zones .zone-qa{margin-top:6px;border-top:none;padding-top:0}
#zones .zone-qa .zq{padding:20px 0;border-bottom:1px solid var(--hairline)}
#zones .zone-qa .zq:last-child{border-bottom:none;padding-bottom:0}
#zones .zone-qa .zq h4{font-family:var(--serif);font-size:21px;font-weight:600;margin-bottom:9px}

/* Retire the old standalone treatments now that everything is a card. */
#zones .blk-top{display:none}
#zones .zone-note.ours{display:none}

/* --------------------------------------------------------------------------
   ZONES — boxed authority, unboxed commentary. September 2026.
   The rule a reader can learn in one glance and never has to be told:
     INSIDE A BOX  = quoted from Albemarle County or ACPS, link along the bottom
     OUTSIDE A BOX = LivingInCrozet
   Nothing of ours ever appears inside a box; nothing quoted ever appears outside
   one. The source link sits on the bottom edge of every box, behind a rule, so
   the box reads as a complete citation from title to attribution.
   -------------------------------------------------------------------------- */

.srcbox{margin:0 0 14px;border:1px solid var(--char);background:var(--ivory)}
.srcbox-in{padding:32px 34px 28px}
.srcbox blockquote{margin:0;font-family:'Lora',Georgia,serif;font-weight:500;font-size:18.5px;
  line-height:1.66;color:var(--char);quotes:"\201C" "\201D"}
.srcbox blockquote::before{content:open-quote}
.srcbox blockquote::after{content:close-quote}
.srcbox .srcq-label{display:block;font-family:var(--mono);font-size:10.5px;font-weight:500;
  letter-spacing:.18em;text-transform:uppercase;color:var(--ink);margin-bottom:14px}
.srcbox .srcq-title{font-family:var(--serif);font-size:26px;font-weight:600;line-height:1.18;
  color:var(--char);margin:0 0 18px;max-width:30ch}
.srcbox-note{font-family:var(--sans);font-size:15.5px;line-height:1.7;color:var(--ink);
  margin:0;max-width:74ch}
.srcbox-note.small{margin-top:16px;font-size:13.5px;color:var(--ink-soft)}

/* The link lives on the bottom edge of the box, not floating after it. */
.srcbox-foot{border-top:1px solid var(--hairline);background:var(--cream);
  padding:16px 34px 17px;display:flex;flex-direction:column;gap:5px}
.srcbox-foot a{font-family:var(--sans);font-size:13.5px;font-weight:600;color:var(--char);
  text-decoration:none;border-bottom:1px solid var(--sand);align-self:flex-start;padding-bottom:2px}
.srcbox-foot a:hover{border-bottom-color:var(--char)}
.srcbox-foot .srcq-date{font-family:var(--mono);font-size:10px;letter-spacing:.09em;
  color:var(--ink-soft);line-height:1.6}

/* The warning box and its two actions read as one unit. */
.srcbox.alert{border-width:2px;margin-bottom:0}
.srcbox.alert .srcbox-in{background:var(--cream)}
.srcbox.alert blockquote{font-size:19.5px}

/* Ours. No box — that is the whole signal. Indented under the authority it
   answers, with a short rule above the label to tie it to the box overhead. */
.ourblock{margin:30px 0 44px;padding:0 0 0 34px;border-left:2px solid var(--sand);max-width:78ch}
.ourblock .srcq-label{display:block;font-family:var(--mono);font-size:10.5px;font-weight:500;
  letter-spacing:.18em;text-transform:uppercase;color:var(--wine);margin-bottom:12px}
.ourblock .srcq-title{font-family:var(--serif);font-size:26px;font-weight:600;line-height:1.18;
  color:var(--char);margin:0 0 14px;max-width:30ch}
.ourblock .srcq-body{font-family:var(--sans);font-size:16px;line-height:1.72;color:var(--ink);margin:0}
.ourblock .srcq-by{margin:15px 0 0;font-family:var(--mono);font-size:10px;letter-spacing:.11em;
  color:var(--ink-soft);line-height:1.6}

/* Table and conflict pairs inside their boxes. */
.srcbox .dir-hold{margin-top:24px}
.srcbox .zone-qa{margin:0;border-top:none;padding-top:0}
.srcbox .zone-qa .zq{padding:20px 0;border-bottom:1px solid var(--hairline)}
.srcbox .zone-qa .zq:last-child{border-bottom:none;padding-bottom:0}
.srcbox .zone-qa .zq h4{font-family:var(--serif);font-size:21px;font-weight:600;margin-bottom:9px}
.srcbox .zone-qa .zq p{font-family:var(--sans);font-size:15.5px;line-height:1.68;color:var(--ink);
  margin:0;max-width:74ch}

#zones .srcq-cta{display:flex;gap:12px;flex-wrap:wrap;margin:0 0 44px;
  padding:22px 34px 26px;background:var(--cream);border:2px solid var(--char);border-top:none}

@media(max-width:700px){
  .srcbox-in{padding:26px 22px 22px}
  .srcbox-foot{padding:15px 22px 16px}
  .ourblock{padding-left:20px;margin:26px 0 38px}
  #zones .srcq-cta{padding:20px 22px 24px}
}

/* --------------------------------------------------------------------------
   ZONES — single heading per block. September 2026.
   Two problems fixed together. Each block carried a mono eyebrow AND a serif
   title that said the same thing, so every block opened with two headings. And
   Cormorant Garamond at 26px sits at almost the same visual weight as Lora at
   18.5px — both serif, both light — so the title read as more body copy rather
   than as the thing introducing it.
   The eyebrow is gone. The title is now the only heading, at a size that cannot
   be mistaken for the quote beneath it.
   -------------------------------------------------------------------------- */

.srcbox .srcq-title,
.ourblock .srcq-title{
  font-size:34px;
  line-height:1.1;
  letter-spacing:-.008em;
  margin:0 0 20px;
  max-width:26ch;
}
.srcbox.alert .srcq-title{font-size:36px}
.ourblock .srcq-title{margin-bottom:16px}

/* Quote steps down slightly so the gap between heading and body is unambiguous. */
.srcbox blockquote{font-size:18px}
.srcbox.alert blockquote{font-size:18.5px}

/* Without an eyebrow the box needs a touch less top padding to stay balanced. */
.srcbox-in{padding-top:30px}
.ourblock{padding-top:2px}

@media(max-width:700px){
  .srcbox .srcq-title,.ourblock .srcq-title{font-size:27px;max-width:none}
  .srcbox.alert .srcq-title{font-size:28px}
}

/* Specificity correction: the block above lost to an earlier `#zones .srcq-title`
   rule (an ID selector always beats two classes), so the heading kept rendering at
   25px. Same intent, scoped to match. Keep new zones rules at this weight. */
#zones .srcbox .srcq-title,
#zones .ourblock .srcq-title{
  font-size:34px;line-height:1.1;letter-spacing:-.008em;margin:0 0 20px;max-width:26ch;
}
#zones .srcbox.alert .srcq-title{font-size:36px}
#zones .ourblock .srcq-title{margin-bottom:16px}
#zones .srcbox blockquote{font-size:18px}
#zones .srcbox.alert blockquote{font-size:18.5px}
#zones .ourblock .srcq-body{font-size:16px;line-height:1.72}
@media(max-width:700px){
  #zones .srcbox .srcq-title,#zones .ourblock .srcq-title{font-size:27px;max-width:none}
  #zones .srcbox.alert .srcq-title{font-size:28px}
}

/* Zones, simplified to two questions. The direct answer is the first thing under
   each question and is set larger than body copy so it reads as the answer. */
#zones .zq-answer{font-family:var(--sans);font-size:17px;line-height:1.72;color:var(--ink);
  max-width:74ch;margin:0 auto 34px;text-align:left}
#zones .zq-answer a{color:var(--char);border-bottom:1px solid var(--sand);text-decoration:none}
#zones .zq-answer a:hover{border-bottom-color:var(--char)}
#zones .sec-top{text-align:left;max-width:74ch;margin-left:0;margin-right:0}
#zones .sec-top.q2-top{margin-top:78px;padding-top:44px;border-top:1px solid var(--hairline)}
#zones .dir-hold{margin-bottom:10px}
#zones .table-caveat{max-width:74ch;margin-bottom:38px}
#zones .ourblock{margin-top:44px}
#zones .ourblock .srcq-body a{color:var(--char);border-bottom:1px solid var(--sand);text-decoration:none}
#zones .sec-note{max-width:74ch;margin-top:26px}
/* Q3 is a sourced fact with no commentary — its attribution sits as a plain line. */
#zones .zq-src{max-width:74ch;margin:-18px 0 0;font-family:var(--mono);font-size:10.5px;
  letter-spacing:.09em;line-height:1.75;color:var(--ink-soft)}
#zones .zq-src a{display:inline-block;margin-top:6px;font-family:var(--sans);font-size:13px;
  font-weight:600;letter-spacing:0;color:var(--char);border-bottom:1px solid var(--sand);text-decoration:none}

/* ==========================================================================
   SCHOOLS HUB — one alignment, one type scale.  September 2026
   Scoped to body.schools-hub so nothing here touches any other page.

   Two rules, applied without exception:
     1. EVERYTHING IS LEFT-ALIGNED. The page was mixing centred section headers
        with left-aligned bodies, which read as two different layouts fighting.
     2. ONE TYPE SCALE. Before this the page used nine sizes between 13 and 36px.
        Now: 38 section head / 26 sub-head / 18 quote / 16 body / 13.5 link /
        10.5 meta. Nothing else.
   ========================================================================== */

/* ---- 1. alignment ---- */
.schools-hub .sec-top,
.schools-hub .sec-answer,
.schools-hub .sec-note,
.schools-hub .sec-note.centered,
.schools-hub .table-caveat,
.schools-hub .zq-answer,
.schools-hub .answer-grid,
.schools-hub .path .sec-top,
.schools-hub .feeder-foot,
.schools-hub .tbl-cta{
  text-align:left;
  margin-left:0;
  margin-right:0;
}
.schools-hub .sec-top{max-width:74ch}
.schools-hub .sec-answer{max-width:74ch;margin-bottom:38px}
.schools-hub .path .converge,
.schools-hub .path .feeder-diagram{margin-left:0}

/* ---- 2. type scale ---- */
.schools-hub h2{font-size:38px;line-height:1.14;letter-spacing:-.01em}
.schools-hub .srcq-title,
.schools-hub .blk-top h3,
.schools-hub .tbl-top h3,
.schools-hub .zone-qa .zq h4{font-size:26px;line-height:1.2;margin-bottom:14px}
.schools-hub .srcbox blockquote,
.schools-hub .srcbox.alert blockquote{font-size:18px;line-height:1.66}
.schools-hub .sec-answer,
.schools-hub .zq-answer,
.schools-hub .srcq-body,
.schools-hub .table-caveat,
.schools-hub .sec-note,
.schools-hub .srcbox-note{font-family:var(--sans);font-size:16px;line-height:1.72;color:var(--ink)}
.schools-hub .table-caveat,
.schools-hub .sec-note{color:var(--ink-soft)}
.schools-hub .srcbox-foot a,
.schools-hub .zq-src a{font-size:13.5px}
.schools-hub .srcq-date,
.schools-hub .srcq-by,
.schools-hub .zq-src{font-size:10.5px;letter-spacing:.09em}

/* Section heads keep one eyebrow treatment across the whole page. */
.schools-hub .sec-top .label{display:block;margin-bottom:14px;font-size:10.5px;letter-spacing:.2em}

.schools-hub #zone-table .dir-hold{margin-top:8px}
.schools-hub .tbl-cta{margin-top:26px}

@media(max-width:700px){
  .schools-hub h2{font-size:29px}
  .schools-hub .srcq-title,.schools-hub .zone-qa .zq h4{font-size:23px}
}

/* ==========================================================================
   SCHOOLS HUB — alignment and type, final pass.  September 2026
   The alignment bug was mine twice over: `#zones .zq-answer{margin:0 auto}` is an
   ID selector, so every `.schools-hub` override lost to it and the answers stayed
   optically centred while their headings sat left. Every rule below is scoped
   `.schools-hub #id` so it cannot lose again. Any future rule here must match.
   TWO SIZES inside an answer: the question, and everything else.
   ========================================================================== */

.schools-hub #zones .zq-answer,
.schools-hub #zones .zq-buyer,
.schools-hub #zones .zq-src,
.schools-hub #zones .sec-top,
.schools-hub #zones .sec-note,
.schools-hub #verify .srcbox,
.schools-hub #verify .srcq-cta,
.schools-hub #zone-table .sec-top,
.schools-hub #zone-table .table-caveat,
.schools-hub #pattern .sec-top,
.schools-hub #pattern .sec-answer,
.schools-hub #at-a-glance .sec-top,
.schools-hub #at-a-glance .sec-answer,
.schools-hub .answer .answer-grid{
  margin-left:0 !important;
  margin-right:0 !important;
  text-align:left !important;
}

/* One body size for every answer, note and caption in the section. */
.schools-hub #zones .zq-answer,
.schools-hub #zones .zq-buyer,
.schools-hub #verify .srcbox blockquote,
.schools-hub #verify .srcbox-note,
.schools-hub #zone-table .table-caveat{
  font-family:var(--sans);font-size:16px;line-height:1.72;color:var(--ink);max-width:74ch;
}
.schools-hub #verify .srcbox blockquote{font-family:'Lora',Georgia,serif;font-weight:500}

/* The buyer note is the same size as the answer — a bold run-in marks it, not a
   third type size and not another heading. */
.schools-hub #zones .zq-buyer{margin-top:20px}
.schools-hub #zones .zq-buyer strong{font-weight:700;color:var(--char)}
.schools-hub #zones .zq-answer a,
.schools-hub #zones .zq-buyer a{color:var(--char);border-bottom:1px solid var(--sand);text-decoration:none}

/* Spacing between the three questions. */
.schools-hub #zones .sec-top{margin:0 0 20px;max-width:74ch}
.schools-hub #zones .sec-top.q2-top{margin-top:74px;padding-top:42px;border-top:1px solid var(--hairline)}
.schools-hub #verify .srcbox{margin-bottom:0}

/* One size for every box title, one for every quote. The page had 34px and 36px
   titles sitting beside 18px and 18.5px quotes — four sizes doing two jobs. */
.schools-hub .srcbox .srcq-title,
.schools-hub .srcbox.alert .srcq-title{font-size:26px !important;line-height:1.2;margin-bottom:16px}
.schools-hub .srcbox blockquote,
.schools-hub .srcbox.alert blockquote{font-size:16px !important;line-height:1.72}

/* --------------------------------------------------------------------------
   CLUSTER PAGES — same model as the hub. September 2026
   Sourced answer, its link, then our reading as a bold run-in at the same size.
   Two sizes per block: the question, and everything else.
   -------------------------------------------------------------------------- */
.guide-page .qa h2{font-size:38px;line-height:1.14;letter-spacing:-.01em;margin-bottom:18px;text-align:left}
.guide-page .qa-a,
.guide-page .qa-buyer,
.guide-page .qa-tbl{font-size:16px;line-height:1.72}
.guide-page .qa-src a,
.guide-page .qa-src a + a{font-size:13.5px}

/* Our reading sits after the source, marked by a bold run-in rather than a heading
   or another box — same device the hub uses. */
.guide-page .qa-buyer{margin-top:20px;padding-top:20px;border-top:1px solid var(--hairline);
  font-family:var(--sans);color:var(--ink);max-width:74ch}
.guide-page .qa-buyer strong{font-weight:700;color:var(--char)}

/* Everything left, nothing centred. */
.guide-page .qa,
.guide-page .qa h2,
.guide-page .qa-a,
.guide-page .qa-buyer,
.guide-page .answer .answer-grid,
.guide-page .sec-top,
.guide-page .dateline{text-align:left;margin-left:0;margin-right:0}
.guide-page .qa-a{max-width:74ch}
/* Sourced detail that used to sit in a tinted list. Same size, same colour, same
   column as the answer it continues — weight is the only difference, so the block
   reads as one sourced passage and the page keeps two type sizes. */
.qa-more{font-weight:450;margin-top:16px}
.guide-page .qa-more{font-weight:450;color:var(--ink)}

@media(max-width:700px){.guide-page .qa h2{font-size:29px}}

/* ==========================================================================
   CLUB FIELD — collapsible club roster for school pages (21 Sep 2026)
   Town-agnostic. Renders from school.clubs.categories[]; any number of
   categories, any number of clubs each. A school with no categories[] falls
   back to the older .tag-row markup and none of this applies.

   Closed by default: the category strip shows the shape of the roster, the
   full list sits inside a native <details>. NATIVE on purpose — the club
   names stay in the HTML source whether open or closed, so crawlers and AI
   answer engines read all of them. Do NOT swap this for a JS accordion.
   ========================================================================== */

/* source link directly under the direct answer — cite at the point of claim */
.sec-srclink{text-align:center;margin:0 auto 46px}
.sec-srclink a{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--wine);text-decoration:none;border-bottom:1px solid var(--sand);padding-bottom:3px}
.sec-srclink a:hover{border-bottom-color:var(--wine)}
.clubs-sec .sec-answer{max-width:760px;margin-bottom:14px}

/* headline count */
.clubfield-count{display:flex;align-items:baseline;justify-content:center;gap:16px;margin:0 auto 10px}
.clubfield-count .n{font-family:var(--data);font-size:clamp(46px,6vw,68px);line-height:1;font-weight:600;color:var(--ink)}
.clubfield-count .cap{font-family:var(--mono);font-size:10.5px;letter-spacing:.24em;text-transform:uppercase;
  color:var(--ink-soft);max-width:150px;text-align:left;line-height:1.5}
.clubfield-rule{border:none;border-top:1px solid var(--hairline);max-width:1140px;margin:30px auto 0}

/* category strip — the always-visible summary */
.cf-pills{list-style:none;display:flex;flex-wrap:wrap;gap:8px;justify-content:center;max-width:940px;margin:0 auto}
.cf-pills li{display:inline-flex;align-items:baseline;gap:9px;border:1px solid var(--sand);padding:8px 13px}
.cp-name{font-size:13.5px;font-weight:600;color:var(--ink);letter-spacing:.005em}
.cp-n{font-family:var(--mono);font-size:10px;color:var(--ink-soft)}

/* disclosure */
.cf-disc{margin-top:34px}
.cf-disc summary{list-style:none;display:flex;justify-content:center;cursor:pointer}
.cf-disc summary::-webkit-details-marker{display:none}
.cf-disc summary span.sbtn{display:inline-flex;align-items:center;gap:10px;background:var(--char);color:var(--ivory);
  font-weight:600;font-size:13px;letter-spacing:.06em;text-transform:uppercase;padding:15px 28px;transition:background .25s}
.cf-disc summary:hover span.sbtn{background:var(--wine)}
.cf-disc summary:focus-visible span.sbtn{outline:3px solid var(--wine);outline-offset:2px}
.cf-disc .lbl-less{display:none}
.cf-disc[open] .lbl-more{display:none}
.cf-disc[open] .lbl-less{display:inline}

/* the full grid */
.clubfield{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--hairline);
  border:1px solid var(--hairline);margin-top:30px}
/* fills a trailing empty cell so the 1px grid background doesn't show as a block */
.clubfield::after{content:'';background:var(--ivory)}
.cf-cat{background:var(--ivory);padding:32px 30px 30px}
.cf-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:16px}
.cf-cat h3{font-size:24px}
.cf-n{font-family:var(--mono);font-size:10px;letter-spacing:.16em;color:var(--ink-soft)}
.cf-list{list-style:none;display:flex;flex-wrap:wrap;gap:8px}
/* club names are READ, not scanned as labels — body font, full ink, no uppercase */
.cf-list li{font-family:var(--sans);font-size:13.5px;line-height:1.35;font-weight:500;letter-spacing:.005em;
  padding:7px 12px;border:1px solid var(--sand);color:var(--ink)}

.clubs-sec .source a{color:var(--wine)}

@media(max-width:940px){.clubfield{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){
  .clubfield{grid-template-columns:1fr}
  .cf-cat{padding:26px 22px 24px}
  .clubfield-count{flex-direction:column;align-items:center;gap:6px}
  .clubfield-count .cap{text-align:center;max-width:none}
}


/* --------------------------------------------------------------------------
   SCHOOLS HUB — audit pass, September 2026
   Components added by the tier 1-4 audit: the named trade-off, the page-ending
   related set, and a light-panel variant of the outline button.
   -------------------------------------------------------------------------- */

/* The named trade-off. Set apart from the note above it by a rule, not a tint —
   same device the cluster pages use for "What this means for you". */
.schools-hub .sec-tradeoff{
  margin-top:26px;padding-top:22px;border-top:1px solid var(--hairline);
  font-family:var(--sans);font-size:16px;line-height:1.72;color:var(--ink);
  max-width:74ch;text-align:left;
}
.schools-hub .sec-tradeoff strong{font-weight:700;color:var(--char)}

/* Second CTA under the zone table sits on cream, so the outline button needs dark
   ink — .btn.line is built white-on-transparent for hero photos. Same fix as
   .srcq-cta above; scoped so the hero version is untouched. */
.tbl-cta{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.tbl-cta .btn.line{background:transparent;color:var(--char);border:1.5px solid var(--char)}
.tbl-cta .btn.line:hover{background:var(--char);color:var(--ivory)}

/* Page ending: one CTA, then a short related set. Navigation, not a second pitch. */
.schools-hub #onward{padding-top:0}
.onward-cta{margin:0 0 26px}
.onward-links{list-style:none;margin:0;padding:0;border-top:1px solid var(--hairline)}
.onward-links li{border-bottom:1px solid var(--hairline)}
.onward-links a{
  display:block;padding:15px 0;text-decoration:none;color:var(--ink);
  font-family:var(--sans);font-size:16px;line-height:1.5;
}
.onward-links a:hover{color:var(--wine)}

/* The new-build addendum runs on from the buyer note without repeating its run-in. */
.schools-hub .zq-buyer.sub-note{margin-top:14px;padding-top:0;border-top:0}

/* Table captions (cost of living). A caption names what the table is, for readers and for AI retrieval. */
.col-table caption{caption-side:top;text-align:left;font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft);padding:0 0 10px}

/* ==========================================================================
   OPTIONAL LAYOUT VARIANTS — added for town #2 (Keswick). Every rule below only
   applies when a town opts in from its fact sheet, so Crozet renders unchanged.
   ========================================================================== */

/* ---------- header variant: centred crest (town.header.style = "crest") ---------- */
.crest-nav{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:24px}
.crest-nav .nav-side.r .nav-links{justify-content:flex-end}
.crest{display:flex;flex-direction:column;align-items:center;text-decoration:none;line-height:1;color:#fff}
.crest-mono{width:56px;height:56px;border-radius:50%;border:1px solid var(--gold);display:grid;place-items:center;position:relative}
.crest-mono::after{content:"";position:absolute;inset:4px;border-radius:50%;border:1px solid var(--gold);opacity:.45}
.crest-mono b{font-family:var(--serif);font-style:italic;font-weight:600;font-size:22px;color:var(--gold);letter-spacing:.02em}
.crest-nm{margin-top:9px;font-size:9.5px;font-weight:600;letter-spacing:.34em;text-transform:uppercase}
.hdr-crest header.scrolled{background:var(--hdr-solid);border-bottom:1px solid rgba(255,255,255,.12)}
.hdr-crest header.scrolled .nav-links a{color:rgba(255,255,255,.82)}
.hdr-crest header.scrolled .nav-links a:hover{color:var(--gold)}
.hdr-crest header.scrolled .nav-links a[aria-current="page"]{border-bottom-color:var(--gold)}
.hdr-crest header.scrolled .crest{color:#fff}
.hdr-crest header.scrolled .nav-toggle{color:#fff}
@media(max-width:940px){
  .crest-nav{grid-template-columns:44px 1fr 44px}
  .crest-nav .nav-side{display:none}
  .crest{grid-column:2;justify-self:center}
  .crest-nav .nav-toggle{grid-column:3}
  .crest-mono{width:46px;height:46px}.crest-mono b{font-size:18px}
}

/* ---------- hero variant: title only, centred (home.hero.style = "title") ---------- */
.hero.hero-title{align-items:center;justify-content:center;text-align:center}
.hero.hero-title .hero-inner{padding:0 28px;max-width:1100px}
.hero.hero-title .label{color:var(--gold);letter-spacing:.4em}
.hero.hero-title h1,.hero.hero-title .hero-h{margin:0 auto;max-width:none;font-size:clamp(52px,9vw,124px);letter-spacing:-.005em}
.hero.hero-title h1::after,.hero.hero-title .hero-h::after{content:"";display:block;width:60px;height:1px;background:var(--gold);margin:34px auto 0}

/* ---------- area sections: estate country organised by village (hood.sections) ---------- */
.place-list{border-top:1px solid var(--hairline);margin-top:10px}
.place{display:grid;grid-template-columns:300px 1fr;gap:48px;padding:42px 0;border-bottom:1px solid var(--hairline)}
.place h3{font-size:clamp(28px,3vw,36px);margin-top:12px}
.place-stats{display:grid;grid-template-columns:auto 1fr;gap:7px 16px;margin-top:20px;font-size:13.5px}
.place-stats div{display:contents}
.place-stats dt{color:var(--ink-soft)}
.place-stats dd{margin:0;font-family:var(--data);font-size:19px;font-weight:600;text-align:right;font-variant-numeric:tabular-nums}
.place-body p{margin-bottom:14px;max-width:62ch}
.place-roads{font-size:13.5px;color:var(--ink-soft)}
@media(max-width:820px){.place{grid-template-columns:1fr;gap:14px;padding:32px 0}}

/* ---------- village bands (hood.sectionsStyle: "bands") ----------
   Dark bands tinted by the town's hero colours; median + every sale on the right. */
.vband-list{display:flex;flex-direction:column;gap:14px;margin-top:10px}
.vband{display:grid;grid-template-columns:1fr 280px;gap:48px;align-items:start;background:var(--hero-b);color:#E6E1D8;padding:40px 44px 38px}
.vband .label{color:#C9B98F}
.vband h3{font-size:clamp(30px,3.2vw,40px);color:#fff;margin:8px 0 14px}
.vband-main p{font-size:15px;max-width:60ch;margin-bottom:12px;color:#DCD6CB}
.vband-main p b{color:#fff}
.vband-roads{font-size:13.5px!important;color:rgba(255,255,255,.6)!important}
.vband-facts{display:flex;flex-wrap:wrap;margin-top:20px}
.vband-facts div{padding:0 22px;border-left:1px solid var(--hairline-d)}
.vband-facts div:first-child{padding-left:0;border-left:none}
.vband-facts dt{font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:#C9B98F}
.vband-facts dd{margin:2px 0 0;font-family:var(--data);font-size:22px;font-weight:600;color:#fff;font-variant-numeric:tabular-nums;line-height:1.2}
.vband-med{padding-top:6px}
.vband-num{font-family:var(--data);font-weight:600;font-size:56px;line-height:1;color:#fff;font-variant-numeric:tabular-nums}
.vband-lbl{font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:#C9B98F;margin-top:8px}
.vband-sh{font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.55);margin:18px 0 8px;padding-top:16px;border-top:1px solid var(--hairline-d)}
.vband-sales{list-style:none;display:flex;flex-wrap:wrap;gap:6px}
.vband-sales li{font-family:var(--mono);font-size:12px;padding:5px 8px;border:1px solid rgba(255,255,255,.22);color:#E6E1D8;font-variant-numeric:tabular-nums}
.vband-sales li.m{background:#C9B98F;border-color:#C9B98F;color:var(--hero-d);font-weight:600}
.vband-note{font-size:12px;color:rgba(255,255,255,.6);margin-top:10px;line-height:1.5}
.vband-facts--grid{display:grid;grid-template-columns:repeat(3,max-content);gap:16px 36px;margin-top:22px;padding-top:18px;border-top:1px solid var(--hairline-d)}
.vband-facts--grid div{padding:0;border-left:none}
.vband-mid{font-size:13.5px;color:rgba(255,255,255,.7);margin-top:12px}
.vband-mid b{color:#fff;font-weight:600}
.vband-streets li{font-size:11.5px}
.vband-streets li span{color:#C9B98F}
/* ---------- find your street (hood.streetTable) ---------- */
.fys-top{display:flex;flex-wrap:wrap;gap:16px 24px;align-items:end;justify-content:space-between;margin-bottom:18px}
.fys h2{font-size:clamp(28px,3.4vw,38px);margin-top:8px}
.fys-sub{color:var(--ink-soft);font-size:14.5px;margin-top:6px;max-width:62ch}
.fys-ctl{display:flex;gap:10px;flex-wrap:wrap}
.fys-ctl[hidden]{display:none}
.fys-ctl input{font:inherit;font-size:15px;padding:11px 14px;border:1px solid var(--ink);background:#fff;min-width:240px;border-radius:0}
.fys-f{display:flex}
.fys-f button{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;padding:11px 12px;border:1px solid var(--hairline);background:#fff;color:var(--ink);cursor:pointer;margin-left:-1px}
.fys-f button[aria-pressed="true"]{background:var(--ink);color:#fff;border-color:var(--ink)}
.fys-scroll{overflow-x:auto;border-top:1px solid var(--ink)}
.fys-table{width:100%;border-collapse:collapse;font-size:14.5px;min-width:680px}
.fys-table thead th{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);text-align:left;padding:12px;border-bottom:1px solid var(--hairline);font-weight:500}
.fys-table tbody th{text-align:left;font-weight:600;padding:11px 12px;border-bottom:1px solid var(--hairline)}
.fys-table tbody td{padding:11px 12px;border-bottom:1px solid var(--hairline);font-variant-numeric:tabular-nums}
.fys-table tbody tr:hover{background:var(--cream)}
.fys-table tr[hidden]{display:none}
.fys-tg{font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;padding:3px 7px;border:1px solid var(--hairline)}
.fys-tg-estate{background:var(--hero-b);color:#fff;border-color:var(--hero-b)}
.fys-tg-core{background:#E6E1D8}
.fys-empty{padding:18px 12px;color:var(--ink-soft)}
@media(max-width:900px){.vband-facts--grid{grid-template-columns:repeat(2,max-content)}.fys-ctl{width:100%}.fys-ctl input{min-width:0;width:100%}}
@media(max-width:900px){
  .vband{grid-template-columns:1fr;gap:22px;padding:30px 24px}
  .vband-med{border-top:1px solid var(--hairline-d);padding-top:20px}
  .vband-num{font-size:46px}
}
header.nav-open .crest{color:var(--ink)}


/* ============ Keswick home additions: card facts, price chart, four facts ============ */
.hood-facts{list-style:none;margin:12px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.hood-facts li{font-family:var(--mono);font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-soft);border:1px solid var(--hairline);padding:5px 9px;background:var(--ivory)}

.pchart{margin:0 auto;max-width:1040px;--pcn:200px;--pcv:170px}
.pc-rows{position:relative;border-top:1px solid var(--char)}
.pc-row{display:grid;grid-template-columns:var(--pcn) 1fr var(--pcv);align-items:center;gap:0;padding:17px 0;border-bottom:1px solid var(--hairline)}
.pc-name b{display:block;font-family:var(--sans);font-size:15.5px;font-weight:700;color:var(--ink);line-height:1.15}
.pc-name span{display:block;font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft);margin-top:3px}
.pc-track{position:relative;height:14px;margin:0 22px;background:linear-gradient(var(--hairline),var(--hairline)) center/100% 1px no-repeat}
.pc-bar{position:absolute;top:0;bottom:0;background:var(--wine);border-radius:1px}
.pc-sec .pc-bar{background:var(--sand)}
.pc-med{position:absolute;top:-4px;bottom:-4px;width:2px;margin-left:-1px;background:var(--gold)}
.pc-val{font-family:var(--data);font-size:19px;font-weight:600;color:var(--ink);text-align:right;font-variant-numeric:tabular-nums;font-feature-settings:'lnum' 1,'tnum' 1;white-space:nowrap}
.pc-val span{display:block;font-family:var(--mono);font-size:10px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft)}
.pc-sec .pc-name b,.pc-sec .pc-val{color:var(--ink-soft)}
.pc-ov{position:absolute;top:0;bottom:0;left:calc(var(--pcn) + 22px);right:calc(var(--pcv) + 22px);pointer-events:none}
.pc-blend{position:absolute;top:-30px;bottom:0;border-left:1px dashed var(--delta)}
.pc-blend span{position:absolute;top:0;left:8px;white-space:nowrap;font-family:var(--mono);font-size:10.5px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--delta)}
.pc-axis{position:relative;height:26px;margin:0 calc(var(--pcv) + 22px) 0 calc(var(--pcn) + 22px)}
.pc-axis span{position:absolute;top:8px;transform:translateX(-50%);font-family:var(--mono);font-size:10.5px;color:var(--ink-soft)}
.pchart figcaption{margin-top:22px;font-size:13px;color:var(--ink-soft);text-align:center;line-height:1.6}
#prices .pc-rows{margin-top:40px}
@media(max-width:760px){
  .pchart{--pcn:0px;--pcv:0px}
  .pc-row{grid-template-columns:1fr auto;row-gap:10px}
  .pc-track{grid-column:1 / -1;grid-row:2;margin:0}
  .pc-ov{left:0;right:0}
  .pc-axis{margin:0}
}

.facts-band{background:var(--char);color:var(--ivory);padding:88px 0}
.facts-band .label{color:var(--gold)}
.facts-band h2{color:var(--ivory)}
.facts-grid{display:grid;grid-template-columns:repeat(4,1fr);margin-top:44px;border-top:1px solid rgba(184,149,90,.45)}
.fact{padding:30px 26px 6px;border-right:1px solid rgba(255,255,255,.1)}
.fact:last-child{border-right:none}
.fact b{display:block;font-family:var(--data);font-size:clamp(40px,4.4vw,58px);font-weight:600;line-height:1;color:var(--gold);font-variant-numeric:lining-nums;font-feature-settings:'lnum' 1}
.fact p{margin-top:14px;font-size:14.5px;line-height:1.55;color:rgba(251,248,241,.82)}
@media(max-width:900px){.facts-grid{grid-template-columns:1fr 1fr}.fact:nth-child(2){border-right:none}}
@media(max-width:520px){.facts-grid{grid-template-columns:1fr}.fact{border-right:none;border-bottom:1px solid rgba(255,255,255,.1);padding:24px 0}}
.sb b{white-space:nowrap}
.statsbar .sb:nth-last-child(2){border-right:none}
@media(max-width:760px){.pc-name b,.pc-name span,.pc-val{display:table;position:relative;z-index:1;background:var(--ivory);padding-right:6px}.pc-val{margin-left:auto;padding:0 0 0 6px}.pc-val span{display:block}}

/* Hero title can render as a <p> when the page's H1 lives in the answer block (home.hero.titleTag) */
.hero-h{font-family:var(--serif);font-weight:600;line-height:1.08;letter-spacing:-.01em}
.answer h1{font-size:clamp(36px,4.6vw,56px);line-height:1.04}
/* Area grids (home + /neighborhoods/): 3 on top, the last 2 centred underneath (desktop only) */
@media(min-width:881px){
  .hood-grid{grid-template-columns:repeat(6,1fr)}
  .hood-grid > *{grid-column:span 2}
  .hood-grid > :nth-child(4):nth-last-child(2){grid-column:2 / span 2}
}

/* ============ Lifestyle calendar (home.lifeCalendar) ============ */
.lifecal{background:var(--char);color:var(--ivory);padding:104px 0 90px}
.lifecal-grid{display:grid;grid-template-columns:minmax(280px,380px) 1fr;gap:80px;align-items:start}
.lifecal-head{position:sticky;top:130px}
.lifecal .label{color:var(--gold);display:block;margin-bottom:18px}
.lifecal h2{color:var(--ivory);font-size:clamp(34px,4vw,50px);line-height:1.06}
.lifecal-answer{margin-top:26px;padding-top:24px;border-top:1px solid rgba(184,149,90,.5);font-size:16.5px;line-height:1.7;color:rgba(251,248,241,.86)}
.lifecal-list{list-style:none;margin:0;padding:0;border-top:1px solid rgba(255,255,255,.14)}
.lc-row{display:grid;grid-template-columns:150px 1fr;gap:28px;padding:30px 0;border-bottom:1px solid rgba(255,255,255,.14)}
.lc-when{font-family:var(--mono);font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);padding-top:9px}
.lc-body h3{font-family:var(--serif);font-size:clamp(24px,2.4vw,30px);font-weight:600;color:var(--ivory);line-height:1.12}
.lc-body p{margin-top:10px;font-size:15px;line-height:1.7;color:rgba(251,248,241,.78);max-width:620px}
.lc-trade .lc-when{color:#D9A3A9}
.lc-trade .lc-body h3{font-style:italic}
.lifecal-note{margin-top:34px;font-size:12.5px;color:rgba(251,248,241,.5);text-align:right}
@media(max-width:900px){.lifecal{padding:76px 0 64px}.lifecal-grid{grid-template-columns:1fr;gap:40px}.lifecal-head{position:static}.lc-row{grid-template-columns:1fr;gap:8px;padding:24px 0}.lc-when{padding-top:0}.lifecal-note{text-align:left}}

/* ============ Crest header: dropdown + button item ============ */
.nav-links .caret{display:inline-block;width:6px;height:6px;margin-left:8px;border-right:1px solid currentColor;border-bottom:1px solid currentColor;transform:translateY(-3px) rotate(45deg);opacity:.8}
@media(min-width:941px){
  .crest-hdr .nav-links{align-items:center}
  .crest-hdr .nav-links .subnav{left:0;transform:translateY(4px);min-width:290px;padding-top:18px}
  .crest-hdr .nav-links .has-sub:hover .subnav,.crest-hdr .nav-links .has-sub:focus-within .subnav{transform:translateY(0)}
  .crest-hdr .nav-links .subnav li{background:var(--ivory)}
  .crest-hdr .nav-links .subnav li:first-child a{font-weight:500}
  .crest-hdr .nav-links .subnav a{text-transform:none;letter-spacing:0;font-size:15px;font-weight:600;color:var(--ink);padding:14px 22px}
  .crest-hdr .nav-links .subnav a small{display:block;margin-top:3px;font-size:12px;font-weight:500;color:var(--ink-soft)}
  .crest-hdr .nav-links .subnav a:hover{background:var(--cream);color:var(--ink)}
  .crest-hdr .nav-links .subnav .sub-group{padding:14px 22px 6px;font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--delta);background:var(--cream)}
  .crest-hdr .nav-links a.nav-btn{border:1px solid var(--gold);padding:10px 16px;color:#fff}
  .crest-hdr .nav-links a.nav-btn:hover{background:var(--gold);color:var(--char)}
}
@media(min-width:941px){
  .crest-hdr .nav-links{gap:28px}
  .crest-hdr .nav-links > li > a{white-space:nowrap}
  .crest-hdr .nav-links a.nav-btn{display:inline-block;line-height:1}
}
@media(min-width:941px) and (max-width:1180px){.crest-hdr .nav-links{gap:18px;font-size:11px}}

/* ============ Crest dropdown, v2: dark panel that matches the header ============ */
@media(min-width:941px){
  .crest-hdr .nav-links .subnav{min-width:300px;padding-top:22px}
  .crest-hdr .nav-links .subnav::before{display:none}
  .crest-hdr .nav-links .subnav li,
  .crest-hdr .nav-links .subnav li:last-child{background:var(--hdr-solid);border:none;border-left:1px solid rgba(184,149,90,.35);border-right:1px solid rgba(184,149,90,.35)}
  .crest-hdr .nav-links .subnav li:first-child{border-top:1px solid var(--gold);padding-top:10px}
  .crest-hdr .nav-links .subnav li:last-child{border-bottom:1px solid rgba(184,149,90,.35);padding-bottom:12px}
  .crest-hdr .nav-links .subnav a{padding:11px 26px;font-family:var(--serif);font-size:19px;font-weight:500;color:var(--ivory);background:none;transition:color .15s ease}
  .crest-hdr .nav-links .subnav a small{font-family:var(--sans);font-size:11.5px;font-weight:400;letter-spacing:.02em;color:rgba(251,248,241,.55);margin-top:2px}
  .crest-hdr .nav-links .subnav a:hover{background:none;color:var(--gold)}
  .crest-hdr .nav-links .subnav li:first-child a{font-family:var(--mono);font-size:10.5px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);padding-bottom:6px}
  .crest-hdr .nav-links .subnav .sub-group{background:var(--hdr-solid);padding:16px 26px 4px;margin-top:6px;font-family:var(--mono);font-size:9.5px;letter-spacing:.18em;color:rgba(251,248,241,.45);position:relative}
  .crest-hdr .nav-links .subnav .sub-group::before{content:"";position:absolute;top:0;left:26px;right:26px;height:1px;background:rgba(255,255,255,.12)}
}
@media(min-width:941px){
  .crest-hdr .nav-links .subnav li,.crest-hdr .nav-links .subnav li:last-child,.crest-hdr .nav-links .subnav .sub-group{background:var(--char)}
  .crest-hdr .nav-links .subnav .sub-group{margin-top:0;padding-top:20px}
}

/* ============ Keswick Life: self-segmentation tiles ============ */
.lt-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:8px}
.lt{position:relative;display:block;aspect-ratio:16/10;overflow:hidden;text-decoration:none;color:#fff}
.lt-bg{position:absolute;inset:0;transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.lt-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(15,28,21,.18) 0%,rgba(15,28,21,.42) 100%);transition:background .4s ease}
.lt-txt{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:24px}
.lt-name{font-family:var(--serif);font-weight:500;font-size:clamp(30px,3.4vw,46px);letter-spacing:.06em;text-transform:uppercase;line-height:1.05}
.lt-name::after{content:"";display:block;width:44px;height:1px;background:var(--gold);margin:18px auto 0;transition:width .4s ease}
.lt-sub{margin-top:14px;font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.78)}
.lt:hover .lt-bg{transform:scale(1.04)}
.lt:hover .lt-shade{background:linear-gradient(180deg,rgba(15,28,21,.3) 0%,rgba(15,28,21,.55) 100%)}
.lt:hover .lt-name::after{width:90px}
.lt-compact{grid-template-columns:repeat(3,1fr)}
.lt-compact .lt{aspect-ratio:4/3}
.lt-compact .lt-name{font-size:clamp(22px,2.2vw,30px)}
@media(max-width:760px){.lt-grid,.lt-compact{grid-template-columns:1fr}.lt{aspect-ratio:16/11}}

/* ============ Path pages: where to look + before you buy ============ */
.fit-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:30px;max-width:980px;margin:0 auto}
.fit{text-decoration:none;display:block;color:var(--ink)}
.fit .frame{aspect-ratio:16/9;overflow:hidden;position:relative}
.fit .ph{position:absolute;inset:0;transition:transform .6s ease}
.fit:hover .ph{transform:scale(1.03)}
.fit p{padding-top:8px;font-size:15px;line-height:1.6;color:var(--ink)}
.fit-more{display:inline-block;margin-top:12px;font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--wine);font-weight:600}
@media(max-width:700px){.fit-grid{grid-template-columns:1fr}}
.know{background:var(--cream);border-top:1px solid var(--hairline);border-bottom:1px solid var(--hairline);padding:96px 0 84px}
.know-grid{display:grid;grid-template-columns:minmax(260px,360px) 1fr;gap:72px;align-items:start}
.know-head .label{display:block;margin-bottom:16px}
.know-head h2{font-size:clamp(32px,3.8vw,46px);line-height:1.06}
.know-list{list-style:none;margin:0;padding:0;counter-reset:k;border-top:1px solid var(--char)}
.know-list li{counter-increment:k;display:grid;grid-template-columns:56px 1fr;padding:26px 0;border-bottom:1px solid var(--hairline)}
.know-list li::before{content:counter(k,decimal-leading-zero);font-family:var(--mono);font-size:12px;font-weight:600;color:var(--gold);padding-top:7px}
.know-list h3{grid-column:2;font-size:clamp(22px,2.2vw,27px)}
.know-list p{grid-column:2;margin-top:8px;font-size:15px;line-height:1.7;color:var(--ink-soft);max-width:640px}
@media(max-width:900px){.know{padding:72px 0 60px}.know-grid{grid-template-columns:1fr;gap:34px}}

.stats5.n4{grid-template-columns:repeat(4,1fr)}
.stats5.n3{grid-template-columns:repeat(3,1fr)}
@media(max-width:860px){.stats5.n4{grid-template-columns:repeat(2,1fr)}.stats5.n4 .st:last-child{grid-column:auto}.stats5.n3{grid-template-columns:1fr}.stats5.n3 .st{border-right:none;border-bottom:1px solid var(--hairline)}.stats5.n3 .st:last-child{grid-column:auto}}

/* ============ Schools by county ============ */
.county-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.county{background:var(--ivory);border-top:2px solid var(--char);padding:28px 26px 30px;box-shadow:0 0 0 1px var(--hairline) inset}
.county .label{display:block;margin-bottom:10px}
.county h3{font-size:clamp(24px,2.4vw,30px)}
.county .areas{margin-top:8px;font-size:14px;color:var(--ink-soft)}
.county .path{list-style:none;margin:22px 0 0;padding:0;border-top:1px solid var(--hairline)}
.county .path li{display:grid;grid-template-columns:92px 1fr;gap:12px;padding:12px 0;border-bottom:1px solid var(--hairline);font-size:15px;font-weight:600;color:var(--ink)}
.county .path li span{font-family:var(--mono);font-size:10px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);padding-top:3px}
.county .cnote{margin-top:16px;font-size:13.5px;line-height:1.6;color:var(--ink-soft)}
.county .textlink{display:inline-block;margin-top:14px;font-size:13px}
.county-sec{background:var(--cream);border-top:1px solid var(--hairline);border-bottom:1px solid var(--hairline)}
.private-list{list-style:none;margin:0 auto;padding:0;max-width:820px;border-top:1px solid var(--char)}
.private-list li{display:flex;justify-content:space-between;gap:20px;padding:18px 0;border-bottom:1px solid var(--hairline)}
.private-list b{font-family:var(--serif);font-size:22px;font-weight:600;color:var(--ink)}
.private-list span{font-size:14px;color:var(--ink-soft);text-align:right}
@media(max-width:900px){.county-grid{grid-template-columns:1fr}.private-list li{flex-direction:column;gap:4px}.private-list span{text-align:left}}
.county-sec .sec-top{text-align:center;margin-left:auto;margin-right:auto}.county-sec{padding:96px 0}

/* ============ Crest nav: groups hug the monogram, equal gap each side ============ */
@media(min-width:941px){
  .crest-nav{gap:0}
  .crest-nav .nav-side.l .nav-links{justify-content:flex-end;padding-right:52px}
  .crest-nav .nav-side.r .nav-links{justify-content:flex-start;padding-left:52px}
}
/* single hero photo: no crossfade */
.hero-slideshow .slide:only-child{animation:none;opacity:1}

/* ============ Cost of living + sell page ============ */
.tax-rate{margin-top:10px;font-size:14px;color:var(--ink-soft)}
.tax-rate b{font-family:var(--data);font-size:34px;font-weight:600;color:var(--ink);margin-right:6px;font-variant-numeric:lining-nums}
.tax-foot{margin:28px auto 0;max-width:760px;text-align:center;font-size:13px;color:var(--ink-soft);line-height:1.6}
.sell-steps{list-style:none;margin:0 auto;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:26px;max-width:1100px}
.sell-steps li{border-top:1px solid var(--char);padding-top:22px}
.sell-steps b{font-family:var(--mono);font-size:12px;color:var(--gold);letter-spacing:.1em}
.sell-steps h3{margin-top:10px;font-size:clamp(22px,2vw,26px)}
.sell-steps p{margin-top:8px;font-size:14.5px;line-height:1.65;color:var(--ink-soft)}
@media(max-width:900px){.sell-steps{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.sell-steps{grid-template-columns:1fr}}

/* ============ Costs, explained (glossary) ============ */
.term-jump{display:grid;grid-template-columns:repeat(4,1fr);gap:26px;padding-top:10px;padding-bottom:30px;border-top:1px solid var(--hairline)}
.term-jump .label{display:block;margin:22px 0 10px}
.term-jump a{display:block;padding:5px 0;font-size:14.5px;font-weight:600;color:var(--ink);text-decoration:none;border-bottom:1px solid transparent}
.term-jump a:hover{color:var(--wine)}
.term-group{padding-top:70px}
.term-list{max-width:900px;margin:0 auto;border-top:1px solid var(--char)}
.term{padding:34px 0 30px;border-bottom:1px solid var(--hairline);scroll-margin-top:120px}
.term h3{font-size:clamp(26px,2.6vw,32px)}
.term-def{margin-top:10px;font-size:17px;line-height:1.65;font-weight:600;color:var(--ink)}
.term dl{margin:18px 0 0;display:grid;grid-template-columns:1fr 1fr;gap:28px}
.term dt{font-family:var(--mono);font-size:10.5px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);margin-bottom:6px}
.term dd{margin:0;font-size:15px;line-height:1.7;color:var(--ink-soft)}
.term-src{margin-top:14px;font-size:12px;color:var(--ink-soft);font-style:italic}
.explain-cta{display:flex;align-items:center;justify-content:space-between;gap:30px;max-width:980px;border-top:1px solid var(--hairline);border-bottom:1px solid var(--hairline);padding-top:36px;padding-bottom:36px;margin-top:60px}
.explain-cta p{font-size:16px;line-height:1.6;color:var(--ink)}
@media(max-width:900px){.term-jump{grid-template-columns:1fr 1fr}.term dl{grid-template-columns:1fr;gap:16px}.explain-cta{flex-direction:column;align-items:flex-start}}

/* ============ Cost profiles by area ============ */
.prof-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:10px}
.prof{background:var(--ivory);box-shadow:0 0 0 1px var(--hairline) inset;border-top:2px solid var(--char);padding:26px 24px 22px;display:flex;flex-direction:column}
.prof-sec{border-top-color:var(--sand)}
.prof-head .label{display:block;margin-bottom:8px}
.prof h3{font-size:clamp(24px,2.3vw,29px)}
.prof h3 a{color:inherit;text-decoration:none}
.prof h3 a:hover{color:var(--wine)}
.prof-price{margin-top:4px;font-size:14px;color:var(--ink-soft)}
.prof-tax{margin:18px 0 6px;padding:16px 0;border-top:1px solid var(--hairline);border-bottom:1px solid var(--hairline)}
.prof-tax b{display:block;font-family:var(--data);font-size:34px;font-weight:600;line-height:1;color:var(--ink);font-variant-numeric:lining-nums}
.prof-tax span{display:block;margin-top:6px;font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft)}
.prof dl{margin:6px 0 0}
.prof dl div{display:grid;grid-template-columns:96px 1fr;gap:12px;padding:10px 0;border-bottom:1px solid var(--hairline)}
.prof dl div:last-child{border-bottom:none}
.prof dt{font-family:var(--mono);font-size:10px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft);padding-top:3px}
.prof dd{margin:0;font-size:14px;line-height:1.55;color:var(--ink)}
.prof dd em{font-style:normal;font-family:var(--mono);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--delta);border:1px solid rgba(111,28,39,.35);padding:1px 5px;margin-left:4px;white-space:nowrap}
@media(max-width:1000px){.prof-grid{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.prof-grid{grid-template-columns:1fr}}

#budget.no-tiers{padding-bottom:10px}
#budget.no-tiers .sec-answer{margin-bottom:0}
.hero.hero-title .label{color:#D4B27A;opacity:1;text-shadow:0 1px 14px rgba(0,0,0,.55)}

.guide-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.guide-card{display:block;text-decoration:none;color:var(--ink);border-top:1px solid var(--char);padding-top:20px}
.guide-card .label{display:block;margin-bottom:10px}
.guide-card h3{font-size:clamp(22px,2vw,26px)}
.guide-card p{margin-top:8px;font-size:14.5px;line-height:1.65;color:var(--ink-soft)}
.guide-card:hover h3{color:var(--wine)}
@media(max-width:900px){.guide-grid{grid-template-columns:1fr}}

/* ============ Cost of living hub ============ */
.cjump{display:flex;gap:22px;align-items:baseline;flex-wrap:wrap;padding-top:0;padding-bottom:40px}
.cjump>div{display:flex;flex-wrap:wrap;gap:8px}
.cjump a{font-size:13px;font-weight:600;color:var(--ink);text-decoration:none;border:1px solid var(--hairline);padding:7px 12px;background:var(--ivory)}
.cjump a:hover{border-color:var(--gold);color:var(--wine)}
.csec{padding:92px 0;scroll-margin-top:110px}
.csec-alt{background:var(--cream);border-top:1px solid var(--hairline);border-bottom:1px solid var(--hairline)}
.csec-grid{display:grid;grid-template-columns:minmax(260px,380px) 1fr;gap:64px;align-items:start}
.csec-head .label{display:block;margin-bottom:14px}
.csec-head h2{font-size:clamp(30px,3.4vw,42px);line-height:1.08}
.csec-answer{margin-top:20px;padding-top:18px;border-top:1px solid var(--char);font-size:16px;line-height:1.7;font-weight:600;color:var(--ink)}
.csec-note{margin-top:14px;font-size:14.5px;line-height:1.7;color:var(--ink-soft)}
.ctable{margin:0;border-top:1px solid var(--char)}
.ctable>div{display:grid;grid-template-columns:minmax(150px,210px) 1fr;gap:20px;padding:15px 0;border-bottom:1px solid var(--hairline)}
.ctable dt{font-family:var(--mono);font-size:10.5px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft);padding-top:4px}
.ctable dd{margin:0}
.ctable dd b{display:block;font-size:15.5px;font-weight:700;color:var(--ink);line-height:1.5}
.ctable dd span{display:block;margin-top:3px;font-size:13.5px;line-height:1.6;color:var(--ink-soft)}
.ctable dd em,.ctable-sm dd em{display:inline-block;margin-top:5px;font-style:normal;font-family:var(--mono);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--delta);border:1px solid rgba(111,28,39,.35);padding:1px 5px}
.ctable-sm>div{grid-template-columns:110px 1fr;gap:14px;padding:11px 0}
.ctable-sm dd b{font-size:14px;font-weight:600}
.ccards{display:grid;grid-template-columns:repeat(2,1fr);gap:22px}
.ccard{background:var(--ivory);box-shadow:0 0 0 1px var(--hairline) inset;padding:24px 22px 16px}
.ccard .label{display:block;margin-bottom:8px}
.ccard h3{font-size:clamp(22px,2.1vw,27px);margin-bottom:6px}
.ccard-lede{font-size:14px;line-height:1.6;color:var(--ink-soft);margin-bottom:14px}
.csec-src{margin-top:16px;font-size:12px;line-height:1.6;color:var(--ink-soft);font-style:italic}
.thist{margin-top:56px;background:var(--ivory);box-shadow:0 0 0 1px var(--hairline) inset;padding:30px 30px 22px}
.thist-head h3{font-size:clamp(22px,2.2vw,28px)}
.thist-head p{margin-top:8px;font-size:15px;line-height:1.65;color:var(--ink-soft);max-width:760px}
.thist-chart{display:flex;align-items:flex-end;gap:10px;height:190px;margin:26px 0 8px;padding-top:24px;border-bottom:1px solid var(--char)}
.thb{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;position:relative}
.thbar{width:100%;max-width:46px;background:var(--wine);display:block}
.thb:nth-last-child(-n+2) .thbar{background:var(--gold)}
.thv{font-family:var(--data);font-size:15px;font-weight:600;color:var(--ink);margin-bottom:6px}
.thy{position:absolute;bottom:-24px;font-family:var(--mono);font-size:10.5px;color:var(--ink-soft)}
.thist-assess{margin-top:40px}
@media(max-width:900px){.csec{padding:70px 0}.csec-grid{grid-template-columns:1fr;gap:30px}.ccards{grid-template-columns:1fr}.ctable>div{grid-template-columns:1fr;gap:4px}.thist{padding:22px 16px}.thist-chart{gap:4px}.thv{font-size:11px}.thy{font-size:9px}}

.prof-tax b{white-space:nowrap;font-size:clamp(26px,2.4vw,34px)}
.prof-tax span{text-transform:none;letter-spacing:.02em;font-family:var(--sans);font-size:13px}
.chigh{background:var(--char);color:var(--ivory);padding:26px 26px 22px;margin-bottom:26px}
.chigh b{display:block;font-family:var(--data);font-size:clamp(36px,4vw,50px);font-weight:600;line-height:1;color:#D4B27A;font-variant-numeric:lining-nums}
.chigh span{display:block;margin-top:8px;font-size:15px;font-weight:600}
.chigh p{margin-top:12px;font-size:13px;line-height:1.6;color:rgba(251,248,241,.72)}
.ctable-sm dd span{display:block;margin-top:3px;font-size:12.5px;line-height:1.55;color:var(--ink-soft)}

.ccards-3{grid-template-columns:repeat(3,1fr);gap:18px}
#clubs .csec-grid{grid-template-columns:1fr;gap:34px}
#clubs .csec-head{max-width:860px}
@media(max-width:1000px){.ccards-3{grid-template-columns:1fr}}
#guides .guide-grid{grid-template-columns:repeat(2,1fr)}@media(max-width:900px){#guides .guide-grid{grid-template-columns:1fr}}

/* ============ Wide panel dropdown (nav[].panel) ============ */
@media(min-width:941px){
  .crest-hdr .nav-links .has-sub{position:relative}
  .mega{position:absolute;top:100%;padding-top:20px;opacity:0;visibility:hidden;pointer-events:none;transform:translateY(4px);transition:opacity .16s ease,transform .16s ease;z-index:60}
  .mega-left{left:0}
  .mega-right{right:-120px}
  .has-sub:hover>.mega,.has-sub:focus-within>.mega{opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0)}
  .mega-in{width:660px;background:var(--char);border-top:1px solid var(--gold);display:grid;grid-template-columns:220px 1fr;box-shadow:0 24px 48px rgba(0,0,0,.3);text-transform:none;letter-spacing:0}
  .mega-lead{padding:28px 26px;background:rgba(255,255,255,.04);border-right:1px solid rgba(255,255,255,.1)}
  .mega-title{font-family:var(--serif);font-size:28px;font-weight:600;color:#fff;line-height:1.1}
  .mega-intro{margin-top:10px;font-size:13.5px;font-weight:400;line-height:1.6;color:rgba(255,255,255,.75)}
  .crest-hdr .nav-links .mega-all{display:inline-block;margin-top:16px;font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#D4B27A;border:none;padding:0}
  .crest-hdr .nav-links .mega-all:hover{color:#fff}
  .mega-list{list-style:none;margin:0;padding:14px 10px;display:grid;grid-template-columns:1fr 1fr;gap:2px;align-content:start}
  .crest-hdr .nav-links .mega-list a{display:block;padding:13px 16px;border:none;color:#fff;white-space:normal}
  .mega-list b{display:block;font-size:15px;font-weight:600;color:#fff;line-height:1.3}
  .mega-list span{display:block;margin-top:4px;font-size:13px;font-weight:400;line-height:1.45;color:rgba(255,255,255,.7)}
  .crest-hdr .nav-links .mega-list a:hover{background:rgba(255,255,255,.06)}
  .crest-hdr .nav-links .mega-list a:hover b{color:#D4B27A}
  .mega-group{grid-column:1/-1;margin:8px 16px 0;padding-top:12px;border-top:1px solid rgba(255,255,255,.12);font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.5)}
}

/* ============ Sticky "On this page" bar ============ */
.subnav-bar{position:sticky;top:103px;z-index:40;background:rgba(251,248,241,.97);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);border-top:1px solid var(--hairline);border-bottom:1px solid var(--hairline)}
.sb-in{display:flex;align-items:center;gap:26px}
.sb-label{flex:none;font-family:var(--mono);font-size:10.5px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--gold)}
.sb-links{display:flex;gap:26px;overflow-x:auto;white-space:nowrap;scrollbar-width:none;-ms-overflow-style:none}
.sb-links::-webkit-scrollbar{display:none}
.sb-links a{display:block;padding:18px 0 16px;font-size:13px;font-weight:600;color:var(--ink-soft);text-decoration:none;border-bottom:2px solid transparent;transition:color .15s ease,border-color .15s ease}
.sb-links a:hover{color:var(--ink)}
.sb-links a.on{color:var(--ink);border-bottom-color:var(--gold)}
.csec,#prices,#profiles,#taxes,#faq,#history{scroll-margin-top:170px}
html{scroll-behavior:smooth}
@media(max-width:940px){.subnav-bar{top:93px}.sb-label{display:none}.sb-links{gap:20px}.csec,#prices,#profiles,#taxes,#faq,#history{scroll-margin-top:150px}}
/* Insurance highlight: lighter, less green */
.chigh{background:var(--ivory);color:var(--ink);box-shadow:0 0 0 1px var(--hairline) inset;border-left:3px solid var(--gold);padding:24px 26px 20px}
.chigh b{color:var(--ink)}
.chigh span{color:var(--ink)}
.chigh p{color:var(--ink-soft)}

/* ---------- rate table (cost of living hub). NETWORK: shared. ---------- */
.rt-wrap{max-width:1000px;margin:34px auto 46px}
table.rtable{width:100%;border-collapse:collapse;font-variant-numeric:lining-nums tabular-nums}
table.rtable caption{caption-side:top;text-align:left;font-family:var(--mono);font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-soft);padding-bottom:14px}
table.rtable thead th{font-family:var(--mono);font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-soft);font-weight:500;text-align:left;padding:0 16px 12px 0;border-bottom:1px solid var(--ink)}
table.rtable tbody th{font-family:var(--serif);font-size:21px;font-weight:600;text-align:left;padding:16px 16px 16px 0;border-bottom:1px solid var(--hairline)}
table.rtable td{padding:16px 16px 16px 0;border-bottom:1px solid var(--hairline);font-size:15px;vertical-align:middle}
table.rtable td:nth-child(2),table.rtable td:nth-child(3){font-family:var(--data);font-size:20px;font-weight:600}
table.rtable td:last-child{color:var(--ink-soft);font-size:14px}
.rt-wrap .csec-src{margin-top:14px}
@media (max-width:720px){
  table.rtable thead{display:none}
  table.rtable,table.rtable tbody,table.rtable tr,table.rtable th,table.rtable td{display:block;width:100%}
  table.rtable tr{padding:14px 0;border-bottom:1px solid var(--hairline)}
  table.rtable tbody th{border:0;padding:0 0 6px}
  table.rtable td{border:0;padding:4px 0;display:flex;gap:12px}
  table.rtable caption{display:block;width:100%}
  table.rtable td::before{content:attr(data-l);flex:0 0 110px;font-family:var(--mono);font-size:9.5px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-soft);padding-top:6px}
}

/* Home page ending: 2–3 related links before the capture form (network-ready: h.related) */
.home-related{padding-top:8px;padding-bottom:40px}
.home-related ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:14px 32px;justify-content:center}
.home-related li{margin:0}

/* Home area cards: sample size under the price (optional n.salesNote) */
.hood-n{font-family:var(--mono);font-size:10.5px;letter-spacing:.04em;color:var(--ink-soft);margin:6px 0 0}

/* Visible page date in the author block (showPageDate) */
.author-date{font-family:var(--mono);font-size:11px;letter-spacing:.04em;color:var(--ink-soft);margin:4px 0 8px}

/* Life path pages: source line under the "Before you buy" list spans the grid */
.know-src{grid-column:1/-1}

/* ============ 27 Sep 2026: centring fixes ============ */
/* Crest nav: every gap is the same: link to link, and last link to the monogram. */
@media(min-width:941px){
  /* Revised 27 Sep (Alex): centre the WHOLE row on the page (equal outer margins, equal
     gaps everywhere). The monogram sits a little off exact centre when one side is wider. */
  .crest-nav{display:flex;justify-content:center;align-items:center;gap:var(--navgap);--navgap:58px}
  .crest-nav .nav-links{gap:var(--navgap)}
  .crest-hdr .crest-nav .nav-side.l .nav-links,.crest-hdr .crest-nav .nav-side.r .nav-links{padding:0}
  /* measure the gap to the circle, not to the wider wordmark under it */
  .crest-nav .crest{width:56px}
  .crest-nav .crest-nm{white-space:nowrap}
  /* 28 Sep (Alex): monogram on its own row, dead centre; all six links in one centred
     row below with identical gaps. (With the monogram in the row, the wider right-hand
     group made "circle centred" and "even gaps" impossible at the same time.) */
  .crest-nav{flex-wrap:wrap;row-gap:16px}
  .crest-nav .crest{order:-1;flex:0 0 100%;width:auto;align-items:center}
}
@media(min-width:941px) and (max-width:1199px){
  .crest-nav{--navgap:38px}
  .crest-nav .nav-links{font-size:11px;letter-spacing:.06em}
}
/* "Nearby"/"Other areas" cards: centre the row when there are fewer than three. */
.near-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:40px}
.near-grid > *{flex:0 1 calc((100% - 80px) / 3);min-width:0}
@media(max-width:820px){.near-grid > *{flex-basis:100%}}

/* ---------- life page: prose "what it's like" section (lp.knowStyle: "prose") ---------- */
.know-prose{background:var(--cream);padding:100px 0}
.know-prose h2{margin:12px 0 22px}
.know-prose .kp-answer{font-size:18px;font-weight:500;color:var(--ink);line-height:1.65;margin-bottom:30px;padding-bottom:28px;border-bottom:1px solid var(--hairline)}
.know-prose p{font-size:16px;line-height:1.75;color:var(--ink);margin-bottom:20px;max-width:68ch}
.know-prose p b{font-weight:700}
@media(max-width:820px){.know-prose{padding:72px 0}}

/* ---------- schools page: sharper county cards + private-school table (27 Sep 2026) ---------- */
.county{display:flex;flex-direction:column;padding:30px 28px 28px}
.county-top{min-height:0}
.county .share{display:inline-block;margin-top:12px;font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink);border:1px solid var(--hairline);padding:5px 8px;background:var(--cream)}
.county .areas{margin-top:10px;font-size:14px;line-height:1.55;color:var(--ink-soft)}
.county .path{margin-top:22px;border-top:1px solid var(--char)}
.county .path li{grid-template-columns:96px 1fr;align-items:baseline;padding:14px 0;background:none}
.county .path li b{font-family:var(--serif);font-size:20px;font-weight:600;line-height:1.25;color:var(--ink)}
.county .cnote{margin-top:18px;font-size:13.5px;line-height:1.6;color:var(--ink-soft)}
.county-link{margin-top:auto;padding-top:20px;font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;color:var(--ink);text-decoration:none}
.county-link:hover{text-decoration:underline}
.pv-scroll{overflow-x:auto;border-top:1px solid var(--char);max-width:1140px;margin:0 auto}
.pv-table{width:100%;border-collapse:collapse;font-size:14.5px;min-width:760px}
.pv-table thead th{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);text-align:left;font-weight:500;padding:12px;border-bottom:1px solid var(--hairline)}
.pv-table tbody th{text-align:left;padding:15px 12px;border-bottom:1px solid var(--hairline);font-family:var(--serif);font-size:19px;font-weight:600}
.pv-table tbody th a{color:var(--ink);text-decoration:none}
.pv-table tbody th a:hover{text-decoration:underline}
.pv-table td{padding:15px 12px;border-bottom:1px solid var(--hairline);color:var(--ink);vertical-align:middle}
.pv-table td.pv-tu{font-variant-numeric:tabular-nums;font-weight:600}
.pv-table tbody tr:hover{background:var(--cream)}
.county-sec .county .path,.county-sec .county .path li{background:transparent}
.county .cnote{margin-bottom:22px}
.county-link{padding-top:0}
/* private-school names: make the outbound link visible */
.pv-table tbody th a{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px;text-decoration-color:var(--hairline)}
.pv-table tbody th a::after{content:"\2197";font-family:var(--sans);font-size:12px;margin-left:6px;color:var(--ink-soft);vertical-align:2px}
.pv-table tbody th a:hover{text-decoration-color:var(--ink)}
/* cost-page cards with an outbound site link (card.url) */
.ccard{display:flex;flex-direction:column}
.ccard h3 a{color:inherit;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:5px;text-decoration-color:var(--hairline)}
.ccard h3 a:hover{text-decoration-color:var(--ink)}
.ccard-link{margin-top:auto;padding-top:18px;font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;color:var(--ink);text-decoration:none}
.ccard-link:hover{text-decoration:underline}

/* ---------- comparison bars (cost sections; shared) ---------- */
.cbars{margin:0;border-top:1px solid var(--char);padding-top:22px;--cb-k:#2E4A3B;--cb-ctx:#B0A99F;--cb-reserve:210px}
.cbars-t{font-family:var(--mono);font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-soft);display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
.cbars-key{display:flex;gap:18px;flex-wrap:wrap}
.cbars-key span{display:inline-flex;align-items:center;gap:7px}
.cbars-key i{width:12px;height:12px;border-radius:2px;display:inline-block;background:var(--cb-ctx)}
.cbars-key i.k{background:var(--cb-k)}
.cbars-rows{margin-top:18px;display:flex;flex-direction:column;gap:2px}
.cbar{display:grid;grid-template-columns:150px 1fr;align-items:center;gap:16px;padding:9px 0}
.cbar-nm{font-size:14px;font-weight:600;line-height:1.25;color:var(--ink-soft)}
.cbar.is-k .cbar-nm{color:var(--ink)}
.cbar-nm small{display:block;font-family:var(--mono);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);font-weight:500;margin-top:2px}
.cbar-track{display:flex;align-items:center;min-height:18px}
.cbar-fill{display:block;height:18px;border-radius:0 4px 4px 0;background:var(--cb-ctx);width:calc((100% - var(--cb-reserve)) * var(--w) / 100);transition:opacity .15s}
.cbar.is-k .cbar-fill{background:var(--cb-k)}
.cbar-v{margin-left:10px;font-family:var(--data);font-weight:700;font-size:20px;white-space:nowrap;font-variant-numeric:tabular-nums;line-height:1;color:var(--ink);position:relative}
.cbar-v em{font-family:var(--sans);font-style:normal;font-size:12px;font-weight:600;color:var(--delta);margin-left:8px}
.cbars-rows:hover .cbar-fill{opacity:.45}
.cbars-rows .cbar:hover .cbar-fill{opacity:1}
.cbars-div{height:1px;background:var(--hairline);margin:8px 0}
.cbars-note{font-size:13px;color:var(--ink-soft);margin-top:14px;line-height:1.65}
@media(max-width:900px){
  .cbars{--cb-reserve:92px}
  .cbar{grid-template-columns:112px 1fr;gap:10px}
  .cbar-v{font-size:17px}
  .cbar-v em{font-size:11px;position:absolute;left:0;top:calc(100% + 6px);margin:0}
  .cbar.has-d{padding-bottom:30px}
}

/* ============ 28 Sep 2026: header.menuOnly (shared, opt-in per town) ============
   Monogram centred, menu button on the right, at every screen width. The six links
   live in the full-screen menu panel (and stay in the HTML for crawlers). */
.nav-menu-only .crest-nav{display:grid!important;grid-template-columns:44px 1fr 44px;align-items:center}
.nav-menu-only .crest-nav .nav-side{display:none}
.nav-menu-only .crest-nav .crest{grid-column:2;justify-self:center;order:0;flex:none;width:auto}
.nav-menu-only .crest-nav .nav-toggle{display:inline-flex;grid-column:3;justify-self:end}
@media(min-width:941px){
  .nav-menu-only .mobile-nav:not([hidden]){display:flex;position:fixed;inset:0;z-index:55;
    flex-direction:column;justify-content:flex-start;overflow-y:auto;
    padding:150px 0 48px;background:var(--ivory);animation:navIn .26s ease both}
  /* desktop panel: the menu laid out in three columns, like a site map */
  .nav-menu-only .mobile-nav-inner{max-width:1080px}
  .nav-menu-only .mobile-nav-links{display:grid;grid-template-columns:repeat(3,1fr);column-gap:56px;align-items:start}
  .nav-menu-only .mobile-nav-links > li{border-top:1px solid var(--hairline);border-bottom:none}
  .nav-menu-only .mobile-nav-links > li > a{font-size:30px;padding:18px 0 10px}
  .nav-menu-only .mobile-nav-cta{max-width:360px;margin:40px auto 0;display:flex}
}

/* ============ 28 Sep 2026: header.layout = "bar" (shared, opt-in) ============
   LivingInCrozet-style wordmark on the left, links centred on the page, solid gold
   Homes for Sale button on the right. Dropdowns reuse the crest styles. */
.bar-nav{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:32px}
.bar-logo{justify-self:start;display:inline-flex;flex-direction:column;align-items:center;text-decoration:none;line-height:1}
.bar-logo small{font:500 10px/1 'Cinzel',var(--serif);letter-spacing:.26em;margin-left:.26em;text-transform:uppercase;color:#D2B784}
.bar-logo svg{display:block;color:var(--gold);margin:5px 0 4px}
.bar-logo b{font:500 24px/1 'Cinzel',var(--serif);letter-spacing:.06em;text-transform:uppercase;color:var(--gold)}
.bar-end{justify-self:end;display:flex;align-items:center;gap:18px}
.bar-cta{font:600 11.5px/1 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--char);background:var(--gold);text-decoration:none;padding:14px 20px;white-space:nowrap;transition:background .2s}
.bar-cta:hover{background:#cfae76}
.bar-hdr .nav-toggle{display:none}
.bar-hdr .bar-links .nav-links{gap:34px}
@media(min-width:941px) and (max-width:1199px){
  .bar-hdr .bar-links .nav-links{gap:20px}
  .bar-logo b{font-size:21px}
  .bar-cta{padding:12px 14px;font-size:10.5px}
}
@media(max-width:940px){
  .bar-nav{grid-template-columns:1fr auto}
  .bar-links,.bar-cta{display:none}
  .bar-hdr .nav-toggle{display:inline-flex}
}

/* 28 Sep (Alex): photo hero darker, with a deeper band at the top so the gold
   wordmark and the nav stay readable over a bright sky. */
.hero-overlay{background:linear-gradient(180deg,rgba(12,20,15,.74) 0%,rgba(12,20,15,.42) 20%,rgba(12,20,15,.34) 48%,rgba(12,20,15,.80) 92%)}

/* 28 Sep (Alex): the whole bar a touch larger at desktop widths. */
@media(min-width:1200px){
  .bar-logo small{font-size:12px}
  .bar-logo svg{width:84px;height:13px}
  .bar-logo b{font-size:29px}
  .bar-hdr .bar-links .nav-links{gap:40px;font-size:13px}
  .bar-cta{font-size:12.5px;padding:16px 24px}
}

/* ============ 28 Sep 2026: frosted-glass dropdown (bar header) ============
   A see-through dark panel that blurs the photo behind it, gold hairline border,
   names in small capitals. The hub link (first child) moves to the bottom. */
@media(min-width:941px){
  .bar-hdr .nav-links .subnav{display:flex;flex-direction:column;isolation:isolate;min-width:260px;left:-26px;padding:18px 0 0}
  .bar-hdr .nav-links .subnav::after{content:"";position:absolute;inset:18px 0 0 0;z-index:-1;
    background:rgba(18,30,23,.58);-webkit-backdrop-filter:blur(14px) saturate(1.2);backdrop-filter:blur(14px) saturate(1.2);
    border:1px solid rgba(210,183,132,.45)}
  .bar-hdr .nav-links .subnav li,
  .bar-hdr .nav-links .subnav li:last-child,
  .bar-hdr .nav-links .subnav li:first-child{background:none;border:none;padding:0}
  .bar-hdr .nav-links .subnav li:nth-child(2){padding-top:14px}
  .bar-hdr .nav-links .subnav a{padding:12px 26px;font-family:var(--sans);font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:#fff;background:none;transition:color .15s ease}
  .bar-hdr .nav-links .subnav a:hover{color:#D2B784;background:none}
  .bar-hdr .nav-links .subnav li:first-child{order:99;margin:6px 26px 16px;border-top:1px solid rgba(210,183,132,.3)}
  .bar-hdr .nav-links .subnav li:first-child a{padding:14px 0 0;font-family:var(--mono);font-size:10.5px;font-weight:500;letter-spacing:.2em;color:#D2B784}
  .bar-hdr .nav-links .subnav li:first-child a:hover{color:#fff}
}

/* county card: link to the county's in-depth schools page (28 Sep) */
.county-page{margin-top:auto;padding-top:20px;font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;color:var(--delta);text-decoration:none}
.county-page:hover{text-decoration:underline}
.county-page + .county-link{margin-top:10px;padding-top:0}

/* ==========================================================================
   HEAD-TO-HEAD PAGES (/compare/<slug>/, compare/versus.njk) + the area-page
   link section (.versus-link). NETWORK: town-agnostic. Added 29 Sep 2026.
   Chart colours --vs-a / --vs-b were run through the dataviz palette validator
   on the light surface (#FBF8F1): lightness, chroma, CVD ΔE 10.5, normal ΔE 19.4,
   contrast all PASS. The brand gold fails the chroma floor as a chart colour, so
   it is not used for bars. A new town can override both in its theme.
   ========================================================================== */
:root{--vs-a:#B8860B;--vs-b:#2E4A3B;--vs-a-deep:#7A5A17;--vs-b-deep:#15271D}
.btn.gold{background:var(--gold);color:var(--char)}.btn.gold:hover{background:#cfae76}
.versus-cta{text-align:center;margin:8px 0 10px}
/* hero: centred both ways, title + two buttons only */
.hero.vs-hero{align-items:center}
.vs-hero .hero-inner{text-align:center;padding-top:120px;padding-bottom:60px}
.vs-hero .label,.vs-hero h1{margin-left:auto;margin-right:auto;text-align:center}
.vs-hero h1{margin-bottom:36px}
.vs-hero .hero-ctas{justify-content:center}
#answer .sec-answer{font-size:18px;max-width:820px}
/* interactive comparer */
.vsb{display:grid;grid-template-columns:230px 1fr;gap:34px;align-items:start;border:1px solid var(--hairline);background:#fff;padding:30px}
.vsb-chips{display:flex;flex-direction:column;gap:6px}.vsb-chips .label{margin-bottom:8px}
.vsb-chip{text-align:left;font:600 13px/1.3 var(--sans);color:var(--ink);background:transparent;border:1px solid transparent;padding:9px 12px;cursor:pointer;border-radius:0}
.vsb-chip:hover{background:var(--cream)}.vsb-chip.on{background:var(--char);color:#fff}
.vsb:not(.js) .vsb-chips{display:none}
.vsb:not(.js){grid-template-columns:1fr}
.vsb:not(.js) .vsb-panel{margin-bottom:34px}
.vsb.js .vsb-panel{display:none}.vsb.js .vsb-panel.on{display:block}
.vsb-legend{display:flex;gap:22px;font:600 12px/1 var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:22px}
.vsb-legend i{display:inline-block;width:12px;height:12px;margin-right:8px;vertical-align:-1px}
.vsb-legend i.a,.vsb-fill.a,.lot-sq.a,.vs-bar.a{background:var(--vs-a)}
.vsb-legend i.b,.vsb-fill.b,.lot-sq.b,.vs-bar.b{background:var(--vs-b)}
.vsb-h{font-size:30px;margin-bottom:18px}
.vsb-row{display:grid;grid-template-columns:130px 1fr 220px;align-items:center;gap:16px;padding:10px 0}
.vsb-name{font:600 12px/1.2 var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft)}
.vsb-track{height:22px;background:var(--cream)}.vsb-fill{height:100%;border-radius:0 4px 4px 0;min-width:4px;transition:width .35s}
.vsb-val b{display:block;font-family:var(--data);font-size:26px;font-weight:600;line-height:1}
.vsb-val small{display:block;font-family:var(--mono);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft);margin-top:5px;line-height:1.5}
.vsb-brief{margin-top:18px;font-size:15.5px;font-weight:600;color:var(--ink);border-top:1px solid var(--hairline);padding-top:16px}
.vs-table{margin-top:26px}.vs-table summary{cursor:pointer;font:600 13px/1 var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--ink);padding:14px 0}
.compare-table td small{font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft)}
/* price cards */
.vs-cards{display:grid;grid-template-columns:1fr 1fr;gap:26px}
.vs-card{border:1px solid var(--hairline);background:#fff;padding:32px 32px 28px}
.vs-card .label{display:block;margin-bottom:8px}.vs-card h3{font-size:26px;margin-bottom:16px}
.vs-card p{font-size:14.5px;color:var(--ink-soft);margin-top:14px}
.vs-bands{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;border-top:1px solid var(--char);padding-top:16px}
.vs-bands b{display:block;font-family:var(--data);font-size:28px;font-weight:600;line-height:1}
.vs-bands small{display:block;font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);margin-top:6px}
.vs-chips{display:flex;flex-wrap:wrap;gap:8px;border-top:1px solid var(--char);padding-top:16px}
.vs-chips span{font-family:var(--data);font-size:20px;font-weight:600;padding:8px 14px;border:1px solid var(--hairline);background:var(--cream)}
.vs-chips span.on{background:var(--char);color:#fff;border-color:var(--char)}
/* land squares, to scale by area */
.lots{display:flex;gap:64px;align-items:flex-end;justify-content:center;padding:10px 0 18px}
.lot{text-align:center}.lot-sq{display:grid;place-items:center;margin:0 auto 14px}
.lot-sq span{font-family:var(--data);font-size:24px;font-weight:600;color:#fff}
.lot b{display:block;font:700 13px/1 var(--sans);letter-spacing:.08em;text-transform:uppercase}
.lot small{display:block;font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft);margin-top:8px}
/* club matchup */
.club-vs{border:1px solid var(--hairline);background:#fff}
.cv-head,.cv-row{display:grid;grid-template-columns:1fr 110px 1fr}
.cv-club{padding:30px 34px 26px;color:#fff}.cv-club.a{background:var(--vs-a-deep)}.cv-club.b{background:var(--vs-b-deep)}
.cv-club .label{color:#E6D9B8;display:block;margin-bottom:8px}.cv-club h3{color:#fff;font-size:30px;line-height:1.1;margin-bottom:10px}
.cv-club a{color:#fff;font:600 12px/1 var(--sans);letter-spacing:.08em;text-transform:uppercase;text-decoration:none;border-bottom:1px solid rgba(255,255,255,.5);padding-bottom:3px}
.cv-vs{display:grid;place-items:center;font-family:var(--serif);font-style:italic;font-size:26px;color:var(--gold);background:var(--cream)}
.cv-row{border-top:1px solid var(--hairline)}.cv-row:nth-child(odd){background:#FCFAF5}
.cv-l,.cv-r{padding:20px 28px;font-size:15px;line-height:1.55;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center}
.cv-who{display:none}
.cv-m{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:14px 8px;border-left:1px solid var(--hairline);border-right:1px solid var(--hairline);text-align:center}
.cv-m svg{width:26px;height:26px;stroke:var(--gold);fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.cv-m span{font-family:var(--mono);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);line-height:1.3}
/* schools counts */
.school-counts{display:flex;gap:40px;justify-content:center;margin:22px 0 10px}.school-counts>div{text-align:center}
.school-counts b{display:block;font-family:var(--data);font-size:30px;font-weight:600;line-height:1;margin-top:6px}
.school-counts small{display:block;font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft);margin-top:6px}
.school-strip .csec-src{max-width:780px;margin:18px auto 0}
/* time on market */
.vs-scale{max-width:780px;margin:0 auto}
.vs-scale-row{display:grid;grid-template-columns:150px 1fr 170px;align-items:center;gap:18px;padding:12px 0}
.vs-bar{height:14px}
.vs-scale-row b{font-family:var(--data);font-size:24px;font-weight:600;white-space:nowrap}
/* ask form */
.ask-form{max-width:720px;margin:0 auto;background:#fff;border:1px solid var(--hairline);padding:34px}
.ask-form label{display:block;font:700 11px/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:8px}
.ask-form textarea,.ask-form input[type=text],.ask-form input[type=email]{width:100%;font:500 15px/1.5 var(--sans);color:var(--ink);background:var(--ivory);border:1px solid var(--hairline);padding:12px 14px;border-radius:0}
.ask-form textarea{resize:vertical;margin-bottom:18px}
.ask-row{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-bottom:22px}
.ask-foot{display:flex;align-items:center;gap:20px;flex-wrap:wrap}.ask-foot small{font-size:12.5px;color:var(--ink-soft)}
@media (max-width:860px){
  .vsb{grid-template-columns:1fr;padding:20px}.vsb-chips{flex-direction:row;flex-wrap:wrap}.vsb-chips .label{width:100%}
  .vsb-row{grid-template-columns:1fr;gap:6px}
  .vs-cards{grid-template-columns:1fr}.vs-bands{grid-template-columns:1fr 1fr}
  .lots{gap:24px}.lot-sq{transform:scale(.7);transform-origin:bottom center}
  .cv-head,.cv-row{grid-template-columns:1fr}.cv-vs{padding:8px}
  .cv-m{flex-direction:row;border:0;justify-content:flex-start;padding:14px 22px 0}
  .cv-l,.cv-r{align-items:flex-start;text-align:left;padding:8px 22px}
  .cv-who{display:block;font:700 11px/1.4 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:2px}
  .vs-scale-row{grid-template-columns:1fr;gap:6px}
  .ask-row{grid-template-columns:1fr}.ask-form{padding:22px}
}

/* ==========================================================================
   Homepage touch-ups (29 Sep 2026). NETWORK: opt-in via town.home flags.
   .hood-buttons  — home.areaCardsStyle: "buttons": area cards without photo
                    frames, dark green with a gold price (Alex picked style B).
   .school-min    — home.schoolsSection.compact: answer + one link, centred.
   ========================================================================== */
.src-center .csec-src{text-align:center;max-width:780px;margin:-30px auto 34px}
.hood-buttons{grid-template-columns:repeat(6,1fr);gap:18px}
.hood-buttons .hood{grid-column:span 2;display:flex;flex-direction:column;background:var(--char);padding:28px 28px 22px;transition:background .2s,transform .2s}
.hood-buttons .hood:nth-child(4){grid-column:2/4}
.hood-buttons .hood:nth-child(5){grid-column:4/6}
.hood-buttons .hood:hover{background:#24402F;transform:translateY(-2px)}
.hood-buttons .hood-cap{border-top:0;margin-top:0;padding-top:0;flex-direction:column;align-items:flex-start;gap:6px}
.hood-buttons .hood-cap h3{font-size:27px;line-height:1.1;color:#fff}
.hood-buttons .hood-cap .band{font-family:var(--data);font-size:24px;font-weight:600;color:var(--gold);letter-spacing:0;white-space:normal}
.hood-buttons .hood-n{font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.6);padding-top:4px}
.hood-buttons .hood p:last-of-type{flex:1;padding-top:12px;font-size:14.5px;color:rgba(255,255,255,.85)}
.hood-buttons .hood::after{content:"See the area →";margin-top:18px;font:600 12px/1 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:#fff;border-top:1px solid rgba(255,255,255,.15);padding-top:14px}
@media (max-width:940px){.hood-buttons{grid-template-columns:1fr 1fr}.hood-buttons .hood,.hood-buttons .hood:nth-child(4),.hood-buttons .hood:nth-child(5){grid-column:auto}.hood-preview.hood-buttons .hood:not(.hood-featured){display:flex}}
@media (max-width:560px){.hood-buttons{grid-template-columns:1fr}}
.school-min{text-align:center;max-width:820px}.school-min .label{display:block;margin-bottom:16px}.school-min h2{margin-bottom:18px}
.school-min .lead-p{font-size:17px;font-weight:600;max-width:720px;margin:0 auto 14px}.school-min .versus-cta{margin-top:26px}
/* Area cards, option 4 (Alex, 29 Sep): hero-green gradient, fine gold inner frame,
   no background panel (removed at Alex's request). Overrides the flat dark cards above. */
.hood-buttons .hood{position:relative;background:linear-gradient(160deg,#2E4A3B 0%,#1D3328 70%)}
.hood-buttons .hood::before{content:"";position:absolute;inset:8px;border:1px solid rgba(201,176,122,.45);pointer-events:none}
.hood-buttons .hood:hover{background:linear-gradient(160deg,#355442 0%,#213A2D 70%)}

/* Keswick Life heroes (29 Sep, Alex): title + two CTAs only, centred both ways. */
.hero.life-hero{align-items:center}
.life-hero .hero-inner{text-align:center;padding-top:120px;padding-bottom:60px}
.life-hero .label,.life-hero h1{margin-left:auto;margin-right:auto;text-align:center}
.life-hero h1{margin-bottom:36px}
.life-hero .hero-ctas{justify-content:center}

/* Life-page fit cards as buttons (lp.fitStyle: "buttons"), 29 Sep. Two or three cards, centred. */
.fit-buttons{grid-template-columns:repeat(2,minmax(0,420px));justify-content:center}
.fit-buttons .hood,.fit-buttons .hood:nth-child(4),.fit-buttons .hood:nth-child(5){grid-column:auto}
@media (max-width:560px){.fit-buttons{grid-template-columns:1fr}}

/* Golf courses block (lp.courses), 29 Sep. Spec cards + "Full Cry, up close". */
.gc{display:grid;grid-template-columns:1fr 1fr;gap:26px}
.gc-card{background:#fff;border:1px solid var(--hairline)}
.gc-head{position:relative;padding:28px 30px 24px;text-align:center;color:#fff}
.gc-head.b{background:linear-gradient(160deg,#2E4A3B 0%,#1D3328 70%)}.gc-head.a{background:linear-gradient(160deg,#8A6420 0%,#5E4412 75%)}
.gc-head::before{content:"";position:absolute;inset:8px;border:1px solid rgba(230,210,160,.45);pointer-events:none}
.gc-head .label{color:#E6D9B8;display:block;margin-bottom:6px}.gc-head h3{color:#fff;font-size:32px;margin-bottom:10px}
.gc-badge{display:inline-block;font:600 11px/1.3 var(--sans);letter-spacing:.08em;text-transform:uppercase;color:#F6EBD0}
.gc-row{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:13px 30px;border-top:1px solid var(--hairline)}
.gc-row small{font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft)}
.gc-row b{font-family:var(--serif);font-size:19px;font-weight:600;text-align:right}
#courses>.cmp-note{text-align:center;margin-top:16px}
.gc-time{display:grid;grid-template-columns:repeat(5,1fr);border-top:2px solid var(--gold);max-width:1000px;margin:0 auto}
.gc-time>div{position:relative;padding:22px 12px 0;text-align:center}
.gc-time>div::before{content:"";position:absolute;top:-7px;left:50%;margin-left:-6px;width:12px;height:12px;border-radius:50%;background:#1D3328;border:2px solid var(--gold)}
.gc-time b{display:block;font-family:var(--data);font-size:28px;font-weight:600;line-height:1}
.gc-time span{display:block;margin-top:8px;font-size:14px;color:var(--ink-soft);line-height:1.45}
.fc{margin-top:46px;border:1px solid var(--hairline);background:#fff}
.fc-head{position:relative;background:linear-gradient(160deg,#2E4A3B 0%,#1D3328 70%);color:#fff;text-align:center;padding:44px 34px 38px}
.fc-head::before{content:"";position:absolute;inset:10px;border:1px solid rgba(201,176,122,.45);pointer-events:none}
.fc-head .label{color:#E0C890;display:block;margin-bottom:8px}.fc-head h3{color:#fff;font-size:36px;margin-bottom:18px}
.fc-head blockquote{font-family:var(--serif);font-style:italic;font-size:24px;color:#F3EAD6;max-width:640px;margin:0 auto 26px}
.fc-head cite{display:block;margin-top:8px;font:500 11px/1 var(--mono);font-style:normal;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.6)}
.fc-awards{display:flex;justify-content:center;flex-wrap:wrap}
.fc-awards>div{padding:0 30px;border-left:1px solid rgba(255,255,255,.18);max-width:240px}.fc-awards>div:first-child{border-left:0}
.fc-awards b{display:block;font-family:var(--data);font-size:34px;font-weight:600;color:var(--gold);line-height:1}
.fc-awards small{display:block;margin-top:8px;font-family:var(--mono);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.75);line-height:1.5}
.fc-body{padding:10px 34px 34px}
.fc-body h4{font-family:var(--serif);font-size:26px;font-weight:600;text-align:center;margin:38px 0 22px}
.fc-holes{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.fc-holes>div{display:flex;gap:18px;align-items:flex-start;border:1px solid var(--hairline);padding:20px}
.fc-no{flex:0 0 56px;height:56px;border-radius:50%;display:grid;place-items:center;background:#1D3328;color:var(--gold);font-family:var(--data);font-size:26px;font-weight:600;border:2px solid var(--gold)}
.fc-holes b{font-size:15px}.fc-holes p{font-size:14.5px;color:var(--ink-soft);margin-top:4px}
.fc-tees{display:flex;flex-wrap:wrap;justify-content:center;gap:8px}
.fc-tees span{border:1px solid var(--hairline);background:var(--cream);padding:10px 14px;text-align:center;font-family:var(--data);font-size:20px;font-weight:600;min-width:110px}
.fc-tees b{display:block;font:600 10px/1.2 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:4px}
.fc .cmp-note{text-align:center;margin-top:16px}
@media (max-width:860px){.gc{grid-template-columns:1fr}.gc-time{grid-template-columns:1fr;border-top:0;border-left:2px solid var(--gold);max-width:520px}.gc-time>div{text-align:left;padding:0 0 18px 24px}.gc-time>div::before{top:6px;left:-7px;margin-left:0}.fc-holes{grid-template-columns:1fr}.fc-awards>div{padding:8px 16px;border-left:0}.fc-body{padding:6px 18px 24px}}

/* ============ Keswick Life section blocks (partials/life-blocks.njk), 29 Sep 2026 ============ */

.land-h{text-align:center;font-family:'Cormorant Garamond',serif;font-size:1.55rem;margin:40px 0 16px;color:var(--char)}
.ladder{display:grid;grid-template-columns:repeat(7,1fr);gap:10px;align-items:end}
.lad{background:#fff;border:1px solid var(--hairline);padding:16px 10px;text-align:center;display:flex;flex-direction:column;gap:6px;min-height:150px;justify-content:center}
.lad-n{font-family:'Cormorant Garamond',serif;font-weight:600;font-size:2rem;line-height:1;color:var(--char)}
.lad-n small{font-size:.9rem;font-family:Manrope,sans-serif;font-weight:500}
.lad-a{font:600 .82rem/1.3 Manrope,sans-serif;color:var(--ink)}
.lad-s{font:500 .72rem/1.3 Manrope,sans-serif;color:var(--ink-soft)}
.lad.hi{position:relative;background:linear-gradient(160deg,#2E4A3B 0%,#1D3328 70%);border:0;min-height:190px}
.lad.hi::before{content:"";position:absolute;inset:6px;border:1px solid rgba(201,176,122,.45);pointer-events:none}
.lad.hi .lad-n{color:#E4CF9E;font-size:2.6rem}.lad.hi .lad-a{color:#fff}.lad.hi .lad-s{color:rgba(255,255,255,.7)}
.land-note{text-align:center;color:var(--ink-soft);font-size:.9rem;margin-top:12px}
.bars{max-width:720px;margin:0 auto;background:#fff;border:1px solid var(--hairline);padding:22px 26px}
.bars-cap{font:600 .78rem/1.4 Manrope,sans-serif;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-soft);margin:0 0 14px}
.bar-row{display:grid;grid-template-columns:170px 1fr 40px;gap:12px;align-items:center;margin:10px 0}
.bar-l{font:600 .92rem Manrope,sans-serif}.bar-t{height:22px;background:#EFE8D8}.bar-f{display:block;height:100%;background:#2E7A4C}
.bar-v{font-family:'Cormorant Garamond',serif;font-weight:600;font-size:1.5rem;text-align:right}
.bar-sub{grid-column:2/4;font-size:.8rem;color:var(--ink-soft);margin-top:-6px}
.lb-areas-grid{margin-top:34px}
.src-center{text-align:center}
.own-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:26px}
.own-card{background:#fff;border:1px solid var(--hairline);padding:26px 26px 20px;border-top:4px solid #2E4A3B}
.own-tag{font:600 .72rem Manrope,sans-serif;letter-spacing:.1em;text-transform:uppercase;color:#8A6D2F}
.own-card h3{font-family:'Cormorant Garamond',serif;font-size:1.5rem;margin:4px 0 12px}
.own-stat{font-family:'Cormorant Garamond',serif;font-weight:600;font-size:2.3rem;line-height:1;color:#2E4A3B}
.own-sl{font-size:.86rem;color:var(--ink-soft);margin:6px 0 14px;padding-bottom:14px;border-bottom:1px solid var(--hairline)}
.own-card p{margin:0 0 10px}.own-src{font-size:.76rem;color:var(--ink-soft)}
.own-links{display:flex;flex-direction:column;gap:6px;margin:4px 0 14px}
.own-link{font:600 .8rem Manrope,sans-serif;letter-spacing:.04em;color:#2E4A3B;text-decoration:none;border-bottom:1px solid transparent;align-self:flex-start}
.own-link:hover{border-bottom-color:#B8955A}
.own-guides{margin-top:30px;display:flex;flex-wrap:wrap;gap:10px;justify-content:center;align-items:center}
.own-gl{width:100%;text-align:center;font:600 .72rem Manrope,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:4px}
.own-guides a{background:linear-gradient(160deg,#2E4A3B 0%,#1D3328 70%);color:#fff;text-decoration:none;padding:12px 20px;font:600 .8rem Manrope,sans-serif;letter-spacing:.06em;border:1px solid rgba(201,176,122,.45)}
.own-guides a:hover{color:#E4CF9E}
.data-note{max-width:760px;margin:26px auto 30px;background:#F3ECDC;border-left:4px solid #B8955A;padding:16px 22px}
.dn-tag{font:600 .7rem Manrope,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:#8A6D2F}
.data-note p{margin:6px 0 0;font-size:.95rem}
@media(max-width:900px){.ladder{grid-template-columns:repeat(2,1fr)}.lad.hi{min-height:150px}.own-grid{grid-template-columns:1fr}.bar-row{grid-template-columns:110px 1fr 30px}}

.hist-stats{grid-template-columns:repeat(3,1fr);max-width:900px;margin:30px auto 0}
.hist-stats .lad-n{font-size:2.6rem}
.hx{max-width:1000px;margin:30px auto 0;background:#fff;border:1px solid var(--hairline);border-top:4px solid #2E4A3B}
.hx-row{display:grid;grid-template-columns:repeat(3,1fr);border-bottom:1px solid var(--hairline)}
.hx-s{text-align:center;padding:26px 16px 22px;display:flex;flex-direction:column;gap:4px}
.hx-s+.hx-s{border-left:1px solid var(--hairline)}
.hx-n{font-family:'Cormorant Garamond',serif;font-weight:600;font-size:2.7rem;line-height:1;color:#2E4A3B}
.hx-a{font:600 .9rem Manrope,sans-serif;color:var(--ink);margin-top:6px}
.hx-l{font:600 .68rem Manrope,sans-serif;letter-spacing:.1em;text-transform:uppercase;color:#8A6D2F}
.tl-in{padding:22px 30px 18px}
.tl-track{position:relative;height:110px;margin:10px 0 30px}
.tl-shade{position:absolute;left:0;top:0;bottom:0;background:#F3ECDC}
.tl-line{position:absolute;left:0;right:0;bottom:6px;height:2px;background:#1D3328}
.tl-dot{position:absolute;width:13px;height:13px;border-radius:50%;background:#fff;border:2px solid #2E7A4C;transform:translateX(-50%)}
.tl-dot.old{background:#2E4A3B;border-color:#2E4A3B}
.tl-tick{position:absolute;bottom:-24px;transform:translateX(-50%);font:500 .75rem Manrope,sans-serif;color:var(--ink-soft)}
.tl-key{display:flex;gap:24px;justify-content:center;font-size:.85rem;color:var(--ink-soft)}
.tl-key span{display:flex;align-items:center;gap:8px}.tl-key .tl-dot{position:static;transform:none;display:inline-block}
.lm-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:26px;position:relative}
.lm{background:#fff;border:1px solid var(--hairline);border-top:4px solid #B8955A;padding:22px 20px 16px}
.lm-y{font-family:'Cormorant Garamond',serif;font-weight:600;font-size:2.3rem;line-height:1;color:#2E4A3B}
.lm h3{font-family:'Cormorant Garamond',serif;font-size:1.4rem;margin:10px 0 2px}
.lm-p{font:600 .7rem Manrope,sans-serif;letter-spacing:.1em;text-transform:uppercase;color:#8A6D2F}
.lm p{margin:12px 0 8px;font-size:.93rem}

.own-3{grid-template-columns:repeat(3,1fr)}
@media(max-width:900px){.hx-row,.lm-grid,.own-3{grid-template-columns:1fr}.hx-s+.hx-s{border-left:0;border-top:1px solid var(--hairline)}.tl-in{padding:18px 14px}}

.eq-facts{display:grid;grid-template-columns:repeat(3,1fr)}
.eq-facts>div{padding:24px 22px;text-align:center;border-top:1px solid var(--hairline);border-left:1px solid var(--hairline)}
.eq-facts>div:nth-child(3n+1){border-left:0}
.eq-facts svg{width:26px;height:26px;stroke:var(--gold);fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;display:block;margin:0 auto 8px}
.eq-facts small{display:block;font-family:var(--mono);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft)}
.eq-facts b{display:block;font-family:var(--serif);font-size:21px;font-weight:600;margin-top:4px;line-height:1.25}
.eq-cal{max-width:820px;margin:0 auto;border-left:2px solid var(--gold);padding-left:0}
.eq-ev{display:grid;grid-template-columns:130px 1fr;gap:22px;align-items:center;padding:16px 0 16px 0;position:relative}
.eq-ev::before{content:"";position:absolute;left:-7px;top:50%;width:12px;height:12px;margin-top:-6px;background:#1D3328;border:2px solid var(--gold);border-radius:50%}
.eq-d{font-family:var(--data);font-size:26px;font-weight:600;color:var(--char);text-align:right;line-height:1}
.eq-d small{display:block;font-family:var(--mono);font-size:10px;letter-spacing:.12em;color:var(--ink-soft);margin-top:4px}
.eq-ev b{font-size:17px}.eq-ev p{font-size:14.5px;color:var(--ink-soft)}
.eq-dir{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.eq-disc{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-bottom:26px}
.eq-disc span{font:600 13px/1 var(--sans);letter-spacing:.08em;text-transform:uppercase;padding:12px 18px;background:linear-gradient(160deg,#2E4A3B 0%,#1D3328 70%);color:#fff}
.kh{border:1px solid var(--hairline);background:#fff}
.kh-head{background:linear-gradient(160deg,#2E4A3B 0%,#1D3328 70%);position:relative;padding:36px 34px 30px;text-align:center;color:#fff}
.kh-head::before{content:"";position:absolute;inset:8px;border:1px solid rgba(201,176,122,.45);pointer-events:none}
.kh-head .label{color:#E0C890;display:block;margin-bottom:8px}.kh-head h3{color:#fff;font-size:36px;margin-bottom:22px}
.kh-stats{display:flex;justify-content:center;gap:0;margin-bottom:22px}
.kh-stats>div{padding:0 34px;border-left:1px solid rgba(255,255,255,.18)}.kh-stats>div:first-child{border-left:0}
.kh-stats b{display:block;font-family:var(--data);font-size:34px;font-weight:600;color:var(--gold);line-height:1}
.kh-stats small{display:block;margin-top:6px;font-family:var(--mono);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.75)}
.kh-head a{position:relative;color:#fff;font:600 12px/1 var(--sans);letter-spacing:.08em;text-transform:uppercase;text-decoration:none;border-bottom:1px solid rgba(255,255,255,.5);padding-bottom:3px}
.kh-season{padding:26px 34px;text-align:center;border-bottom:1px solid var(--hairline)}
.kh-season>small,.kh-days small{display:block;font-family:var(--mono);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:10px}
.kh-months{display:grid;grid-template-columns:repeat(12,1fr);gap:3px;max-width:720px;margin:0 auto 20px}
.kh-months span{padding:10px 0;font:600 12px/1 var(--mono);background:var(--cream);color:var(--ink-soft)}
.kh-months span.on{background:#2E4A3B;color:#fff}
.kh-months span.half-on{background:linear-gradient(90deg,#2E4A3B 50%,var(--cream) 50%);color:#fff}
.kh-months span.half-in{background:linear-gradient(90deg,var(--cream) 50%,#2E4A3B 50%);color:var(--char)}
.kh-days{display:flex;justify-content:center;align-items:center;gap:6px;flex-wrap:wrap}.kh-days small{margin:0 10px 0 0}
.kh-days .d{width:48px;padding:9px 0;font:600 12px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;border:1px solid var(--hairline);color:var(--ink-soft)}
.kh-days .d.on{background:var(--gold);border-color:var(--gold);color:var(--char)}
.kh .eq-facts{grid-template-columns:repeat(3,1fr)}.kh .eq-facts>div{border-top:0}
#hunt .cmp-note{text-align:center;margin-top:16px}
#calendar .cmp-note{text-align:center;margin-top:16px}
@media (max-width:860px){.kh-stats>div{padding:0 16px}.kh .eq-facts{grid-template-columns:1fr}.kh .eq-facts>div{border-left:0!important;border-top:1px solid var(--hairline)}.kh-months span{font-size:10px}}
@media (max-width:560px){.eq-ev{grid-template-columns:90px 1fr;gap:14px}.eq-d{font-size:20px}}

/* Street lists: streets with one sale folded behind a toggle (29 Sep 2026) */
.vband-more{margin-top:8px}
.vband-more summary{display:inline-block;cursor:pointer;list-style:none;font-family:var(--mono);font-size:11.5px;letter-spacing:.06em;color:#E0C890;border:1px dashed rgba(201,176,122,.6);padding:7px 12px}
.vband-more summary::-webkit-details-marker{display:none}
.vband-more[open] summary{margin-bottom:8px}
.vband-more summary:hover{border-style:solid}
.fys-one .fys-tog-row td{padding:0;border-bottom:1px solid var(--hairline)}
.fys-tog{width:100%;text-align:left;font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;padding:14px 12px;background:var(--cream);border:0;color:var(--ink);cursor:pointer}
.fys-tog:hover{background:#EDE3CD}
.fys-tog b{font-weight:600}
.fys-one tr[data-one] th{font-weight:500}

.school-strip .school-cta{margin-top:26px;text-align:center}

/* ---------- Sale chart (hood.saleChart): every sale in a small area, 29 Sep 2026 ---------- */
.sc{margin:34px auto 0;max-width:1080px;background:#fff;border:1px solid var(--hairline);border-top:4px solid #2E4A3B}
.sc-stats{display:grid;grid-template-columns:repeat(4,1fr);border-bottom:1px solid var(--hairline)}
.sc-stats>div{text-align:center;padding:24px 12px 20px}.sc-stats>div+div{border-left:1px solid var(--hairline)}
.sc-stats b{display:block;font-family:'Cormorant Garamond',serif;font-weight:600;font-size:2.1rem;line-height:1;color:#2E4A3B}
.sc-stats small{display:block;margin-top:8px;font:600 .68rem Manrope,sans-serif;letter-spacing:.1em;text-transform:uppercase;color:#8A6D2F}
.sc-cap{font:600 .72rem Manrope,sans-serif;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft);padding:22px 30px 0}
.sc-plot{padding:8px 30px 10px;position:relative}
.sc-axis{position:relative;height:22px;margin-left:190px;margin-right:110px}
.sc-axis span{position:absolute;bottom:2px;transform:translateX(-50%);font:500 .72rem Manrope,sans-serif;color:var(--ink-soft)}
.sc-row{display:grid;grid-template-columns:190px 1fr;align-items:start;padding:14px 0;border-top:1px solid var(--hairline)}
.sc-who b{display:block;font-family:'Cormorant Garamond',serif;font-size:1.3rem;font-weight:600;line-height:1.1;color:var(--char)}
.sc-who small{display:block;margin-top:4px;font-size:.8rem;color:var(--ink-soft)}
.sc-body{margin-right:110px}
.sc-track{position:relative;height:26px}
.sc-track i{position:absolute;top:-6px;bottom:-6px;width:1px;background:var(--hairline)}
.sc-bar{position:absolute;left:0;top:3px;height:20px;background:#2E4A3B;border-radius:0 4px 4px 0}
.is-med .sc-bar{background:#B8860B}
.sc-val{position:absolute;top:0;margin-left:10px;white-space:nowrap;font-family:'Cormorant Garamond',serif;font-weight:600;font-size:1.35rem;line-height:26px;color:var(--char)}
.sc-val em{font:600 .64rem Manrope,sans-serif;font-style:normal;letter-spacing:.1em;text-transform:uppercase;background:#B8860B;color:#fff;padding:3px 7px;margin-left:8px;vertical-align:middle}
.sc-facts{display:flex;flex-wrap:wrap;gap:4px 0;margin:10px 0 0;font-size:.84rem;color:var(--ink-soft)}
.sc-facts span+span::before{content:"·";margin:0 8px;color:var(--hairline)}
.sc-note{padding:0 30px 22px;margin:6px 0 0}
@media(max-width:760px){.sc-stats{grid-template-columns:1fr 1fr}.sc-stats>div:nth-child(3){border-left:0}.sc-stats>div:nth-child(n+3){border-top:1px solid var(--hairline)}
.sc-plot{padding:8px 16px}.sc-axis{margin-left:0;margin-right:96px}.sc-row{grid-template-columns:1fr;gap:8px}.sc-body{margin-right:96px}.sc-cap,.sc-note{padding-left:16px;padding-right:16px}}

/* ---------- Village band mini bar chart (p.bars) + life-card links, 29 Sep 2026 ---------- */
.vbar{margin:6px 0 4px}
.vbar-row{display:grid;grid-template-columns:1fr 104px;gap:10px;align-items:center;margin:7px 0}
.vbar-t{position:relative;height:14px;background:rgba(255,255,255,.08)}
.vbar-f{position:absolute;left:0;top:0;bottom:0;background:#9DBFA8;border-radius:0 3px 3px 0}
.vbar-row.m .vbar-f{background:#E0C890}
.vbar-row.over .vbar-f{border-radius:0;background:repeating-linear-gradient(90deg,#9DBFA8 0 calc(100% - 14px),transparent calc(100% - 14px) calc(100% - 10px),#9DBFA8 calc(100% - 10px) calc(100% - 6px),transparent calc(100% - 6px) calc(100% - 3px),#9DBFA8 calc(100% - 3px))}
.vbar-v{font:600 12.5px/1 var(--mono,monospace);color:#fff;white-space:nowrap}
.vbar-v em{font-style:normal;font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:#E0C890;margin-left:6px}
.vbar-ax{position:relative;height:16px;margin-right:114px;margin-top:4px}
.vbar-ax span{position:absolute;top:0;transform:translateX(-50%);font:500 10px/1 var(--mono,monospace);color:rgba(255,255,255,.55)}
.vbar-ax span:first-child{transform:none}.vbar-ax span:last-child{transform:translateX(-100%)}
.icon-card .icon-link{display:inline-block;margin-top:12px;font:600 12px/1.3 var(--sans,Manrope,sans-serif);letter-spacing:.06em;text-transform:uppercase;color:#E0C890;text-decoration:none;border-bottom:1px solid rgba(224,200,144,.4);padding-bottom:2px}
.icon-card .icon-link:hover{border-bottom-color:#E0C890}

/* ---------- Time to sell (hood.sellTime): days on market vs % of list, 29 Sep 2026 ---------- */
.stm{margin:34px auto 0;max-width:1080px;background:#fff;border:1px solid var(--hairline);border-top:4px solid #2E4A3B}
.stm .sc-stats{grid-template-columns:repeat(3,1fr)}
.stm-plot{position:relative;padding:14px 40px 46px 110px}
.stm-box{position:relative;height:300px;border-left:1px solid var(--ink-soft);border-bottom:1px solid var(--ink-soft)}
.stm-gy{position:absolute;left:0;right:0;height:0;border-top:1px solid var(--hairline)}
.stm-gy.ref{border-top:2px dashed #B8860B}
.stm-gy em{position:absolute;right:100%;top:-8px;margin-right:10px;white-space:nowrap;font:500 .72rem Manrope,sans-serif;font-style:normal;color:var(--ink-soft)}
.stm-gy.ref em{color:#8A6D2F;font-weight:700}
.stm-gx{position:absolute;top:0;bottom:0;width:0;border-left:1px solid var(--hairline)}
.stm-gx em{position:absolute;top:100%;margin-top:8px;transform:translateX(-50%);white-space:nowrap;font:500 .72rem Manrope,sans-serif;font-style:normal;color:var(--ink-soft)}
.stm-dot{position:absolute;width:13px;height:13px;margin:0 0 -6.5px -6.5px;border-radius:50%;background:#2E4A3B;box-shadow:0 0 0 2px #fff;cursor:default}
.stm-dot:hover,.stm-dot:focus{background:#1D3328;outline:none;box-shadow:0 0 0 2px #fff,0 0 0 4px #2E4A3B}
.stm-yl{position:absolute;left:14px;top:50%;transform:translateY(-50%) rotate(-90deg);transform-origin:left top;font:600 .66rem Manrope,sans-serif;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft);white-space:nowrap;display:none}
.stm-xl{position:absolute;left:110px;right:40px;bottom:10px;text-align:center;font:600 .66rem Manrope,sans-serif;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft)}
@media(max-width:760px){.stm .sc-stats{grid-template-columns:1fr}.stm .sc-stats>div+div{border-left:0;border-top:1px solid var(--hairline)}.stm-plot{padding:14px 18px 46px 78px}.stm-box{height:240px}.stm-xl{left:78px;right:18px}}
#time-to-sell .versus-cta{margin:30px 0 26px}
#time-to-sell .versus-cta .btn{display:inline-block}
.stm .sc-note{text-align:center;max-width:none}
#time-to-sell .src-center .csec-src{margin:16px auto 0!important;position:static!important;transform:none!important}

/* Fix 29 Sep: life-block source lines sat 30px up into the chart above (shared .src-center rule has a negative margin) */
section[class*="lb-"] .src-center .csec-src{margin:16px auto 0}

/* ---------- Clarify table (hood.clarify), 29 Sep 2026 ---------- */
.cl-wrap{max-width:900px;margin:30px auto 0;overflow-x:auto;background:#fff;border:1px solid var(--hairline);border-top:4px solid #2E4A3B}
.cl{width:100%;border-collapse:collapse;min-width:560px;font-size:15px}
.cl thead th{padding:20px 18px;text-align:center;border-bottom:1px solid var(--hairline);vertical-align:bottom}
.cl thead th a{display:block;font-family:'Cormorant Garamond',serif;font-size:1.5rem;font-weight:600;color:var(--char);text-decoration:none}
.cl thead th a:hover{text-decoration:underline}
.cl thead th small{display:block;margin-top:4px;font:600 .68rem Manrope,sans-serif;letter-spacing:.1em;text-transform:uppercase;color:#8A6D2F}
.cl thead th+th{border-left:1px solid var(--hairline)}
.cl tbody th{text-align:left;padding:14px 18px;font:600 .72rem Manrope,sans-serif;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft);border-top:1px solid var(--hairline);white-space:nowrap}
.cl tbody td{text-align:center;padding:14px 18px;border-top:1px solid var(--hairline);border-left:1px solid var(--hairline)}
.cl-src{text-align:center;max-width:900px;margin:14px auto 0}
.cl-cta{margin-top:22px}

/* ---------- Type guide (hood.typeGuide): range chart + side-by-side table, 29 Sep 2026 ---------- */
.tg{margin:34px auto 0;max-width:1080px;background:#fff;border:1px solid var(--hairline);border-top:4px solid #2E4A3B;padding-bottom:18px}
.tg-plot{padding:8px 30px 0}
.tg-axis{position:relative;height:22px;margin-left:200px;margin-right:170px}
.tg-axis span{position:absolute;bottom:2px;transform:translateX(-50%);font:500 .72rem Manrope,sans-serif;color:var(--ink-soft)}
.tg-row{display:grid;grid-template-columns:200px 1fr;align-items:center;padding:14px 0;border-top:1px solid var(--hairline)}
.tg-who b{display:block;font-family:'Cormorant Garamond',serif;font-size:1.3rem;font-weight:600;line-height:1.1;color:var(--char)}
.tg-who small{display:block;margin-top:3px;font-size:.8rem;color:var(--ink-soft)}
.tg-track{position:relative;height:28px;margin-right:170px}
.tg-track i{position:absolute;top:-8px;bottom:-8px;width:1px;background:var(--hairline)}
.tg-range{position:absolute;top:8px;height:12px;background:#2E4A3B;border-radius:6px;min-width:10px}
.tg-med{position:absolute;top:3px;width:4px;height:22px;margin-left:-2px;background:#B8860B;border-radius:2px;box-shadow:0 0 0 2px #fff}
.tg-lab{position:absolute;top:0;margin-left:12px;white-space:nowrap;font-family:'Cormorant Garamond',serif;font-weight:600;font-size:1.25rem;line-height:28px;color:var(--char)}
.tg-lab small{font:500 .74rem Manrope,sans-serif;color:var(--ink-soft)}
.tg-key{display:flex;gap:22px;justify-content:center;padding:12px 0 0;border-top:1px solid var(--hairline);font-size:.82rem;color:var(--ink-soft)}
.tg-key span{display:flex;align-items:center;gap:8px}
.tg-key .k-range{display:inline-block;width:26px;height:10px;border-radius:5px;background:#2E4A3B}
.tg-key .k-med{display:inline-block;width:4px;height:16px;border-radius:2px;background:#B8860B}
.tg-tbl{max-width:1080px;margin-top:24px}
.tg-ct{display:block;font-family:'Cormorant Garamond',serif;font-size:1.3rem;font-weight:600;color:var(--char)}
.tg-tbl .cl thead th small{margin-top:3px}
.tg-tbl .cl tbody tr:first-child td{font-family:'Cormorant Garamond',serif;font-size:1.35rem;font-weight:600;color:#2E4A3B}
.tg-notes{max-width:1080px;margin:18px auto 0;padding:0;list-style:none;font-size:.92rem;color:var(--ink-soft)}
.tg-notes li{padding:6px 0 6px 18px;position:relative}.tg-notes li::before{content:"";position:absolute;left:0;top:14px;width:6px;height:6px;background:#B8860B;transform:rotate(45deg)}
.tg-notes b{color:var(--ink)}
@media(max-width:760px){.tg-plot{padding:8px 14px 0}.tg-axis{margin-left:0;margin-right:0}.tg-row{grid-template-columns:1fr;gap:6px}.tg-track{margin-right:0;margin-bottom:26px}.tg-lab{left:0!important;top:26px;margin-left:0}}

/* type guide: hover tooltips replace the always-on labels (Alex 29 Sep) */
.tg-axis{margin-right:30px}.tg-track{margin-right:30px}
.tg-hit{position:absolute;top:0;height:28px;cursor:pointer;outline:none;min-width:10px}
.tg-hit .tg-range{left:0;right:0;width:auto}
.tg-hit:hover .tg-range,.tg-hit:focus .tg-range{background:#15271D}
.tg-tip{position:absolute;bottom:calc(100% + 10px);left:50%;transform:translateX(-50%);background:#15271D;color:#fff;padding:9px 13px;font:500 .8rem/1.45 Manrope,sans-serif;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .12s;z-index:3;box-shadow:0 6px 18px rgba(0,0,0,.18)}
.tg-tip b{font-family:'Cormorant Garamond',serif;font-size:1.25rem;font-weight:600;color:#E0C890}
.tg-tip::after{content:"";position:absolute;top:100%;left:50%;margin-left:-6px;border:6px solid transparent;border-top-color:#15271D}
.tg-hit:hover .tg-tip,.tg-hit:focus .tg-tip{opacity:1}
.tg-hint{font-style:italic}
@media(max-width:760px){.tg-track{margin-bottom:0}}

/* ---------- Area-page duel + neighborhood chart (hood.duel, hood.hoodChart), 29 Sep 2026 ---------- */
#duel .vsb{margin-top:28px}
section .src-center.duel-src .csec-src{margin:16px auto 0}
.hc-a{background:var(--vs-a)!important}.hc-b{background:var(--vs-b)!important}
.tg-hit:hover .tg-range.hc-a,.tg-hit:focus .tg-range.hc-a{background:var(--vs-a-deep)!important}
.tg-hit:hover .tg-range.hc-b,.tg-hit:focus .tg-range.hc-b{background:var(--vs-b-deep)!important}
.hc-notes{display:grid;grid-template-columns:1fr 1fr;gap:26px;max-width:1080px;margin:26px auto 0}
.hc-col{background:#fff;border:1px solid var(--hairline);padding:22px 24px}
.hc-col .label{display:block;margin-bottom:8px}.hc-col p{font-size:.95rem;margin:0 0 10px}
.hc-table{max-width:1080px;margin:22px auto 0}
@media(max-width:760px){.hc-notes{grid-template-columns:1fr}}
.stats5.n2{grid-template-columns:repeat(2,1fr);max-width:760px;margin:0 auto}
@media(max-width:860px){.stats5.n2 .st:last-child{grid-column:auto}}
.hc-chart .tg-med,.hc-chart .tg-key .k-med{background:#15271D}

/* 29 Sep (Alex): chart green matches the site's dark green #2E4A3B. Validator: CVD ΔE 25 vs gold #B8860B (pass); fails the lightness/chroma bands, accepted for brand match. */
.hc-chart .tg-med,.hc-chart .tg-key .k-med{background:#fff;box-shadow:0 0 0 2px #15271D}

/* ============ Schools hub county cards (Sep 29): centered head, one CTA ============ */
.county-sec .county-top{text-align:center}
.county-sec .county h3 a{color:inherit;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:6px;text-decoration-color:var(--hairline)}
.county-sec .county h3 a:hover{text-decoration-color:var(--ink)}
.county-sec .county-homes{margin-top:auto;align-self:center;text-align:center}
.county-sec .county-homes{align-self:stretch;white-space:nowrap;padding-left:12px;padding-right:12px}
.county-sec .county-homes{display:flex;justify-content:center;text-align:center}
.county-sec .county-system{align-self:center;margin-top:14px;font-size:13.5px;color:var(--ink);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px;text-decoration-color:var(--hairline)}
.county-sec .county-system:hover{text-decoration-color:var(--ink)}
.county-sec .county-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.county-sec .county-homes{white-space:normal;line-height:1.5;padding:14px 18px}@media(max-width:900px){.county-sec .county-grid{grid-template-columns:1fr}}

/* ============ County schools pages v2 (Sep 29, 2026): flow + 3 section kinds. NETWORK: town-agnostic ============ */
.sflow-sec,.sch-sec{padding:92px 0}
.sch-sec.alt{background:var(--cream);border-top:1px solid var(--hairline);border-bottom:1px solid var(--hairline)}
.sch-answer{max-width:720px;margin:0 auto 40px;text-align:center;font-size:17.5px;line-height:1.65;font-weight:600;color:var(--ink)}
.sch-src{max-width:1100px;margin:26px auto 0}
.sch-src .csec-src{text-align:center;margin:0}
/* flow: one column per grade band, arrows between */
.sflow{list-style:none;margin:0 auto;padding:0;display:grid;gap:44px;max-width:1140px;counter-reset:none}
.sflow.n2{grid-template-columns:repeat(2,minmax(0,1fr))}
.sflow.n3{grid-template-columns:repeat(3,minmax(0,1fr))}
.sflow.n4{grid-template-columns:repeat(4,minmax(0,1fr));gap:34px}
.sflow-col{position:relative;display:flex;flex-direction:column;gap:14px}
.sflow-col+.sflow-col::before{content:"→";position:absolute;left:-30px;top:2px;font-size:20px;color:#B8860B;line-height:1}
.sflow.n4 .sflow-col+.sflow-col::before{left:-25px}
.sflow-head{display:flex;justify-content:space-between;align-items:baseline;gap:10px;border-bottom:1px solid var(--char);padding-bottom:10px}
.sflow-head b{font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;font-weight:600;color:var(--ink)}
.sflow-head span{font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;color:var(--ink-soft)}
.scard{background:var(--ivory);box-shadow:0 0 0 1px var(--hairline) inset;padding:18px 18px 16px;text-align:left}
.scard.main{box-shadow:0 0 0 1px var(--hairline) inset,inset 0 3px 0 #B8860B;padding-top:20px}
.scard:not(.main){background:transparent}
.scard-tag{display:block;font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:#8B6B3D;margin-bottom:6px}
.scard h3{font-size:22px;line-height:1.15}
.scard:not(.main) h3{font-size:19px}
.scard h3 a{color:var(--ink);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px;text-decoration-color:var(--hairline)}
.scard h3 a:hover{text-decoration-color:var(--ink)}
.scard h3 a::after{content:"\2197";font-family:var(--sans);font-size:11px;margin-left:5px;color:var(--ink-soft);vertical-align:3px}
.scard-num{margin-top:8px;font-size:13.5px;color:var(--ink-soft)}
.scard-num b{font-family:var(--data);font-size:26px;font-weight:600;color:var(--ink);font-variant-numeric:lining-nums;margin-right:2px}
.scard-facts{list-style:none;margin:10px 0 0;padding:10px 0 0;border-top:1px solid var(--hairline);font-size:13.5px;line-height:1.55;color:var(--ink-soft)}
.scard-facts li+li{margin-top:3px}
.scard-facts .share{color:#2E4A3B;font-weight:600}
/* the route line(s) under the flow */
.sroutes{max-width:1140px;margin:30px auto 0;border-top:1px solid var(--hairline);padding-top:18px;display:flex;flex-direction:column;gap:8px;align-items:center}
.sroute{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:center;gap:6px 10px;font-size:14.5px;color:var(--ink)}
.sroute b{font-weight:700}
.sroute i{font-style:normal;color:#B8860B}
.sroute em{font-style:normal;font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);margin:0 4px}
/* kind: steps */
.ssteps{list-style:none;margin:0 auto;padding:0;display:grid;gap:26px;max-width:1040px;counter-reset:st}
.ssteps.n2{grid-template-columns:repeat(2,minmax(0,1fr));max-width:760px}
.ssteps.n3{grid-template-columns:repeat(3,minmax(0,1fr))}
.ssteps li{counter-increment:st;border-top:1px solid var(--char);padding-top:18px}
.ssteps li::before{content:counter(st,decimal-leading-zero);display:block;font-family:var(--mono);font-size:12px;letter-spacing:.1em;color:#B8860B;margin-bottom:8px}
.ssteps b{display:block;font-family:var(--serif);font-size:23px;font-weight:600;line-height:1.2;color:var(--ink)}
.ssteps b a{color:inherit;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px;text-decoration-color:var(--hairline)}
.ssteps p{margin-top:8px;font-size:14.5px;line-height:1.65;color:var(--ink-soft)}
/* kind: list */
.slist{margin:0 auto;max-width:760px;border-top:1px solid var(--char)}
.slist>div{display:grid;grid-template-columns:200px 1fr;gap:20px;padding:15px 0;border-bottom:1px solid var(--hairline)}
.slist dt{font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);padding-top:3px}
.slist dd{margin:0;font-size:15.5px;font-weight:600;line-height:1.5;color:var(--ink)}
.slist dd a{color:inherit;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px;text-decoration-color:var(--hairline)}
/* kind: cards */
.scards{display:grid;gap:22px;max-width:1140px;margin:0 auto}
.scards.n3{grid-template-columns:repeat(3,minmax(0,1fr))}
.scards.n4{grid-template-columns:repeat(4,minmax(0,1fr))}
.scard2{background:var(--ivory);box-shadow:0 0 0 1px var(--hairline) inset;border-top:2px solid var(--char);padding:20px 20px 22px}
.scard2 span{display:block;font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft)}
.scard2 b{display:block;margin-top:10px;font-family:var(--serif);font-size:22px;font-weight:600;line-height:1.2;color:var(--ink)}
.scard2 p{margin-top:8px;font-size:14px;line-height:1.6;color:var(--ink-soft)}
@media(max-width:1000px){
  .sflow.n4,.scards.n4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sflow.n4 .sflow-col:nth-child(3)::before{display:none}
}
@media(max-width:760px){
  .sflow-sec,.sch-sec{padding:64px 0}
  .sflow.n2,.sflow.n3,.sflow.n4{grid-template-columns:1fr;gap:40px}
  .sflow-col+.sflow-col::before,.sflow.n4 .sflow-col:nth-child(3)::before{display:block;content:"↓";left:50%;top:-31px;transform:translateX(-50%)}
  .ssteps.n2,.ssteps.n3,.scards.n3,.scards.n4{grid-template-columns:1fr}
  .slist>div{grid-template-columns:1fr;gap:4px}
  .sch-answer{text-align:left}
}

/* ============ County schools v2.1 (Sep 29, 2026): one row per school path ============ */
.spath{max-width:1140px;margin:0 auto 30px;background:var(--ivory);box-shadow:0 0 0 1px var(--hairline) inset;padding:22px 26px 26px}
.spath+.spath{margin-top:18px}
.spath-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 14px;padding-bottom:14px;margin-bottom:18px;border-bottom:1px solid var(--char)}
.spath-head b{font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:#8B6B3D;font-weight:600}
.spath-head span{font-family:var(--serif);font-size:26px;font-weight:600;line-height:1.1;color:var(--ink)}
.spath-head em{font-style:normal;font-size:13.5px;color:#2E4A3B;font-weight:600;margin-left:auto}
.spath-grid{display:grid;grid-template-columns:repeat(var(--cols),minmax(0,1fr));column-gap:44px;row-gap:14px;align-items:start}
.spath-colhead{display:flex;justify-content:space-between;align-items:baseline;gap:8px;padding-bottom:6px;border-bottom:1px solid var(--hairline)}
.spath-colhead b{font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;font-weight:600;color:var(--ink)}
.spath-colhead span{font-family:var(--mono);font-size:10px;letter-spacing:.08em;color:var(--ink-soft)}
.spath-cell{position:relative;display:flex;flex-direction:column;gap:8px;height:100%}
.spath-cell.arr::before{content:"→";position:absolute;left:-30px;top:22px;font-size:20px;line-height:1;color:#B8860B}
.spath-cell .scard{box-shadow:0 0 0 1px var(--hairline) inset;background:var(--ivory);padding:16px 16px 14px}
.spath-cell .scard h3{font-size:21px}
.spath-cell .scard.compact{background:var(--cream);padding:12px 16px}
.spath-cell .scard.compact h3{font-size:18px}
.spath-cell .scard.compact .scard-num{margin-top:4px;font-size:12.5px}
.spath-alt{align-self:center;font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-soft)}
.spath-or{position:absolute;left:-44px;top:-11px;width:44px;text-align:center;font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:#8B6B3D;background:var(--ivory)}
.spath-cell.branch{padding-top:6px}
.spath-grid:has(.spath-cell[style*="span 2"]) .spath-cell[style*="span 2"] .scard{height:100%}
.sflow-sec .sch-src{margin-top:10px}
@media(max-width:1000px){
  .spath-grid{column-gap:30px}
  .spath-cell.arr::before{left:-22px}
}
@media(max-width:760px){
  .spath{padding:18px 16px 20px}
  .spath-head em{margin-left:0}
  .spath-grid{grid-template-columns:1fr;row-gap:26px}
  .spath-colhead{display:none}
  .spath-cell{grid-column:1 !important;grid-row:auto !important}
  .spath-cell.arr::before{content:"↓";left:50%;top:-24px;transform:translateX(-50%)}
  .spath-or{position:static;width:auto;text-align:left;background:none;margin-bottom:-2px}
}
@media(max-width:760px){
  .spath-cell.branch.arr::before{display:none}
  .spath-cell.branch .spath-or{display:block;border-top:1px solid var(--char);padding-top:14px;margin-top:6px;font-size:0}
  .spath-cell.branch .spath-or::before{content:"Or, instead";font-size:10.5px;letter-spacing:.16em}
}

/* ============ Cost hub v2 (Sep 29, 2026): rate tiles, tax-by-area bars, centered sections ============ */
.rtiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;max-width:1040px;margin:34px auto 0}
.rtile{background:var(--ivory);box-shadow:0 0 0 1px var(--hairline) inset;border-top:3px solid #2E4A3B;padding:22px 22px 20px;text-align:center}
.rtile .label{display:block}
.rtile b{display:block;margin-top:10px;font-family:var(--data);font-size:46px;font-weight:600;line-height:1;color:var(--ink);font-variant-numeric:lining-nums}
.rtile small{display:block;margin-top:6px;font-size:12.5px;color:var(--ink-soft)}
.rtile p{margin-top:12px;padding-top:12px;border-top:1px solid var(--hairline);font-size:14px;line-height:1.5;color:var(--ink)}
.rtile p+p{margin-top:0;padding-top:10px}
.rtile p span{display:block;font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:3px}
.taxbars{max-width:1040px;margin:44px auto 0;border-top:1px solid var(--char);padding-top:18px}
.taxbars figcaption{display:flex;justify-content:space-between;align-items:baseline;flex-wrap:wrap;gap:8px;margin-bottom:12px}
.taxbars figcaption b{font-family:var(--serif);font-size:24px;font-weight:600;color:var(--ink)}
.taxbars figcaption span{font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft)}
.taxbar{display:grid;grid-template-columns:250px 1fr 150px;gap:18px;align-items:center;padding:12px 0;border-bottom:1px solid var(--hairline)}
.taxbar-nm a{font-size:15.5px;font-weight:700;color:var(--ink);text-decoration:none}
.taxbar-nm a:hover{text-decoration:underline}
.taxbar-nm small{display:block;margin-top:2px;font-size:12px;color:var(--ink-soft)}
.taxbar-track{position:relative;height:16px;background:repeating-linear-gradient(90deg,transparent 0 calc(16.666% - 1px),var(--hairline) calc(16.666% - 1px) 16.666%)}
.taxbar-fill{position:absolute;top:0;bottom:0;background:#2E4A3B}
.taxbar-fill.alt{background:#B8860B}
.taxbar-v{text-align:right;font-family:var(--data);font-size:22px;font-weight:600;color:var(--ink);font-variant-numeric:lining-nums}
.taxbars-note{margin-top:14px;font-size:12.5px;line-height:1.6;color:var(--ink-soft)}
#profiles .csec-src{text-align:center;max-width:1040px;margin:14px auto 0}
.col-cta{text-align:center;margin-top:34px}
/* centered cost sections */
.csec-c{padding:92px 0}
.csec-c .sec-answer{max-width:760px}
.ctiles{display:grid;gap:22px;max-width:1080px;margin:36px auto 0}
.ctiles.n1{grid-template-columns:minmax(0,560px);justify-content:center}
.ctiles.n2{grid-template-columns:repeat(2,minmax(0,1fr));max-width:860px}
.ctiles.n3{grid-template-columns:repeat(3,minmax(0,1fr))}
.ctiles.n4{grid-template-columns:repeat(4,minmax(0,1fr))}
.ctile{background:var(--ivory);box-shadow:0 0 0 1px var(--hairline) inset;border-top:3px solid #2E4A3B;padding:22px 22px 22px}
.ctile .label{display:block;color:#8B6B3D}
.ctile b{display:block;margin-top:10px;font-family:var(--serif);font-size:24px;font-weight:600;line-height:1.2;color:var(--ink)}
.ctile p{margin-top:10px;font-size:14px;line-height:1.6;color:var(--ink-soft)}
.ctile em,.ccards-c em{display:inline-block;margin-top:10px;font-style:normal;font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:#8B6B3D;border:1px solid #D9C9A8;padding:3px 7px}
.ccards-c{display:grid;gap:22px;max-width:1140px;margin:36px auto 0}
.ccards-c.n3{grid-template-columns:repeat(3,minmax(0,1fr))}
.ccards-c.n2{grid-template-columns:repeat(2,minmax(0,1fr))}
.ccards-c .ccard{background:var(--ivory);box-shadow:0 0 0 1px var(--hairline) inset;padding:0 0 22px;border:none}
.ccards-c .ccard-top{background:#2E4A3B;padding:22px 22px 20px;color:#fff}
.ccards-c .ccard-top .label{color:#D9C08A}
.ccards-c .ccard-top h3{margin-top:6px;font-size:26px;color:#fff}
.ccards-c .ccard-top h3 a{color:#fff;text-decoration:none}
.ccards-c .ccard-top .ccard-lede{margin-top:8px;font-size:14px;line-height:1.55;color:rgba(255,255,255,.82)}
.ccards-c .ctable{margin:6px 22px 0;border-top:none}
.ccards-c .ctable>div.is-ask{background:#FBF7EE;margin:0 -22px;padding-left:22px;padding-right:22px}
.ccards-c .ccard-link{margin:auto 22px 0;padding-top:18px}
.cnote-box{max-width:860px;margin:30px auto 0;background:var(--cream);border-left:3px solid #B8860B;padding:16px 20px}
.csec-alt .cnote-box{background:var(--ivory)}
.cnote-box b{display:block;font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:#8B6B3D;margin-bottom:6px}
.cnote-box p{font-size:14.5px;line-height:1.65;color:var(--ink)}
.csec-c-src{max-width:1080px;margin:18px auto 0;text-align:center}
.csec-c-src .csec-src{margin:0}
@media(max-width:900px){
  .rtiles,.ctiles.n3,.ctiles.n4,.ccards-c.n3{grid-template-columns:1fr}
  .taxbar{grid-template-columns:1fr 110px;gap:6px 12px}
  .taxbar-nm{grid-column:1 / -1}
}
@media(max-width:640px){.ctiles.n2,.ccards-c.n2{grid-template-columns:1fr}}
.taxbar{grid-template-columns:250px 1fr 190px}
.taxbar-v{white-space:nowrap}
.ccards-c .ctable>div.is-ask{margin:0;padding-left:10px;padding-right:10px}
.ccards-c .ctable dd span{overflow-wrap:anywhere}
.thist-chart + .csec-src{margin-top:40px}
.rtile p+p{border-top-color:transparent}
@media(max-width:900px){.taxbar{grid-template-columns:1fr 130px}}
#profiles .thist .csec-src{margin-top:46px}
.taxbar-fill{left:0}
.taxbar-fill.ext{background:repeating-linear-gradient(135deg,#2E4A3B 0 4px,#8FA597 4px 8px)}

/* ---- price chart hover mode (pcHover): values pop up on hover/tap instead of a right column ---- */
.pc-hover{--pcv:0px}
.pc-hover .pc-val{display:none}
.pc-hover .pc-track{margin-right:0}
.pc-hit{position:absolute;top:-8px;bottom:-8px;min-width:14px;cursor:pointer;outline:none;z-index:2}
.pc-hit:hover~.pc-bar,.pc-track:hover .pc-bar{filter:brightness(.8)}
.pc-tip{position:absolute;bottom:calc(100% + 8px);left:50%;transform:translateX(-50%);background:#15271D;color:#fff;padding:9px 13px;font:500 .8rem/1.45 Manrope,sans-serif;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .12s;z-index:5;box-shadow:0 6px 18px rgba(0,0,0,.18);text-align:center}
.pc-tip b{font-family:'Cormorant Garamond',serif;font-size:1.3rem;font-weight:600;color:#E0C890}
.pc-tip::after{content:"";position:absolute;top:100%;left:50%;margin-left:-6px;border:6px solid transparent;border-top-color:#15271D}
.pc-hit:hover .pc-tip,.pc-hit:focus .pc-tip{opacity:1}
@media(max-width:760px){.pc-hover .pc-row{grid-template-columns:1fr}}

/* ============ Cost pages v2.1 (Sep 29, 2026): cluster tiles, centered bars, guide cards ============ */
.ctiles.n5,.ctiles.n6{grid-template-columns:repeat(3,minmax(0,1fr))}
.cbars-c{max-width:960px;margin:36px auto 0}
.gg-cards{display:grid;gap:22px;max-width:1140px;margin:0 auto}
.gg-cards.n2{grid-template-columns:repeat(2,minmax(0,1fr));max-width:860px}
.gg-cards.n3{grid-template-columns:repeat(3,minmax(0,1fr))}
.gg-cards.n4{grid-template-columns:repeat(2,minmax(0,1fr))}
.gg-cards .guide-card{display:flex;flex-direction:column;background:var(--ivory);box-shadow:0 0 0 1px var(--hairline) inset;border-top:3px solid #2E4A3B;padding:26px 24px 24px;text-align:center;text-decoration:none;transition:box-shadow .15s,transform .15s}
.gg-cards .guide-card:hover{box-shadow:0 0 0 1px #2E4A3B inset,0 10px 24px rgba(21,39,29,.10);transform:translateY(-2px)}
.gg-cards .guide-card .label{color:#8B6B3D}
.gg-cards .guide-card h3{margin-top:10px}
.gg-cards .guide-card p{flex:1}
.gg-cards .guide-card .fit-more{margin-top:18px;align-self:center}
@media(max-width:900px){.ctiles.n5,.ctiles.n6,.gg-cards.n3{grid-template-columns:1fr}}
@media(max-width:640px){.gg-cards.n2,.gg-cards.n4{grid-template-columns:1fr}}
.guide-grid.gg-cards{margin-top:34px}
.guide-grid.gg-cards.n3{grid-template-columns:repeat(3,minmax(0,1fr))}
.guide-grid.gg-cards.n2,.guide-grid.gg-cards.n4{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-width:900px){.guide-grid.gg-cards.n3{grid-template-columns:1fr}}
@media(max-width:640px){.guide-grid.gg-cards.n2,.guide-grid.gg-cards.n4{grid-template-columns:1fr}}
#guides .guide-grid.gg-cards.n3{grid-template-columns:repeat(3,minmax(0,1fr))}@media(max-width:900px){#guides .guide-grid.gg-cards.n3{grid-template-columns:1fr}}
/* clubs: even cards — header, facts and link rows line up across all three (subgrid) */
.ccards-c .ccard{display:grid;grid-template-rows:subgrid;grid-row:span 3;row-gap:0}
.ccards-c .ccard-top{height:100%}
.ccards-c .ctable{display:flex;flex-direction:column}
.ccards-c .ctable>div.is-ask{margin-top:auto}
.ccards-c .ccard-link{align-self:end}
@media(max-width:900px){.ccards-c .ccard{grid-row:auto;grid-template-rows:auto}}

/* ============ Property taxes page v2 (Sep 29, 2026): area table, history, bill calendar ============ */
.atable{max-width:1080px;margin:36px auto 0;border-top:1px solid var(--char)}
.atable-h,.atable-r{display:grid;grid-template-columns:1.3fr .8fr 1fr 2fr;gap:18px;align-items:center;padding:14px 4px;border-bottom:1px solid var(--hairline)}
.atable-h span{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft)}
.atable-r:hover{background:var(--ivory)}
.at-nm a{font-size:15.5px;font-weight:700;color:var(--ink);text-decoration:none}
.at-nm a:hover{text-decoration:underline}
.atable small{display:block;margin-top:2px;font-size:12px;color:var(--ink-soft)}
.at-rate b,.at-price b{font-family:var(--data);font-size:22px;font-weight:600;color:var(--ink);font-variant-numeric:lining-nums}
.at-tax{display:grid;grid-template-columns:150px 1fr;gap:12px;align-items:center}
.at-tax b{font-family:var(--data);font-size:22px;font-weight:600;color:var(--ink);white-space:nowrap;font-variant-numeric:lining-nums}
.at-track{position:relative;display:block;height:12px;background:var(--cream)}
.at-fill{position:absolute;left:0;top:0;bottom:0;display:block;background:#2E4A3B}
.at-fill.alt{background:#B8860B}
.at-fill.ext{background:repeating-linear-gradient(135deg,#2E4A3B 0 4px,#8FA597 4px 8px)}
.thist-c{max-width:1000px;margin:34px auto 0;background:var(--ivory);box-shadow:0 0 0 1px var(--hairline) inset;padding:26px 28px 24px}
.thist-cap{margin-top:12px;text-align:center;font-size:12.5px;color:var(--ink-soft)}
.hvals{margin-top:22px;padding-top:18px;border-top:1px solid var(--hairline);text-align:center}
.hvals-row{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin-top:12px}
.hvals-row div{background:var(--cream);padding:12px 8px}
.hvals-row b{display:block;font-family:var(--data);font-size:26px;font-weight:600;color:var(--ink);font-variant-numeric:lining-nums}
.hvals-row span{font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;color:var(--ink-soft)}
.bcal{max-width:1000px;margin:36px auto 0;background:var(--ivory);box-shadow:0 0 0 1px var(--hairline) inset;padding:22px 26px 26px}
.bcal-months,.bcal-row{display:grid;grid-template-columns:140px 1fr;align-items:center}
.bcal-months{grid-template-columns:140px repeat(12,1fr);font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft);padding-bottom:8px;border-bottom:1px solid var(--char)}
.bcal-months span+span{border-left:1px solid var(--hairline);padding-left:6px}
.bcal-row{padding:22px 0 10px;border-bottom:1px solid var(--hairline)}
.bcal-nm b{display:block;font-size:15.5px;color:var(--ink)}
.bcal-nm small{font-size:12px;color:var(--ink-soft)}
.bcal-track{position:relative;height:34px;background:linear-gradient(var(--hairline),var(--hairline)) center/100% 2px no-repeat}
.bcal-pin{position:absolute;top:0;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center}
.bcal-pin i{display:block;width:14px;height:14px;margin-top:10px;border-radius:50%;background:#2E4A3B;box-shadow:0 0 0 3px var(--ivory)}
.bcal-pin em{position:absolute;top:-14px;white-space:nowrap;font-style:normal;font-size:12.5px;font-weight:700;color:var(--ink)}
@media(max-width:900px){
  .atable-h{display:none}
  .atable-r{grid-template-columns:1fr 1fr;row-gap:8px}
  .at-nm,.at-tax{grid-column:1 / -1}
  .hvals-row{grid-template-columns:repeat(3,1fr)}
  .bcal{padding:18px 14px}
  .bcal-months,.bcal-row{grid-template-columns:78px repeat(12,1fr)}
  .bcal-row{grid-template-columns:78px 1fr}
  .bcal-months span{font-size:8px;letter-spacing:0;padding-left:2px!important}
  .bcal-pin em{font-size:11px}
}
.at-tax{grid-template-columns:190px 1fr}
.thist-c .thist-cap{margin-top:40px}
@media(max-width:900px){.atable-r [data-l]::before{content:attr(data-l);display:block;font-family:var(--mono);font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:2px}}

/* ---- numbered steps with county detail (cost sections) ---- */
.csteps{max-width:1080px;margin:36px auto 0}
.csteps-t{text-align:center;font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:#8B6B3D;margin-bottom:16px}
.csteps ol{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;counter-reset:none}
.csteps li{background:var(--ivory);box-shadow:0 0 0 1px var(--hairline) inset;padding:22px 22px 18px;display:flex;flex-direction:column}
.csteps-h{display:flex;gap:14px;align-items:flex-start}
.csteps-h>span{flex:none;display:flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:50%;background:#2E4A3B;color:#fff;font-family:var(--data);font-size:19px;font-weight:600}
.csteps-h b{display:block;font-family:var(--serif);font-size:22px;font-weight:600;line-height:1.2;color:var(--ink)}
.csteps-h p{margin-top:6px;font-size:13.5px;line-height:1.55;color:var(--ink-soft)}
.csteps dl{margin:16px 0 0;border-top:1px solid var(--hairline)}
.csteps dl>div{padding:10px 0;border-bottom:1px solid var(--hairline)}
.csteps dl>div:last-child{border-bottom:none}
.csteps dt{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:#8B6B3D}
.csteps dd{margin:3px 0 0;font-size:14px;line-height:1.5;color:var(--ink)}
@media(max-width:900px){.csteps ol{grid-template-columns:1fr}}
.csteps-h{min-height:34px;align-items:center}.csteps-h div{align-self:center}

/* checklist rows (cost sections) */
.cchecklist{max-width:860px;margin:34px auto 0;border-top:1px solid var(--char);background:var(--ivory);box-shadow:0 0 0 1px var(--hairline) inset}
.cchecklist>div{display:grid;grid-template-columns:230px 1fr;gap:20px;padding:16px 22px;border-bottom:1px solid var(--hairline)}
.cchecklist>div:last-child{border-bottom:none}
.cchecklist dt{font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:#8B6B3D;padding-top:4px}
.cchecklist dd{margin:0}
.cchecklist dd b{display:block;font-family:var(--serif);font-size:20px;font-weight:600;color:var(--ink)}
.cchecklist dd span{display:block;margin-top:4px;font-size:14px;line-height:1.55;color:var(--ink-soft)}
@media(max-width:640px){.cchecklist>div{grid-template-columns:1fr;gap:4px}}

/* barn / reference table (cost sections) */
.btable-wrap{max-width:1140px;margin:34px auto 0;background:var(--ivory);box-shadow:0 0 0 1px var(--hairline) inset;border-top:2px solid var(--char)}
.btable{width:100%;border-collapse:collapse;font-size:14.5px}
.btable thead th{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);font-weight:500;text-align:left;padding:14px 16px;border-bottom:1px solid var(--hairline)}
.btable tbody th{text-align:left;vertical-align:top;padding:16px;border-bottom:1px solid var(--hairline);width:22%}
.btable tbody th a{font-family:var(--serif);font-size:19px;font-weight:600;color:var(--ink);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px;text-decoration-color:var(--hairline)}
.btable tbody th a::after{content:"\2197";font-family:var(--sans);font-size:11px;margin-left:5px;color:var(--ink-soft);vertical-align:3px}
.btable tbody th small{display:block;margin-top:4px;font-size:12.5px;font-weight:400;color:var(--ink-soft)}
.btable td{vertical-align:top;padding:16px;border-bottom:1px solid var(--hairline);line-height:1.55;color:var(--ink)}
.btable tbody tr:last-child th,.btable tbody tr:last-child td{border-bottom:none}
.btable td.bt-price{color:var(--ink-soft);white-space:nowrap}
.btable td.bt-price.has{color:#2E4A3B;font-weight:700;white-space:normal}
@media(max-width:900px){
  .btable thead{display:none}
  .btable tr{display:block;padding:14px 16px;border-bottom:1px solid var(--hairline)}
  .btable tbody th,.btable td{display:block;width:auto;padding:4px 0;border:none}
  .btable td::before{content:attr(data-l);display:block;font-family:var(--mono);font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;color:#8B6B3D}
}

/* ---- Full Cry feature: plain question heading + stat row (Sep 29) ---- */
.fc-top{margin-top:64px}
.fc-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-bottom:1px solid var(--hairline);background:var(--ivory)}
.fc-stats>div{padding:24px 20px;text-align:center;border-left:1px solid var(--hairline)}.fc-stats>div:first-child{border-left:0}
.fc-stats b{display:block;font-family:var(--data);font-size:34px;font-weight:600;color:#2E4A3B;line-height:1}
.fc-stats small{display:block;margin-top:8px;font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft);line-height:1.5}
.fc-top+.sec-answer+.fc{margin-top:30px}
@media(max-width:700px){.fc-stats{grid-template-columns:1fr}.fc-stats>div{border-left:0;border-top:1px solid var(--hairline)}.fc-stats>div:first-child{border-top:0}}

/* ---- Land & Farms: acreage range chart, log scale, hover for median + range (Sep 29) ---- */
.acr{max-width:980px;margin:34px auto 0;background:#fff;border:1px solid var(--hairline);padding:24px 28px 18px}
.acr-cap{text-align:center;font:500 .78rem/1.5 Manrope,sans-serif;color:var(--ink-soft);margin-bottom:18px}
.acr-row{display:grid;grid-template-columns:190px 1fr 74px;gap:16px;align-items:center;padding:9px 0;border-top:1px solid #F1EBDD}
.acr-row:first-of-type{border-top:0}
.acr-l b{display:block;font:600 .9rem/1.25 Manrope,sans-serif;color:var(--ink)}.acr-l small{font:500 .72rem Manrope,sans-serif;color:var(--ink-soft)}
.acr-t{position:relative;height:26px}
.acr-t::before{content:"";position:absolute;left:0;right:0;top:50%;border-top:1px dashed #E3DAC6}
.acr-bar{position:absolute;top:8px;height:10px;background:rgba(46,74,59,.28);border-radius:5px;min-width:6px}
.acr-row.hi .acr-bar{background:rgba(46,74,59,.5)}
.acr-dot{position:absolute;top:4px;width:18px;height:18px;margin-left:-9px;border-radius:50%;background:#2E4A3B;border:3px solid #fff;box-shadow:0 0 0 1px #2E4A3B}
.acr-row.hi .acr-dot{background:#B8860B;box-shadow:0 0 0 1px #B8860B}
.acr-v{text-align:right;font-family:var(--data);font-size:1.25rem;font-weight:600;color:#2E4A3B}.acr-v small{font:500 .7rem Manrope,sans-serif;color:var(--ink-soft)}
.acr-row{position:relative;cursor:pointer;outline:none}
.acr-row:hover,.acr-row:focus{background:#FAF6EC}
.acr-tip{position:absolute;bottom:calc(100% - 4px);transform:translateX(-50%);background:#15271D;color:#fff;padding:9px 13px;font:500 .8rem/1.45 Manrope,sans-serif;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .12s;z-index:5;box-shadow:0 6px 18px rgba(0,0,0,.18);text-align:center}
.acr-tip b{font-family:'Cormorant Garamond',serif;font-size:1.3rem;font-weight:600;color:#E0C890}
.acr-tip::after{content:"";position:absolute;top:100%;left:50%;margin-left:-6px;border:6px solid transparent;border-top-color:#15271D}
.acr-row:hover .acr-tip,.acr-row:focus .acr-tip{opacity:1}
.acr-ax{display:grid;grid-template-columns:190px 1fr 74px;gap:16px;margin-top:4px}
.acr-ax>div{position:relative;height:22px;border-top:1px solid var(--hairline)}
.acr-ax span{position:absolute;top:5px;transform:translateX(-50%);font:500 .7rem Manrope,sans-serif;color:var(--ink-soft)}
.acr-key{display:flex;justify-content:center;gap:22px;margin-top:10px;font:500 .74rem Manrope,sans-serif;color:var(--ink-soft)}
.acr-key i{display:inline-block;vertical-align:middle;margin-right:7px}
.acr-key .k-dot{width:12px;height:12px;border-radius:50%;background:#2E4A3B}.acr-key .k-bar{width:26px;height:8px;border-radius:4px;background:rgba(46,74,59,.28)}
@media(max-width:700px){.acr{padding:18px 14px}.acr-row,.acr-ax{grid-template-columns:104px 1fr 54px;gap:10px}.acr-l b{font-size:.8rem}.acr-v{font-size:1.05rem}}

/* ---- Sep 29: dark-green bars, even guide buttons, even area cards ---- */
.bar-f{background:#2E4A3B}
.tl-dot{border-color:#2E4A3B}
.own-guides a{flex:1 1 0;min-width:200px;max-width:260px;text-align:center;display:flex;align-items:center;justify-content:center}
.own-guides .own-gl{flex-basis:100%;text-align:center}
.lb-areas-grid{grid-template-columns:repeat(2,minmax(0,1fr));max-width:900px;margin-left:auto;margin-right:auto;align-items:stretch}
.lb-areas-grid>*{grid-column:auto}
.lb-areas-grid .hood{height:100%;display:flex;flex-direction:column}
@media(max-width:620px){.lb-areas-grid{grid-template-columns:1fr}}
.acr-ax span{white-space:nowrap}.acr-ax>i{display:block}

/* ---- Land acreage chart v2 (Sep 29): crisp solid dark-green bars + gold median tick, matching the price charts ---- */
.acr{padding:26px 30px 18px}
.acr-row{grid-template-columns:200px 1fr 80px;padding:15px 0;border-top:0;border-bottom:1px solid var(--hairline)}
.acr-row:first-of-type{border-top:1px solid var(--char)}
.acr-l b{font-family:var(--sans);font-size:15px;font-weight:700;line-height:1.15}
.acr-l small{display:block;margin-top:3px;font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase}
.acr-t{height:14px;margin:0 6px}
.acr-t::before{border-top:1px solid var(--hairline)}
.acr-bar,.acr-row.hi .acr-bar{top:0;height:14px;background:#2E4A3B;border-radius:1px;min-width:4px}
.acr-row:hover .acr-bar,.acr-row:focus .acr-bar{background:#1D3328}
.acr-med{position:absolute;top:-5px;bottom:-5px;width:3px;margin-left:-1.5px;background:#C9A24A}
.acr-tip{bottom:calc(100% + 10px)}
.acr-row:hover,.acr-row:focus{background:#FAF6EC}
.acr-v{font-size:19px;color:var(--ink);font-variant-numeric:tabular-nums lining-nums;font-feature-settings:'lnum' 1,'tnum' 1}
.acr-v small{font-family:var(--mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase}
.acr-ax{grid-template-columns:200px 1fr 80px}.acr-ax>div{border-top:0;margin:0 6px}
.acr-ax span{font-family:var(--mono);font-size:10.5px}
.acr-key .k-bar{width:26px;height:10px;border-radius:1px;background:#2E4A3B}
.acr-key .k-med{width:3px;height:16px;background:#C9A24A}
@media(max-width:700px){.acr-row,.acr-ax{grid-template-columns:104px 1fr 56px}}
/* Sep 29: hole numbers sat low in their circles (old-style numerals) — lining figures, true centering */
.fc-no{display:flex!important;align-items:center;justify-content:center;line-height:1!important;padding:0!important;font-variant-numeric:lining-nums;font-feature-settings:'lnum' 1}
/* Sep 29: centered source line under the buyer-agent note */
.buynote .src,.buynote .sources,.buynote p[class*=src]{text-align:center;margin-left:auto;margin-right:auto}

/* ---- per-county school paths (Louisa & Fluvanna page, Sep 29) ---- */
.sp-rows{max-width:1040px;margin:10px auto 30px;border-top:1px solid var(--hairline)}
.sp-row{display:grid;grid-template-columns:190px 1fr;gap:24px;align-items:center;padding:26px 0;border-bottom:1px solid var(--hairline)}
.sp-county .label{display:block;color:#2E4A3B}
.sp-county small{display:block;margin-top:6px;font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft)}
.sp-steps{list-style:none;margin:0;padding:0;display:flex;align-items:stretch;gap:0}
.sp-steps li{position:relative;flex:1 1 0;background:#fff;border:1px solid var(--hairline);padding:16px 14px;text-align:center;display:flex;flex-direction:column;justify-content:center;margin-right:28px}
.sp-steps li:last-child{margin-right:0}
.sp-steps li:not(:last-child)::after{content:"→";position:absolute;right:-22px;top:50%;transform:translateY(-50%);color:#B8860B;font-size:18px}
.sp-steps small{font-family:var(--mono);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft)}
.sp-steps b{display:block;margin-top:6px;font-family:var(--sans);font-size:16px;font-weight:700;line-height:1.25;color:var(--ink)}
.sp-steps em{display:block;margin-top:4px;font-style:normal;font-size:12px;color:var(--ink-soft)}
@media(max-width:820px){.sp-row{grid-template-columns:1fr;gap:12px;text-align:center}.sp-steps{flex-direction:column}.sp-steps li{margin:0 0 26px}.sp-steps li:last-child{margin-bottom:0}.sp-steps li:not(:last-child)::after{content:"↓";right:auto;left:50%;top:auto;bottom:-24px;transform:translateX(-50%)}}

/* Sep 29: plain own-cards (no tag/stat) */
.own-plain h3{margin-bottom:12px}

/* ---- local providers per quoted job (horse farm costs, Sep 29) ---- */
.cprov{max-width:1080px;margin:44px auto 0}
.cprov-t{text-align:center;font-family:var(--serif);font-size:28px;font-weight:600;color:var(--ink);margin-bottom:22px}
.cprov-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:18px}
.cprov-g{background:#fff;border:1px solid var(--hairline);border-top:3px solid #2E4A3B;padding:20px 22px}
.cprov-g .label{display:block;color:#8B6B3D;margin-bottom:10px}
.cprov-g ul{list-style:none;margin:0;padding:0}
.cprov-g li{padding:9px 0;border-top:1px solid #F1EBDD}.cprov-g li:first-child{border-top:0;padding-top:0}
.cprov-g a{font-family:var(--sans);font-weight:700;font-size:15px;color:#2E4A3B;text-decoration:none}
.cprov-g a:hover{text-decoration:underline}.cprov-g a span{font-size:12px;color:#B8860B}
.cprov-g small{display:block;margin-top:2px;font-size:12.5px;line-height:1.45;color:var(--ink-soft)}
.cprov-note{max-width:760px;margin:18px auto 0;text-align:center;font-size:12.5px;font-style:italic;color:var(--ink-soft)}
.cprov-grid{display:flex;flex-wrap:wrap;justify-content:center}.cprov-g{flex:0 1 calc((100% - 36px)/3);min-width:280px}
@media(max-width:900px){.cprov-g{flex-basis:100%}}

/* ---- quoted job cards: price + who can quote (horse farm costs, Sep 29 v2) ---- */
.cjobs{max-width:1100px;margin:36px auto 0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.cjob{background:#fff;border:1px solid var(--hairline);display:flex;flex-direction:column}
.cjob-h{position:relative;background:linear-gradient(160deg,#2E4A3B 0%,#1D3328 75%);padding:22px 22px 20px;text-align:center}
.cjob-h::before{content:"";position:absolute;inset:6px;border:1px solid rgba(201,176,122,.4);pointer-events:none}
.cjob-h .label{display:block;color:#E0C890;margin-bottom:8px}
.cjob-h b{display:block;font-family:var(--serif);font-size:24px;font-weight:600;color:#fff;line-height:1.15}
.cjob-b{padding:18px 22px 20px;flex:1}
.cjob-b>p{font-size:14px;line-height:1.55;color:var(--ink-soft);margin-bottom:12px;text-align:center}
.cjob-who{display:block;font-family:var(--mono);font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;color:#8B6B3D;margin-bottom:8px}
.cjob-b ul{list-style:none;margin:0;padding:0}
.cjob-b li{padding:8px 0;border-top:1px solid #F1EBDD}
.cjob-b a{font-family:var(--sans);font-weight:700;font-size:14.5px;color:#2E4A3B;text-decoration:none}.cjob-b a:hover{text-decoration:underline}
.cjob-b a span{font-size:11px;color:#B8860B}
.cjob-b small{display:block;margin-top:2px;font-size:12px;line-height:1.45;color:var(--ink-soft)}
@media(max-width:960px){.cjobs{grid-template-columns:1fr 1fr}}@media(max-width:620px){.cjobs{grid-template-columns:1fr}}
/* Sep 29: compare hero buttons — centered, equal width, centered text */
.vs-hero .hero-ctas{display:flex;justify-content:center;flex-wrap:wrap;gap:16px}
.vs-hero .hero-ctas .btn{flex:0 0 400px;max-width:100%;display:inline-flex;justify-content:center;text-align:center}
/* Sep 29: centered tile text; 5 tiles = 3 + 2, centered */
.ctile{text-align:center}
.ctiles.n5{display:flex;flex-wrap:wrap;justify-content:center}
.ctiles.n5>.ctile{flex:0 1 calc((100% - 44px)/3)}
@media(max-width:900px){.ctiles.n5>.ctile{flex-basis:100%}}
.ctiles.n0{display:none}
.ctiles.n6{grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:900px){.ctiles.n6{grid-template-columns:1fr}}

/* ==== Stat bars: Option A "Gold Rule" (Alex 29 Sep: every stat bar sitewide) ====
   gold top rule, gold dividers, charcoal figures, brass mono labels. NETWORK: shared. */
.statsbar5{background:var(--cream);border-top:2px solid #B8860B;border-bottom:1px solid var(--hairline)}
.stats5 .st{padding:38px 24px 30px;border-right:1px solid #E3D4AE}
.stats5 .st b{font-size:clamp(34px,4vw,58px);color:var(--char);font-variant-numeric:lining-nums tabular-nums}
.stats5 .st span{margin-top:12px;font-size:11px;font-weight:600;letter-spacing:.18em;color:#8B6B3D}
.stats5-meta{padding:14px 0 18px;border-top:1px solid #E3D4AE;font-size:10.5px;letter-spacing:.12em;text-transform:uppercase}
.stats5-meta a{color:var(--char)}
@media(max-width:860px){.stats5 .st{padding:24px 14px 20px;border-bottom:1px solid #E3D4AE}}
/* the smaller in-section stat rows get the same treatment */
.sc-stats,.hx-row,.fc-stats{background:var(--cream);border-top:2px solid #B8860B;border-bottom:1px solid var(--hairline)}
.sc-stats>div+div,.hx-s+.hx-s,.fc-stats>div{border-left-color:#E3D4AE}
.sc-stats b,.hx-n,.fc-stats b{color:var(--char);font-variant-numeric:lining-nums;font-feature-settings:'lnum' 1}
.sc-stats small,.hx-l,.fc-stats small{font-family:var(--mono);font-size:10.5px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:#8B6B3D}
/* Sep 29 v2: stat bars a size smaller; figures never wrap ("36 of 41" on one line) */
.stats5 .st b{font-size:clamp(28px,3.1vw,44px);white-space:nowrap}
.stats5 .st{padding:32px 18px 26px}
.stats5 .st span{font-size:10.5px;letter-spacing:.16em}

/* ---- Keswick Life listing cards (food & drink, things to do; Sep 29). Crozet's td-* cards, sharpened ---- */
.lb-listing .td-tier{max-width:1180px;margin:48px auto 26px}
.lb-listing .td-tier h3{color:#8B6B3D;font-weight:600}
.lb-listing .td-tier .rule{border-top-color:#B8860B}
.ls-grid{max-width:1180px;margin:0 auto}
.ls-card{background:#fff;border:1px solid var(--hairline);border-top:3px solid #2E4A3B;padding:0 24px 22px}
.ls-card .td-cap{border-top:0;margin-top:0;padding-top:22px;display:flex;flex-direction:column;height:100%}
.ls-card h3 a{color:var(--ink);text-decoration:none}.ls-card h3 a:hover{color:#2E4A3B;text-decoration:underline}
.ls-card .td-addr{color:#8B6B3D}
.ls-card .td-note{border-left-color:#B8860B}
.ls-go{margin-top:auto;padding-top:14px;font-family:var(--sans);font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#2E4A3B;text-decoration:none}
.ls-go span{color:#B8860B}.ls-go:hover{text-decoration:underline}
.ls-drop{max-width:1180px;margin:30px auto 0}
.ls-drop summary{color:#2E4A3B}
.ls-drop .td-table a{color:#2E4A3B;font-weight:700}
.ls-foot{max-width:780px;margin:30px auto 0;text-align:center;font-size:15px;line-height:1.6;color:var(--ink)}
/* Sep 29: compact life tiles (5 on a path page) — 3 + 2, centered */
.lt-compact{display:flex;flex-wrap:wrap;justify-content:center}
.lt-compact .lt{flex:0 1 calc((100% - 44px)/3)}
@media(max-width:860px){.lt-compact .lt{flex-basis:calc((100% - 22px)/2)}}
@media(max-width:560px){.lt-compact .lt{flex-basis:100%}}
.ls-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:26px}
.ls-grid>.ls-card{flex:0 1 calc((100% - 52px)/3)}
@media(max-width:900px){.ls-grid>.ls-card{flex-basis:calc((100% - 26px)/2)}}
@media(max-width:580px){.ls-grid>.ls-card{flex-basis:100%}}
.ls-badge{align-self:flex-start;margin-bottom:12px;padding:5px 10px;background:#FBF3DF;border:1px solid #D9BE7A;font-family:var(--mono);font-size:10px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:#7A5A12}

/* Sep 29: "Other reasons people choose Keswick" on path pages = plain links, not picture tiles */
.lt-links{display:flex;flex-wrap:wrap;justify-content:center;gap:12px 34px;margin-top:6px}
.lt-links a{font-family:var(--sans);font-size:15px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#2E4A3B;text-decoration:none;padding-bottom:4px;border-bottom:1px solid #D9BE7A}
.lt-links a span{color:#B8860B}.lt-links a:hover{border-bottom-color:#2E4A3B}

/* Sep 29: Sell a Home = outlined gold button stacked under the gold Homes for Sale button */
.bar-ctas{display:flex;flex-direction:column;align-items:stretch;gap:8px}
.bar-cta,.bar-cta2{text-align:center}
.bar-cta2{font:600 11.5px/1 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:#fff;background:transparent;border:1px solid var(--gold);text-decoration:none;padding:11px 20px;white-space:nowrap;transition:background .2s,color .2s}
.bar-cta2:hover,.bar-cta2[aria-current="page"]{background:rgba(184,134,11,.18);color:var(--gold-pale,#E0C890)}
@media(max-width:1180px){.bar-cta2{padding:10px 14px;font-size:10.5px}}
@media(max-width:940px){.bar-ctas{display:none}}
@media(min-width:1500px){.bar-cta2{font-size:12.5px;padding:12px 24px}}
/* Sep 29: Homes for Sale and Sell a Home exactly the same size (same box, same border, same padding at every width) */
.bar-cta,.bar-cta2{box-sizing:border-box;border:1px solid var(--gold);padding:13px 20px;font-size:11.5px;line-height:1}
@media(min-width:941px) and (max-width:1199px){.bar-cta,.bar-cta2{padding:11px 14px;font-size:10.5px}}
@media(min-width:1500px){.bar-cta,.bar-cta2{padding:15px 24px;font-size:12.5px}}

/* ---- About page (Sep 29) ---- */
.ab-stats{margin:34px 0 0}
.ab-bio{max-width:760px;margin:40px auto 0;text-align:center}
.ab-bio p{font-size:16.5px;line-height:1.7;color:var(--ink);margin-top:14px}
.ab-sub{text-align:center;font-family:var(--serif);font-size:30px;font-weight:600;margin:56px 0 26px}
.ab-time{max-width:1100px;margin:0 auto 26px}
.ab-lux{background:var(--cream);border-top:1px solid var(--hairline);border-bottom:1px solid var(--hairline)}
.ab-pillars{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;max-width:1080px;margin:36px auto 0}
.ab-pillar{background:#fff;border:1px solid var(--hairline);border-top:3px solid #2E4A3B;padding:26px 24px;text-align:center}
.ab-n{display:block;font-family:var(--mono);font-size:11px;letter-spacing:.18em;color:#B8860B;margin-bottom:10px}
.ab-pillar h3{font-size:24px;margin-bottom:10px}
.ab-pillar p{font-size:14.5px;line-height:1.6;color:var(--ink-soft)}
.ab-lux .cmp-note{text-align:center;margin-top:14px}
.ab-team{list-style:none;margin:0 auto;padding:0;max-width:1080px;display:flex;flex-wrap:wrap;justify-content:center;gap:14px}
.ab-team li{flex:0 1 calc((100% - 42px)/4);background:#fff;border:1px solid var(--hairline);padding:16px 12px;text-align:center}
.ab-team b{display:block;font-family:var(--serif);font-size:20px;font-weight:600;color:var(--ink)}
.ab-team small{display:block;margin-top:4px;font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:#8B6B3D}
.ab-office{max-width:640px;margin:36px auto 0;text-align:center;display:flex;flex-direction:column;align-items:center;gap:8px}
.ab-office p{font-size:16px;color:var(--ink)}
.ab-office a{font-family:var(--sans);font-weight:700;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:#2E4A3B;text-decoration:none;border-bottom:1px solid #D9BE7A}
.ab-tms{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;max-width:1080px;margin:36px auto 0}
.ab-tm{margin:0;background:#fff;border:1px solid var(--hairline);border-top:3px solid #B8860B;padding:28px 30px;display:flex;flex-direction:column}
.ab-stars{color:#B8860B;letter-spacing:.2em;font-size:15px}
.ab-tm blockquote{margin:14px 0 18px;font-family:var(--serif);font-size:21px;line-height:1.45;color:var(--ink);flex:1}
.ab-tm figcaption b{display:block;font-family:var(--sans);font-size:15px}
.ab-tm figcaption small{font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:#8B6B3D}
@media(max-width:900px){.ab-pillars,.ab-tms{grid-template-columns:1fr}.ab-team li{flex-basis:calc((100% - 14px)/2)}}
.ab-time{grid-template-columns:repeat(6,1fr)}
#gary .src-center,#town-lux .src-center,#reviews .src-center,#who .src-center{margin-top:28px}
@media(max-width:860px){.ab-time{grid-template-columns:1fr}}

/* ==== About page (Sep 29 v2): warm, personal, deliberately unlike the data pages. .abx-* only ==== */
.abx{background:#F7F2E8;color:#2B2520}
.abx-wrap{max-width:1120px;margin:0 auto;padding:0 28px}
.abx-narrow{max-width:720px;text-align:center}
.abx h1,.abx h2{font-family:var(--serif);font-weight:500;letter-spacing:0;color:#2B2520}
/* 1. intro: dark band behind the header, portrait straddling into the cream */
.abx-intro{background:linear-gradient(180deg,#1D3328 0,#1D3328 210px,#F7F2E8 210px);padding:150px 0 90px}
.abx-intro-grid{display:grid;grid-template-columns:380px 1fr;gap:72px;align-items:start}
.abx-portrait{position:relative}
.abx-photo{aspect-ratio:4/5;background:linear-gradient(160deg,#C9B48A 0%,#8B6B3D 100%);border:10px solid #fff;box-shadow:0 18px 40px rgba(43,37,32,.18);display:flex;align-items:center;justify-content:center;transform:rotate(-1.5deg)}
.abx-photo span{font-family:var(--serif);font-size:96px;font-style:italic;color:rgba(255,255,255,.85)}
.abx-sign{margin-top:22px;text-align:center;font-family:var(--serif);font-style:italic;font-size:30px;color:#8B6B3D}
.abx-words{padding-top:88px}
.abx-kicker{display:inline-block;font-family:var(--serif);font-style:italic;font-size:20px;color:#8B6B3D;margin-bottom:6px}
.abx-words h1{font-size:clamp(46px,6vw,76px);line-height:1.02;margin-bottom:12px}
.abx-role{font-family:var(--sans);font-size:13px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:#6B5A3E;padding-bottom:22px;margin-bottom:26px;border-bottom:1px solid #DCCFB4}
.abx-words p:not(.abx-role){font-family:var(--serif);font-size:22px;line-height:1.6;color:#3A322B;margin-bottom:18px}
/* 2. quote */
.abx-quote{background:#1D3328;padding:96px 0;text-align:center;color:#F3EAD6}
.abx-mark{display:block;font-family:var(--serif);font-size:120px;line-height:.6;color:#B8860B}
.abx-quote blockquote{max-width:860px;margin:18px auto 0;font-family:var(--serif);font-style:italic;font-size:clamp(26px,3vw,36px);line-height:1.4;color:#F3EAD6}
.abx-by{margin-top:22px;font-family:var(--sans);font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:#C9B48A}
/* 3. Town Lux */
.abx-lux{padding:96px 0 80px}
.abx-lux h2,.abx-kind h2,.abx-hello h2{font-size:clamp(34px,4vw,48px);margin-bottom:18px}
.abx-lux p{font-family:var(--serif);font-size:21px;line-height:1.6;color:#3A322B}
.abx-values{list-style:none;padding:0;margin:28px 0 30px;display:flex;justify-content:center;flex-wrap:wrap;gap:10px 34px}
.abx-values li{font-family:var(--serif);font-style:italic;font-size:21px;color:#8B6B3D}
.abx-values li+li::before{content:"·";margin-right:34px;color:#C9B48A;font-style:normal}
.abx-link{font-family:var(--sans);font-size:13px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#1D3328;text-decoration:none;border-bottom:1px solid #B8860B;padding-bottom:3px}
/* 4. kind words: handwritten-note feel */
.abx-kind{padding:40px 0 96px;text-align:center}
.abx-notes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:30px;margin-top:40px;text-align:left}
.abx-note{margin:0;background:#FFFDF8;padding:34px 36px 28px;box-shadow:0 10px 26px rgba(43,37,32,.08);border-radius:2px}
.abx-note:nth-child(odd){transform:rotate(-.6deg)}.abx-note:nth-child(even){transform:rotate(.5deg)}
.abx-note blockquote{margin:0 0 20px;font-family:var(--serif);font-size:20px;line-height:1.55;color:#3A322B}
.abx-note figcaption{font-family:var(--serif);font-style:italic;font-size:22px;color:#8B6B3D}
.abx-note figcaption span{display:block;font-family:var(--sans);font-style:normal;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:#9A8B73;margin-top:2px}
.abx-from{margin-top:34px;font-family:var(--serif);font-style:italic;font-size:17px;color:#6B5A3E}
.abx-from a{color:#6B5A3E}
/* 5. hello */
.abx-hello{padding:88px 0 110px;background:#EFE6D4;border-top:1px solid #DCCFB4}
.abx-hello p{font-family:var(--serif);font-size:21px;line-height:1.6;color:#3A322B}
.abx-hello address{margin:26px 0 30px;font-style:normal;font-family:var(--serif);font-size:22px;line-height:1.5;color:#2B2520}
.abx-call{display:inline-block;background:#1D3328;color:#F3EAD6;text-decoration:none;font-family:var(--sans);font-size:13px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;padding:16px 30px;border:1px solid #B8860B}
.abx-call:hover{background:#2E4A3B}
@media(max-width:900px){
  .abx-intro{background:linear-gradient(180deg,#1D3328 0,#1D3328 150px,#F7F2E8 150px);padding-top:110px}
  .abx-intro-grid{grid-template-columns:1fr;gap:28px}.abx-portrait{max-width:300px;margin:0 auto}.abx-words{padding-top:0;text-align:center}
  .abx-notes{grid-template-columns:1fr}.abx-note{transform:none!important}
  .abx-values li+li::before{display:none}
}
/* Sep 29 v3: smaller, straight portrait (and straight review cards) */
.abx-intro-grid{grid-template-columns:280px 1fr;gap:64px;align-items:center}
.abx-photo{transform:none;border-width:8px;box-shadow:0 12px 28px rgba(43,37,32,.14)}
.abx-photo span{font-size:72px}
.abx-sign{font-size:24px;margin-top:16px}
.abx-words{padding-top:64px}
.abx-note:nth-child(odd),.abx-note:nth-child(even){transform:none}
@media(max-width:900px){.abx-portrait{max-width:220px}}
.abx-words p.abx-lede{font-family:var(--serif);font-style:italic;font-size:24px;line-height:1.5;color:#1D3328;padding:4px 0 4px 22px;border-left:3px solid #B8860B;margin:0 0 26px}
.abx-lede a{color:#1D3328;text-decoration:none;border-bottom:1px solid #B8860B}

/* ==== About v4 (Sep 29): "Meet Gary Palmer", option C — two quiet columns. .ab3-* only ==== */
.ab3{background:#FBF9F5;padding:190px 24px 110px}
.ab3-grid{max-width:1080px;margin:0 auto;display:grid;grid-template-columns:260px 1fr;gap:64px;align-items:start}
.ab3-photo{display:block;width:100%;height:auto;aspect-ratio:1/1;object-fit:cover;object-position:center top;background:#D9D2C4}
.ab3-contact{margin-top:22px;font:400 15px/1.7 var(--sans);color:#3A342E}
.ab3-contact a{color:#1D3328;font-weight:700;text-decoration:none;border-bottom:1px solid #B8860B}
.ab3-main h1{font:500 52px/1.05 var(--serif);color:#26221E}
.ab3-role{font:500 15px var(--sans);color:#6B645E;margin-top:8px}
.ab3-t{font:400 17px/1.75 var(--sans);color:#3A342E;margin-top:16px}
.ab3-q{margin:30px 0;font:italic 500 24px/1.45 var(--serif);color:#1D3328}
.ab3-rv{margin-top:20px;padding-top:20px;border-top:1px solid #E4DED3}
.ab3-rv p{font:400 16px/1.7 var(--sans);color:#3A342E}
.ab3-rv small{display:block;margin-top:6px;font:500 13px var(--sans);color:#6B645E}
.ab3-from{margin-top:26px;font:400 13px var(--sans);color:#6B645E}
.ab3-from a{color:#6B645E}
@media(max-width:800px){.ab3{padding:130px 20px 80px}.ab3-grid{grid-template-columns:1fr;gap:28px}.ab3-side{max-width:240px}}
/* the header is see-through over photo heroes; the About page has none, so give it solid green */
body:has(.ab3) header{background:#1D3328}
/* About v5 (Sep 29): crisper — white page, cream side panel with a framed photo, gold rule under the title, gold-edged reviews */
.ab3{background:#fff;padding:180px 24px 110px}
.ab3-side{background:#F4EFE6;border-top:3px solid #2E4A3B;padding:18px 18px 24px}
.ab3-photo{border:1px solid #D9BE7A;outline:6px solid #fff;outline-offset:-7px}
.ab3-contact{margin-top:20px;padding-top:18px;border-top:1px solid #DCCFB4}
.ab3-role{padding-bottom:22px;border-bottom:2px solid #B8860B;display:inline-block}
.ab3-main h1{font-size:56px}
.ab3-t{margin-top:18px}
.ab3-rv{border-top:0;padding:18px 0 18px 22px;border-left:2px solid #B8860B;margin-top:24px}
.ab3-main .ab3-t:last-of-type{margin-bottom:34px}
/* About v6: no box around the photo + contact */
.ab3-side{background:none;border-top:0;padding:0}
.ab3-photo{border:0;outline:0}
.ab3-contact{border-top:0;padding-top:0}
.ab3-role a{color:#1D3328;font-weight:600;text-decoration:none;border-bottom:1px solid #B8860B}.ab3-role a:hover{color:#B8860B}

/* Sep 29: dropdowns = hub link first, in gold; a subtle line above a second group (sepAbove) */
@media(min-width:941px){
  .bar-hdr .nav-links .subnav li:first-child{order:0;margin:0;border-top:0}
  .bar-hdr .nav-links .subnav li:first-child a{padding:12px 26px;font-family:var(--sans);font-size:12px;font-weight:700;letter-spacing:.14em;color:#D2B784}
  .bar-hdr .nav-links .subnav li:first-child a:hover{color:#fff}
  .bar-hdr .nav-links .subnav li:nth-child(2){padding-top:0}
  .bar-hdr .nav-links .subnav li.sub-sep{margin-top:8px;padding-top:8px;position:relative}
  .bar-hdr .nav-links .subnav li.sub-sep::before{content:"";position:absolute;top:0;left:26px;right:26px;height:1px;background:rgba(210,183,132,.3)}
  .bar-hdr .nav-links .subnav li:last-child{padding-bottom:14px}
}
/* Sep 29: perfectly even dropdown rhythm — every row the same height, the divider sits in the normal gap
   (adds no space), and equal breathing room above the first row and below the last */
@media(min-width:941px){
  .bar-hdr .nav-links .subnav li,
  .bar-hdr .nav-links .subnav li:first-child,
  .bar-hdr .nav-links .subnav li:nth-child(2),
  .bar-hdr .nav-links .subnav li:last-child,
  .bar-hdr .nav-links .subnav li.sub-sep{margin:0;padding:0}
  .bar-hdr .nav-links .subnav li > a,
  .bar-hdr .nav-links .subnav li:first-child > a{padding:12px 26px;line-height:1.3}
  .bar-hdr .nav-links .subnav li:first-child{padding-top:8px}
  .bar-hdr .nav-links .subnav li:last-child{padding-bottom:8px}
  .bar-hdr .nav-links .subnav li.sub-sep::before{top:0}
}
@media(min-width:941px){.bar-hdr .nav-links .subnav{min-width:max-content}.bar-hdr .nav-links .subnav li > a{white-space:nowrap}}
.eq-ev b a{color:inherit;text-decoration:none;border-bottom:1px solid #D9BE7A}.eq-ev b a:hover{color:#2E4A3B}
/* Sep 29: Keswick Life hub "What is life in Keswick like?" on a light background (home keeps the dark one) */
.lifecal-light{background:#FBF9F5;color:var(--ink);border-top:1px solid var(--hairline);border-bottom:1px solid var(--hairline)}
.lifecal-light .label{color:#8B6B3D}
.lifecal-light h2{color:var(--ink)}
.lifecal-light .lifecal-answer{color:#3A342E;border-top-color:#D9BE7A}
.lifecal-light .lifecal-list{border-top-color:var(--hairline)}
.lifecal-light .lc-row{border-bottom-color:var(--hairline)}
.lifecal-light .lc-when{color:#8B6B3D}
.lifecal-light .lc-body h3{color:var(--ink)}
.lifecal-light .lc-body p{color:#4A433C}
.lifecal-light .lifecal-note,.lifecal-light .lifecal-note a{color:var(--ink-soft)}

/* ==== "Contact us" floating button + panel, every page (Sep 29) ==== */
.cfab{position:fixed;right:24px;bottom:24px;z-index:70;font-family:var(--sans)}
.cfab-btn{display:flex;align-items:center;gap:10px;background:#1D3328;color:#fff;border:1px solid #B8860B;padding:14px 20px;font:700 12px var(--sans);letter-spacing:.12em;text-transform:uppercase;cursor:pointer;box-shadow:0 8px 24px rgba(0,0,0,.18);transition:background .2s}
.cfab-btn:hover{background:#2E4A3B}
.cfab-btn svg{width:16px;height:16px;color:#E0C890}
.cfab-panel{position:absolute;right:0;bottom:62px;width:340px;background:#fff;border-top:3px solid #B8860B;box-shadow:0 18px 44px rgba(0,0,0,.22);padding:24px 24px 18px}
.cfab-panel[hidden]{display:none}
.cfab-x{position:absolute;top:10px;right:12px;background:none;border:0;font-size:22px;line-height:1;color:#999;cursor:pointer}
.cfab-t{font:500 26px var(--serif);color:var(--ink)}
.cfab-s{font-size:13px;color:var(--ink-soft);margin:4px 0 6px}
.cfab form label{display:block;margin-top:12px;margin-bottom:5px;font:600 11px var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft)}
.cfab form label small{text-transform:none;letter-spacing:0;font-weight:500}
.cfab form input,.cfab form textarea{width:100%;border:1px solid #D8D1C4;padding:10px 12px;font:400 15px var(--sans);background:#fff;border-radius:0}
.cfab form textarea{resize:none}
.cfab-send{margin-top:16px;width:100%;background:#1D3328;color:#fff;border:0;padding:13px;font:700 12px var(--sans);letter-spacing:.12em;text-transform:uppercase;cursor:pointer}
.cfab-send:hover{background:#2E4A3B}
.cfab-alt{margin-top:12px;font-size:13px;color:var(--ink-soft);text-align:center}
.cfab-alt a{color:#1D3328;font-weight:700}
@media(max-width:600px){.cfab{right:14px;bottom:14px}.cfab-btn{padding:12px 16px}.cfab-panel{position:fixed;left:12px;right:12px;bottom:74px;width:auto;max-height:calc(100vh - 110px);overflow:auto}}
/* Sep 29: quieter "Contact us" button — smaller, light, thin border, soft shadow */
.cfab{right:20px;bottom:20px}
.cfab-btn{gap:7px;background:rgba(255,255,255,.94);color:#1D3328;border:1px solid #D9CFBC;padding:9px 14px;font-size:10.5px;letter-spacing:.12em;box-shadow:0 3px 10px rgba(0,0,0,.08)}
.cfab-btn:hover{background:#fff;border-color:#B8860B}
.cfab-btn svg{width:13px;height:13px;color:#B8860B}
.cfab-panel{bottom:48px}
@media(max-width:600px){.cfab{right:12px;bottom:12px}.cfab-btn{padding:8px 12px}.cfab-panel{bottom:60px}}
/* Sep 29: small Contact us button back on dark green (keeps the smaller size) */
.cfab-btn{background:#1D3328;color:#fff;border-color:rgba(184,134,11,.55)}
.cfab-btn:hover{background:#2E4A3B;border-color:#B8860B}
.cfab-btn svg{color:#E0C890}
/* Launch check (Sep 29): phone fixes — long listing tier labels wrap; screen-reader tables never widen the page */
@media(max-width:700px){
  .lb-listing .td-tier{flex-wrap:wrap;gap:6px 12px}
  .lb-listing .td-tier h3{white-space:normal;line-height:1.5}
  .lb-listing .td-tier .rule{display:none}
}
table.sr-only{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;white-space:nowrap}
table.sr-only{display:block!important;max-width:1px!important;max-height:1px!important}