/* ============================================================
   Germantown Avenue — interactive guide
   Namespaced under .gtwn so it won't collide with site styles.
   Everything below renders from the DATA object in germantown.js.
   Loaded only on the Germantown Avenue guide post (extra_css frontmatter).
   ============================================================ */
.gtwn{
  --paper:#ffffff;
  --paper-2:#f6f6f6;
  --ink:#0c0c0c;
  --ink-soft:#333333;
  --ink-mute:#666666;
  --hair:#e5e5e5;
  --hair-2:#b0b0b0;
  --serif:"Cormorant Garamond", Georgia, serif;
  --sans:"Inter", system-ui, sans-serif;

  color:var(--ink);
  background:var(--paper);
  font-family:var(--sans);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  max-width:1080px;
  margin:0 auto;
  padding:clamp(20px,4vw,52px);
  box-sizing:border-box;
}
.gtwn *{box-sizing:border-box;}

/* ---- header ------------------------------------------------ */
.gtwn__eyebrow{
  font-size:11px; font-weight:600; letter-spacing:.22em; text-transform:uppercase;
  color:var(--ink-mute); margin:0 0 14px;
}
.gtwn__title{
  font-family:var(--serif); font-weight:500; font-size:clamp(34px,6vw,58px);
  line-height:1.02; letter-spacing:-.01em; margin:0 0 12px; color:var(--ink);
}
.gtwn__dek{
  font-size:15px; line-height:1.6; color:var(--ink-soft); max-width:46ch; margin:0;
}
.gtwn__rule{height:1px; background:var(--hair); border:0; margin:26px 0 0;}

/* ---- layout ------------------------------------------------ */
.gtwn__body{
  display:grid;
  grid-template-columns:minmax(0,0.92fr) minmax(0,1fr);
  gap:clamp(24px,4vw,56px);
  align-items:start;
  padding-top:30px;
}
.gtwn__mapwrap{position:relative;}
.gtwn__map{display:block; width:100%; height:auto; overflow:hidden;}

/* ---- reader panel ----------------------------------------- */
.gtwn__panel{
  position:sticky; top:24px;
  min-height:320px;
  padding-top:6px;
}
.gtwn__panel-index{
  font-size:11px; font-weight:600; letter-spacing:.2em; text-transform:uppercase;
  color:var(--ink-mute); display:flex; align-items:center; gap:10px; margin-bottom:18px;
}
.gtwn__panel-index .n{color:var(--ink);}
.gtwn__panel-index .bar{flex:1; height:1px; background:var(--hair); max-width:60px;}
.gtwn__hood{
  font-size:11px; font-weight:600; letter-spacing:.18em; text-transform:uppercase;
  color:var(--ink-mute); margin:0 0 6px;
}
.gtwn__name{
  font-family:var(--serif); font-weight:500; font-size:clamp(28px,4.4vw,40px);
  line-height:1.06; letter-spacing:-.01em; margin:0 0 8px; color:var(--ink);
}
.gtwn__addr{
  font-size:12.5px; letter-spacing:.02em; color:var(--ink-mute); margin:0 0 20px;
}
.gtwn__copy{ font-size:16px; line-height:1.66; color:var(--ink-soft); margin:0; max-width:48ch;}
.gtwn__copy + .gtwn__copy{margin-top:12px;}

.gtwn__intro .gtwn__name{font-style:italic; color:var(--ink-soft);}
.gtwn__intro .gtwn__copy{color:var(--ink-mute);}

.gtwn__nav{display:flex; gap:8px; margin-top:30px;}
.gtwn__nav button{
  font-family:var(--sans); font-size:12px; font-weight:500; letter-spacing:.04em;
  color:var(--ink-soft); background:transparent; border:1px solid var(--hair-2);
  padding:9px 16px; border-radius:999px; cursor:pointer;
  transition:border-color .25s ease, color .25s ease, background .25s ease;
}
.gtwn__nav button:hover:not(:disabled){border-color:var(--ink); color:var(--ink);}
.gtwn__nav button:disabled{opacity:.4; cursor:default;}
.gtwn__nav button:focus-visible{outline:2px solid var(--ink); outline-offset:2px;}

