


.zip-row{flex-wrap:wrap}
.zip-row .zip-note{flex-basis:100%}


.crumb{padding:16px 0 0;font-size:14px;color:var(--muted)}
.crumb a{text-decoration:none;color:var(--muted);transition:color .15s}
.crumb a:hover{color:var(--olive)}
.crumb span[aria-current]{color:var(--ink);font-weight:600}


.pin-motif{width:100%;height:100%;color:var(--olive)}
.hero-photo .pin-motif{max-width:230px;margin:0 auto}
.areas-hero .hero-photo{
  background:var(--sand);border:1px solid var(--line);border-radius:var(--r);
  aspect-ratio:1/1;display:grid;place-items:center;padding:34px}
.city-hero .hero-photo,.hood-hero .hero-photo{position:relative;overflow:hidden}

.hero-photo .ph,.area-row .ph{color:var(--muted)}




.area-list{max-width:980px;margin:0 auto}
.area-row{
  display:grid;grid-template-columns:1.3fr .7fr;gap:32px;align-items:start;
  padding:30px 0;border-top:1px solid var(--line)}
.area-list .area-row:first-child{border-top:0}
.area-row-lead{display:flex;gap:20px;align-items:flex-start}
.area-num{
  font-family:var(--font-display);font-variant-numeric:lining-nums tabular-nums;
  font-size:15px;color:var(--olive);flex:none;padding-top:4px;letter-spacing:.02em}
.area-row h3{font-family:var(--font-display);font-weight:400;font-size:24px;margin:0 0 8px}
.area-row h3 a{text-decoration:none;color:var(--ink);transition:color var(--t-minor) var(--ease-hover)}
.area-row h3 a:hover{color:var(--olive)}
.area-row-lead > div > p{color:var(--muted);font-size:15px;margin:0 0 8px;max-width:52ch}
.area-row .office-note{font-size:13px;color:var(--olive);font-weight:600;margin:0}
.area-row-side{display:flex;flex-direction:column;align-items:flex-start;gap:14px}
.area-row-side .hoods{justify-content:flex-start;margin:0}
.area-row-side .hoods a{padding:6px 13px;font-size:13.5px}
.area-card-cta{display:inline-flex;align-items:center;gap:6px}
.area-card-cta .nudge{display:inline-block;transition:transform var(--t-minor) var(--ease-hover)}
.area-card-cta:hover .nudge{transform:translateX(4px)}


.hero-photo .pin-unveil{width:100%;height:100%;display:grid;place-items:center}


.hoods-lg a{padding:12px 20px;font-size:15.5px;font-weight:500}
.hoods a{transition:border-color var(--t-minor) var(--ease-hover),color var(--t-minor) var(--ease-hover)}
.hoods a:hover{border-color:var(--olive);color:var(--olive)}


.nearby-row{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}
.nearby-row a{
  display:inline-flex;align-items:center;gap:7px;padding:11px 20px;border-radius:999px;
  border:1px solid var(--line);background:#fff;text-decoration:none;color:var(--ink);
  font-size:15px;font-weight:500;transition:border-color var(--t-minor) var(--ease-hover),color var(--t-minor) var(--ease-hover)}
.nearby-row a:hover{border-color:var(--olive);color:var(--olive)}
.nearby-row a .nudge{display:inline-block;transition:transform var(--t-minor) var(--ease-hover)}
.nearby-row a:hover .nudge{transform:translateX(4px)}


