/* ============================================================
   HUBS (2026-10-09): CondoHub, PreDevHub, Leasing Communities and
   the 455 static leasing community pages, rebuilt on the site-wide
   kit (assets/services.css .k-* layer + assets/services.js window.K).
   Loads AFTER site.css and services.css. Everything here is page-
   scoped (.hub-*) or a narrow override under .hub-page; the kit and
   .svc-* files stay untouched.

   PAGE SKELETON (the three hubs)
     <html class="no-js"> + the 1-line head script (swaps to "js")
     <body class="k-page hub-page">
       #site-header (CHROME)
       section.k-hero-data#top            1. compact data hero: loop + runtime KPIs + "as of"
       section#browse                     2. .k-filters[data-k-filters="2"] (sticky one-row bar + Quick picks) + .k-sec > .k-split-head + .k-split[data-k-split="2"] (list; Map mode on demand)
       section.k-sec.k-dark               3. the numbers (kit kpis + chart + ranked bars)
       ...page sections                   4. story / FAQ (light, k-alt)
       section.k-sec.lead-band.svc-close  n. closing band: portrait sign-off + the page's lead form
       #site-footer (CHROME)
     (the quick-view <dialog> was retired 2026-10-19: cards link to the building pages)
     scripts (all defer): leaflet, markercluster, data files, data.js,
       site.js, services.js, the hub script.

   COMPONENTS
   .hub-page            body hook (filters body flows in rows on desktop; --k-stick = 0)
   .hub-find            search pill in a hero copy column (PreDevHub #a-find)
   .hub-achips          page-rendered removable chips next to the kit's .k-achips
   .hub-scope           the "Map area only" chip group (hidden; the map's .k-map-switch mirrors it in Map mode)
   .hub-pin / .hub-cluster / .hub-draw / .hub-draw-hint   map markers, clusters, lasso control
   .hub-group           neighborhood row inside .k-cards (spans the grid)
   .hub-hood            hood tag on a card image (button: filters to that hood)
   .hub-promo           amber in-grid card (report / brief CTA)
   .hub-qv              the card's "Building page →" line (the card's title anchor is the link; it stretches over the card)
   .hub-pop             pin tap preview inside a Leaflet popup: one link to the page (name, area, one fact)
   .hub-popular         the "Popular" badge (top 5 percent by the hub's Recommended score), inside .hub-badges
   .hub-report          reports split (copy | showcase card)
   .hub-index           the generated LEASING-LINKS block (details > p rows)
   .hub-sat             Esri World Imagery 2x2 composite centred on a coordinate
   .hub-rent            rent tiles / lines on the community page
   .b-glance            "At a glance" summary in a community page hero (scripts/lib/glance.mjs)
   .lh-shortlist        leasing directory: one-link strip under the hero CTAs to the page's lead form
   ============================================================ */