/* crossfade for panel content */
.gtwn__panel-body{transition:opacity .32s ease, transform .32s ease;}
.gtwn__panel-body.is-swapping{opacity:0; transform:translateY(6px);}

/* ============================================================
   SVG map elements
   ============================================================ */
.gtwn-avenue{
  fill:none; stroke:var(--ink); stroke-width:2.4; stroke-linecap:round; stroke-linejoin:round;
  vector-effect:non-scaling-stroke;
}
.gtwn-avenue--reveal{
  stroke-dasharray:var(--len); stroke-dashoffset:var(--len);
  transition:stroke-dashoffset 1.75s cubic-bezier(.22,1,.36,1);
}
.gtwn.is-revealed .gtwn-avenue--reveal{stroke-dashoffset:0;}

/* map labels hold a constant size while the camera zooms (semantic zoom):
   the stage scales by s, each label counter-scales by --inv (=1/s). */
.gtwn-cross-tick{stroke:var(--hair-2); stroke-width:1; vector-effect:non-scaling-stroke; transition:opacity .4s ease;}
.gtwn-cross-label{
  font-family:var(--sans); font-size:10px; font-weight:500; letter-spacing:.12em;
  text-transform:uppercase; fill:var(--ink-mute);
  transform:scale(var(--inv,1)); transform-box:fill-box; transform-origin:left center;
}
.gtwn-cross, .gtwn-cross-label, .gtwn-cross-note{opacity:0; transition:opacity .6s ease var(--d,0s), transform .9s cubic-bezier(.33,0,.16,1);}
.gtwn.is-revealed .gtwn-cross, .gtwn.is-revealed .gtwn-cross-label, .gtwn.is-revealed .gtwn-cross-note{opacity:1;}
/* on zoom the real OSM street geometry takes over, so drop the perpendicular
   ticks — they don't match the true street angles and read as noise. */
.gtwn--zoomed .gtwn-cross-tick{opacity:0;}
/* On the slim rotated phone column a zoomed-in cross-street name can't fit and
   gets clipped at the right edge. Once zoomed, the real OSM streets + numbered
   pins + the rail write-up carry the context, so drop the names there. */
.gtwn--rot.gtwn--zoomed .gtwn-cross-label,
.gtwn--rot.gtwn--zoomed .gtwn-cross-note{opacity:0 !important; transition:opacity .35s ease;}

.gtwn-cross-note{
  font-family:var(--serif); font-style:italic; font-size:10px; letter-spacing:.01em; fill:var(--ink-mute);
  transform:scale(var(--inv,1)); transform-box:fill-box; transform-origin:left center;
}
/* the real boundary streets, drawn faded */
.gtwn-bstreet{fill:none; stroke:var(--ink-mute); stroke-width:1.1; stroke-linecap:round; stroke-linejoin:round; vector-effect:non-scaling-stroke; opacity:0; transition:opacity .9s ease .45s;}
.gtwn.is-revealed .gtwn-bstreet{opacity:.42;}
.gtwn-bname{font-family:var(--serif); font-style:italic; font-size:11px; letter-spacing:.01em; fill:var(--ink-mute); opacity:0;
  transform:scale(var(--inv,1)); transform-box:fill-box; transform-origin:right center;
  transition:opacity .9s ease .6s, transform .9s cubic-bezier(.33,0,.16,1);}
.gtwn.is-revealed .gtwn-bname{opacity:.7;}
/* neighborhood names flanking the seam */
.gtwn-hood{
  font-family:var(--serif); font-style:italic; font-size:20px; font-weight:600; fill:var(--ink-soft);
  opacity:0;
  transform:scale(var(--inv,1)); transform-box:fill-box; transform-origin:right center;
  transition:opacity .8s ease .7s, transform .9s cubic-bezier(.33,0,.16,1);
}
.gtwn.is-revealed .gtwn-hood{opacity:.95;}
/* the neighborhood names are an overview cue; once zoomed in they just clutter */
.gtwn--zoomed .gtwn-hood{opacity:0 !important; transition:opacity .35s ease;}

