/* ===========================================================
   Individual listing pages  (/listings/<slug>.html)
   Same rules as the rest of the site: square corners, no gradients, no shadows.
   =========================================================== */

/* map category colors: chosen to stay apart from each other and from Signal Red,
   which is reserved for the property itself */
:root{
  --c-food:     #E8B04A;
  --c-fitness:  #5BC0DE;
  --c-hotels:   #C69BF0;
  --c-services: #9BA3AE;
  --c-parks:    #6FCF97;
  --c-transit:  #FFFFFF;
}

/* ---------- header ---------- */
.ld-head{ padding-bottom:clamp(20px,3vw,34px); }
.ld-head .eyebrow a{ color:inherit; }
.ld-head h1{ font-size:clamp(2.1rem,5vw,3.8rem); margin-bottom:.55rem; }
.ld-loc{ font-family:var(--mono); font-size:.74rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--ink-3); margin:0 0 1.2rem; }
.ld-status{ display:inline-block; font-family:var(--mono); font-size:.62rem; letter-spacing:.14em;
  text-transform:uppercase; padding:.32rem .65rem; border:1px solid var(--line-2); color:var(--ink);
  background:var(--glass-2); margin-left:.5rem; }

/* ---------- on-this-page nav ---------- */
.ld-nav{ position:sticky; top:var(--nav-h); z-index:50; background:var(--bg);
  border-block:1px solid var(--line); }
.ld-nav__in{ display:flex; gap:clamp(1rem,2.4vw,2.2rem); overflow-x:auto; scrollbar-width:none;
  max-width:var(--maxw); margin-inline:auto; padding:0 var(--pad); }
.ld-nav__in::-webkit-scrollbar{ display:none; }
.ld-nav a{ flex:none; font-family:var(--mono); font-size:.68rem; letter-spacing:.16em;
  text-transform:uppercase; color:var(--ink-3); padding:1rem 0; border-bottom:2px solid transparent;
  margin-bottom:-1px; transition:color .2s, border-color .2s; }
.ld-nav a:hover{ color:var(--ink); }
.ld-nav a[aria-current="true"]{ color:var(--ink); border-bottom-color:var(--acc); }

.ld-section{ padding-block:clamp(40px,6vw,84px); scroll-margin-top:calc(var(--nav-h) + 48px); }
.ld-section + .ld-section{ border-top:1px solid var(--line); }
.ld-h2{ font-size:clamp(1.5rem,2.8vw,2.2rem); margin:0 0 clamp(20px,3vw,34px); }
.ld-h2 small{ display:block; font-family:var(--mono); font-size:.66rem; letter-spacing:.18em;
  text-transform:uppercase; color:var(--acc-bright); font-weight:500; margin-bottom:.7rem; }

/* ---------- hero + facts ---------- */
.ld-hero{ display:grid; grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);
  gap:clamp(18px,2.6vw,36px); align-items:start; }
@media (max-width:900px){ .ld-hero{ grid-template-columns:1fr; } }
.ld-hero__media{ position:relative; aspect-ratio:16/10; background:var(--bg-2);
  border:1px solid var(--line); overflow:hidden; }
.ld-hero__media img{ width:100%; height:100%; object-fit:cover; display:block; }
.ld-side{ display:flex; flex-direction:column; gap:1rem; }
.ld-facts{ margin:0; border:1px solid var(--line); background:var(--bg-1); }
.ld-facts div{ display:flex; justify-content:space-between; gap:1.2rem; padding:.85rem 1.1rem;
  border-bottom:1px solid var(--line); }
.ld-facts div:last-child{ border-bottom:0; }
.ld-facts dt{ font-family:var(--mono); font-size:.64rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--ink-3); padding-top:.2rem; flex:none; }
.ld-facts dd{ margin:0; text-align:right; font-weight:500; color:var(--ink); font-size:.95rem; }
.ld-actions{ display:flex; flex-wrap:wrap; gap:.7rem; }
.ld-actions .btn{ flex:1 1 auto; justify-content:center; }