.dark-band{background:var(--olive-d);color:#f0eee2}

.dark-band .eyebrow{color:var(--on-dark)}
.dark-band h2{color:#fff}
.dark-band .lede{color:#d9d7c6}
.dark-band .guar-grid b{color:#fff}
.dark-band .guar-grid p{color:#cfcdbc}

.why-split{display:grid;grid-template-columns:5fr 7fr;gap:72px;align-items:start}
.why-head .lede{margin:14px 0 0;max-width:40ch}
.why-list{list-style:none;margin:0;padding:0;counter-reset:why}
.why-list li{display:grid;grid-template-columns:52px 1fr;column-gap:14px;padding:22px 0;
  border-top:1px solid rgba(255,255,255,.16);counter-increment:why}
.why-list li:last-child{border-bottom:1px solid rgba(255,255,255,.16)}
.why-list li::before{content:counter(why,decimal-leading-zero);grid-row:span 2;
  font-family:var(--font-display);font-size:22px;line-height:1.15;color:var(--on-dark);
  font-variant-numeric:lining-nums tabular-nums;display:inline-block;
  transition:transform var(--t-micro,.15s) var(--ease-hover,ease)}
.why-list b{color:#fff;font-size:17px;margin-bottom:4px;display:block}
.why-list p{margin:0;font-size:15px;color:#cfcdbc;max-width:52ch}

.why-list li:hover::before,.why-list li:focus-within::before{transform:translateY(-3px)}
@media (prefers-reduced-motion:reduce){
  .why-list li::before{transition:none}
  .why-list li:hover::before,.why-list li:focus-within::before{transform:none}
}


.guar .btn-ghost,.dark-band .btn-ghost{color:#fff;border-color:rgba(255,255,255,.35)}
.guar .btn-ghost:hover,.dark-band .btn-ghost:hover{border-color:var(--olive-l);color:var(--olive-l)}


.guar-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;text-align:left;margin-top:10px}
.guar-grid b{display:block;font-size:16px;margin-bottom:6px}
.guar-grid p{margin:0;font-size:14.5px;color:var(--muted)}


.mapbox{
  aspect-ratio:16/6;border-radius:var(--r);overflow:hidden}
.mapbox.loaded{background:none;border:0}
.mapbox-trigger{
  width:100%;height:100%;aspect-ratio:16/6;background:var(--sand);border:1px solid var(--line);
  border-radius:var(--r);display:flex;align-items:center;justify-content:center;color:var(--muted);
  cursor:pointer;font-size:15px;font-family:inherit;transition:border-color .15s,background .15s}
.mapbox-trigger:hover,.mapbox-trigger:focus-visible{border-color:var(--olive);background:#fff}
.office-block .sec-head{margin-bottom:26px}


.vreview-row{
  display:flex;gap:18px;max-width:760px;margin:0 auto;justify-content:center;flex-wrap:wrap}
.vreview{flex:0 0 auto;width:160px}
.vreview-poster{
  aspect-ratio:9/16;border-radius:var(--r);background:var(--sand);
  border:1px dashed var(--line);display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:14px;position:relative}
.vreview-play{
  width:52px;height:52px;border-radius:50%;border:1.5px solid var(--olive);
  background:#fff;color:var(--olive);display:flex;align-items:center;justify-content:center;
  cursor:default;transition:transform var(--t-minor,.28s) var(--ease-hover,ease)}
.vreview-play svg{width:22px;height:22px}
.vreview:hover .vreview-play{transform:scale(1.08)}
.vreview-tag{
  font-size:11.5px;letter-spacing:.02em;color:var(--muted);text-align:center;
  padding:0 10px;line-height:1.4}

@media (max-width:700px){
  .vreview-row{
    flex-wrap:nowrap;overflow-x:auto;justify-content:flex-start;
    scroll-snap-type:x mandatory;padding-bottom:4px;margin:0 -20px;padding-left:20px;padding-right:20px}
  .vreview{scroll-snap-align:start}
}


.incl-list .incl-item{
  background:none;border:0;border-top:1px solid var(--line);border-radius:0;
  padding:16px 4px}
.incl-list .incl-item:first-child{border-top:0}


.price-teaser{
  background:#fff;border:1px solid var(--line);border-radius:var(--r);
  padding:26px 28px;box-shadow:var(--shadow);display:flex;align-items:center;
  justify-content:space-between;gap:20px;flex-wrap:wrap;max-width:760px;margin:0 auto}
.price-teaser .lbl{font-size:14px;letter-spacing:0;text-transform:none;
  color:var(--muted);font-weight:600;margin-bottom:4px}
.price-teaser .amt{font-family:var(--font-display);font-size:34px;color:var(--olive)}
.price-teaser .amt small{font-family:var(--font-body);font-size:14px;color:var(--muted);font-weight:400}
.price-teaser .note{font-size:13.5px;color:var(--muted);max-width:32ch}


@media (max-width:940px){
  .guar-grid{grid-template-columns:repeat(2,1fr)}
  .why-split{grid-template-columns:1fr;gap:28px}
}
@media (max-width:700px){
  .area-row{grid-template-columns:1fr;gap:16px;padding:24px 0}
  .area-row-side{align-items:flex-start}
  .guar-grid{grid-template-columns:1fr}
  .price-teaser{flex-direction:column;text-align:center}
  .price-teaser > a{width:100%}
  .hoods-lg a{font-size:14.5px;padding:10px 16px}
  
  
  .hoods-fold{width:100%;margin-top:2px}
  .hoods-fold summary{
    cursor:pointer;list-style:none;min-height:44px;display:flex;align-items:center;
    gap:8px;font-size:14px;font-weight:600;color:var(--olive);user-select:none;
  }
  .hoods-fold summary::-webkit-details-marker{display:none}
  .hoods-fold summary::after{
    content:"";width:8px;height:8px;flex:none;
    border-right:1.6px solid var(--olive);border-bottom:1.6px solid var(--olive);
    transform:rotate(45deg);transition:transform var(--t-minor,.28s) var(--ease-io,ease);
  }
  .hoods-fold[open] summary::after{transform:rotate(-135deg)}
  .hoods-fold .hoods{margin-top:12px}
}