/* furniture */
.gtwn-furn{opacity:0; transition:opacity .8s ease .9s;}
.gtwn.is-revealed .gtwn-furn{opacity:.85;}
.gtwn-furn line, .gtwn-furn path{stroke:var(--ink-mute); fill:none;}
.gtwn-furn text{font-family:var(--sans); font-size:10px; letter-spacing:.1em; fill:var(--ink-mute);}

/* edge fades */
.gtwn-fade{pointer-events:none;}

/* ---- camera / zoom ---------------------------------------- */
#gtwn-stage{transform-box:view-box; transform-origin:0 0; transition:transform .9s cubic-bezier(.33,0,.16,1);}
.gtwn-pin__pos, .gtwn-cluster__pos{transition:transform .9s cubic-bezier(.33,0,.16,1);}
.gtwn-context{opacity:0; transition:opacity .55s ease .12s;}
.gtwn--zoomed .gtwn-context{opacity:1;}
.gtwn-cstreet{stroke:var(--ink-mute); stroke-width:1; fill:none; opacity:.34; stroke-linecap:round; vector-effect:non-scaling-stroke;}
.gtwn-rstreet{stroke:var(--ink-mute); stroke-width:1; fill:none; opacity:.3; stroke-linecap:round; stroke-linejoin:round; vector-effect:non-scaling-stroke;}
.gtwn-osm-credit{font-family:var(--sans); font-size:8px; letter-spacing:.04em; fill:var(--ink-mute); opacity:0; transition:opacity .6s ease;}
.gtwn--zoomed .gtwn-osm-credit{opacity:.55;}
.gtwn-fade{transition:opacity .5s ease;}
.gtwn--zoomed .gtwn-fade, .gtwn--zoomed .gtwn-furn{opacity:0 !important;}

/* ---- pins -------------------------------------------------- */
.gtwn-pin{cursor:pointer; opacity:0; transform:translateY(-7px); transition:opacity .55s ease var(--d,0s), transform .55s cubic-bezier(.34,1.4,.5,1) var(--d,0s);}
.gtwn.is-revealed .gtwn-pin{opacity:1; transform:none;}
.gtwn-pin__fx{transform-box:fill-box; transform-origin:center; transition:transform .3s cubic-bezier(.34,1.4,.5,1);}
.gtwn-pin__hit{fill:transparent;}
.gtwn-pin__casing{fill:var(--paper);}
.gtwn-pin__ring{fill:var(--paper); stroke:var(--ink); stroke-width:1.6; transition:stroke-width .25s ease;}
.gtwn-pin__core{fill:var(--ink); opacity:0; transform-box:fill-box; transform:scale(.2); transform-origin:center; transition:opacity .3s ease, transform .35s cubic-bezier(.34,1.5,.5,1);}
.gtwn-pin__num{font-family:var(--sans); font-size:8.5px; font-weight:600; fill:var(--paper); text-anchor:middle; dominant-baseline:central; opacity:0; transition:opacity .2s ease;}
.gtwn-pin__label{
  font-family:var(--sans); font-size:12px; font-weight:500; letter-spacing:.01em; fill:var(--ink);
  paint-order:stroke; stroke:var(--paper); stroke-width:3.5px; stroke-linejoin:round;
  opacity:0; transition:opacity .25s ease; pointer-events:none;
}
.gtwn-pin__pulse{fill:none; stroke:var(--ink); stroke-width:1.2; opacity:0;}

/* hover / focus */
.gtwn-pin:hover .gtwn-pin__fx, .gtwn-pin:focus-visible .gtwn-pin__fx{transform:scale(1.22);}
.gtwn-pin:hover .gtwn-pin__label, .gtwn-pin:focus-visible .gtwn-pin__label{opacity:1;}
.gtwn-pin:hover .gtwn-pin__ring{stroke-width:2;}
.gtwn-pin:focus{outline:none;}
.gtwn-pin:focus-visible .gtwn-pin__ring{stroke-width:2.4;}