/* ---------- overview ---------- */
.ld-over{ display:grid; grid-template-columns:minmax(0,1.5fr) minmax(0,1fr); gap:clamp(24px,4vw,64px); }
@media (max-width:860px){ .ld-over{ grid-template-columns:1fr; } }
.ld-over p{ color:var(--ink-2); max-width:64ch; }
.ld-hl{ list-style:none; margin:0; padding:0; border-top:1px solid var(--line); }
.ld-hl li{ padding:.8rem 0 .8rem 1.4rem; border-bottom:1px solid var(--line); position:relative;
  color:var(--ink-2); font-size:.95rem; }
.ld-hl li::before{ content:""; position:absolute; left:0; top:1.28rem; width:8px; height:1px; background:var(--acc); }

/* ---------- gallery + floor plans ---------- */
.ld-gal{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; }
.ld-gal a, .ld-fp a{ position:relative; display:block; overflow:hidden; background:var(--bg-2);
  border:1px solid var(--line); aspect-ratio:4/3; }
.ld-gal a:first-child{ grid-column:span 2; grid-row:span 2; aspect-ratio:auto; }
.ld-gal img, .ld-fp img{ width:100%; height:100%; object-fit:cover; display:block;
  transition:transform .6s var(--ease), opacity .3s; opacity:.92; }
.ld-gal img{ position:absolute; inset:0; }   /* so the big tile's own height never stretches the rows */
.ld-gal a:hover img, .ld-fp a:hover img{ transform:scale(1.04); opacity:1; }
@media (max-width:760px){ .ld-gal{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .ld-gal a:first-child{ grid-column:span 2; grid-row:auto; aspect-ratio:4/3; } }
.ld-fp{ display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:14px; }
.ld-fp a{ background:#fff; aspect-ratio:4/3; }
.ld-fp img{ object-fit:contain; padding:.6rem; opacity:1; }
.ld-fp figcaption, .ld-gal figcaption{ font-family:var(--mono); font-size:.62rem; letter-spacing:.12em;
  text-transform:uppercase; color:var(--ink-3); margin-top:.5rem; }
.ld-fp figure{ margin:0; }
.ld-fp__pdf{ display:flex!important; align-items:center; justify-content:center; gap:.6rem; color:#201E1D;
  font-weight:600; font-size:.9rem; }
.ld-fp__pdf svg{ width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.7; }

/* ---------- video + 3D tours ---------- */
.ld-embeds{ display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr)); gap:18px; }
.ld-embeds--one{ grid-template-columns:minmax(0,1fr); max-width:980px; }
.ld-embed{ margin:0; }
.ld-embed__slot{ position:relative; aspect-ratio:16/9; background:var(--bg-2); border:1px solid var(--line); overflow:hidden; }
a.ld-embed__box{ position:absolute; inset:0; display:block; }
a.ld-embed__box img{ width:100%; height:100%; object-fit:cover; display:block; opacity:.7;
  transition:opacity .3s, transform .6s var(--ease); }