/* ---------- page hook ---------- */
.hub-page { --k-stick: 0px; }
.hub-page main { display: block; }
.hub-page .k-hero-data .k-kpi .v { font-variant-numeric: tabular-nums; }
.hub-page .k-hero-data .k-kpi .m { font-size: 11px; }
.hub-page .k-hero-data .hero-ctas .btn-ghost { color: #fff; }
.hub-page .k-hero-in { min-height: min(58vh, 560px); }
.hub-page .k-hero-side .k-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.hub-page .k-hero-side .k-kpi .v { white-space: nowrap; overflow-wrap: normal; }
@media (min-width: 981px) { .hub-page .k-hero-side { min-width: 360px; } .hub-page .k-hero-side .k-kpi .v { font-size: clamp(1.45rem, 2.1vw, 1.9rem); } }

/* search pill in a hero copy column (PreDevHub keeps its #a-find form) */
.hub-find { display: flex; align-items: center; gap: 8px; margin-top: 22px; max-width: 520px; padding: 6px 6px 6px 16px; border-radius: 999px; background: rgba(255,255,255,.1); border: 1.5px solid rgba(255,255,255,.22); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); transition: border-color .15s ease; }
.hub-find:focus-within { border-color: var(--amber); }
.hub-find svg { width: 17px; height: 17px; flex: none; stroke: var(--amber); fill: none; stroke-width: 2.2; stroke-linecap: round; }
.hub-find input { flex: 1; min-width: 0; background: none; border: 0; outline: none; color: #fff; font: 600 14.5px 'Sora', 'Sora Fallback', sans-serif; padding: 9px 0; }
.hub-find input::placeholder { color: rgba(255,255,255,.6); font-weight: 500; }
.hub-find input:focus-visible { outline: none; }
.hub-find .btn { padding: 10px 16px; font-size: 13.5px; }

/* ---------- filter bar: the browse kit v2 (services.css [data-k-filters="2"]) ----------
   2026-10-20: one row (search, Area pill, dropdown menus, More filters, Sort, List | Map) + the Quick
   picks row; the sheet holds the rest at every width. The 2026-10-19 "All filters" fold is gone. */
/* phones: the floating Map / List button (.k-split-fab) is the toggle; the bar's copy of it took a row of its own,
   so the stuck bar was 150px tall at 390 (ux 10-13). Both stay in sync (services.js setView). */
@media (max-width: 760px) { .hub-page .k-filters .k-view { display: none; } }
/* phones: the sheet's Area / Sort selects get a row each; side by side they clipped their values
   ("All neighborhooc", "Entrega: la más pı", "Más cerca de D") at 360-390 (ux 10-13) */
@media (max-width: 480px) { .hub-page .k-fseg-selects { grid-template-columns: minmax(0, 1fr); } }
/* the "Map area only" chip stays in the bar for the kit's state but never shows: the map's own
   "Search as I move" switch (.k-map-switch, drawn by the hub script) mirrors it in Map mode */
.hub-page .hub-scope { display: none; }
/* chip counts: 11.5px (the kit's 10.5px passed contrast but read as fine print; ux audit 10-16) */
.hub-page .k-chip .ct { font-size: 11.5px; }
/* the one-sentence rule next to the result count ("Recommended: ...", the Pets note) */
.hub-why { font-weight: 500; color: var(--k-dim); }

/* ---------- map ---------- */
.hub-page .k-map { background: #E9E7E1; }
.hub-page .k-map .leaflet-control-zoom a { background: #fff; color: var(--ink); border-color: var(--hairline); width: 34px; height: 34px; line-height: 34px; }
.hub-page .k-map .leaflet-control-attribution { background: rgba(255,255,255,.78); color: #5A5F68; font-size: 9.5px; }
.hub-page .k-map .leaflet-control-attribution a { color: #3d4148; }
.hub-pin { position: relative; width: 16px; height: 16px; cursor: pointer; }
.hub-pin .k-pin { position: absolute; inset: 0; }
.hub-pin.is-dim .k-pin { width: 11px; height: 11px; margin: 2.5px; background: #8B9099; border-color: #fff; }
.hub-pin .lbl { display: none; position: absolute; left: 50%; top: 19px; transform: translateX(-50%); max-width: 150px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding: 3px 7px; border-radius: 5px; background: rgba(255,255,255,.94); border: 1px solid var(--hairline); color: var(--ink); font: 700 10px 'Sora', 'Sora Fallback', sans-serif; letter-spacing: .01em; pointer-events: none; box-shadow: 0 2px 8px rgba(0,0,0,.12); }
.k-map.zlbl .hub-pin .lbl, .hub-pin.on .lbl { display: block; }
.hub-pin.on .lbl { border-color: var(--amber); }
.hub-pin.on .k-pin { transform: scale(1.25); background: #fff; border-color: var(--amber); }
.hub-cluster { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; border-radius: 50%; background: var(--amber); color: var(--ink); border: 2.5px solid #fff; font: 800 12.5px/1 'Sora', 'Sora Fallback', sans-serif; font-variant-numeric: tabular-nums; box-shadow: 0 3px 12px rgba(0,0,0,.25); }
.hub-cluster.is-big { font-size: 13.5px; }
.hub-tip { background: var(--ink) !important; border: 0 !important; border-radius: 8px !important; color: #fff !important; font: 600 12px 'Sora', 'Sora Fallback', sans-serif !important; padding: 7px 11px !important; box-shadow: 0 10px 24px -10px rgba(0,0,0,.5) !important; }
.hub-tip::before { display: none !important; }
/* pin tap: a one-line preview that is itself the link to the page (2026-10-19; no sheet) */
.hub-pop { display: block; font: 600 12.5px 'Sora', 'Sora Fallback', sans-serif; color: var(--ink); text-decoration: none; }
.hub-pop b { display: block; font-size: 13.5px; }
.hub-pop b .go { color: #8A5B00; }
.hub-pop .m { display: block; color: var(--ink-soft); font-weight: 500; font-size: 11.5px; margin-top: 2px; }
a.hub-pop:hover b { color: #8A5B00; }
.hub-page .leaflet-popup-content-wrapper { border-radius: 12px; box-shadow: 0 14px 34px -14px rgba(0,0,0,.4); }
.hub-page .leaflet-popup-content { margin: 12px 14px; }
/* lasso control (Leaflet top-left) */
.hub-draw button { display: inline-flex; align-items: center; gap: 7px; cursor: pointer; white-space: nowrap; min-height: 36px; padding: 0 14px; border-radius: 999px; border: 1.5px solid var(--hairline); background: #fff; color: var(--ink); font: 700 12.5px 'Sora', 'Sora Fallback', sans-serif; box-shadow: 0 6px 18px -8px rgba(0,0,0,.35); transition: border-color .15s ease, background .15s ease, color .15s ease; }
.hub-draw button svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.hub-draw button:hover { border-color: var(--ink); }
.hub-draw button.armed { background: var(--amber); border-color: var(--amber); }
.k-map.drawing, .k-map.drawing .leaflet-container, .k-map.drawing .leaflet-interactive { cursor: crosshair !important; touch-action: none; }
.hub-draw-hint { position: absolute; left: 50%; top: 14px; z-index: 800; transform: translateX(-50%); padding: 9px 16px; border-radius: 999px; background: var(--amber); color: var(--ink); font: 600 11.5px 'Sora', 'Sora Fallback', sans-serif; white-space: nowrap; pointer-events: none; box-shadow: 0 6px 18px rgba(0,0,0,.25); }
.hub-page .k-map-note { justify-content: space-between; }

/* ---------- cards in the split ---------- */
.hub-group { grid-column: 1 / -1; display: flex; align-items: baseline; gap: 12px; padding: 14px 2px 0; }
.hub-group b { font-size: 15px; letter-spacing: -.01em; color: var(--k-text); }
.hub-group span { font-size: 11.5px; font-weight: 600; color: var(--k-dim); white-space: nowrap; font-variant-numeric: tabular-nums; }
.hub-group::after { content: ''; flex: 1; height: 1px; background: var(--k-line-2); align-self: center; }
.hub-group:first-child { padding-top: 0; }
.hub-page .k-card.is-link { cursor: pointer; }
/* the card is one link (2026-10-19, item 12): the title anchor stretches over the card, so a click,
   cmd-click and middle-click behave like any link; real controls inside (hood tag, price-sheet link,
   gallery button, CTA row) sit above it; decorations (badges, caption, status) let clicks through */
.hub-page .k-card.is-link h3 a { color: inherit; text-decoration: none; }
.hub-page .k-card.is-link h3 a::after { content: ''; position: absolute; inset: 0; z-index: 1; }
.hub-page .k-card.is-link h3 a:focus-visible { outline: none; }
.hub-page .k-card.is-link:has(h3 a:focus-visible) { outline: 3px solid var(--k-focus); outline-offset: 3px; }
.hub-page .k-card-img :is(.hub-badges, .k-card-cap, .k-status) { pointer-events: none; }
.hub-qv.is-off { color: var(--k-dim); cursor: default; }
.hub-page .k-card-img { background: #E9E7E1; }
.hub-page .k-bldg .k-card-img, .hub-page .k-project .k-card-img, .hub-page .k-community .k-card-img { aspect-ratio: 16 / 10; }
.hub-sat { position: absolute; width: 512px; height: 512px; pointer-events: none; }
.hub-sat img { position: absolute; width: 256px; height: 256px; max-width: none; }
.hub-page .k-card-img > img.ph { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 1; }
.hub-hood { position: absolute; left: 10px; top: 10px; z-index: 2; cursor: pointer; padding: 4px 9px; border-radius: 6px; border: 1px solid rgba(255,255,255,.35); background: rgba(11,13,16,.72); color: #fff; font: 700 10px 'Sora', 'Sora Fallback', sans-serif; letter-spacing: .08em; text-transform: uppercase; backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); transition: background .15s ease, color .15s ease; }
.hub-hood:hover { background: var(--amber); color: var(--ink); border-color: var(--amber); }
.hub-page .k-card-img .badge { z-index: 2; }
.hub-page .k-card-img .k-card-cap { z-index: 2; }
.hub-page .k-card-img .k-status { z-index: 2; left: auto; right: 10px; }
.hub-page .k-card-body h3 { font-size: 1.02rem; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.hub-page .k-bldg-hood { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hub-page .k-live { margin-top: 8px; padding-top: 10px; border-top: 1px solid var(--k-line); display: grid; gap: 4px; font-size: 12.5px; }
.hub-page .k-live span { display: flex; align-items: baseline; gap: 6px; min-width: 0; }
.hub-page .k-live .fr { margin-left: auto; font-weight: 600; color: var(--k-text); white-space: nowrap; }
/* the count + label never break ("en / alquiler" split at 360 in Spanish); the price drops to its own line instead (ux 10-13) */
.hub-page .k-live span:not(.quiet) { flex-wrap: wrap; white-space: nowrap; }
.hub-page .k-live .dim { color: var(--k-dim); }
.hub-page .k-live .dim b { color: var(--k-dim); font-weight: 600; }
.hub-page .k-live .quiet { color: var(--k-dim); font-size: 12px; line-height: 1.5; }
.hub-page .k-live .dot { width: 6px; height: 6px; border-radius: 50%; background: var(--amber); flex: none; align-self: center; }
.hub-page .k-live .dot.off { background: var(--k-line-2); }
.hub-qv { display: inline-flex; align-items: center; gap: 6px; margin-top: auto; padding: 8px 0 0; border: 0; background: none; cursor: pointer; font: 700 13.5px 'Sora', 'Sora Fallback', sans-serif; color: var(--k-text); text-align: left; }
.hub-qv span { color: var(--k-accent); transition: transform .15s ease; }
.hub-page .k-card.is-link:hover .hub-qv span, .hub-qv:hover span { transform: translateX(4px); }
.hub-page .k-card-body .k-kv { margin-top: 6px; }
.hub-page .k-kv.is-tight div { padding: 4px 0; font-size: 12.5px; }
.hub-page .k-kv.is-tight div:first-child { border-top: 0; }
.hub-page .k-kv.is-row { display: flex; flex-wrap: wrap; gap: 4px 16px; }
.hub-page .k-kv.is-row div { padding: 0; border: 0; gap: 5px; justify-content: flex-start; }
.hub-promo { background: var(--amber); border-color: var(--amber); color: var(--ink); justify-content: center; }
.hub-promo .k-card-body { gap: 10px; padding: 22px 22px; }
.hub-promo b { font: 800 17px/1.3 'Sora', 'Sora Fallback', sans-serif; letter-spacing: -.02em; }
.hub-promo p { font-size: 13px; font-weight: 500; color: rgba(16,17,20,.78); line-height: 1.55; }
.hub-promo button { align-self: flex-start; margin-top: 2px; cursor: pointer; border: 0; border-radius: 999px; padding: 10px 16px; background: var(--ink); color: #fff; font: 700 12.5px 'Sora', 'Sora Fallback', sans-serif; transition: transform .15s ease; }
.hub-promo button:hover { transform: translateY(-2px); }
/* the promo as one band below the first six cards (2026-10-19), not a card cell inside the grid */
.hub-promo.is-band { grid-column: 1 / -1; }
.hub-promo.is-band .k-card-body { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: 'b btn' 'p btn'; align-items: center; gap: 4px 24px; padding: 18px 22px; }
.hub-promo.is-band b { grid-area: b; }
.hub-promo.is-band p { grid-area: p; max-width: 60em; }
.hub-promo.is-band button { grid-area: btn; margin: 0; }
@media (max-width: 600px) { .hub-promo.is-band .k-card-body { grid-template-columns: minmax(0, 1fr); grid-template-areas: 'b' 'p' 'btn'; gap: 8px; } }
/* "Popular" (top 5 percent by the hub's score) and the other image badges share one bottom-left row */
.hub-badges { position: absolute; left: 10px; bottom: 10px; z-index: 2; display: flex; flex-wrap: wrap; gap: 6px; }
.hub-badges .badge { position: static; }
.hub-popular { display: inline-flex; align-items: center; gap: 5px; padding: 4px 9px 4px 7px; border-radius: 6px; background: var(--amber); color: var(--ink); font: 800 9.5px 'Sora', 'Sora Fallback', sans-serif; letter-spacing: .12em; text-transform: uppercase; box-shadow: 0 2px 8px rgba(0,0,0,.18); }
.hub-popular svg { width: 11px; height: 11px; fill: var(--ink); }
/* "Show more" under the cards (replaced the page numbers, 2026-10-19) */
.hub-more .hub-more-n { font-size: 12.5px; font-weight: 600; color: var(--k-dim); font-variant-numeric: tabular-nums; }
#bmore { flex-wrap: wrap; align-items: center; gap: 8px 16px; }
.hub-page .k-empty { grid-column: 1 / -1; }
.hub-page .k-split-head { align-items: start; }
/* the stamp wraps when the list column is narrow (ux 10-13: the Spanish stamp ran 110px past the viewport at 1024) */
.hub-page .k-split-head .k-asof { min-width: 0; text-wrap: pretty; }
.hub-page .k-split-list .k-note { margin-top: 18px; }
.hub-page .k-split-list .k-pager { margin-top: 18px; }
.hub-page .k-skel-card .k-skel-img { aspect-ratio: 16 / 10; }
.hub-more { display: flex; justify-content: center; margin-top: 18px; }
.hub-more .btn { padding: 12px 22px; font-size: 14px; }
.hub-more[hidden] { display: none; }

/* project cards (PreDevHub) */
.hub-page .k-chip .sub { font-weight: 500; opacity: .72; }
.hub-verif { display: inline-grid; place-items: center; width: 17px; height: 17px; margin-left: 3px; border-radius: 50%; background: #1B7A3D; color: #fff; font-size: 10px; font-weight: 800; vertical-align: 2px; }
.hub-page .k-project .k-dev { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* 2026-10-19 card: one fact line, one price line (three honest states), flags only when true */
.hub-fact { display: flex; flex-wrap: wrap; gap: 2px 0; margin-top: 8px; font-size: 12.5px; color: var(--k-dim); }
.hub-fact span { white-space: nowrap; }
.hub-fact span + span::before { content: '·'; margin: 0 6px; color: var(--k-line-2); }
.hub-fact b { color: var(--k-text); font-weight: 700; font-variant-numeric: tabular-nums; }
.hub-price { margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--k-line); font-size: 13px; color: var(--k-text); }
.hub-price b { font-weight: 700; font-variant-numeric: tabular-nums; }
.hub-price .dim { color: var(--k-dim); font-weight: 500; }
.hub-flags { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 8px; }
.hub-flags span { display: inline-flex; align-items: center; min-height: 22px; padding: 2px 8px; border-radius: 999px; border: 1px solid var(--k-line); font-size: 11px; font-weight: 600; color: var(--k-dim); white-space: nowrap; }
.hub-mini { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 16px; margin-top: 8px !important; }
.hub-mini div { flex-direction: column; align-items: flex-start; gap: 1px; padding: 7px 0 !important; border-top: 1px solid var(--k-line) !important; }
.hub-mini dt { font-size: 10px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.hub-mini dd { text-align: left; font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.hub-mini .dim { color: var(--k-dim); font-weight: 500; }
.hub-mini .yes { color: #1B7A3D; }
.hub-doc-link { position: relative; z-index: 2; display: inline-block; padding-block: 5px; margin-block: -5px; color: #8A5B00; text-decoration: underline; text-underline-offset: 2px; }  /* 30px target, same line box (was 15px tall); above the card's stretched link */
.hub-mini dd:has(.hub-doc-link) { overflow: visible; }  /* the dd's ellipsis clip cut the target back to 21px; the link text is short */
.hub-doc-link:hover { color: var(--ink); }

/* community cards (Leasing communities) */
.hub-page .k-community.is-unnamed .k-card-body h3 { color: var(--k-dim); }
.hub-page .k-community .k-card-body h3 a { color: inherit; text-decoration: none; }
.hub-page .k-community .k-card-body h3 a:hover { color: #8A5B00; }
.hub-page .k-community .k-card-img .k-status { left: 10px; right: auto; }
.hub-gal { position: absolute; inset: 0; z-index: 2; padding: 0; border: 0; background: none; cursor: zoom-in; display: block; width: 100%; }  /* above the card's stretched link: the photo opens the gallery */
.hub-gal img.ph { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.hub-gal:hover img.ph { transform: scale(1.03); }
.hub-addr { font-size: 12.5px; color: var(--k-dim); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hub-mgmt { font-size: 12px; font-weight: 600; color: var(--k-dim); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hub-rentline { margin-top: 6px; font-size: 12.5px !important; line-height: 1.5 !important; color: var(--k-text) !important; }
.hub-rentline b { font-variant-numeric: tabular-nums; }
.hub-rentline.is-live { padding: 7px 10px; border-radius: 8px; background: rgba(242,179,54,.14); border: 1px solid rgba(242,179,54,.45); font-weight: 600; }
.hub-pol, .hub-special { font-size: 12px !important; line-height: 1.5 !important; }
.hub-pol.is-unknown { color: var(--k-dim) !important; font-style: italic; }  /* Pets filter on: "policy not on file", never hidden as a no */
.hub-special { color: #8A5B00 !important; font-weight: 600; }
.hub-card-ctas { position: relative; z-index: 2; display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; margin-top: auto; padding-top: 12px; }  /* above the card's stretched link */
.hub-card-ctas .btn { padding: 10px 16px; font-size: 13px; }
.hub-card-ctas .hub-qv { margin-top: 0; padding: 0; text-decoration: none; }
.hub-key { display: inline-block; width: 9px; height: 9px; margin: 0 4px 0 2px; border-radius: 50%; background: var(--amber); border: 1.5px solid #16130E; vertical-align: -1px; }
.hub-key.is-dim { background: #8B9099; border-color: #fff; box-shadow: 0 0 0 1px rgba(16,17,20,.25); margin-left: 8px; }
#math .hub-index { margin-top: clamp(36px, 5vw, 56px); padding-top: 18px; border-top-color: rgba(16,17,20,.14); }
#math .hub-index summary { font-size: 15px; }

/* ---------- reports split (CondoHub) ---------- */
.hub-report { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: clamp(28px, 4vw, 60px); align-items: center; }
.hub-report .eyebrow { margin-bottom: 14px; }
.hub-report p { color: var(--ink-soft); margin-top: 16px; max-width: 43.1em; }  /* = 58ch of Sora 400; em, so the fallback wraps the same */
.hub-report .checklist { margin-top: 20px; }
.hub-report .hero-ctas { margin: 24px 0 0; }
.hub-report .hero-ctas .btn { color: var(--ink); }
.hub-showcase .k-card-img { aspect-ratio: 4 / 3; }
.hub-showcase .k-card-body h3 { -webkit-line-clamp: unset; display: block; }
@media (max-width: 860px) { .hub-report { grid-template-columns: minmax(0, 1fr); } .hub-showcase { max-width: 560px; } }

/* ---------- the numbers (dark) ---------- */
.hub-page .k-dark .k-kpis + .k-grid { margin-top: 14px; }
.hub-page .k-bars > * { display: block; padding: 6px 0; }  /* the row is a <div> holding one full-width <button> (filter) or <a> (page link) grid */
.hub-page .k-bars :is(button, a) { all: unset; display: grid; grid-template-columns: minmax(120px, 42%) minmax(0, 1fr) auto; align-items: center; gap: 6px 12px; cursor: pointer; width: 100%; box-sizing: border-box; }
.hub-page .k-bars :is(button, a):hover .l { color: var(--k-accent); }
.hub-page .k-bars :is(button, a):focus-visible { outline: 3px solid var(--k-focus); outline-offset: 2px; border-radius: 6px; }
.hub-page .k-chart-foot { margin-top: 14px; }
.hub-page .k-bars > .is-static, .hub-page .k-bars > * > .is-static { display: grid; grid-template-columns: minmax(120px, 42%) minmax(0, 1fr) auto; align-items: center; gap: 6px 12px; }
.hub-page .k-bars > .is-static .l { color: var(--k-dim); }
.hub-page .k-dark .k-grid + .k-grid { margin-top: 14px; }
.hub-foot { margin-top: 22px; display: flex; flex-wrap: wrap; gap: 10px 26px; align-items: center; justify-content: space-between; font-size: 12.5px; color: var(--k-dim); }
.hub-foot a { color: var(--amber); font-weight: 600; text-decoration: none; display: inline-flex; align-items: center; gap: 7px; }
.hub-foot a .arr { transition: transform .18s ease; }
.hub-foot a:hover .arr { transform: translateX(4px); }
.hub-foot .links { display: flex; flex-wrap: wrap; gap: 8px 22px; }
@media (max-width: 900px) {  /* stacked rows until the two bar panels are wide enough for full names */
  .hub-page .k-bars :is(button, a), .hub-page .k-bars .is-static { grid-template-columns: minmax(0, 1fr) auto; }
  .hub-page .k-bars :is(button, a) .t, .hub-page .k-bars .is-static .t { grid-column: 1 / -1; order: 3; }
}

/* ---------- FAQ (svc-faq inside k-alt) ---------- */
.hub-page .svc-faq { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(28px, 4vw, 56px); align-items: start; }
.hub-page .svc-faq-head { position: sticky; top: 24px; }
.hub-page .svc-faq-head p { margin-top: 14px; color: var(--ink-soft); font-size: 15px; line-height: 1.7; }
.hub-page .svc-faq-head p a { color: var(--ink); font-weight: 700; }
@media (max-width: 860px) { .hub-page .svc-faq { grid-template-columns: minmax(0, 1fr); } .hub-page .svc-faq-head { position: static; } }

/* ---------- closing band ---------- */
/* the form keeps its natural height (the textarea used to stretch to the copy column) and rides along on desktop */
.hub-page .svc-close .lead-grid { align-items: start; }
@media (min-width: 981px) { .hub-page .svc-close .lead-form { position: sticky; top: 24px; } }
.hub-page .lead-band .cur-b { display: flex; align-items: baseline; gap: 12px; margin-bottom: 16px; padding: 11px 14px; border: 1px solid rgba(242,179,54,.45); background: rgba(242,179,54,.08); border-radius: 9px; }
.hub-page .lead-band .cur-b .k { flex: none; font-size: 9.5px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--amber); }
.hub-page .lead-band .cur-b .v { font-size: 13px; font-weight: 600; color: #fff; }
.hub-page .lead-band .cur-b[hidden] { display: none; }
.hub-page .lead-band .checklist { margin: 8px 0 22px; }

/* ---------- the generated LEASING-LINKS block ---------- */
.hub-index { margin-top: 22px; border-top: 1px solid var(--k-line-2); padding-top: 14px; }
.hub-index summary { cursor: pointer; list-style: none; display: flex; align-items: center; gap: 10px; padding: 6px 0; font: 700 13.5px 'Sora', 'Sora Fallback', sans-serif; color: var(--k-text); }
.hub-index summary::-webkit-details-marker { display: none; }
.hub-index summary::before { content: '+'; display: inline-grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; border: 1.5px solid var(--k-text); font-weight: 800; font-size: 14px; line-height: 1; }
.hub-index[open] summary::before { content: '–'; }
.hub-index-body { margin-top: 12px; font-size: 13px; line-height: 1.9; color: var(--k-dim); columns: 2; column-gap: 32px; }
.hub-index-body p { margin: 0 0 10px; break-inside: avoid; }
.hub-index-body b { color: var(--k-text); }
.hub-index-body a { color: var(--k-text); text-decoration: none; font-weight: 500; }
.hub-index-body a:hover { color: var(--k-accent); text-decoration: underline; text-underline-offset: 2px; }
@media (max-width: 860px) { .hub-index-body { columns: 1; } }

/* ---------- community page (leasing/<slug>/) ---------- */
/* hero: the community's photo (900px squares, so it sits under a heavier scrim) or the parcel from
   above (one Esri export image framed with the community at 70% / 50%; the pin marks it at any crop) */
.hub-lp .k-hero-media.is-sat img { object-position: 70% 25%; }
.hub-lp .k-hero-media.has-photo::after { background: linear-gradient(90deg, rgba(11,13,16,.92) 0%, rgba(11,13,16,.78) 45%, rgba(11,13,16,.5) 75%, rgba(11,13,16,.62) 100%), linear-gradient(to top, rgba(11,13,16,.92) 0%, rgba(11,13,16,.15) 55%); }
.hub-lp .k-hero-media.is-sat::after { background: linear-gradient(90deg, rgba(11,13,16,.9) 0%, rgba(11,13,16,.7) 42%, rgba(11,13,16,.2) 70%, rgba(11,13,16,.42) 100%), linear-gradient(to top, rgba(11,13,16,.9) 0%, rgba(11,13,16,.1) 50%); }
.hub-sat-pin { position: absolute; left: 70%; top: 25%; z-index: 1; width: 18px; height: 18px; margin: -9px 0 0 -9px; border-radius: 50%; background: var(--amber); border: 3px solid #16130E; box-shadow: 0 0 0 6px rgba(242,179,54,.28), 0 4px 14px rgba(0,0,0,.5); }
.hub-sat-pin::after { content: ''; position: absolute; inset: -9px; border-radius: 50%; border: 2px solid rgba(242,179,54,.7); animation: hub-ping 2.4s ease-out infinite; }
@keyframes hub-ping { from { transform: scale(.6); opacity: 1; } to { transform: scale(2.2); opacity: 0; } }
.hub-lp .k-hero-media .k-card-cap { z-index: 2; left: auto; right: 14px; bottom: 12px; }
/* phones: the copy covers the whole hero, so the credit sits on the bottom edge (at the top it ran
   into the breadcrumb) and the parcel pin, which landed inside the H1, steps aside (the map below marks it) */
@media (max-width: 760px) {
  .hub-lp .k-hero-media .k-card-cap { top: auto; bottom: 6px; right: var(--pad); font-size: 9.5px; }
  .hub-lp .hub-sat-pin { display: none; }
}
.hub-photos-btn { cursor: pointer; display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 0 16px; border-radius: 999px; border: 1.5px solid rgba(255,255,255,.3); background: rgba(11,13,16,.45); color: #fff; font: 700 13.5px 'Sora', 'Sora Fallback', sans-serif; backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); transition: border-color .15s ease; }
.hub-photos-btn:hover { border-color: var(--amber); }
.hub-lp .k-hero-data h1 { max-width: 15.38em; }  /* = 20ch of Sora 800; em, so the fallback wraps the same (no swap shift in the hero) */
.hub-lp-sub { margin-top: 8px; font-size: 13.5px; font-weight: 600; color: rgba(255,255,255,.72); }
/* "At a glance" (2026-10-13): the answer-first summary under the CTA row of each /leasing/<slug>/ hero
   (scripts/lib/glance.mjs; same look as building.css .b-glance on the condo pages) */
.b-glance { margin-top: 20px; max-width: 44em; padding-left: 14px; border-left: 2px solid var(--amber); font-size: 13.5px; line-height: 1.6; color: rgba(255,255,255,.82); text-wrap: pretty; }
.b-glance-k { display: block; margin-bottom: 3px; font-size: 10.5px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--amber); }
.b-glance-src { color: rgba(255,255,255,.66); }
@media (max-width: 700px) { .b-glance { margin-top: 16px; font-size: 13px; } }
/* leasing directory: the "shortlist" strip under the hero CTAs, one link to the page's own lead form (#lh-claim) */
.lh-shortlist { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 4px 16px; margin-top: 16px; max-width: 40em; padding: 12px 16px; border: 1px solid rgba(255,255,255,.2); border-left: 3px solid var(--amber); border-radius: 12px; background: rgba(11,13,16,.6); color: rgba(255,255,255,.88); font-size: 14px; line-height: 1.5; text-decoration: none; -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); transition: border-color .15s ease, background-color .15s ease; }
.lh-shortlist b { color: var(--paper); }
.lh-shortlist .go { font-weight: 700; color: var(--amber); white-space: nowrap; }
.lh-shortlist:hover { border-color: rgba(242,179,54,.75); background: rgba(11,13,16,.75); }
.lh-shortlist:focus-visible { outline: 2px solid var(--amber); outline-offset: 3px; }
@media (prefers-reduced-motion: reduce) { .lh-shortlist { transition: none; } }
.hub-lp .k-hero-data .k-lede { max-width: 44em; }
.hub-lp .hero-ctas { align-items: center; }
.hub-lp .hero-ctas .btn-ghost { color: #fff; }
.hub-lp .hero-ctas .lp-site { align-self: center; font: 600 13px 'Sora', 'Sora Fallback', sans-serif; color: rgba(255,255,255,.8); text-decoration: none; }
.hub-lp .hero-ctas .lp-site:hover { color: var(--amber); }
.hub-lp .k-hero-side .k-kpi.is-hot { border-color: rgba(242,179,54,.6); }
.hub-lp .k-hero-side .k-kpi.is-hot .v { color: var(--amber); }
.hub-lp .k-hero-side .k-kpi.is-hot .k::before { content: ''; display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: var(--amber); margin-right: 6px; vertical-align: 1px; animation: pulse 2.2s ease-in-out infinite; }
/* gallery strip with fewer than five photos */
.k-gallery.is-n2 { grid-template-columns: 1fr 1fr; grid-template-rows: 1fr; }
.k-gallery.is-n2 > *:first-child { grid-row: auto; }
.k-gallery.is-n3 { grid-template-columns: 2fr 1fr; }
.k-gallery.is-n4 { grid-template-columns: 2fr 1fr 1fr; }
.k-gallery.is-n4 > *:last-child { grid-column: span 2; }
@media (max-width: 700px) { .k-gallery.is-n2, .k-gallery.is-n3, .k-gallery.is-n4 { grid-template-columns: 1fr 1fr; } .k-gallery.is-n4 > *:last-child { grid-column: auto; } .k-gallery.is-n2 > *:first-child { grid-column: auto; aspect-ratio: 4 / 3; } }
.hub-rent-stamp { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }
.hub-lp .k-gallery { margin-top: 0; }
/* tiles keep one size whatever their count (ux 10-13: a lone tile used to stretch 1,144px wide at 1440) */
.hub-rent .k-kpis { grid-template-columns: repeat(auto-fill, minmax(min(100%, 200px), 1fr)); max-width: 940px; margin-top: 20px; }
@media (max-width: 600px) { .hub-rent .k-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.hub-rent .k-kpi.is-live { border-color: rgba(242,179,54,.5); }
.hub-rent .k-kpi.is-live .v { color: var(--amber); }
.hub-rent-line { margin-top: 18px; font-size: 14.5px; color: #C9CDD4; line-height: 1.6; }
.hub-rent-line b { color: var(--amber); font-variant-numeric: tabular-nums; }
.hub-rent-sheet { margin-top: 20px; font-size: 15px; color: #fff; line-height: 1.7; }
.hub-rent-special { margin-top: 12px; font-size: 14px; font-weight: 600; color: var(--amber); }
.hub-rent-none { margin-top: 20px; font-size: 14.5px; line-height: 1.7; color: #9AA0A8; max-width: 46.07em; }
.hub-rent-none a { color: var(--amber); font-weight: 700; }
.hub-rent .k-note { margin-top: 16px; max-width: 59.44em; }
/* B9 rent history (<details> under the rent tiles) shipped unstyled: its bullets hung 12px outside the content edge
   (8px from the screen edge at 390), the list ran at body size and the summary sat 6px under the tiles (ux 10-13).
   Same summary as the kit's .k-chart-table. */
.hub-rent-hist { margin-top: 18px; max-width: 59.44em; border-top: 1px solid var(--k-line); }
.hub-rent-hist summary { cursor: pointer; list-style: none; padding: 10px 0; font-size: 12.5px; font-weight: 700; color: var(--k-dim); }
.hub-rent-hist summary::-webkit-details-marker { display: none; }
.hub-rent-hist summary::before { content: '+ '; color: var(--k-accent); }
.hub-rent-hist[open] summary::before { content: '– '; }
.hub-rent-hist ul { list-style: none; display: grid; gap: 8px; padding-bottom: 4px; }
.hub-rent-hist li { position: relative; padding-left: 16px; font-size: 13.5px; line-height: 1.6; color: var(--k-dim); font-variant-numeric: tabular-nums; }
.hub-rent-hist li::before { content: ''; position: absolute; left: 1px; top: .62em; width: 6px; height: 6px; border-radius: 50%; background: var(--amber); }
.hub-rent-hist li b { color: var(--k-text); font-weight: 700; }
.hub-profile { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(300px, .85fr); gap: clamp(24px, 4vw, 48px); align-items: start; }
.hub-profile .k-map { height: auto; aspect-ratio: 16 / 10.5; min-height: 0; max-height: none; }
.hub-profile .k-map-note a { color: var(--ink); font-weight: 600; }
.hub-record { border: 1px solid var(--hairline); border-radius: var(--radius); background: #FBFAF7; padding: clamp(20px, 3vw, 28px); }
.hub-record h3 { margin-bottom: 6px; }
.hub-record .k-facts { grid-template-columns: minmax(0, 1fr); gap: 0; margin-top: 10px; }
.hub-record .btn { width: 100%; justify-content: center; margin-top: 18px; white-space: normal; text-align: center; }
.hub-record .hub-crosslinks { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 14px; }
.hub-record .hub-crosslinks a { display: inline-flex; align-items: center; gap: 6px; padding: 7px 12px; border-radius: 999px; border: 1px solid var(--hairline); background: #fff; color: var(--ink); text-decoration: none; font-size: 12.5px; font-weight: 600; transition: background .15s ease, color .15s ease, border-color .15s ease; }
.hub-record .hub-crosslinks a:hover { background: var(--ink); color: #fff; border-color: var(--ink); }
.hub-record .hub-crosslinks a span { color: #8A5B00; }
.hub-record .hub-crosslinks a:hover span { color: var(--amber); }
@media (max-width: 860px) { .hub-profile { grid-template-columns: minmax(0, 1fr); } }
.hub-play { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(22px, 3vw, 44px); }
.hub-play .num { font-size: clamp(2.3rem, 4vw, 3.2rem); font-weight: 800; letter-spacing: -.035em; line-height: 1; font-variant-numeric: tabular-nums; }
.hub-play .num .hl { background-image: linear-gradient(transparent 70%, var(--amber) 70%, var(--amber) 96%, transparent 96%); padding-inline: 2px; }
.hub-play h3 { margin: 14px 0 10px; }
.hub-play p { font-size: 14px; color: var(--ink-soft); line-height: 1.65; }
@media (max-width: 860px) { .hub-play { grid-template-columns: minmax(0, 1fr); gap: 26px; } }
.hub-lp .k-nearby { grid-auto-columns: minmax(240px, 1fr); }
.hub-lp .k-near .k-near-m i { font-weight: 800; }
.hub-missing { text-align: center; padding: clamp(60px, 10vw, 120px) 0; }
.hub-missing h2 { font-size: clamp(1.8rem, 4vw, 2.8rem); color: #fff; }
.hub-missing p { color: #9aa0a8; margin-top: 14px; }
.hub-missing .btn { margin-top: 26px; }

/* ---------- the generated CONDO-LINKS block (CondoHub): markup untouched, styled around ----------
   It follows the FAQ (k-alt), so it continues that band instead of floating on paper. */
.hub-page #condo-links { background: var(--paper-deep); padding-bottom: clamp(48px, 6vw, 80px) !important; }
.hub-page #condo-links .wrap::before { content: ''; display: block; height: 1px; margin-bottom: clamp(26px, 3.5vw, 36px); background: rgba(16,17,20,.14); }
.hub-page .hub-faq-tight { padding-bottom: clamp(36px, 4vw, 52px); }
.hub-page #condo-links .eyebrow { margin-bottom: 4px; }
/* generated CONDO-LINKS block: its "Full directory" link is inline amber on paper (1.57:1).
   Markup stays as generated; ink text with an amber underline keeps the accent and passes contrast */
.hub-page #condo-links p > a[href="/condos/"] { color: var(--ink) !important; text-decoration: underline !important; text-decoration-color: var(--amber) !important; text-decoration-thickness: 2px !important; text-underline-offset: 3px; }
.hub-page #condo-links div > a { background: #FBFAF7; transition: background .15s ease, color .15s ease, border-color .15s ease; }
.hub-page #condo-links div > a:hover { background: var(--ink) !important; color: #fff !important; border-color: var(--ink) !important; }

/* ---------- compact rows: building, project and community cards when the list is narrow ----------
   A container query on the list (services.css: .k-split[data-k-split="2"] .k-split-list is "klist"), so
   the same rules serve phones AND the results rail beside the map in Map mode (about 400px wide). */
@container klist (max-width: 600px) {
  .hub-page .k-cards :is(.k-bldg, .k-project) { display: grid; grid-template-columns: 112px minmax(0, 1fr); }
  .hub-page .k-cards :is(.k-bldg, .k-project) .k-card-img { aspect-ratio: auto; height: 100%; min-height: 140px; }
  .hub-page .k-cards :is(.k-bldg, .k-project) :is(.hub-hood, .k-card-cap) { display: none; }
  .hub-page .k-cards .k-bldg .badge { left: 6px; top: 6px; font-size: 9px; padding: 3px 6px; }
  /* the status chip takes the top edge, the Popular badge keeps the bottom one (they overlapped at the bottom, 2026-10-20) */
  .hub-page .k-cards .k-project .k-card-img .k-status { left: 6px; right: 6px; top: 6px; bottom: auto; justify-content: center; gap: 5px; padding: 3px 6px; font-size: 8.5px; letter-spacing: .05em; white-space: normal; text-align: center; }
  .hub-page .k-cards .k-project .k-card-img .k-status::before { display: none; }
  .hub-page .k-cards :is(.k-bldg, .k-project) .k-card-body { padding: 12px 14px 12px; gap: 3px; }
  .hub-page .k-cards :is(.k-bldg, .k-project) .k-card-body h3 { font-size: .95rem; }
  .hub-page .k-cards .k-bldg .k-bldg-hood, .hub-page .k-cards .k-project .k-dev { font-size: 11.5px; }
  .hub-page .k-cards .k-bldg .k-kv.is-row { gap: 2px 12px; margin-top: 2px; }
  .hub-page .k-cards .k-bldg .k-live { margin-top: 6px; padding-top: 7px; font-size: 12px; gap: 2px; }
  .hub-page .k-cards .k-project .hub-fact { margin-top: 4px; font-size: 12px; }
  .hub-page .k-cards .k-project .hub-price { margin-top: 5px; padding-top: 5px; font-size: 12.5px; }
  .hub-page .k-cards .k-project .hub-flags { margin-top: 5px; gap: 4px; }
  .hub-page .k-cards .k-project .hub-flags span { min-height: 20px; padding: 1px 7px; font-size: 10.5px; }
  .hub-page .k-cards :is(.k-bldg, .k-project, .k-community) .hub-badges { left: 6px; bottom: 6px; }
  .hub-page .k-cards :is(.k-bldg, .k-project, .k-community) .hub-popular { padding: 3px 7px 3px 5px; font-size: 8.5px; }
  .hub-page .k-cards :is(.k-bldg, .k-project) .hub-qv { padding-top: 4px; font-size: 12.5px; }
  /* communities: same row, the photo keeps its gallery button */
  .hub-page .k-cards .k-community { display: grid; grid-template-columns: 112px minmax(0, 1fr); }
  .hub-page .k-cards .k-community .k-card-img { aspect-ratio: auto; height: 100%; min-height: 150px; }
  .hub-page .k-cards .k-community .k-card-cap, .hub-page .k-cards .k-community .hub-mgmt { display: none; }
  .hub-page .k-cards .k-community .k-card-img .k-status { left: 6px; right: 6px; top: 6px; bottom: auto; justify-content: center; padding: 3px 5px; font-size: 8.5px; letter-spacing: .04em; }
  .hub-page .k-cards .k-community .k-card-img .k-status::before { display: none; }
  .hub-page .k-cards .k-community .k-card-body { padding: 12px 14px 12px; gap: 3px; }
  .hub-page .k-cards .k-community .k-card-body h3 { font-size: .95rem; }
  .hub-page .k-cards .k-community .hub-addr { font-size: 11.5px; }
  .hub-page .k-cards .k-community .k-kv.is-row { gap: 2px 12px; margin-top: 2px; }
  .hub-page .k-cards .k-community .hub-rentline { margin-top: 4px; font-size: 12px !important; }
  .hub-page .k-cards .k-community .hub-rentline.is-live { padding: 5px 8px; }
  .hub-page .k-cards .k-community :is(.hub-pol, .hub-special) { font-size: 11.5px !important; }
  .hub-page .k-cards .k-community .hub-card-ctas { gap: 6px 12px; padding-top: 8px; }
  .hub-page .k-cards .k-community .hub-card-ctas .btn { padding: 8px 12px; font-size: 12px; }
  .hub-page .k-cards .k-community .hub-card-ctas .hub-qv { font-size: 12px; }
}

/* ---------- reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
  .hub-hood, .hub-qv span, .hub-promo button, .hub-draw button { transition: none; }
  .hub-lp .k-hero-side .k-kpi.is-hot .k::before, .hub-sat-pin::after { animation: none; }
}

/* ---- WCAG 2.5.8 target size (Wave A PLACES, audit-core ticket "condohub 40+ targets < 24 px") ----
   Every control on the hubs is at least 24 x 24 CSS px; map pins keep their 16 px look inside a 24 px hit area. */
.hub-hood { min-height: 26px; padding: 5px 10px; }
.hub-qv { min-height: 28px; }
.hub-card-ctas .hub-qv { min-height: 28px; }
.hub-page .k-bars button { min-height: 28px; }
.hub-index-body a { display: inline-block; min-height: 24px; line-height: 24px; }
.hub-pin { width: 24px; height: 24px; }
.hub-pin .k-pin { inset: 4px; }
.hub-pin.is-dim .k-pin { margin: 6.5px; }
.hub-pin .lbl { top: 23px; }
.leaflet-control-attribution a { display: inline-block; min-height: 24px; line-height: 24px; }
/* CLS: the Area select fills its options after load; a fixed width keeps the filter row from reflowing */
#c-hood { width: 13.5em; max-width: 100%; }
/* Map mode (2026-10-20): the rail rows keep the hood tag and caption off (as on phones); the promo band
   and the neighborhood group rows stay out of the rail; the row's photo keeps its proportions */
.hub-page .k-split[data-view="map"] .hub-promo { display: none; }
.hub-page .k-split[data-view="map"] .k-card.on .hub-qv span { transform: translateX(4px); }
@media (max-width: 760px) {
  .hub-page .k-split[data-k-split="2"][data-view="map"] .k-cards :is(.k-bldg, .k-project, .k-community) .k-card-img { min-height: 0; }
  .hub-page .k-split[data-k-split="2"][data-view="map"] .k-cards .k-community .hub-card-ctas { display: none; }
}
/* the count line sits above the split in both modes (moved out of the list column, 2026-10-20) */
.hub-page .wrap > .k-split-head { margin-bottom: 14px; }
/* Map mode: the panel fills the viewport under the stuck bar (services.css); the section's top padding
   shrinks to 18px so only the count line sits between them (the hub script keeps --k-head-h on the split).
   List mode takes the same 18px (spacing audit 2026-10-20: it kept the k-tight 64px, 34 on phones, a blank
   band between the bar and the count line that the two modes did not share, so List / Map jumped by 46px) */
.hub-page .k-filters[data-k-filters="2"] + .k-sec,
.hub-page .k-sec:has(> .wrap > .k-split[data-k-split="2"][data-view="map"]) { padding-top: 18px; }