/* discoverability pulse until first interaction */
/* liveliness ripple on every visible pin — at the overview AND the zoomed-in elevation */
.gtwn.is-revealed .gtwn-pin:not(.is-hidden):not(.gtwn-pin--active) .gtwn-pin__pulse{
  animation:gtwn-pulse 2.6s ease-out infinite; animation-delay:calc(var(--d,0s) + .4s);
}
.gtwn-pin--active .gtwn-pin__pulse{animation:none !important; opacity:0 !important;}
@keyframes gtwn-pulse{0%{opacity:.5; r:6px;} 70%{opacity:0; r:18px;} 100%{opacity:0; r:18px;}}

/* active */
.gtwn-pin--active .gtwn-pin__fx{transform:scale(1.18);}
.gtwn-pin--active .gtwn-pin__core{opacity:1; transform:scale(1);}
.gtwn-pin--active .gtwn-pin__ring{stroke-width:0;}
.gtwn-pin--active .gtwn-pin__num{opacity:1;}
.gtwn-pin--active .gtwn-pin__label{opacity:1; font-weight:600;}
/* backgrounded pins: de-emphasize the marker only — the paper casing stays fully
   opaque so the road is never visible through any pin */
.gtwn.has-active .gtwn-pin:not(.gtwn-pin--active) .gtwn-pin__ring{stroke:var(--hair-2);}
.gtwn.has-active .gtwn-pin:not(.gtwn-pin--active) .gtwn-pin__num{fill:var(--ink-mute);}
.gtwn.has-active .gtwn-pin:not(.gtwn-pin--active) .gtwn-pin__stackcue{opacity:.18;}
.gtwn.has-active .gtwn-pin:not(.gtwn-pin--active):hover .gtwn-pin__ring{stroke:var(--ink);}

/* ---- overlapping (stacked) pins --------------------------- */
.gtwn-pin__stackcue{fill:none; stroke:var(--ink); stroke-width:1; opacity:0; transition:opacity .3s ease;}
.gtwn.is-revealed .gtwn-pin--stacked .gtwn-pin__stackcue{opacity:.30;}
.gtwn-pin--stacked:hover .gtwn-pin__stackcue, .gtwn-pin--stacked:focus-visible .gtwn-pin__stackcue{opacity:.6;}
/* the chooser replaces the single label on hover, so suppress it (unless active) */
.gtwn-pin--stacked:not(.gtwn-pin--active):hover .gtwn-pin__label,
.gtwn-pin--stacked:not(.gtwn-pin--active):focus-visible .gtwn-pin__label{opacity:0;}

.gtwn-disambig{
  position:absolute; z-index:6; left:0; top:0; min-width:128px; max-width:220px;
  background:var(--paper); border:1px solid var(--hair-2);
  transform:translateY(-50%); opacity:0; pointer-events:none;
  transition:opacity .14s ease; box-sizing:border-box;
}
.gtwn-disambig.is-open{opacity:1; pointer-events:auto;}
.gtwn-disambig__head{
  font-family:var(--sans); font-size:9px; font-weight:600; letter-spacing:.14em; text-transform:uppercase;
  color:var(--ink-mute); padding:8px 12px 6px;
}
.gtwn-disambig__opt{
  display:block; width:100%; text-align:left; background:transparent; border:0; cursor:pointer;
  font-family:var(--sans); font-size:13px; line-height:1.25; color:var(--ink);
  padding:9px 12px; border-top:1px solid var(--hair); transition:background .12s ease;
}
.gtwn-disambig__opt:hover, .gtwn-disambig__opt:focus-visible{background:var(--paper-2); outline:none;}

/* ---- overview <-> detail visibility ----------------------- */
.gtwn-pin.is-hidden{opacity:0 !important; pointer-events:none;}
.gtwn-pin.is-hidden .gtwn-pin__fx{transform:scale(.5);}