a.ld-embed__box:hover img{ opacity:.95; transform:scale(1.03); }
.ld-embed__frame{ position:absolute; inset:0; width:100%; height:100%; border:0; background:#000; }
.ld-embed__play{ position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:76px; height:76px;
  display:grid; place-items:center; background:var(--acc-btn); color:#fff; transition:background .2s; }
a.ld-embed__box:hover .ld-embed__play{ background:#C4260F; }
.ld-embed__play svg{ width:30px; height:30px; fill:currentColor; margin-left:3px; }
.ld-embed__badge{ position:absolute; left:.85rem; top:.85rem; font-family:var(--mono); font-size:.6rem;
  letter-spacing:.14em; text-transform:uppercase; padding:.35rem .65rem; background:rgba(32,30,29,.8);
  border:1px solid var(--line-2); color:var(--ink); }
.ld-embed figcaption{ font-family:var(--mono); font-size:.66rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--ink-3); margin-top:.65rem; }

/* ---------- lightbox ---------- */
.ld-lb{ border:0; padding:0; background:transparent; max-width:none; max-height:none; width:100vw; height:100vh;
  color:#fff; }
.ld-lb::backdrop{ background:rgba(20,18,17,.94); }
.ld-lb__stage{ width:100%; height:100%; display:grid; place-items:center; padding:clamp(52px,7vh,80px) clamp(14px,5vw,90px); }
.ld-lb__stage figure{ margin:0; display:flex; flex-direction:column; align-items:center; gap:.8rem; max-width:100%; max-height:100%; }
.ld-lb__stage img{ max-width:100%; max-height:calc(100vh - 170px); object-fit:contain; display:block; }
.ld-lb__stage figcaption{ font-family:var(--mono); font-size:.68rem; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-3); }
.ld-lb button{ position:absolute; background:var(--bg-1); border:1px solid var(--line-2); color:#fff; width:46px; height:46px;
  display:grid; place-items:center; cursor:pointer; transition:background .2s; }
.ld-lb button:hover{ background:var(--acc); }
.ld-lb button svg{ width:18px; height:18px; stroke:currentColor; fill:none; stroke-width:2; }
.ld-lb__x{ top:16px; right:16px; } .ld-lb__p{ left:16px; top:50%; } .ld-lb__n{ right:16px; top:50%; }

/* ---------- map ---------- */
.ld-mapwrap{ border:1px solid var(--line); background:var(--bg-1); }
.ld-chips{ display:flex; flex-wrap:wrap; gap:.5rem; padding:.8rem; border-bottom:1px solid var(--line); background:var(--bg); }
.ld-chip{ display:inline-flex; align-items:center; gap:.5rem; font:inherit; font-size:.78rem; font-weight:500;
  color:var(--ink-2); background:transparent; border:1px solid var(--line-2); padding:.42rem .75rem; cursor:pointer;
  transition:background .2s, color .2s, border-color .2s; }
.ld-chip i{ width:10px; height:10px; border-radius:50%; background:var(--c); display:block; flex:none; }
.ld-chip[data-k="transit"] i{ border-radius:0; }
.ld-chip em{ font-style:normal; font-family:var(--mono); font-size:.66rem; color:var(--ink-4); }
.ld-chip[aria-pressed="false"]{ opacity:.5; }
.ld-chip[aria-pressed="false"] i{ background:transparent; box-shadow:inset 0 0 0 1.5px var(--c); }
.ld-chip:hover{ border-color:var(--ink-3); color:var(--ink); }
.ld-map{ height:clamp(380px,58vh,600px); background:var(--bg-1); }
.ld-mapfoot{ display:flex; flex-wrap:wrap; gap:.5rem 1.4rem; justify-content:space-between; align-items:center;
  padding:.75rem .9rem; border-top:1px solid var(--line); background:var(--bg); font-size:.8rem; color:var(--ink-4); }
.ld-mapfoot a{ color:var(--acc-bright); font-weight:600; }
.ld-mapfoot a:hover{ color:#fff; }
.ld-mapfoot span a + a{ margin-left:1.2rem; }

.leaflet-container{ background:var(--bg-1); font-family:var(--body); }
.leaflet-tile{ filter:grayscale(1) invert(1) brightness(.86) contrast(1.05) hue-rotate(180deg); }
.leaflet-control-zoom a{ background:var(--bg-2)!important; color:var(--ink-2)!important; border-color:var(--line)!important; border-radius:0!important; }
.leaflet-control-zoom a:hover{ background:var(--acc)!important; color:#fff!important; }
.leaflet-bar{ border:0!important; box-shadow:none!important; }
.leaflet-control-attribution{ background:rgba(32,30,29,.85)!important; color:var(--ink-4)!important; font-size:9px!important; }
.leaflet-control-attribution a{ color:var(--ink-3)!important; }
.leaflet-popup-content-wrapper{ background:var(--bg-2); color:var(--ink); border-radius:0; box-shadow:none; border:1px solid var(--line-2); }
.leaflet-popup-tip{ background:var(--bg-2); box-shadow:none; }
.leaflet-popup-content{ margin:.7rem .9rem; font-family:var(--body); font-size:.85rem; line-height:1.4; }
.leaflet-popup-content b{ display:block; font-family:var(--display); font-weight:600; font-size:.95rem; }
.leaflet-popup-content span{ color:var(--ink-3); font-size:.78rem; }
a.leaflet-popup-close-button{ color:var(--ink-3)!important; }
.leaflet-tooltip.ld-tip{ background:var(--bg-2); border:1px solid var(--line-2); color:var(--ink); font-family:var(--mono);
  font-size:.62rem; letter-spacing:.1em; text-transform:uppercase; padding:.28rem .5rem; border-radius:0; box-shadow:none; }
.leaflet-tooltip.ld-tip::before{ display:none; }
.leaflet-tooltip.ld-ring{ background:transparent; border:0; box-shadow:none; color:var(--ink-3); font-family:var(--mono);
  font-size:.58rem; letter-spacing:.12em; text-transform:uppercase; padding:0; }
.leaflet-tooltip.ld-ring::before{ display:none; }
.ld-pin{ display:block; width:22px; height:22px; background:var(--acc); border:3px solid #fff; border-radius:50%; }
.ld-sq{ display:block; width:11px; height:11px; background:#fff; border:2px solid #201E1D; }

/* ---------- nearby + getting around ---------- */
.ld-near{ display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr)); gap:14px; }
.ld-card{ border:1px solid var(--line); background:var(--bg-1); padding:1.2rem 1.25rem 1.1rem; }
.ld-card h3{ display:flex; align-items:center; gap:.6rem; font-size:1.02rem; margin:0 0 .15rem; }
.ld-card h3 i{ width:10px; height:10px; border-radius:50%; background:var(--c); flex:none; }
.ld-card h3[data-k="transit"] i{ border-radius:0; }
.ld-card__sub{ font-size:.75rem; color:var(--ink-4); margin:0 0 .9rem; }
.ld-list{ list-style:none; margin:0; padding:0; }
.ld-list li{ display:flex; justify-content:space-between; gap:1rem; padding:.55rem 0; border-top:1px solid var(--line);
  font-size:.88rem; }
.ld-list li > span:first-child{ color:var(--ink); min-width:0; }
.ld-list small{ display:block; color:var(--ink-4); font-size:.72rem; margin-top:.1rem; }
.ld-list .ld-d{ flex:none; text-align:right; font-family:var(--mono); font-size:.68rem; letter-spacing:.04em; color:var(--ink-3);
  white-space:nowrap; padding-top:.2rem; }
.ld-go{ display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr)); gap:14px; }
.ld-go .ld-card h3{ font-size:1.1rem; }
.ld-routes{ font-size:.85rem; color:var(--ink-2); margin:.8rem 0 0; line-height:1.7; }
.ld-routes b{ color:var(--ink); font-weight:600; }
.ld-none{ font-size:.88rem; color:var(--ink-3); margin:0; }
.ld-src{ font-size:.74rem; color:var(--ink-4); margin-top:1.4rem; max-width:80ch; }
.ld-src a{ color:var(--ink-3); text-decoration:underline; }

/* ---------- closing CTA ---------- */
.ld-cta{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:1.4rem;
  border:1px solid var(--line-2); background:var(--bg-1); padding:clamp(24px,3.6vw,44px); }
.ld-cta h2{ font-size:clamp(1.4rem,2.6vw,2rem); margin:0 0 .4rem; }
.ld-cta p{ margin:0; color:var(--ink-2); max-width:54ch; }
.ld-cta .ld-actions .btn{ flex:0 0 auto; }

@media (prefers-reduced-motion:reduce){
  .ld-gal img, .ld-fp img, a.ld-embed__box img{ transition:none; }
}

/* walking-radius labels on the map */
.ld-ring-lbl{ font-family:var(--mono); font-size:.58rem; letter-spacing:.12em; text-transform:uppercase;
  color:var(--ink-3); text-align:center; width:90px; white-space:nowrap; background:none; border:0; }
.ld-chip[data-k="rings"] i{ border-radius:50%; background:transparent; border:1.5px dashed var(--c); }
.ld-chip[data-k="rings"][aria-pressed="false"] i{ box-shadow:none; }