/* nestabode family tools — shared kit stylesheet (BUILD 135)
   Site chrome + brand tokens + app components carried from /family-parks/ (BUILD 131):
   self-hosted fonts · nb-2026 tokens/chrome · nav submenus · controls/map/list/panel · near-me strip · area index + hub pages.
   Page skeleton: head → this file → header.nav → kit components → footer.footer → nav behaviour script → family-kit.js */

/* ---- self-hosted fonts (as /family-parks/ #nb-fonts) ---- */
@font-face{font-family:'Inter';font-style:normal;font-weight:300 700;font-display:swap;src:url(/assets/fonts/inter-latin-var.woff2?v=fnt-20260903) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:'Cormorant Garamond';font-style:normal;font-weight:300 600;font-display:swap;src:url(/assets/fonts/cormorant-latin-var.woff2?v=fnt-20260903) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:'Cormorant Garamond';font-style:italic;font-weight:400 600;font-display:swap;src:url(/assets/fonts/cormorant-italic-latin-var.woff2?v=fnt-20260903) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

/* ============================================================
   nestabode v2 brand tokens — ground-truth from nb-2026.css
   ============================================================ */
:root{
  /* palette */
  --navy:#0F1A3D;
  --navy-2:#16234D;
  --cotton:#F4F1EA;
  --linen:#E0D2B8;
  --brass:#A8482A;
  --brass-ink:#8B4513;
  --soft-brass:#D4A878;
  --rule:rgba(15,26,61,.12);
  --rule-strong:rgba(15,26,61,.22);
  --ink:#0F1A3D;
  --muted:rgba(15,26,61,.72);
  --muted-2:rgba(15,26,61,.66);  /* darkened from .55 → ~5.5:1 on cotton (WCAG AA) */
  --page-bg:#F4F1EA;
  --on-dark:#F4F1EA;
  --on-dark-muted:rgba(244,241,234,.70);
  /* illustrated-scene palette (muted / editorial, brand-harmonized) */
  --grass:#C9D6B5;
  --grass-2:#BCCBA4;
  --path:#E0D2B8;
  --wood:#D4A878;
  --water:#AEC9D6;
  --water-deep:#94B6C6;
  --tree:#8AA06F;
  --tree-2:#6E8A57;
  --scene-ground:#EDE7D8;
  /* type */
  --display:"Cormorant Garamond", Georgia, serif;
  --body:Inter, system-ui, -apple-system, sans-serif;
  /* type scale */
  --h1:clamp(3.2rem,7vw,7rem);
  --h2:clamp(2.4rem,4.4vw,3.9rem);
  --h3:clamp(1.4rem,2.2vw,2rem);
  --eyebrow:11px;
  --gut:clamp(1.25rem,3vw,2.25rem);
  --bay:clamp(3rem,5.5vw,6rem);
  /* easing */
  --ease:cubic-bezier(.16,1,.3,1);
  --ease-soft:cubic-bezier(.22,.61,.36,1);
  --maxw:1280px;
}
*{box-sizing:border-box;}
html{ -webkit-text-size-adjust:100%; }
body{
  margin:0;
  background:var(--page-bg);
  color:var(--ink);
  font-family:var(--body);
  font-size:16px;
  line-height:1.6;
  letter-spacing:.1px;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  /* subtle paper grain */
  background-image:
    radial-gradient(rgba(15,26,61,.018) 1px, transparent 1px),
    radial-gradient(rgba(15,26,61,.014) 1px, transparent 1px);
  background-size:3px 3px, 7px 7px;
  background-position:0 0, 2px 3px;
  overflow-x:hidden;
}
img,svg{ max-width:100%; }
a{ color:var(--ink); text-decoration:none; }
button{ font-family:inherit; cursor:pointer; }
/* visually hidden but accessible */
.sr-only{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0;
}
:focus-visible{ outline:2px solid var(--brass); outline-offset:2px; }
/* ---------- eyebrow / label primitives ---------- */
.eyebrow{
  font-family:var(--body);
  font-weight:600;
  text-transform:uppercase;
  font-size:var(--eyebrow);
  letter-spacing:1.6px;
  color:var(--muted);
}
.eyebrow.brass{ color:var(--brass); }
em, .accent{ color:var(--brass); font-style:italic; }
/* =========================================================
   Standard nestabode site chrome — header / nav
   (grafted verbatim from nb-2026.css for site-wide parity)
   ========================================================= */
.container{max-width:1280px;margin:0 auto;padding:0 clamp(20px,4vw,48px)}
/* film-grain overlay */
.grain{position:fixed;inset:-100%;z-index:9997;pointer-events:none;opacity:.04;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(/%23n)'/%3E%3C/svg%3E");
  animation:grain 1.2s steps(4) infinite}
@keyframes grain{0%{transform:translate(0,0)}25%{transform:translate(-3%,2%)}50%{transform:translate(2%,-3%)}75%{transform:translate(-2%,-2%)}100%{transform:translate(3%,2%)}}
/* announcement / utility bar (brass strip, dismissible) */
.dev-banner{background:var(--brass);color:#241E25;display:flex;align-items:center;justify-content:center;gap:clamp(.8rem,2vw,1.8rem);padding:8px 44px 8px 16px;font-family:'Inter',sans-serif;font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;position:relative;z-index:9999}
.dev-banner a{color:#241E25;font-weight:700;border-bottom:1px solid rgba(15,26,61,.45);padding-bottom:1px;transition:border-color .3s}
.dev-banner a:hover{border-color:#241E25}
.dev-banner .x{position:absolute;right:10px;top:50%;transform:translateY(-50%);background:none;border:none;color:#241E25;font-size:18px;line-height:1;cursor:pointer;opacity:.7;padding:6px 10px}
.dev-banner .x:hover{opacity:1}
body.ann-hide .dev-banner{display:none}
@media (max-width:640px){.dev-banner{font-size:9.5px;letter-spacing:.1em;gap:.7rem}.dev-banner span{display:none}.dev-banner a{display:inline;border-bottom-color:rgba(15,26,61,.55)}}
/* sticky shrink-on-scroll nav */
.nav{position:sticky;top:0;z-index:900;padding:1.7rem 0;background:transparent;transition:padding .4s var(--ease),background .4s var(--ease),backdrop-filter .4s}
.nav.shrink{padding:.85rem 0;background:rgba(244,241,234,.82);backdrop-filter:saturate(160%) blur(20px);-webkit-backdrop-filter:saturate(160%) blur(20px);border-bottom:1px solid var(--rule)}
.nav .container{display:flex;align-items:center;justify-content:space-between;gap:1.5rem}
.nav .logo img{height:74px;width:auto;transition:height .4s var(--ease),transform .5s var(--ease)}
.nav.shrink .logo img{height:52px}
.nav .logo:hover img{transform:rotate(-5deg)}
.nav nav ul{list-style:none;margin:0;padding:0;display:flex;gap:clamp(12px,1.6vw,28px);align-items:center;flex-wrap:nowrap}
.nav nav a{font-family:'Inter',sans-serif;font-size:clamp(10.5px,.78vw,12px);letter-spacing:.12em;text-transform:uppercase;font-weight:500;color:#241E25;white-space:nowrap;transition:letter-spacing .4s var(--ease),color .3s}
.nav nav a:hover{letter-spacing:.22em;color:var(--brass)}
/* mobile nav: hamburger + drawer (injected by inline script below) */
.nav-burger{display:none;flex:none;width:46px;height:46px;align-items:center;justify-content:center;
  background:transparent;border:1px solid var(--rule);border-radius:999px;cursor:pointer;padding:0;
  transition:border-color .3s var(--ease),background .3s var(--ease)}
.nav-burger:hover{border-color:var(--brass)}
.nav-burger .bars{position:relative;display:block;width:20px;height:14px}
.nav-burger .bars span{position:absolute;left:0;height:1.6px;width:100%;background:var(--navy);border-radius:2px;
  transition:transform .4s var(--ease),opacity .25s var(--ease),background .3s}
.nav-burger .bars span:nth-child(1){top:0}
.nav-burger .bars span:nth-child(2){top:6px}
.nav-burger .bars span:nth-child(3){top:12px}
.nav-drawer{position:fixed;inset:0;z-index:10000;visibility:hidden;pointer-events:none}
.nav-drawer .nd-scrim{position:absolute;inset:0;background:rgba(15,26,61,.42);opacity:0;
  transition:opacity .5s var(--ease);backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px)}
.nav-drawer .nd-panel{position:absolute;top:0;right:0;height:100%;width:min(86vw,420px);
  background:var(--cotton);box-shadow:-30px 0 80px rgba(15,26,61,.22);
  display:flex;flex-direction:column;padding:clamp(1.6rem,5vw,2.4rem) clamp(1.5rem,6vw,2.4rem) 2.4rem;
  padding-top:max(clamp(1.6rem,5vw,2.4rem),env(safe-area-inset-top,0px));
  transform:translateX(100%);transition:transform .55s var(--ease)}
.nav-drawer .nd-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:2.4rem;flex:none}
.nav-drawer .nd-eyebrow{font-family:'Inter',sans-serif;font-size:11px;letter-spacing:.22em;text-transform:uppercase;font-weight:600;color:var(--brass)}
.nav-drawer .nd-close{width:44px;height:44px;flex:none;display:inline-flex;align-items:center;justify-content:center;
  background:transparent;border:1px solid var(--rule);border-radius:999px;cursor:pointer;
  font-size:22px;line-height:1;color:#241E25;padding:0;transition:border-color .3s,color .3s}
.nav-drawer .nd-close:hover{border-color:var(--brass);color:var(--brass)}
.nav-drawer .nd-links{list-style:none;display:flex;flex-direction:column;margin:0;padding:0}
.nav-drawer .nd-links li{border-bottom:1px solid var(--rule)}
.nav-drawer .nd-links a{display:flex;align-items:center;min-height:56px;
  font-family:'Cormorant Garamond',Georgia,serif;font-size:1.9rem;font-weight:400;letter-spacing:-.5px;
  color:#241E25;transition:color .3s var(--ease),padding-left .35s var(--ease)}
.nav-drawer .nd-links a:hover,.nav-drawer .nd-links a:focus-visible{color:var(--brass);padding-left:.4rem}
.nav-drawer .nd-foot{margin-top:auto;padding-top:1.8rem;font-family:'Inter',sans-serif;font-size:12px;letter-spacing:.1em;color:rgba(15,26,61,.6)}
.nav-drawer .nd-foot a{color:var(--brass)}
.nav-drawer.open{visibility:visible;pointer-events:auto}
.nav-drawer.open .nd-scrim{opacity:1}
.nav-drawer.open .nd-panel{transform:translateX(0)}
body.nav-open{overflow:hidden}
body.nav-open .nav-burger .bars span:nth-child(1){transform:translateY(6px) rotate(45deg)}
body.nav-open .nav-burger .bars span:nth-child(2){opacity:0}
body.nav-open .nav-burger .bars span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
@media (max-width:860px){
  .nav nav ul{display:none}
  .nav-burger{display:inline-flex}
}
@media (prefers-reduced-motion:reduce){
  .nav-drawer .nd-scrim,.nav-drawer .nd-panel,.nav-burger .bars span{transition:none}
  .grain{animation:none}
}
/* =========================================================
   Hero
   ========================================================= */
.hero{
  max-width:var(--maxw); margin:0 auto;
  padding:clamp(1rem,3vw,2.5rem) var(--gut) clamp(1.5rem,4vw,3rem);
  border-bottom:1px solid var(--rule);
}
.hero .eyebrow{ display:block; margin-bottom:1.1rem; }
.hero h1{
  font-family:var(--display); font-weight:400; letter-spacing:-.5px;
  font-size:clamp(2.9rem,8.5vw,5.8rem);
  line-height:.98; margin:0 0 1.1rem; max-width:14ch;
}
.hero h1 em{ font-weight:500; }
.hero .lede{
  font-size:clamp(1.05rem,1.6vw,1.2rem);
  color:var(--muted); max-width:52ch; margin:0 0 1.4rem;
}
.hero .meta{
  display:flex; flex-wrap:wrap; align-items:center; gap:.7rem 1.4rem;
  padding-top:1.1rem; border-top:1px solid var(--rule);
}
.hero .meta .count-badge{
  font-family:var(--display); font-size:2.4rem; line-height:1; font-weight:500;
}
.hero .meta .count-badge span{ color:var(--brass); }
.hero .meta .meta-note{ font-size:.92rem; color:var(--muted); max-width:34ch; }
/* =========================================================
   Sticky controls
   ========================================================= */
.controls{
  position:sticky; top:0; z-index:600;
  background:rgba(244,241,234,.92);
  backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
  border-bottom:1px solid var(--rule);
}
.controls-inner{
  max-width:var(--maxw); margin:0 auto;
  padding:.7rem var(--gut);
  display:flex; flex-direction:column; gap:.7rem;
}
.controls-row{
  display:flex; align-items:center; gap:.6rem; flex-wrap:wrap;
}
.controls-row.top{ justify-content:space-between; }
/* search + sort row (#6/#7) */
.search-row{ gap:.6rem; }
.search-wrap{ position:relative; flex:1 1 260px; display:flex; align-items:center; }
.search-ico{ position:absolute; left:.7rem; width:16px; height:16px; color:var(--muted-2); pointer-events:none; }
.search-input{
  width:100%; min-height:44px; padding:.5rem 2.2rem .5rem 2.3rem;
  font-family:var(--body); font-size:14px; color:var(--ink);
  background:var(--cotton); border:1px solid var(--rule-strong);
}
.search-input::placeholder{ color:var(--muted-2); }
.search-input::-webkit-search-cancel-button{ -webkit-appearance:none; appearance:none; }
.search-clear{
  position:absolute; right:.45rem; width:30px; height:30px; display:flex; align-items:center; justify-content:center;
  border:0; background:none; cursor:pointer; color:var(--muted); font-size:13px; line-height:1;
}
.search-clear:hover{ color:var(--brass-ink); }
.sortctl{ display:inline-flex; align-items:center; gap:.4rem; flex:0 0 auto; }
.sort-lbl{ font-family:var(--body); font-weight:600; text-transform:uppercase;
  font-size:10px; letter-spacing:1.4px; color:var(--muted-2); }
.sort-sel{
  min-height:44px; padding:.4rem 1.8rem .4rem .7rem; font-family:var(--body); font-size:13px; color:var(--ink);
  background:var(--cotton) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='7' viewBox='0 0 10 7'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%230F1A3D' stroke-width='1.6' fill='none'/%3E%3C/svg%3E") no-repeat right .65rem center;
  border:1px solid var(--rule-strong); border-radius:0; appearance:none; -webkit-appearance:none; cursor:pointer;
}
/* view toggle */
.view-toggle{
  display:inline-flex; border:1px solid var(--ink); flex:0 0 auto;
}
.view-toggle button{
  background:transparent; border:0; color:var(--ink);
  font-family:var(--body); font-weight:600; text-transform:uppercase;
  font-size:11px; letter-spacing:1.4px;
  padding:0 18px; min-height:44px; min-width:78px;
  transition:background .35s var(--ease), color .35s var(--ease);
}
.view-toggle button + button{ border-left:1px solid var(--ink); }
.view-toggle button[aria-pressed="true"]{ background:var(--ink); color:var(--cotton); }
/* near me */
.nearme{
  display:inline-flex; align-items:center; gap:.55ch;
  background:transparent; border:1px solid var(--ink); color:var(--ink);
  font-family:var(--body); font-weight:600; text-transform:uppercase;
  font-size:11px; letter-spacing:1.4px;
  padding:0 16px; min-height:44px;
  transition:background .35s var(--ease), color .35s var(--ease);
}
.nearme:hover{ background:var(--ink); color:var(--cotton); }
.nearme[aria-pressed="true"]{ background:var(--brass); border-color:var(--brass); color:var(--cotton); }
.nearme svg{ width:15px; height:15px; }
/* filter chips */
.chips{ display:flex; align-items:center; column-gap:.45rem; row-gap:8px; flex-wrap:wrap; }
.chips .chips-label{
  font-family:var(--body); font-weight:600; text-transform:uppercase;
  font-size:10px; letter-spacing:1.4px; color:var(--muted-2);
  margin-right:.2rem;
}
.chip{
  background:transparent; border:1px solid var(--rule-strong); color:var(--ink);
  font-family:var(--body); font-size:12.5px; font-weight:500;
  padding:.45rem .85rem; min-height:44px;
  display:inline-flex; align-items:center; gap:.5ch;
  transition:background .3s var(--ease), border-color .3s var(--ease), color .3s var(--ease);
  white-space:nowrap;
}
.chip:hover{ border-color:var(--ink); }
.chip[aria-pressed="true"]{ background:var(--ink); border-color:var(--ink); color:var(--cotton); }
.chip[aria-pressed="true"] .ico{ color:var(--cotton); }
.chip .ico{ display:inline-flex; line-height:0; color:var(--brass); }
.chip .ico svg{ width:17px; height:17px; display:block; }
/* district (area) pills — primary geographic navigation */
.districts-row{ margin-bottom:.15rem; }
.districts{ display:flex; align-items:center; column-gap:.4rem; row-gap:8px; flex-wrap:wrap; }
.dpill{
  background:transparent; border:1px solid var(--rule-strong); color:var(--ink);
  font-family:var(--body); font-size:12.5px; font-weight:500;
  padding:.4rem .8rem; min-height:44px;
  display:inline-flex; align-items:center; gap:.55ch; white-space:nowrap;
  transition:background .3s var(--ease), border-color .3s var(--ease), color .3s var(--ease);
}
.dpill:hover{ border-color:var(--ink); }
.dpill[aria-pressed="true"]{ background:var(--brass); border-color:var(--brass); color:var(--cotton); }
.dpill .dn{ font-size:10.5px; font-weight:600; color:var(--muted); letter-spacing:.3px; }
.dpill:hover .dn{ color:var(--ink); }
.dpill[aria-pressed="true"] .dn{ color:var(--cotton); opacity:.85; }
.dgroup{ font-family:var(--body); font-weight:600; text-transform:uppercase;
  font-size:9.5px; letter-spacing:1.4px; color:var(--muted-2);
  align-self:center; padding:0 .15rem 0 .4rem; }
.dgroup::before{ content:"·"; margin-right:.5rem; color:var(--rule-strong); }
/* marker-cluster bubbles, brand-styled */
.np-cluster{
  position:relative;
  background:var(--ink); color:var(--cotton);
  border-radius:50%; text-align:center;
  font-family:var(--body); font-weight:600; font-size:12.5px;
  border:2px solid var(--cotton); box-shadow:0 2px 7px rgba(15,26,61,.38);
}
/* brass dot = the cluster holds at least one accent pin */
.np-cluster.has-accent .cl-accent{
  position:absolute; top:-2px; right:-2px; width:9px; height:9px; line-height:0;
  background:var(--brass); border:1.5px solid var(--cotton); border-radius:50%;
}
.marker-cluster-small, .marker-cluster-medium, .marker-cluster-large,
.marker-cluster-small div, .marker-cluster-medium div, .marker-cluster-large div{
  background:transparent!important;
}
.controls-foot{
  display:flex; align-items:center; justify-content:space-between; gap:1rem;
  flex-wrap:wrap;
}
.count-live{ font-size:12.5px; color:var(--muted); }
.count-live b{ color:var(--ink); font-weight:600; }
.btn-reset{
  background:transparent; border:0; color:var(--brass-ink);
  font-size:11px; font-weight:600; text-transform:uppercase; letter-spacing:1.2px;
  text-decoration:underline; text-underline-offset:3px;
  padding:.4rem .2rem; min-height:36px;
}
.btn-reset[hidden]{ display:none; }
/* geo status message */
.geo-msg{
  font-size:12.5px; color:var(--muted); padding:.1rem 0;
}
.geo-msg.err{ color:var(--brass-ink); }
.geo-msg[hidden]{ display:none; }
/* manual location entry (GPS fallback) */
.geo-manual{ margin:.6rem 0 .9rem; }
.geo-manual[hidden]{ display:none; }
.geo-manual .gm-row{ display:flex; gap:.5rem; flex-wrap:wrap; max-width:440px; }
.gm-input{
  flex:1 1 200px; min-height:44px; padding:.5rem .8rem;
  font-family:var(--body); font-size:14px; color:var(--ink);
  background:var(--cotton); border:1px solid var(--rule-strong);
}
.gm-input:focus{ border-color:var(--ink); }  /* global :focus-visible brass ring applies */
.gm-input::placeholder{ color:var(--muted-2); }
.gm-go{
  min-height:44px; padding:0 1.1rem; background:var(--ink); color:var(--cotton);
  border:0; font-family:var(--body); font-weight:600; font-size:11.5px;
  text-transform:uppercase; letter-spacing:1.4px; white-space:nowrap;
  transition:background .3s var(--ease);
}
.gm-go:hover{ background:var(--navy-2); }
.gm-status{ display:block; font-size:12px; color:var(--muted); margin-top:.4rem; }
/* persistent "you are here" chip (#14) */
.near-chip{ display:inline-flex; align-items:center; gap:.5rem; margin:.55rem 0 .2rem;
  padding:.32rem .55rem .32rem .6rem; background:var(--cotton);
  border:1px solid var(--rule-strong); border-radius:999px; font-size:12.5px; color:var(--ink); }
.near-chip[hidden]{ display:none; }
.near-chip .nc-pin{ color:var(--brass); font-size:9px; line-height:1; }
.near-chip .nc-text b{ font-weight:600; }
.near-chip .nc-edit,.near-chip .nc-clear{ appearance:none; border:0; background:none; cursor:pointer;
  font-family:var(--body); font-size:11px; text-transform:uppercase; letter-spacing:.8px;
  color:var(--muted); padding:.45rem .4rem; line-height:1; transition:color .2s var(--ease); }
.near-chip .nc-edit{ border-left:1px solid var(--rule); }
.near-chip .nc-edit:hover,.near-chip .nc-clear:hover{ color:var(--brass-ink); }
/* =========================================================
   Stage (map + list)
   ========================================================= */
.stage{ max-width:var(--maxw); margin:0 auto; padding:0 var(--gut) var(--bay); }
/* MAP */
#mapWrap{ padding-top:var(--gut); }
#map{
  width:100%; height:62vh; min-height:380px; max-height:680px;
  border:1px solid var(--ink);
  background:#e8e6df;
}
.leaflet-container:focus{ outline:2px solid var(--brass); outline-offset:2px; }
.map-cap{
  font-size:11.5px; color:var(--muted); margin-top:.6rem;
  display:flex; align-items:center; gap:.5ch;
}
.map-cap .dot-pin{ color:var(--brass); }
/* map legend + live season line (#9 / #4) */
.map-legend{
  display:flex; align-items:center; flex-wrap:wrap; gap:.4rem 1rem;
  margin-top:.7rem; font-size:11.5px; color:var(--muted);
}
.map-legend .ml-item{ display:inline-flex; align-items:center; gap:.45ch; }
.map-legend .ml-pin{ flex:0 0 auto; }
.map-legend .ml-season{ color:var(--brass-ink); font-weight:600; }
.map-legend .ml-season:empty{ display:none; }
/* live water-play status in the detail panel (#4) */
.d-waterlive{ display:flex; flex-wrap:wrap; gap:.4rem .7rem; margin:.7rem 0 0; }
.d-waterlive[hidden]{ display:none; }
.water-live{ display:inline-flex; align-items:center; gap:.4ch; font-size:.82rem; font-weight:600;
  letter-spacing:.02em; padding:.18rem .55rem; border-radius:999px; }
.water-live.on{ color:var(--cotton); background:var(--brass); }
.water-live.off{ color:var(--muted); background:transparent; border:1px solid var(--rule-strong); }
/* Leaflet on-brand polish */
.leaflet-container{ font-family:var(--body); background:#e8e6df; }
.leaflet-control-attribution{
  background:rgba(244,241,234,.86)!important; color:var(--muted)!important;
  font-size:10px!important; border-radius:0!important;
}
.leaflet-control-attribution a{ color:var(--brass-ink)!important; }
.leaflet-bar{
  border-radius:0!important; border:1px solid var(--navy)!important;
  box-shadow:0 2px 8px rgba(15,26,61,.18)!important;
}
.leaflet-control-zoom a,
.leaflet-bar a{
  border-radius:0!important;
  background:var(--navy)!important; color:var(--cotton)!important;
  border-bottom:1px solid rgba(244,241,234,.22)!important;
  transition:background .25s var(--ease)!important;
}
.leaflet-control-zoom a:last-child,
.leaflet-bar a:last-child{ border-bottom:0!important; }
.leaflet-control-zoom a:hover,
.leaflet-bar a:hover{ background:var(--navy-2)!important; color:#fff!important; }
.leaflet-popup-content-wrapper{
  border-radius:0!important; background:var(--cotton);
  box-shadow:0 6px 22px rgba(15,26,61,.16);
  border:1px solid var(--ink);
}
.leaflet-popup-tip{ background:var(--cotton); border:1px solid var(--ink); }
.leaflet-popup-content{ margin:14px 16px; font-family:var(--body); }
/* custom marker */
.np-pin{
  width:30px; height:38px; position:relative;
  transition:transform .3s var(--ease);
}
.np-pin svg{ display:block; filter:drop-shadow(0 3px 4px rgba(15,26,61,.30)); }
.np-pin:hover{ transform:translateY(-3px) scale(1.06); }
.np-pin.is-accent .pin-body{ fill:var(--brass); }
.you-here-dot{
  width:18px; height:18px; border-radius:50%;
  background:var(--brass); border:3px solid var(--cotton);
  box-shadow:0 0 0 2px var(--brass), 0 2px 6px rgba(15,26,61,.4);
}
/* popup body */
.pop h4{ font-family:var(--display); font-size:1.3rem; font-weight:500; margin:0 0 .15rem; }
.pop .nb{ font-size:11px; color:var(--muted); text-transform:uppercase; letter-spacing:1px; font-weight:600; margin-bottom:.55rem; }
.pop .pf{ font-size:12px; color:var(--muted); margin-bottom:.7rem; line-height:1.4; }
.pop .pop-open{
  display:inline-flex; align-items:center; gap:.4ch; width:100%; justify-content:center;
  background:var(--ink); color:var(--cotton); border:0;
  font-weight:600; text-transform:uppercase; font-size:10.5px; letter-spacing:1.4px;
  padding:11px 14px; min-height:42px;
}
.pop .pop-open:hover{ background:var(--navy-2); }
/* LIST */
#listWrap{ padding-top:var(--gut); }
.cards{
  display:grid; gap:0;
  grid-template-columns:1fr;
  border-top:1px solid var(--rule);
}
.card{
  position:relative;
  display:grid; gap:1rem;
  grid-template-columns:104px 1fr;
  padding:1.4rem 0;
  border-bottom:1px solid var(--rule);
  align-items:start;
  opacity:0; transform:translateY(14px);
  animation:fadeUp .7s var(--ease) forwards;
}
@media (prefers-reduced-motion:reduce){
  .card{ opacity:1; transform:none; animation:none; }
}
.card .thumb{
  width:104px; aspect-ratio:5/3; border:1px solid var(--rule); overflow:hidden;
  background:var(--scene-ground);
}
.card .thumb svg{ display:block; width:100%; height:100%; }
/* Save heart (#12) — card + detail */
.savebtn{
  position:absolute; top:6px; right:0; z-index:3;
  width:34px; height:34px; display:flex; align-items:center; justify-content:center;
  border:0; background:none; cursor:pointer; color:var(--muted-2);
  transition:color .2s var(--ease), transform .2s var(--ease);
}
.savebtn svg{ width:19px; height:19px; }
.savebtn:hover{ color:var(--brass); transform:scale(1.08); }
.savebtn.on{ color:var(--brass); }
.d-save{
  display:inline-flex; align-items:center; gap:.5ch; margin:0 0 1.2rem;
  padding:.4rem .8rem; cursor:pointer;
  background:none; border:1px solid var(--rule-strong); color:var(--ink);
  font-family:var(--body); font-weight:600; text-transform:uppercase; font-size:11px; letter-spacing:1.4px;
  transition:background .25s var(--ease), color .25s var(--ease), border-color .25s var(--ease);
}
.d-save .ico{ display:inline-flex; line-height:0; }
.d-save .ico svg{ width:15px; height:15px; }
.d-save:hover{ border-color:var(--brass); color:var(--brass-ink); }
.d-save.on{ background:var(--brass); border-color:var(--brass); color:var(--cotton); }
.card .c-body{ min-width:0; }
.card h3{
  font-family:var(--display); font-weight:500; letter-spacing:-.3px;
  font-size:1.55rem; line-height:1.08; margin:0 0 .15rem;
}
.card .c-nb{
  font-size:10.5px; font-weight:600; text-transform:uppercase; letter-spacing:1.2px;
  color:var(--muted); margin-bottom:.6rem;
}
.card .c-hook{ font-size:.95rem; color:var(--muted); margin:0; max-width:60ch; }
.card .c-icons{ display:flex; flex-wrap:wrap; gap:.4rem; margin-top:12px; margin-bottom:.9rem; }
.feat{
  display:inline-flex; align-items:center; gap:.4ch;
  font-size:11px; color:var(--ink);
  border:1px solid var(--rule); padding:.28rem .55rem;
}
.feat .ico{ display:inline-flex; line-height:0; color:var(--brass); }
.feat .ico svg{ width:16px; height:16px; display:block; }
.feat.more{ color:var(--muted); border-style:dashed; }
.agechip{
  display:inline-flex; align-items:center; gap:.45ch;
  font-size:10px; font-weight:600; text-transform:uppercase; letter-spacing:1px;
  background:transparent; color:var(--brass); border:1px solid rgba(194,106,56,.45);
  padding:.3rem .55rem;
}
.agechip .ico{ display:inline-flex; line-height:0; color:var(--brass); }
.agechip .ico svg{ width:14px; height:14px; display:block; }
.distpill{
  display:inline-flex; align-items:center; gap:.4ch;
  font-size:10.5px; font-weight:600; text-transform:uppercase; letter-spacing:1px;
  color:var(--brass); border:1px solid var(--brass); padding:.28rem .55rem;
}
.distpill .ico{ display:inline-flex; line-height:0; color:var(--brass); }
.distpill .ico svg{ width:13px; height:13px; display:block; }
.distpill[hidden]{ display:none; }
/* near-me proximity tier badges */
.tierbadge{
  display:inline-flex; align-items:center; gap:.4ch;
  font-size:10px; font-weight:600; text-transform:uppercase; letter-spacing:1px;
  padding:.28rem .55rem; border:1px solid transparent;
}
.tierbadge .ico{ display:inline-flex; line-height:0; }
.tierbadge .ico svg{ width:13px; height:13px; display:block; }
/* Walkable — brass, the on-brand "near enough to walk" emphasis */
.tierbadge.walk{ background:var(--brass); border-color:var(--brass); color:var(--cotton); }
.tierbadge.walk .ico{ color:var(--cotton); }
/* Short drive — quiet, navy hairline */
.tierbadge.drive{ background:transparent; border-color:var(--rule-strong); color:var(--muted); }
.tierbadge.drive .ico{ color:var(--muted-2); }
/* "Farther afield" divider — a full-width, de-emphasized rule in the card grid */
.list-sentinel{ grid-column:1 / -1; height:1px; }
.far-divider{
  grid-column:1 / -1;
  display:flex; align-items:center; gap:1rem;
  padding:1.4rem 0 .6rem;
}
.far-divider .fd-rule{ flex:1; height:1px; background:var(--rule); }
.far-divider .fd-label{
  font-family:var(--body); font-weight:600; text-transform:uppercase;
  font-size:10px; letter-spacing:1.4px; color:var(--muted-2); white-space:nowrap;
}
/* de-emphasize cards beyond the near radius (target inner blocks so the
   card's fadeUp 'forwards' animation doesn't override the dimming) */
.card.is-far .thumb,
.card.is-far .c-body{ opacity:.62; transition:opacity .3s var(--ease); }
.card.is-far:hover .thumb,
.card.is-far:hover .c-body{ opacity:1; }
.card .c-meta-row{ display:flex; flex-wrap:wrap; gap:.45rem; align-items:center; margin-bottom:1rem; }
/* collapse the meta row's spacing if a card ever lacks an age chip / distance pill */
.card .c-meta-row:empty{ display:none; }
.card .c-icons:has(+ .c-meta-row:empty){ margin-bottom:1rem; }
.card .c-actions{ display:flex; gap:.6rem; flex-wrap:wrap; }
.btn-sq{
  display:inline-flex; align-items:center; gap:.5ch; justify-content:center;
  font-family:var(--body); font-weight:600; text-transform:uppercase;
  font-size:11px; letter-spacing:1.3px;
  min-height:46px; padding:0 18px; border:1px solid var(--ink);
  background:transparent; color:var(--ink);
  transition:background .3s var(--ease), color .3s var(--ease);
}
.btn-sq:hover{ background:var(--ink); color:var(--cotton); }
.btn-sq.fill{ background:var(--ink); color:var(--cotton); }
.btn-sq.fill:hover{ background:var(--navy-2); }
.btn-sq svg{ width:14px; height:14px; }
.empty{
  padding:3rem 0; text-align:center; color:var(--muted);
  font-family:var(--display); font-size:1.5rem; font-weight:400;
}
.empty[hidden]{ display:none; }
[hidden]{ display:none !important; }
/* =========================================================
   Detail overlay
   ========================================================= */
.overlay{
  position:fixed; inset:0; z-index:1000;
  display:flex; justify-content:flex-end;
  pointer-events:none;
  visibility:hidden;
  /* fade children out, THEN hide the container so it can't bleed into layout/screenshots */
  transition:visibility 0s linear .25s;
}
.overlay.open{ pointer-events:auto; visibility:visible; transition:visibility 0s linear 0s; }
.overlay .scrim{
  position:absolute; inset:0; background:rgba(15,26,61,.42);
  opacity:0; transition:opacity .45s var(--ease);
  backdrop-filter:blur(2px); -webkit-backdrop-filter:blur(2px);
}
.overlay.open .scrim{ opacity:1; }
.panel{
  position:relative; height:100%; width:min(540px,100%);
  background:var(--cotton); border-left:1px solid var(--ink);
  overflow-y:auto; -webkit-overflow-scrolling:touch;
  transform:translateX(100%);
  transition:transform .5s var(--ease);
  box-shadow:-18px 0 50px rgba(15,26,61,.14);
}
.overlay.open .panel{ transform:translateX(0); }
@media (prefers-reduced-motion:reduce){
  .overlay .scrim,.panel{ transition:none; }
}
.panel-close{
  position:absolute; top:14px; right:14px; z-index:5;
  width:44px; height:44px; border:1px solid var(--ink); background:var(--cotton);
  color:var(--ink); font-size:20px; line-height:1;
  display:flex; align-items:center; justify-content:center;
  transition:background .3s var(--ease), color .3s var(--ease);
}
.panel-close:hover{ background:var(--ink); color:var(--cotton); }
.panel-scene{ border-bottom:1px solid var(--ink); background:var(--scene-ground); }
.panel-scene svg{ display:block; width:100%; height:auto; }
.scene-cap{
  font-size:10.5px; color:var(--muted); padding:.55rem var(--gut);
  border-bottom:1px solid var(--rule); display:flex; align-items:center; gap:.5ch;
}
.panel-body{ padding:1.6rem var(--gut) 2rem; }
.panel-body .d-eyebrow{ display:block; margin-bottom:.55rem; }
.panel-body h2{
  font-family:var(--display); font-weight:500; letter-spacing:-.5px;
  font-size:clamp(2rem,5vw,2.7rem); line-height:1.02; margin:0 0 .35rem;
}
.panel-body .d-cross{ font-size:.92rem; color:var(--muted); margin:0 0 1.2rem; }
.d-section{ padding:1.2rem 0; border-top:1px solid var(--rule); }
.d-section h3{
  font-family:var(--body); font-weight:600; text-transform:uppercase;
  font-size:11px; letter-spacing:1.5px; color:var(--muted); margin:0 0 .8rem;
}
.d-feats{ display:flex; flex-wrap:wrap; gap:.5rem; }
.d-feat{
  display:inline-flex; align-items:center; gap:.5ch;
  font-size:12.5px; color:var(--ink); border:1px solid var(--rule); padding:.4rem .7rem;
}
.d-feat .ico{ display:inline-flex; line-height:0; color:var(--brass); }
.d-feat .ico svg{ width:17px; height:17px; display:block; }
.d-feat.winter{ border-color:var(--brass); color:var(--brass-ink); border-style:dashed; }
.d-feat.winter .ico{ color:var(--brass-ink); }
.d-meta-row{ display:flex; flex-wrap:wrap; gap:.5rem; align-items:center; margin-top:.2rem; }
.d-hook{ font-family:var(--body); font-size:1.12rem; line-height:1.6; font-weight:400; color:var(--ink); margin:.2rem 0 0; }
.d-season{ font-size:.92rem; color:var(--muted); margin:.6rem 0 0; display:flex; gap:.6ch; }
.d-season .sun{ color:#241E25; flex:0 0 auto; display:inline-flex; line-height:0; margin-top:.15em; }
.d-season .sun svg{ width:15px; height:15px; display:block; }
.d-dist{ font-size:.9rem; color:var(--brass-ink); margin-top:.5rem; font-weight:500; }
.leaflet-attribution-flag{ display:none !important; }
.d-dist[hidden]{ display:none; }
.d-actions{ margin-top:1.4rem; display:flex; gap:.6rem; flex-wrap:wrap; }
.d-directions, .d-photos{
  display:inline-flex; align-items:center; justify-content:center; gap:.6ch; flex:1 1 0; min-width:140px;
  font-weight:600; text-transform:uppercase; font-size:11.5px; letter-spacing:1.6px;
  min-height:54px; padding:0 20px;
  transition:background .35s var(--ease), border-color .35s var(--ease), color .35s var(--ease);
}
.d-directions{ background:var(--ink); color:var(--cotton); border:0; }
.d-directions:hover{ background:var(--navy-2); }
.d-photos{ background:transparent; color:var(--ink); border:1px solid var(--ink); }
.d-photos:hover{ background:var(--ink); color:var(--cotton); }
.d-directions svg, .d-photos svg{ width:16px; height:16px; }
/* #11 — mobile detail panel: full-height sheet, opaque scrim, capped scene band,
   safe-area, and a thumb-reachable bottom-anchored close bar. */
@media (max-width:640px){
  .overlay .scrim{ background:rgba(15,26,61,.62); }
  .panel{ width:100%; border-left:0; box-shadow:none; }
  .panel-close{ display:none; }  /* bottom CLOSE bar is the mobile close affordance */
  /* cap the illustration to ~38vh so name/hook/buttons land above the fold;
     centre the SVG in the band so the playground centrepiece stays in view */
  .panel-scene{ max-height:38vh; overflow:hidden; display:flex; align-items:center; }
  .panel-body{ padding:1.3rem var(--gut) calc(5.5rem + env(safe-area-inset-bottom)); }
  /* bottom-anchored close bar (replaces relying on the top-right × alone) */
  .panel-closebar{
    position:sticky; bottom:0; left:0; right:0; z-index:6;
    display:flex; padding:.7rem var(--gut) calc(.7rem + env(safe-area-inset-bottom));
    background:linear-gradient(to top, var(--cotton) 72%, rgba(244,241,234,0));
  }
  .panel-closebar button{
    flex:1 1 auto; min-height:50px; border:1px solid var(--ink); background:var(--cotton);
    color:var(--ink); font-family:var(--body); font-weight:600; text-transform:uppercase;
    letter-spacing:1.4px; font-size:11.5px; cursor:pointer;
  }
  .panel-closebar button:hover{ background:var(--ink); color:var(--cotton); }
}
@media (min-width:641px){ .panel-closebar{ display:none; } }
/* soft CTA block (inside panel + page) */
.cta-block{
  margin-top:1.6rem; padding:1.5rem; background:var(--navy);
  color:var(--on-dark);
}
.cta-block p{
  font-family:var(--body); font-size:1.05rem; line-height:1.55; font-weight:400;
  margin:0 0 1.2rem; color:var(--on-dark);
}
.cta-block p em{ color:var(--soft-brass); }
.cta-pill{
  display:inline-flex; align-items:center; justify-content:center; gap:.6ch;
  background:var(--cotton); color:#241E25;
  border-radius:999px; border:0;
  font-weight:600; text-transform:uppercase; font-size:11.5px; letter-spacing:1.8px;
  padding:16.8px 32px; min-height:54px;
  transition:transform .4s var(--ease), background .4s var(--ease);
}
.cta-pill:hover{ transform:translateY(-2px); background:#fff; }
.cta-pill .arr{ transition:transform .4s var(--ease); }
.cta-pill:hover .arr{ transform:translateX(4px); }
/* =========================================================
   Page-level CTA band
   ========================================================= */
.cta-band{
  background:var(--navy); color:var(--on-dark);
}
.cta-band-inner{
  max-width:var(--maxw); margin:0 auto; padding:var(--bay) var(--gut);
  display:grid; gap:1.5rem; align-items:center;
  grid-template-columns:1fr;
}
.cta-band .eyebrow{ color:var(--soft-brass); }
.cta-band h2{
  font-family:var(--display); font-weight:400; letter-spacing:-.5px;
  font-size:var(--h2); line-height:1.02; margin:.8rem 0 1rem; max-width:18ch;
  color:var(--on-dark);
}
.cta-band h2 em{ color:var(--soft-brass); font-weight:500; }
.cta-band p{ color:var(--on-dark-muted); max-width:50ch; margin:0 0 1.6rem; font-size:1.05rem; }
/* =========================================================
   Standard nestabode site chrome — monograph footer
   (grafted verbatim from nb-2026.css for site-wide parity)
   ========================================================= */
.footer{background:var(--navy);color:var(--cotton);position:relative;overflow:hidden;padding:clamp(5rem,9vw,8rem) 0 2.5rem}
.footer .ghost{position:absolute;left:0;right:0;bottom:-3vw;text-align:center;font-family:'Cormorant Garamond',serif;font-size:24vw;line-height:.8;color:var(--cotton);opacity:.035;user-select:none;pointer-events:none;letter-spacing:-.02em;white-space:nowrap}
@media(max-width:480px){.footer .ghost{display:none}}
.footer .container{position:relative;z-index:2}
.footer-cols{display:grid;grid-template-columns:2fr 1fr 1fr 1.25fr;gap:clamp(1.8rem,3.4vw,3.6rem);margin-bottom:clamp(3rem,6vw,5rem);align-items:start}
.footer .lede{font-family:'Cormorant Garamond',serif;font-size:1.8rem;max-width:22ch;line-height:1.25;margin:0 0 1.4rem}
.footer .browse-cta{display:inline-block;font-family:'Inter',sans-serif;font-size:13px;letter-spacing:.04em;color:var(--soft-brass);text-decoration:none;border-bottom:1px solid rgba(193,154,107,.35);padding-bottom:2px;transition:border-color .3s,letter-spacing .3s}
.footer .browse-cta:hover{border-color:var(--soft-brass);letter-spacing:.08em}
.footer h5{font-family:'Inter',sans-serif;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--soft-brass);margin:0 0 1.2rem;font-weight:600}
.footer ul{list-style:none;margin:0;padding:0}
.footer li{margin-bottom:.7rem}
.footer a{font-family:'Inter',sans-serif;font-size:14px;color:var(--linen);transition:color .3s,letter-spacing .3s}
.footer a:hover{color:var(--cotton);letter-spacing:.04em}
.footer .legal{font-family:'Inter',sans-serif;font-size:13px;color:rgba(224,210,184,.7);line-height:1.55;margin-top:1rem}
/* Brokerage lockup (official HouseSigma asset) */
.footer .brk-logo{height:24px;width:auto;display:block;opacity:.95;margin-bottom:.9rem}
.footer-sig{position:relative;z-index:2;text-align:center;margin:0 auto clamp(1.6rem,3.5vw,2.4rem);padding-top:1.7rem;border-top:1px solid rgba(244,241,234,.13);display:flex;flex-direction:column;align-items:center;gap:.55rem}
.footer-sig .nest-mark{font-size:clamp(1.5rem,3vw,2.1rem);color:var(--cotton)}
.footer-sig .nest-mark .nm-accent{color:var(--soft-brass)}
.nest-mark{font-family:'Cormorant Garamond',Georgia,serif;font-weight:400;line-height:1.05;display:inline-flex;flex-wrap:wrap;align-items:baseline;justify-content:center;gap:.3em;margin:0;color:var(--cotton)}
.nest-mark .nm-w{display:inline-block}
.nest-mark .nm-accent{font-style:italic;color:var(--soft-brass)}
.footer-meta{border-top:1px solid rgba(244,241,234,.15);padding-top:1.5rem;display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;font-family:'Inter',sans-serif;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:rgba(224,210,184,.6)}
@media (max-width:1080px) and (min-width:901px){.footer-cols{grid-template-columns:1.6fr 1fr 1fr;gap:2.4rem}.footer-cols>div:last-child{grid-column:2 / 4}}
@media (max-width:900px){.footer-cols{grid-template-columns:1fr 1fr;gap:2.2rem}}
@media (max-width:560px){.footer-cols{grid-template-columns:1fr}}
/* =========================================================
   Load-in motion (staggered fade-up)
   ========================================================= */
@keyframes fadeUp{ to{ opacity:1; transform:translateY(0); } }
.reveal{ opacity:0; transform:translateY(18px); animation:fadeUp .9s var(--ease) forwards; }
.reveal.d1{ animation-delay:.06s; }
.reveal.d2{ animation-delay:.16s; }
.reveal.d3{ animation-delay:.28s; }
.reveal.d4{ animation-delay:.40s; }
@media (prefers-reduced-motion:reduce){
  .reveal{ opacity:1; transform:none; animation:none; }
}
/* ---- Mobile: free the trapped viewport & tame the filter wall (2026-06-07) ----
   On phones the controls panel stacks ~660px tall (Area + Filter rows wrap into
   3-row walls); pinned (sticky) it buried the map and crushed the list / "near me"
   results into a sliver, so the page felt unscrollable. Fix is CSS-only — no markup
   or JS change: (1) stop the panel pinning, and (2) turn the two chip rows into
   compact single-row horizontal swipe-strips. */
@media (max-width:719.98px){
  .controls{ position:static; }            /* stop hijacking the viewport */
  /* Area + amenity chips: one swipeable row each instead of a wrapping wall */
  .districts, .chips{
    flex-wrap:nowrap; width:100%; min-width:0; max-width:100%;
    overflow-x:auto; overflow-y:hidden; -webkit-overflow-scrolling:touch;
    scrollbar-width:none; padding-bottom:2px;
    -webkit-mask-image:linear-gradient(to right, #000 calc(100% - 22px), transparent);
            mask-image:linear-gradient(to right, #000 calc(100% - 22px), transparent);
  }
  .districts::-webkit-scrollbar, .chips::-webkit-scrollbar{ display:none; }
  .dpill, .chip{ flex:0 0 auto; }          /* don't squash pills in a no-wrap strip */
  .dgroup{ flex:0 0 auto; }
  /* scroll affordance: chevron on the swipe strips so off-screen options read as reachable */
  .controls-row:has(.districts), .controls-row:has(.chips){ position:relative; }
  .controls-row:has(.districts)::after, .controls-row:has(.chips)::after{ content:"›"; position:absolute; top:0; right:0; bottom:2px; width:30px; display:flex; align-items:center; justify-content:flex-end; padding-right:4px; pointer-events:none; font:600 17px/1 var(--body); color:var(--brass); background:linear-gradient(to right, transparent, var(--cotton) 58%); }
  .chips-label{ flex:0 0 auto; position:sticky; left:0; z-index:1; padding-right:.35rem;
    background:linear-gradient(to right, rgba(244,241,234,.94) 68%, transparent); }
}
/* =========================================================
   Desktop enhancements
   ========================================================= */
@media (min-width:720px){
  .cards{ grid-template-columns:1fr 1fr; column-gap:2.4rem; }
  .card{ grid-template-columns:128px 1fr; }
  .card .thumb{ width:128px; }
  .controls-inner{ padding-top:.85rem; padding-bottom:.85rem; }
  .controls-row.top{ flex-wrap:nowrap; }
  .cta-band-inner{ grid-template-columns:1.3fr .9fr; }
  .cta-band .cta-copy{ grid-column:1; }
  #map{ height:66vh; }
}
@media (min-width:1024px){
  .cards{ grid-template-columns:1fr 1fr; }
}

/* ---- nav submenus (as /family-parks/ #nb-nav-critical) ---- */
.nav .container{gap:1.5rem}
.nav .logo{flex:0 0 auto;min-width:120px}
.nav nav ul{flex-wrap:nowrap}
.nav .has-sub{position:relative}
.nav .has-sub>a,.nav .has-sub>.sub-trigger{display:inline-flex;align-items:center;gap:6px}
.nav nav li.has-sub>.sub-trigger{font-family:'Inter',sans-serif;font-size:clamp(10.5px,.78vw,12px);letter-spacing:.12em;text-transform:uppercase;font-weight:500;color:#241E25;cursor:pointer}
.nav .has-sub>a::after,.nav .has-sub>.sub-trigger::after{content:"";width:6px;height:6px;border-right:1.4px solid currentColor;border-bottom:1.4px solid currentColor;transform:translateY(-2px) rotate(45deg);opacity:.5}
.nav .has-sub>.submenu{position:absolute;top:calc(100% + 10px);left:0;min-width:208px;flex-direction:column;gap:0;align-items:stretch;list-style:none;margin:0;padding:6px 0;background:#FAF8F2;border:1px solid rgba(74,34,47,.10);border-top:2px solid #c25b34;border-radius:5px;box-shadow:0 14px 30px -14px rgba(74,34,47,.22),0 2px 6px rgba(74,34,47,.07);z-index:950}
.nav .has-sub>.submenu li{margin:0;border:none}
.nav .has-sub>.submenu[hidden]{display:none}
.nav .has-sub:hover>.submenu,.nav .has-sub:focus-within>.submenu{display:flex}
.nav .has-sub>.submenu a{display:block;padding:9px 20px;min-height:0;text-transform:none;letter-spacing:.02em;font-size:13px;font-weight:500;white-space:nowrap;color:#4a222f}
.nav .has-sub>.submenu a:hover{background:#F0EBE0;color:#c25b34}

/* BUILD 131 — near-me strip, nearest ring, re-centre control, crawlable area index, area pages */
.near-strip{ margin-top:var(--gut); border:1px solid var(--ink); background:var(--cotton); }
.near-strip[hidden]{ display:none; }
.near-strip .ns-head{ margin:0; padding:.65rem 1rem .55rem; font-family:var(--body); font-weight:600; text-transform:uppercase; font-size:11px; letter-spacing:1.4px; color:var(--brass-ink); border-bottom:1px solid var(--rule); }
.ns-list{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); }
.ns-li{ display:flex; align-items:stretch; min-width:0; border-left:1px solid var(--rule); }
.ns-li:first-child{ border-left:0; }
.ns-item{ flex:1 1 auto; min-width:0; display:flex; gap:.7rem; align-items:flex-start; text-align:left; background:transparent; border:0; padding:.8rem 1rem; cursor:pointer; font:inherit; color:var(--ink); min-height:64px; }
.ns-item:hover .ns-name{ text-decoration:underline; text-underline-offset:3px; }
.ns-item:focus-visible, .ns-dir:focus-visible{ outline:2px solid var(--brass); outline-offset:-2px; }
.ns-rank{ flex:0 0 auto; width:26px; height:26px; display:inline-flex; align-items:center; justify-content:center; font-family:var(--display); font-size:1.05rem; font-weight:500; border:1px solid var(--ink); }
.ns-li.is-first .ns-rank{ background:var(--brass); border-color:var(--brass); color:var(--cotton); }
.ns-body{ min-width:0; display:flex; flex-direction:column; gap:.3rem; }
.ns-name{ font-family:var(--display); font-size:1.2rem; line-height:1.1; font-weight:500; overflow-wrap:anywhere; }
.ns-meta{ display:flex; flex-wrap:wrap; align-items:center; gap:.25rem .75rem; font-size:12px; color:var(--muted); }
.ns-dist{ font-weight:600; color:var(--ink); }
.ns-walk, .ns-water{ display:inline-flex; align-items:center; gap:.35ch; }
.ns-meta .ico{ display:inline-flex; line-height:0; }
.ns-meta .ico svg{ width:13px; height:13px; display:block; }
.ns-water .ico{ color:var(--brass); }
.ns-dir{ flex:0 0 auto; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.25rem; width:70px; border-left:1px solid var(--rule); color:var(--ink); text-decoration:none; font-size:9.5px; font-weight:600; text-transform:uppercase; letter-spacing:.9px; }
.ns-dir .ico{ display:inline-flex; line-height:0; }
.ns-dir .ico svg{ width:18px; height:18px; display:block; }
.ns-dir:hover{ background:var(--ink); color:var(--cotton); }
@media (max-width:900px){
  .ns-list{ grid-template-columns:1fr; }
  .ns-li{ border-left:0; border-top:1px solid var(--rule); }
  .ns-li:first-child{ border-top:0; }
}
/* desktop: the sticky controls sat at top:0 under the sticky site header, hiding Map/List + Near me once scrolled */
@media (min-width:720px){ .controls{ top:var(--nb-nav-h, 0px); } }
.nearest-ring{ width:46px; height:46px; border-radius:50%; border:3px solid var(--brass); box-shadow:0 0 0 3px rgba(244,241,234,.9); animation:nbRing 1.6s ease-out 3; }
@keyframes nbRing{ 0%{ transform:scale(.7); opacity:1 } 100%{ transform:scale(1.12); opacity:.9 } }
@media (prefers-reduced-motion:reduce){ .nearest-ring{ animation:none; } }
.nb-recenter a{ display:flex !important; align-items:center; justify-content:center; }
.nb-recenter a svg{ width:18px; height:18px; display:block; }
/* crawlable area index (main page + area pages) */
.area-index{ border-top:1px solid var(--rule); }
.area-index .ai-inner{ max-width:var(--maxw); margin:0 auto; padding:var(--bay) var(--gut); }
.area-index h2{ font-family:var(--display); font-weight:400; font-size:var(--h2); line-height:1.02; letter-spacing:-.5px; margin:0 0 .8rem; max-width:22ch; }
.area-index .ai-lede{ color:var(--muted); max-width:60ch; margin:0 0 1.6rem; }
.ai-group{ margin:0 0 1.2rem; }
.ai-glabel{ display:block; font-weight:600; text-transform:uppercase; font-size:10.5px; letter-spacing:1.4px; color:var(--muted-2); margin-bottom:.5rem; }
.ai-group ul{ list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:.5rem; }
.ai-group a{ display:inline-flex; align-items:center; gap:.55ch; min-height:44px; padding:.4rem .85rem; border:1px solid var(--rule-strong); color:var(--ink); text-decoration:none; font-size:13px; font-weight:500; }
.ai-group a:hover{ border-color:var(--ink); }
.ai-group a .n{ font-size:10.5px; font-weight:600; color:var(--muted); }
.ai-group a[aria-current="page"]{ background:var(--ink); border-color:var(--ink); color:var(--cotton); }
.ai-group a[aria-current="page"] .n{ color:var(--cotton); opacity:.85; }
/* area pages */
.hub-bc{ max-width:var(--maxw); margin:0 auto; padding:1rem var(--gut) 0; display:flex; flex-wrap:wrap; gap:.6ch; font-size:12px; color:var(--muted); }
.hub-bc a{ color:var(--ink); }
.hub-hero .hub-cta{ margin:1.3rem 0 0; }
.hub-list{ max-width:var(--maxw); margin:0 auto; padding:0 var(--gut) var(--bay); }
.hub-group h2{ font-family:var(--display); font-weight:400; font-size:clamp(1.6rem,3vw,2.2rem); line-height:1.05; margin:2.2rem 0 .9rem; padding-bottom:.5rem; border-bottom:1px solid var(--rule-strong); }
.hub-parks{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(auto-fill, minmax(min(100%, 300px), 1fr)); gap:1rem; }
.hub-park{ border:1px solid var(--rule-strong); padding:1rem 1.1rem 1.1rem; scroll-margin-top:1rem; min-width:0; }
.hub-park:target{ border-color:var(--brass); box-shadow:0 0 0 2px var(--brass); }
.hub-park h3{ font-family:var(--display); font-weight:500; font-size:1.35rem; line-height:1.1; margin:0 0 .3rem; overflow-wrap:anywhere; }
.hp-cross{ font-size:12.5px; color:var(--muted); margin:0 0 .6rem; }
.hp-hook{ font-size:.95rem; margin:0 0 .7rem; }
.hp-feats{ list-style:none; margin:0 0 .6rem; padding:0; display:flex; flex-wrap:wrap; gap:.35rem; }
.hp-feats li{ font-size:11.5px; border:1px solid var(--rule-strong); padding:.2rem .5rem; }
.hp-age{ font-size:10.5px; font-weight:600; text-transform:uppercase; letter-spacing:1px; color:var(--brass-ink); margin:0 0 .4rem; }
.hp-season{ font-size:12px; color:var(--muted); margin:0 0 .7rem; }
.hp-actions{ display:flex; flex-wrap:wrap; gap:.5rem; margin:.5rem 0 0; }
.hp-actions .btn-sq{ min-height:44px; padding:0 14px; }

/* ============================================================
   BUILD 135 family kit — additions
   ============================================================ */
/* the global [hidden] rule beat the hover/focus display:flex, so submenus never opened */
.nav .has-sub:hover>.submenu[hidden],.nav .has-sub:focus-within>.submenu[hidden]{display:flex!important}
.nbf-app{ display:block; }
/* pin with a count badge (T1: matching sessions per location) */
.np-pin .np-count{
  position:absolute; top:-6px; left:18px; min-width:19px; height:19px; padding:0 4px;
  display:flex; align-items:center; justify-content:center;
  background:var(--brass); color:var(--cotton); border:1.5px solid var(--cotton);
  font-family:var(--body); font-size:10.5px; font-weight:600; line-height:1; letter-spacing:0;
  box-shadow:0 1px 4px rgba(15,26,61,.35); pointer-events:none;
}
.np-pin.is-accent .np-count{ background:var(--ink); }
/* list cards without an illustration */
.card.no-thumb{ grid-template-columns:1fr; }
.card.no-thumb .c-body{ padding-right:2.4rem; }
/* open now / starting soon */
.nbf-status{
  display:inline-flex; align-items:center; gap:.5ch; white-space:nowrap;
  font-size:10.5px; font-weight:600; text-transform:uppercase; letter-spacing:1px;
  padding:.28rem .55rem; border:1px solid var(--brass); color:var(--brass-ink);
}
.nbf-status .dot{ width:7px; height:7px; border-radius:50%; background:currentColor; flex:0 0 auto; }
.nbf-status.is-open{ background:var(--brass); color:var(--cotton); }
.nbf-status.is-soon .dot{ background:transparent; border:1.5px solid currentColor; }
.pop .nbf-status{ margin:0 0 .5rem; }
.ns-meta .nbf-status{ padding:.12rem .4rem; font-size:9.5px; }
.d-meta-row:empty{ display:none; }
/* count line + data window */
.controls-foot{ justify-content:flex-start; column-gap:1.2rem; row-gap:.2rem; }
.controls-foot .btn-reset{ margin-left:auto; }
.nbf-through{ font-size:12px; color:var(--muted-2); }
.nbf-stale{ margin:var(--gut) 0 0; padding:.75rem 1rem; border:1px solid var(--brass); border-left-width:4px; background:rgba(168,72,42,.06); color:var(--brass-ink); font-size:13.5px; }
/* the empty state sits above whichever view is showing */
.stage > .empty{ padding:2rem 0 .25rem; }
/* chip groups that share a row on wide screens (day + time of day) */
.nbf-pair{ display:flex; flex-direction:column; gap:.7rem; min-width:0; }
.nbf-pair > .controls-row{ min-width:0; }
@media (min-width:1100px){ .nbf-pair{ flex-direction:row; flex-wrap:wrap; column-gap:2rem; } }
.chip .chip-count{ font-size:10.5px; font-weight:600; color:var(--muted); }
.chip[aria-pressed="true"] .chip-count{ color:var(--cotton); }
.nbf-date{ flex:0 0 auto; min-height:44px; padding:.35rem .6rem; font-family:var(--body); font-size:13px; color:var(--ink); background:var(--cotton); border:1px solid var(--ink); border-radius:0; }
.nbf-select{ display:inline-flex; align-items:center; gap:.4rem; flex:0 0 auto; margin:0; }
/* map offline */
.nbf-map-off{ display:flex; align-items:center; justify-content:center; height:100%; padding:2rem; text-align:center; font-family:var(--display); font-size:1.3rem; color:var(--muted); }
.nbf-map-off b{ color:var(--brass); font-style:italic; font-weight:500; }
/* weekly schedule (detail panel) */
.nbf-week{ list-style:none; margin:0; padding:0; }
.nbf-day{ display:grid; grid-template-columns:6.5rem 1fr; gap:.2rem 1rem; padding:.65rem 0; border-top:1px solid var(--rule); }
.nbf-day:first-child{ border-top:0; padding-top:0; }
.nbf-day-h{ font-size:11px; font-weight:600; text-transform:uppercase; letter-spacing:1.2px; color:var(--muted); padding-top:.15rem; }
.nbf-day ul{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:.4rem; }
.nbf-day ul > li{ display:flex; flex-wrap:wrap; gap:.05rem .8rem; font-size:.92rem; line-height:1.4; }
.nbf-time{ font-weight:600; white-space:nowrap; font-variant-numeric:tabular-nums; }
.nbf-what{ color:var(--muted); }
@media (max-width:420px){ .nbf-day{ grid-template-columns:1fr; } }
/* compact times list (cards) */
.nbf-times{ list-style:none; margin:.75rem 0 .9rem; padding:0; display:flex; flex-direction:column; gap:.3rem; font-size:.9rem; line-height:1.4; }
.nbf-times li{ display:flex; flex-wrap:wrap; gap:.05rem .7rem; }
.nbf-times .nbf-when{ font-weight:600; white-space:nowrap; font-variant-numeric:tabular-nums; }
.nbf-times .nbf-what{ color:var(--muted); }
.nbf-times .more{ color:var(--muted); font-size:.82rem; }
.map-legend .ml-count{ display:inline-flex; align-items:center; justify-content:center; min-width:17px; height:17px; padding:0 3px; background:var(--brass); color:var(--cotton); font-size:10px; font-weight:600; line-height:1; }
/* the panel sits above the brass announcement bar (z 9999), which otherwise covered its close button */
.overlay{ z-index:10001; }
/* the Area label matches the Filter label (the parks page rendered it in the body serif at full size) */
.districts .chips-label{ font-family:var(--body); font-weight:600; text-transform:uppercase; font-size:10px; letter-spacing:1.4px; color:var(--muted-2); margin-right:.2rem; }
/* one top row on wide screens: Map/List · search (+ selects) · Near me; below 1100px search drops to its own line */
.controls-row.top{ flex-wrap:wrap; }
.controls-row.top > .search-row{ order:3; flex:1 1 100%; display:flex; align-items:center; gap:.6rem; flex-wrap:wrap; min-width:0; }
@media (min-width:720px){ .controls-row.top{ flex-wrap:wrap; } }
@media (min-width:1100px){
  .controls-row.top{ flex-wrap:nowrap; }
  .controls-row.top > .search-row{ order:0; flex:1 1 auto; flex-wrap:nowrap; }
}
/* keep Leaflet's panes and controls (z 400–1000) inside the map, under the sticky controls (z 600) */
#map{ isolation:isolate; z-index:0; }
/* near-me group: the chip hugs its text (it stretched across the column), message sits tight under it */
.controls-inner > .near-chip{ align-self:flex-start; margin:0; max-width:100%; }
.controls-inner > .geo-msg{ margin:0; }
.geo-manual{ margin:0; }
.geo-manual .gm-row{ max-width:560px; }
/* phone panel: the close bar sits at the bottom of the sheet even when the content is short */
@media (max-width:640px){
  .panel{ display:flex; flex-direction:column; }
  .panel-body{ flex:1 0 auto; padding-bottom:1.5rem; }
  .panel-closebar{ flex:0 0 auto; margin-top:auto; }
}

/* BUILD 135 — hub sources + licence line: small print, like the parks page note */
.fam-sources{ max-width:72ch; margin:1.6rem 0 0; font-size:12.5px; line-height:1.55; color:var(--muted); }
.fam-sources a{ color:inherit; text-decoration:underline; text-underline-offset:2px; }