/* ---- off-Avenue connectors -------------------------------- */
.gtwn-connects{opacity:0; transition:opacity .5s ease .1s;}
.gtwn--zoomed .gtwn-connects{opacity:1;}
.gtwn-connects.is-hidden{opacity:0 !important;}
.gtwn-connect{stroke:var(--ink-mute); stroke-width:1; stroke-dasharray:1.6 3; opacity:.7; stroke-linecap:round; vector-effect:non-scaling-stroke;}

/* ---- cluster badges --------------------------------------- */
.gtwn-cluster{cursor:pointer; opacity:0; transform:translateY(-7px); transition:opacity .55s ease var(--d,0s), transform .55s cubic-bezier(.34,1.4,.5,1) var(--d,0s);}
.gtwn.is-revealed .gtwn-cluster{opacity:1; transform:none;}
.gtwn-cluster.is-hidden{opacity:0 !important; pointer-events:none; transition:opacity .4s ease;}
.gtwn-cluster__hit{fill:transparent;}
.gtwn-cluster__ring{fill:var(--paper); stroke:var(--ink); stroke-width:1.4;}
.gtwn-cluster__core{fill:var(--ink); transform-box:fill-box; transform-origin:center; transition:transform .25s cubic-bezier(.34,1.4,.5,1);}
.gtwn-cluster__num{font-family:var(--sans); font-size:11px; font-weight:600; fill:var(--paper); text-anchor:middle; dominant-baseline:central; pointer-events:none;}
.gtwn-cluster__label{font-family:var(--sans); font-size:11px; font-weight:600; letter-spacing:.02em; fill:var(--ink); paint-order:stroke; stroke:var(--paper); stroke-width:3.5px; stroke-linejoin:round; opacity:0; transition:opacity .2s ease; pointer-events:none;}
.gtwn-cluster:hover .gtwn-cluster__core, .gtwn-cluster:focus-visible .gtwn-cluster__core{transform:scale(1.13);}
.gtwn-cluster:hover .gtwn-cluster__label, .gtwn-cluster:focus-visible .gtwn-cluster__label{opacity:1;}
.gtwn-cluster:focus{outline:none;}
.gtwn-cluster:focus-visible .gtwn-cluster__ring{stroke-width:2.6;}

/* ---- panel list ------------------------------------------- */
.gtwn__list{margin-top:18px; display:flex; flex-direction:column; gap:0; max-height:46vh; overflow:auto; -webkit-overflow-scrolling:touch;}
.gtwn__grp{display:flex; flex-direction:column;}
.gtwn__grp-h{display:flex; align-items:center; gap:8px; width:100%; text-align:left; background:transparent; border:0; cursor:pointer;
  font-family:var(--sans); font-size:10px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-mute); padding:14px 2px 5px;}
.gtwn__grp-h:hover{color:var(--ink);}
.gtwn__grp-n{margin-left:auto; font-family:var(--sans); font-size:9.5px; letter-spacing:.04em; color:var(--ink); border:1px solid var(--hair-2); border-radius:999px; padding:1px 7px;}
.gtwn__li{display:flex; align-items:center; gap:11px; width:100%; text-align:left; background:transparent; border:0; border-top:1px solid var(--hair); cursor:pointer;
  font-family:var(--serif); font-size:16px; color:var(--ink-soft); padding:9px 2px; transition:color .15s ease;}
.gtwn__li:hover{color:var(--ink);}
.gtwn__li:focus-visible{outline:2px solid var(--ink); outline-offset:2px;}
.gtwn__li-n{font-family:var(--sans); font-size:10px; color:var(--ink-mute); min-width:16px;}
.gtwn__li-hood{margin-left:auto; font-family:var(--sans); font-size:9px; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-mute);}

/* close / back-to-avenue control */
.gtwn__close{
  font-family:var(--sans); font-size:12px; font-weight:500; letter-spacing:.04em;
  color:var(--ink-soft); background:transparent; border:1px solid var(--hair-2);
  padding:9px 16px; border-radius:999px; cursor:pointer; margin-right:auto;
  display:none; transition:border-color .25s ease, color .25s ease;
}
.gtwn.has-active .gtwn__close{display:inline-block;}
.gtwn__close:hover{border-color:var(--ink); color:var(--ink);}
.gtwn__close:focus-visible{outline:2px solid var(--ink); outline-offset:2px;}

/* ---- mobile rail -------------------------------------------
   The persistent, scrollable index of every stop. Hidden on
   desktop (the swap reader drives that); on a phone it sits to the
   right of a full-height map and doubles as the reader — selecting
   a stop expands its write-up in place. */
.gtwn__rail{display:none; position:relative;}
.gtwn__rail-head{
  position:sticky; top:0; z-index:2; background:var(--paper);
  font-family:var(--sans); font-size:10px; font-weight:600; letter-spacing:.16em;
  text-transform:uppercase; color:var(--ink-mute);
  display:flex; align-items:baseline; justify-content:space-between;
  padding:1px 0 9px; border-bottom:1px solid var(--hair);
}
.gtwn__rail-head span{color:var(--ink);}
.gtwn__rail-hood{
  font-family:var(--sans); font-size:10px; font-weight:600; letter-spacing:.14em;
  text-transform:uppercase; color:var(--ink-mute); padding:15px 0 3px;
}
.gtwn__rail-row{border-top:1px solid var(--hair);}
.gtwn__rail-hood + .gtwn__rail-row{border-top:0;}
.gtwn__rail-name{
  display:flex; align-items:baseline; gap:9px; width:100%; text-align:left;
  background:transparent; border:0; cursor:pointer; padding:11px 0;
  font-family:var(--serif); font-size:18px; line-height:1.22; color:var(--ink-soft);
  transition:color .15s ease;
}
.gtwn__rail-name:hover{color:var(--ink);}
.gtwn__rail-name:focus-visible{outline:2px solid var(--ink); outline-offset:2px;}
.gtwn__rail-n{font-family:var(--sans); font-size:10px; font-weight:600; color:var(--ink-mute); min-width:18px; flex:0 0 auto;}
.gtwn__rail-t{flex:1 1 auto;}
.gtwn__rail-row.is-open > .gtwn__rail-name{color:var(--ink); font-weight:600;}
.gtwn__rail-row.is-open > .gtwn__rail-name .gtwn__rail-n{color:var(--ink);}
/* full rail width for the write-up — no indent, it's a narrow column already */
.gtwn__rail-body{display:none; padding:0 0 18px 0;}
.gtwn__rail-row.is-open > .gtwn__rail-body{display:block;}
#gtwn .gtwn__rail-body .gtwn__addr{margin:2px 0 12px;}
#gtwn .gtwn__rail-body .gtwn__copy{font-size:16px; line-height:1.65; max-width:none;}
#gtwn .gtwn__rail-body .gtwn__copy + .gtwn__copy{margin-top:11px;}

/* On the rotated phone map the active stop's name label would overflow the slim
   column (and just repeats the rail). The cross-street names carry the on-map
   context, so drop the per-pin name label there. */
.gtwn--rot .gtwn-pin__label{display:none;}

/* ---- responsive ------------------------------------------- */
@media (max-width:820px){
  .gtwn{padding:16px 12px;}
  /* full-height frame: the whole map stays visible on the left, the names
     rail scrolls on the right. The map can't fill the height (it's ~3:4
     portrait and would need more width than a phone has), so it's centered
     in the column at the largest size that shows the entire road. */
  .gtwn__body{
    grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);   /* fallback split */
    gap:12px; padding-top:14px; height:100svh; align-items:stretch;
  }
  .gtwn__mapwrap{max-width:none; margin:0; width:100%; align-self:center;}
  /* rotated build: Germantown Ave runs straight up-and-down, a tall skinny
     ribbon. Give it a slim fixed column running tall (the road fades off top
     and bottom) and hand the rest of the width to the names, which now get a
     noticeably wider, less-condensed column. */
  .gtwn--rot .gtwn__body{grid-template-columns:clamp(110px,37vw,140px) minmax(0,1fr);}
  .gtwn--rot .gtwn__map{max-height:94svh;}
  .gtwn__panel{
    position:static; min-height:0; padding-top:0; border-top:0; margin-top:0;
    display:flex; flex-direction:column; overflow:hidden;
  }
  /* the swap reader and prev/next/back controls are the desktop UI; the rail
     is both index and reader on a phone */
  .gtwn__panel-body, .gtwn__nav{display:none;}
  .gtwn__rail{
    display:block; flex:1 1 auto; min-height:0; overflow-y:auto;
    -webkit-overflow-scrolling:touch; border-left:1px solid var(--hair); padding-left:12px;
  }
}

@media (prefers-reduced-motion:reduce){
  .gtwn-avenue--reveal{transition:none; stroke-dashoffset:0 !important;}
  #gtwn-stage{transition:none;}
  .gtwn-pin, .gtwn-pin__pos, .gtwn-cluster__pos, .gtwn-cross, .gtwn-cross-label, .gtwn-cross-note, .gtwn-bstreet, .gtwn-bname, .gtwn-hood, .gtwn-furn, .gtwn-context, .gtwn-cluster, .gtwn-connects{transition:none !important;}
  .gtwn-pin{opacity:1 !important; transform:none !important;}
  .gtwn-pin.is-hidden, .gtwn-cluster.is-hidden{opacity:0 !important;}
  .gtwn-cluster{opacity:1 !important; transform:none !important;}
  .gtwn-cross, .gtwn-cross-label, .gtwn-cross-note, .gtwn-bstreet, .gtwn-bname, .gtwn-hood, .gtwn-furn{opacity:1 !important; transform:none !important;}
  .gtwn-pin__pulse{animation:none !important; opacity:0 !important;}
  .gtwn__panel-body{transition:none;}
}

/* ============================================================
   Blog-embed adjustments (added for site integration)
   The post body column is 680px; let the map break out wider, and
   re-assert the widget's own typography over .blog-body p/hr rules,
   which would otherwise outrank the widget's single-class selectors.
   #gtwn (an id) wins specificity cleanly.
   ============================================================ */
.gtwn-breakout{margin:36px 0;}
@media (min-width:821px){
  /* Break out of the 680px text column to the full width of the centered
     .container (max-width:1160px, 2rem side padding). .blog-body is left-
     aligned, so its left edge sits at the container's content-left; filling the
     container's content width from there lands the map symmetrically on the
     page. This mirrors how .container itself computes its content box, so it
     can't overflow it — no horizontal scrollbar, no page-anchored % needed. */
  .gtwn-breakout{
    width:min(1096px, calc(100vw - 4rem));
  }
}
#gtwn p{margin:0;}
#gtwn .gtwn__eyebrow{margin:0 0 14px;}
#gtwn .gtwn__title{margin:0 0 12px;}
#gtwn .gtwn__dek{font-size:15px; line-height:1.6; color:var(--ink-soft);}
#gtwn .gtwn__copy{font-size:16px; line-height:1.66; color:var(--ink-soft);}
#gtwn .gtwn__copy + .gtwn__copy{margin-top:12px;}
#gtwn .gtwn__name{font-family:var(--serif); font-weight:500; font-size:clamp(28px,4.4vw,40px); line-height:1.06; letter-spacing:-.01em; color:var(--ink); margin:0 0 8px;}
#gtwn .gtwn__intro .gtwn__name{font-style:italic; color:var(--ink-soft);}
#gtwn .gtwn__addr{font-size:12.5px; color:var(--ink-mute); margin:0 0 20px;}
#gtwn .gtwn__hood{margin:0 0 6px;}
#gtwn .gtwn__rule{height:1px; background:var(--hair); border:0; margin:26px 0 0;}