/* Public prospect page — editorial brochure look matched to the MGRE print
   brochure: warm white paper, classic serif display type, navy bands with gold
   accents. Light by default; sections carrying the (light-linework) plan
   drawings, the drone map and the contact block sit on navy bands. */
:root {
  --paper: #f8f6f1;
  --paper-2: #efeae0;
  --ink: #0f1f3a;
  --navy: #0f1f3a;
  --navy-2: #16305a;
  --gold: #b08a3e;      /* gold for use on white (AA contrast) */
  --gold-2: #d4af5f;    /* gold for use on navy */
  --good: #3f9d67;
  /* component tokens (swapped inside .dark bands) */
  --bg: var(--paper);
  --text: var(--ink);
  --muted: #62708a;
  --card: #fbf9f4;
  --cream: #fbf9f4;
  --cream-2: #ece6d8;   /* off-white for anything sitting on a navy band */
  --border: rgba(15, 31, 58, 0.13);
  --serif: 'Playfair Display', 'Iowan Old Style', Georgia, serif;   /* matches mollenhourgrossrealestate.com headings */
  --sans: 'Cantarell', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;   /* matches site body copy */
}
.dark {
  --bg: var(--navy);
  --text: #f4efe3;
  --muted: #a7b4c6;
  --card: #15294b;
  --border: rgba(212, 175, 95, 0.22);
  --gold: var(--gold-2);
  background: var(--bg);
  color: var(--text);
}

* { box-sizing: border-box; }
html, body { margin: 0; }
html { scroll-behavior: smooth; }
body { background: var(--paper); color: var(--ink); font-family: var(--sans); font-size: 16px; line-height: 1.6; -webkit-font-smoothing: antialiased; overflow-x: hidden; }
#tour { width: 100%; }
.wrap { max-width: 1120px; margin: 0 auto; padding: 0 32px; }
.tour-loading { text-align: center; padding: 20vh 0; color: var(--muted); }
img { max-width: 100%; }
a { color: inherit; }

/* ---- type ---- */
h1, h2, h3, .serif { font-family: var(--serif); font-weight: 400; letter-spacing: -0.005em; }
.kicker { font-family: var(--sans); font-size: 11.5px; font-weight: 700; letter-spacing: 0.16em; text-transform: uppercase; color: var(--gold); }

/* ---- buttons ---- */
.tour-btn {
  display: inline-block; font-family: var(--sans); font-size: 12.5px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase;
  line-height: 1; padding: 16px 26px; border-radius: 2px; text-decoration: none; white-space: nowrap;
  background: var(--ink); color: #fff; border: 1px solid var(--ink); transition: background .18s, color .18s, transform .18s;
}
.tour-btn:hover { background: var(--navy-2); border-color: var(--navy-2); transform: translateY(-1px); }
.tour-btn.ghost { background: transparent; color: var(--ink); }
.tour-btn.ghost:hover { background: rgba(15, 31, 58, 0.06); }
.tour-btn.sm { padding: 12px 18px; font-size: 11.5px; }
.dark .tour-btn { background: var(--gold-2); border-color: var(--gold-2); color: var(--navy); }
.dark .tour-btn:hover { background: #e2c47c; border-color: #e2c47c; }
.dark .tour-btn.ghost { background: transparent; color: var(--gold-2); border-color: rgba(212, 175, 95, 0.55); }
.dark .tour-btn.ghost:hover { background: rgba(212, 175, 95, 0.1); }

/* ---- header ---- */
.tour-head { background: var(--cream); border-bottom: 1px solid var(--border); }
.tour-head .wrap { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding-top: 16px; padding-bottom: 16px; }
.tour-logo { height: 66px; width: auto; display: block; }
.tour-head-r { display: flex; align-items: center; gap: 26px; }
.tour-status { display: inline-flex; align-items: center; gap: 9px; font-size: 11.5px; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink); }
.tour-status i { width: 8px; height: 8px; border-radius: 50%; background: var(--good); box-shadow: 0 0 0 3px rgba(63, 157, 103, 0.18); }

/* ---- photo hero ---- */
.tour-photo { position: relative; width: 100%; height: min(74vh, 700px); overflow: hidden; background: var(--navy); }
.tour-photo picture { display: block; width: 100%; height: 100%; }
.tour-photo-img { width: 100%; height: 100%; object-fit: cover; display: block; }
.tour-photo-scrim { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(8, 20, 38, 0.14) 0%, rgba(8, 20, 38, 0) 30%, rgba(8, 20, 38, 0.52) 66%, rgba(8, 20, 38, 0.92) 100%); }   /* the rendering is busy behind the headline, so the wash starts earlier */
.tour-photo-cap { position: absolute; left: 0; right: 0; bottom: 0; padding-bottom: 54px; color: #fff; }
.tour-photo-loc { font-size: 12px; font-weight: 700; letter-spacing: 0.2em; text-transform: uppercase; color: var(--gold-2); }
.tour-photo-cap h1 { font-size: clamp(36px, 5.2vw, 64px); line-height: 1.06; margin: 12px 0 0; color: #fff; }
.tour-hero-plain { padding: 72px 0 8px; }
.tour-hero-plain h1 { font-size: clamp(34px, 4.8vw, 56px); line-height: 1.06; margin: 10px 0 0; }
.tour-hero-plain .tour-photo-loc { color: var(--gold); }
.tour-hero-plain .tour-photo-tag { color: var(--ink); }

/* ---- sticky section nav ---- */
.tour-nav { position: sticky; top: 0; z-index: 40; background: rgba(248, 246, 241, 0.94); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border-bottom: 1px solid var(--border); }
.tour-nav .wrap { display: flex; align-items: center; gap: 0; }
.nav-links { display: flex; gap: 2px; flex: 1 1 auto; min-width: 0; overflow-x: auto; scrollbar-width: none; }
.nav-links a:first-child { margin-left: auto; } .nav-links a:last-child { margin-right: auto; } /* centered when it fits, scrollable when it doesn't */
.nav-links::-webkit-scrollbar { display: none; }
/* The logo slides in only after the masthead has scrolled off, so the two are never
   on screen at once, and it stays the way back to the top from anywhere on the page. */
.nav-home { flex: 0 0 auto; display: flex; align-items: center; width: 0; min-width: 0; opacity: 0; overflow: hidden;
  transition: width .22s ease, opacity .22s ease; }
.tour-nav.scrolled .nav-home { width: 110px; opacity: 1; }
.nav-home img { height: 52px; width: auto; display: block; }   /* the logo sets the sticky bar's height, so this is the ceiling before it gets chunky */
.tour-nav a { flex: 0 0 auto; font-size: 11px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--muted); text-decoration: none; padding: 19px 12px 17px; border-bottom: 2px solid transparent; white-space: nowrap; transition: color .15s, border-color .15s; }
.tour-nav a:hover { color: var(--ink); }
.tour-nav a.active { color: var(--ink); border-bottom-color: var(--gold); }

/* ---- lede: courtesy statement + the two live numbers ---- */
.tour-hero-cta { margin-top: 30px; }
.tour-hero-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; padding-top: 8px; }
.ths-lbl { font-size: 11.5px; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--muted); }
.ths-val { font-family: var(--serif); font-size: clamp(23px, 2.1vw, 29px); line-height: 1.15; color: var(--ink); margin-top: 10px; }
.ths-sub { font-size: 13px; color: var(--muted); margin-top: 6px; }
.tour-bar { width: 100%; height: 3px; background: var(--border); margin-top: 14px; overflow: hidden; }
.tour-bar-fill { height: 100%; background: var(--gold); }

/* ---- sections ---- */
.tour-sec { padding: 52px 0; }
.tour-sec.dark { padding: 56px 0; }
.sec-head { margin-bottom: 26px; }
.sec-title { font-size: clamp(27px, 3vw, 37px); line-height: 1.12; margin: 0; color: var(--text); }
.sec-title::before { content: ''; display: block; width: 46px; height: 2px; background: var(--gold); margin-bottom: 22px; }
.tour-stub { color: var(--muted); font-size: 15px; padding: 34px 0; border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); text-align: center; font-family: var(--serif); font-style: italic; font-size: 19px; }
.tour-specs-note { font-size: 13px; color: var(--muted); margin-top: 22px; }

/* ---- key facts band ---- */
.tour-facts { padding: 34px 0; }
.facts-grid { display: grid; grid-template-columns: repeat(4, 1fr); row-gap: 24px; }
.fact { padding: 2px 26px; border-left: 1px solid var(--border); }
.fact:nth-child(4n + 1) { border-left: none; padding-left: 0; }
.fact-v { font-family: var(--serif); font-size: clamp(20px, 1.9vw, 25px); line-height: 1.2; color: var(--gold-2); }
.fact-l { font-size: 14.5px; font-weight: 500; color: var(--muted); margin-bottom: 4px; }

/* ---- overview ---- */
.tour-bullets { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--border); }
.tour-bullets li { padding: 15px 0; border-bottom: 1px solid var(--border); font-size: 15.5px; line-height: 1.55; color: var(--text); }

/* ---- milestones ---- */
.mh-track { display: flex; overflow-x: auto; padding: 8px 0 8px; }
.mh { flex: 1 1 0; min-width: 110px; text-align: center; position: relative; padding-top: 34px; }
.mh-line { position: absolute; top: 7px; left: 0; width: 100%; height: 1px; background: var(--border); }
.mh.done .mh-line, .mh.current .mh-line { background: var(--gold); height: 2px; top: 6.5px; }
.mh-dot { position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 15px; height: 15px; border-radius: 50%; background: var(--paper); border: 1.5px solid var(--border); z-index: 1; }
.mh.done .mh-dot { background: var(--gold); border-color: var(--gold); }
.mh.current .mh-dot { background: var(--ink); border-color: var(--ink); box-shadow: 0 0 0 5px rgba(176, 138, 62, 0.25); }
.mh-name { font-size: 13px; font-weight: 700; padding: 0 8px; line-height: 1.3; min-height: 34px; color: var(--ink); }
.mh.done .mh-name { color: var(--muted); font-weight: 400; }
.mh-date { font-family: var(--serif); font-size: 14.5px; color: var(--muted); margin-top: 4px; }
.mh.current .mh-date { color: var(--gold); }
.tour-updated { display: inline-flex; align-items: center; gap: 9px; margin-top: 26px; font-size: 12.5px; color: var(--muted); }
.tour-live-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--good); box-shadow: 0 0 0 0 rgba(63, 157, 103, 0.5); animation: tourpulse 2s infinite; }
@keyframes tourpulse { 0% { box-shadow: 0 0 0 0 rgba(63, 157, 103, 0.5); } 70% { box-shadow: 0 0 0 7px rgba(63, 157, 103, 0); } 100% { box-shadow: 0 0 0 0 rgba(63, 157, 103, 0); } }

/* ---- suite table ---- */

/* ---- brochure ---- */
.broch-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: center; }
.broch-cover { display: block; }
.broch-cover img { display: block; width: 100%; border-radius: 3px; box-shadow: 0 30px 60px -20px rgba(15, 31, 58, 0.35), 0 0 0 1px var(--border); transition: transform .25s; }
.broch-cover:hover img { transform: translateY(-4px); }
.broch-txt p { font-size: 17px; line-height: 1.65; color: var(--text); margin: 0 0 28px; }

/* ---- media ---- */
.tour-embed { position: relative; width: 100%; padding-top: 58%; border-radius: 6px; overflow: hidden; background: var(--card); }
.tour-embed iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.tour-embed + .tour-embed { margin-top: 16px; }
.tour-ddmap { position: relative; width: 100%; height: 620px; border-radius: 6px; overflow: hidden; background: var(--card); }
.tour-ddmap iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.tour-map { width: 100%; height: 460px; border-radius: 6px; overflow: hidden; background: var(--card); }
.tour-map-cap { font-size: 13px; color: var(--muted); margin-top: 14px; }
.tour-gallery { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 18px; }
.tour-gallery.solo { grid-template-columns: 1fr; }
.tour-render { width: 100%; border-radius: 6px; display: block; }
.tour-siteplan { width: 100%; display: block; }
.tour-siteplan-full { margin-top: 26px; }

/* ---- specifications ---- */
.spec-groups { display: grid; grid-template-columns: 1fr 1fr; gap: 44px 72px; }
.spec-group-title { font-family: var(--serif); font-size: 20px; color: var(--ink); margin-bottom: 8px; }
.tour-specs { display: block; }
.spec { display: flex; justify-content: space-between; gap: 28px; padding: 12px 0; border-bottom: 1px solid var(--border); }
.spec-lbl { font-size: 14px; color: var(--muted); flex: 0 0 auto; }
.spec-val { font-size: 15px; font-weight: 400; color: var(--text); text-align: right; line-height: 1.45; }

/* ---- location ---- */
.leaflet-container { font-family: var(--sans); }
.tour-map .leaflet-control-zoom a { background: var(--card); color: var(--text); border-color: var(--border); }
.tour-map .leaflet-control-layers { background: var(--card); color: var(--text); border: 1px solid var(--border); border-radius: 6px; box-shadow: 0 6px 20px rgba(0, 0, 0, 0.25); }
.tour-map .leaflet-control-layers-expanded { padding: 10px 12px; font-size: 13px; }
.tour-map .leaflet-control-layers label { margin: 3px 0; font-weight: 700; }
.tour-map .leaflet-control-layers-separator { border-top-color: var(--border); }

/* ---- contact band ---- */
.contact-grid { display: grid; grid-template-columns: 1fr auto; gap: 48px; align-items: center; }
.tour-contact-name { font-family: var(--serif); font-size: 27px; line-height: 1.1; color: var(--text); }
.tour-contact-org { font-size: 11.5px; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--gold-2); margin-top: 8px; }
.tour-contact-lines { margin-top: 18px; display: flex; flex-wrap: wrap; gap: 8px 32px; }
.tour-contact-line { color: var(--text); text-decoration: none; font-size: 16px; border-bottom: 1px solid transparent; transition: border-color .15s; }
.tour-contact-line:hover { border-bottom-color: var(--gold-2); }
.tour-contact-ctas { display: flex; flex-wrap: wrap; gap: 14px; }
.tour-contact-sec .sec-head { margin-bottom: 32px; }

/* ---- footer ---- */
.tour-foot { background: var(--paper-2); padding: 44px 0 56px; }
.tour-foot .wrap { display: flex; align-items: center; gap: 28px; flex-wrap: wrap; }
.tour-foot .tour-logo { height: 54px; }
.foot-txt { font-size: 13px; color: var(--muted); line-height: 1.55; max-width: 640px; }
.foot-txt strong { color: var(--ink); font-weight: 700; }

.tour-nf { text-align: center; padding: 16vh 20px; }
.tour-nf .tour-logo { margin: 0 auto; }
.tour-nf h1 { font-size: 26px; margin: 26px 0 8px; }
.tour-nf p { color: var(--muted); }

/* ---- Interactive space calculator (lives on a navy band) ---- */
.sc-intro { font-size: 17px; line-height: 1.6; color: var(--text); margin: -18px 0 30px; max-width: 760px; }
.sc-wrap { display: grid; grid-template-columns: 1fr; gap: 20px; }
.sc-svg { width: 100%; height: auto; display: block; }
.sc-shell { fill: none; stroke: rgba(212,175,95,.35); stroke-width: 2; }
.sc-sect { cursor: pointer; }
.sc-sect .sc-fill { fill: rgba(212,175,95,.10); stroke: rgba(212,175,95,.45); stroke-width: 1.5; transition: fill .15s ease, stroke .15s ease; }
.sc-sect:hover .sc-fill { fill: rgba(212,175,95,.22); stroke: var(--gold-2); }
.sc-sect:focus-visible .sc-fill { stroke: #fff; stroke-width: 2.5; }
.sc-sect.selected .sc-fill { fill: rgba(212,175,95,.82); stroke: #e7cf95; stroke-width: 2; }
.sc-sect.selected .sc-lbl, .sc-sect.selected .sc-sf { fill: var(--navy); }
.sc-sect.leased { cursor: not-allowed; }
.sc-sect.leased .sc-fill { fill: rgba(255,255,255,.04); stroke: rgba(255,255,255,.14); stroke-dasharray: 5 5; }
.sc-sect.leased .sc-lbl, .sc-sect.leased .sc-sf { fill: var(--muted); }
.sc-leased { fill: var(--muted); font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.sc-lbl { fill: var(--text); font-family: var(--serif); font-size: 30px; font-weight: 400; pointer-events: none; }
.sc-sf { fill: var(--muted); font-size: 13px; font-weight: 700; pointer-events: none; }
.sc-dock { fill: var(--gold-2); opacity: .85; }
.sc-sect.leased .sc-dock { fill: var(--muted); opacity: .5; }
.sc-dim { fill: var(--muted); font-size: 13px; letter-spacing: .04em; }
.sc-nope .sc-fill { animation: scnope .38s ease; }
@keyframes scnope { 0%,100% { transform: translateX(0); } 25% { transform: translateX(-4px); } 75% { transform: translateX(4px); } }
.sc-tally { border-top: 1px solid var(--border); padding: 20px 0 0; }
.sc-empty { color: var(--muted); font-family: var(--serif); font-style: italic; font-size: 16.5px; }
.sc-t-head { font-size: 11.5px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--gold-2); margin-bottom: 18px; }
.sc-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 18px 28px; }
.sc-t-v { font-family: var(--serif); font-size: 29px; color: var(--text); line-height: 1.05; }
.sc-t-l { font-size: 11.5px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); margin-top: 6px; }
.sc-cta { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-top: 26px; padding-top: 22px; border-top: 1px solid var(--border); }
.sc-price { font-size: 14px; color: var(--muted); }
.sc-btn { padding: 13px 20px; font-size: 11.5px; }
.sc-spec-l { font-size: 11.5px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.sc-spec-v { font-size: 15.5px; font-weight: 400; color: var(--text); margin-top: 5px; }
/* real floor-plan mode */
.sc-plan { position: relative; width: 100%; line-height: 0; }
.sc-plan-img { width: 100%; height: auto; display: block; opacity: .95; }
.sc-plan-svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.sc-plan .sc-sect .sc-fill { fill: rgba(212,175,95,.05); stroke: rgba(212,175,95,.55); stroke-width: 6; }
.sc-plan .sc-sect:hover .sc-fill { fill: rgba(212,175,95,.18); stroke: var(--gold-2); }
.sc-plan .sc-sect.selected .sc-fill { fill: rgba(212,175,95,.55); stroke: #e7cf95; stroke-width: 8; }
.sc-plan .sc-sect.selected .sc-lbl { fill: var(--navy); }
.sc-plan .sc-sect.selected .sc-sf { fill: #1d2f4d; }
.sc-plan .sc-lbl { fill: var(--text); paint-order: stroke; stroke: rgba(10,26,48,.55); stroke-width: 10; stroke-linejoin: round; }
.sc-plan .sc-sf { fill: var(--gold-2); font-weight: 700; paint-order: stroke; stroke: rgba(10,26,48,.55); stroke-width: 6; }
.sc-plan .sc-sect.leased .sc-fill { fill: rgba(255,255,255,.05); stroke: rgba(255,255,255,.22); stroke-dasharray: 22 18; }
.sc-plan .sc-sect.leased .sc-lbl, .sc-plan .sc-sect.leased .sc-sf { fill: var(--muted); }
.sc-plan .sc-nope .sc-fill { animation: scnopeplan .38s ease; }
@keyframes scnopeplan { 0%,100% { transform: translateX(0); } 25% { transform: translateX(-14px); } 75% { transform: translateX(14px); } }

/* ---- responsive ---- */
@media (max-width: 900px) {
  .lede-grid, .ov-grid, .broch-grid, .loc-grid, .spec-groups { grid-template-columns: 1fr; gap: 40px; }
  .contact-grid { grid-template-columns: 1fr; gap: 28px; }
  .facts-grid { grid-template-columns: repeat(2, 1fr); row-gap: 30px; }
  .fact { padding: 0 20px; }
  .fact:nth-child(4n + 1) { border-left: 1px solid var(--border); padding-left: 20px; }
  .fact:nth-child(2n + 1) { border-left: none; padding-left: 0; }
  .tour-sec, .tour-sec.dark { padding: 60px 0; }
  .tour-lede { padding: 48px 0 40px; }
}
@media (max-width: 640px) {
  .wrap { padding: 0 20px; }
  .tour-logo { height: 50px; }
  .tour-head .tour-btn { display: inline-block; font-size: 12.5px; padding: 10px 14px; }
  .tour-head .tour-status { display: none; }   /* the hero already carries the status */
  .tour-head-r { gap: 12px; }
  .tour-photo { height: auto; min-height: 0; }
  .tour-photo picture { height: auto; }
  .tour-photo-img { height: auto; object-fit: contain; }
  .tour-photo-scrim { display: none; }
  .tour-photo-cap { position: static; padding: 22px 0 28px; }
  .tour-photo-cap h1 { margin-top: 8px; }
  .tour-hero-stats { grid-template-columns: 1fr; gap: 22px; }
  .tour-map, .tour-locmap { height: 320px; }
  .tour-ddmap { height: 400px; }
  .tour-pdf { height: 420px; }
  .sc-lbl { font-size: 22px; } .sc-sf { font-size: 11px; }
  .tour-foot .wrap { flex-direction: column; align-items: flex-start; }
}

/* ---- chapters: "01 · What is it?" kickers above the lead section of each chapter ---- */
.sec-kicker { font-size: 11.5px; font-weight: 700; letter-spacing: 0.16em; text-transform: uppercase; color: var(--gold); margin-bottom: 14px; }
.sec-kicker + .sec-title::before { display: none; }

/* ---- pricing ---- */

/* ---- team ---- */
.team { border-top: 1px solid var(--ink); padding-top: 18px; }

/* ---- faq ---- */

@media (max-width: 900px) { .price-grid { grid-template-columns: 1fr; gap: 40px; } }

/* ---- about us (chapter 04) ---- */
@media (max-width: 900px) { .about-grid { grid-template-columns: 1fr; gap: 36px; } }

/* ---- progress-first: hero strip · status tiles · interactive timeline · work lists · plan chart ---- */
.tour-hero-prog { display: flex; flex-wrap: wrap; gap: 10px 28px; margin-top: 22px; font-size: 14px; color: rgba(255,255,255,.85); align-items: center; }
.tour-hero-prog b { font-family: var(--serif); font-weight: 400; font-size: 22px; color: #fff; margin-right: 6px; }
.prog-chip { font-size: 11px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #fff; border: 1px solid rgba(255,255,255,.45); padding: 7px 12px; border-radius: 2px; }
.prog-chip::before { content: ''; display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: var(--good); margin-right: 8px; vertical-align: 1px; }
.prog-chip.late::before { background: #d08a4a; }

.prog-tiles { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--ink); border-bottom: 1px solid var(--border); margin-bottom: 44px; }
.prog-tile { padding: 22px 26px 22px 0; border-left: 1px solid var(--border); padding-left: 26px; }
.prog-tile:first-child { border-left: none; padding-left: 0; }
.prog-tile-l { font-size: 11.5px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.prog-tile-v { font-family: var(--serif); font-size: clamp(24px, 2.3vw, 32px); line-height: 1.15; color: var(--ink); margin-top: 10px; }
.prog-tile.good .prog-tile-v { color: var(--good); }
.prog-tile.late .prog-tile-v { color: #a4592a; }
.prog-tile-s { font-size: 13px; color: var(--muted); margin-top: 6px; }

.mh { cursor: pointer; border-radius: 4px; transition: background .15s; padding-bottom: 10px; }
.mh:hover { background: rgba(15,31,58,.035); }
.mh.open .mh-name { color: var(--gold); }
.mh.open .mh-dot { box-shadow: 0 0 0 5px rgba(176,138,62,.22); }
.mh:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }
.mh-detail { display: grid; grid-template-columns: auto 1fr; gap: 6px 22px; align-items: baseline; padding: 22px 26px; margin-top: 8px; background: var(--cream); border: 1px solid var(--border); border-radius: 4px; }
.mhd-status { grid-row: 1 / span 3; align-self: start; font-size: 11px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); border: 1px solid var(--border); padding: 6px 10px; border-radius: 2px; margin-top: 4px; }
.mhd-status.done { color: var(--good); border-color: rgba(63,157,103,.4); }
.mhd-status.current { color: var(--gold); border-color: rgba(176,138,62,.5); }
.mhd-name { font-family: var(--serif); font-size: 24px; color: var(--ink); }
.mhd-when { font-size: 13.5px; color: var(--muted); }


.plan-chart { margin-top: 52px; }
.plan-chart svg { width: 100%; height: auto; display: block; margin-top: 8px; }
.pc-grid { stroke: var(--border); stroke-width: 1; }
.pc-ylbl, .pc-xlbl { font-family: var(--sans); font-size: 12px; fill: var(--muted); }
.pc-area { fill: rgba(176,138,62,.08); }
.pc-line { fill: none; stroke: var(--ink); stroke-width: 2; }
.pc-ms { stroke: var(--gold); stroke-width: 2; }
.pc-today { stroke: var(--gold); stroke-width: 1.5; stroke-dasharray: 4 5; }
.pc-dot { fill: var(--gold); stroke: #fff; stroke-width: 3; }
.pc-today-lbl { font-family: var(--serif); font-size: 17px; fill: var(--ink); }
.pc-cap { font-size: 12.5px; color: var(--muted); margin-top: 8px; }


@media (max-width: 900px) {
  .prog-tiles { grid-template-columns: 1fr 1fr; }
  .prog-tile:nth-child(3) { border-left: none; padding-left: 0; }
  .prog-tile:nth-child(n+3) { border-top: 1px solid var(--border); }
  .mh-detail { grid-template-columns: 1fr; }
  .mhd-status { grid-row: auto; justify-self: start; }
  .tour-hero-prog b { font-size: 19px; }
}

.pc-h { font-size: 11.5px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--gold); margin-bottom: 8px; }

/* =====================================================================
   Legibility pass — format, font and color.
   · Body and every label: Inter (dark navy, 17px). The serif stays only on
     the big headings and display numbers, where it can hold up on screen.
   · No tracked all-caps labels: plain sentence-case labels instead.
   · Gold is an accent line, never small text. Muted text is dark enough
     to read at a glance; borders are visible.
   ===================================================================== */
:root {
  --sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  --ink: #12213f; --text: #12213f;
  --muted: #45536b;
  --border: rgba(18, 33, 63, 0.18);
  --gold: #a07a2c;
}
.dark { --muted: #c3ccda; --border: rgba(255,255,255,.18); --gold: #d4af5f; }
body { font-family: var(--sans); font-size: 17px; line-height: 1.65; color: var(--ink); }

/* labels: sentence case, medium weight, readable size */
.kicker, .sec-kicker, .tour-photo-loc, .tour-status, .tour-nav a, .ths-lbl, .fact-l, .prog-tile-l, .price-side-h, .pc-h,
.deliv-rec-l, .about-fact-l, .about-credit-l, .team-role, .tour-contact-org, .sc-t-head, .sc-t-l, .sc-spec-l, .mhd-status, .prog-chip,
.tour-table th, .sc-leased, .tour-btn {
  text-transform: none; letter-spacing: 0; font-family: var(--sans);
}
.ths-lbl, .fact-l, .prog-tile-l, .price-side-h, .pc-h, .deliv-rec-l, .about-fact-l, .about-credit-l, .team-role, .tour-contact-org,
.sc-t-head, .sc-t-l, .sc-spec-l, .tour-table th { font-size: 14.5px; font-weight: 500; color: var(--muted); }
.sec-kicker { font-size: 15px; font-weight: 600; color: var(--ink); margin-bottom: 12px; }
.sec-kicker::before { content: ''; display: inline-block; width: 28px; height: 2px; background: var(--gold); margin-right: 12px; vertical-align: middle; }
.tour-photo-loc { font-size: 16px; font-weight: 500; color: #fff; opacity: .9; }
.tour-status { font-size: 14.5px; font-weight: 600; }
.tour-nav a { font-size: 15px; font-weight: 500; color: var(--muted); padding: 17px 16px 15px; }
.tour-nav a.active, .tour-nav a:hover { color: var(--ink); }
.tour-nav a.active { font-weight: 600; }
.tour-contact-org, .team-role, .about-credit-l, .deliv-rec-l, .pc-h, .price-side-h, .sc-t-head { color: var(--muted); }
.dark .tour-contact-org, .dark .sc-t-head { color: var(--gold); }
.mhd-status { font-size: 13.5px; font-weight: 600; padding: 6px 10px; }
.prog-chip { font-size: 14px; font-weight: 600; padding: 8px 13px; }

/* buttons: sentence case */
.tour-btn { font-size: 15px; font-weight: 600; padding: 15px 24px; }
.tour-btn.sm { font-size: 14px; padding: 11px 16px; }
.sc-btn { font-size: 14px; }

/* headings: serif only here */
.sec-title { font-size: clamp(30px, 3.2vw, 40px); line-height: 1.15; }
.tour-photo-cap h1 { font-size: clamp(38px, 5.4vw, 66px); text-shadow: 0 2px 18px rgba(8,20,38,.55); }
.tour-hero-prog { font-size: 15.5px; color: #fff; text-shadow: 0 1px 10px rgba(8,20,38,.65); }
.tour-hero-prog b { font-size: 24px; }

/* display numbers keep the serif, bigger */
.ths-val { font-size: clamp(28px, 2.6vw, 34px); }
.prog-tile-v { font-size: clamp(28px, 2.6vw, 36px); }
.fact-v { font-size: clamp(24px, 2.2vw, 30px); }
.sc-t-v { font-size: 32px; }
.mhd-name { font-size: 26px; }
.spec-group-title { font-family: var(--sans); font-weight: 600; font-size: 19px; }
.tour-contact-name { font-size: 30px; }

/* everything smaller than a heading becomes the sans */
.mh-date { font-family: var(--sans); font-size: 14.5px; color: var(--muted); }
.mh-name { font-size: 15px; color: var(--ink); }
.mh.done .mh-name { color: var(--ink); }
.price-step p, .team-blurb, .about-credit-b, .faq p, .broch-txt p, .mhd-desc, .tour-bullets li { font-size: 17px; line-height: 1.6; }
.tour-bullets li { padding: 16px 0; }
.pc-today-lbl { font-family: var(--sans); font-weight: 600; font-size: 15px; }
.pc-ylbl, .pc-xlbl { font-size: 13px; }
.sc-empty, .tour-stub { font-family: var(--sans); font-style: normal; font-size: 16.5px; }
.sc-intro { font-size: 18px; }
.sc-sf { font-size: 14px; } .sc-lbl { font-family: var(--sans); font-weight: 700; }
.sc-spec-v, .tour-contact-line { font-size: 17px; }
.sc-price, .sc-legend, .tour-specs-note, .tour-map-cap, .pc-cap, .sc-dim-cap, .ths-sub, .prog-tile-s, .mhd-when, .tour-updated, .foot-txt { font-size: 14.5px; }
.spec-lbl { font-size: 15.5px; } .spec-val { font-size: 16.5px; }
.tour-photo-tag, .sec-lead, .tour-bullets li, .ov-lede { max-width: 800px; }

/* timeline targets */
.mh { min-width: 128px; }
.mh-dot { width: 17px; height: 17px; }

/* boss note: gold text on navy is hard to read on small screens — use white, bolder */
.fact-v { color: #fff; }
.dark .sc-sf, .sc-plan .sc-sf { fill: #fff; font-weight: 700; }
.dark .sc-t-head, .dark .tour-contact-org, .dark .sec-kicker { color: #fff; }
.dark .sc-t-v { color: #fff; }

/* ---- 3D model viewer ---- */
.tour-model { position: relative; width: 100%; height: min(72vh, 680px); border-radius: 6px; overflow: hidden; background: var(--cream); border: 1px solid var(--border); }
.tour-model iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
@media (max-width: 640px) { .tour-model { height: 60vh; } }

/* ---- live-first: hero dial · live section · slider chart · drive-time map · calculator mini diagram ---- */
.hero-cap-grid { display: flex; align-items: flex-end; justify-content: space-between; gap: 40px; }
.hero-dial { flex: 0 0 auto; text-align: center; color: #fff; }
.hero-dial svg { width: 160px; height: 160px; display: block; transform: rotate(-90deg); }
.hd-track { fill: none; stroke: rgba(255,255,255,.22); stroke-width: 10; }
.hd-arc { fill: none; stroke: #d4af5f; stroke-width: 10; stroke-linecap: round; transition: stroke-dashoffset 1.2s cubic-bezier(.4,0,.2,1); }
.hero-dial { position: relative; }
.hd-cap { position: absolute; top: 0; left: 0; width: 160px; height: 160px; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.hd-pct { font-family: var(--serif); font-size: 46px; line-height: 1; text-shadow: 0 1px 10px rgba(8,20,38,.6); }
.hd-pct span { font-size: 24px; }
.hd-lbl { font-size: 13px; opacity: .9; margin-top: 2px; }
.hd-days { font-size: 14px; margin-top: 10px; text-shadow: 0 1px 10px rgba(8,20,38,.6); }
.hd-days b { font-family: var(--serif); font-weight: 400; font-size: 22px; margin-right: 4px; }


.sc-sect.preview .sc-fill { fill: rgba(212,175,95,.3); stroke: #e7cf95; }
.sc-plan .sc-sect.preview .sc-fill { fill: rgba(212,175,95,.28); }


.dt-item { display: grid; grid-template-columns: minmax(0, 1fr) 210px 14px; align-items: center; gap: 12px; width: 100%; text-align: left; font: inherit; font-size: 16px; color: var(--ink);
  background: var(--cream); border: 1px solid var(--border); border-radius: 4px; padding: 13px 16px; cursor: pointer; transition: border-color .15s, background .15s; }

/* Section letters as buttons. The plan's own sections are ~33px wide on a phone,
   too small to tap accurately, so below 760px the letters become the control and
   the plan stays as the picture of what you just built. */
.sc-chips { display: none; }
.sc-chip {
  flex: 1 1 calc(20% - 6px); min-height: 46px;
  font: 600 16px/1 var(--sans); letter-spacing: .02em;
  color: var(--cream-2); background: rgba(255,255,255,.06);
  border: 1px solid rgba(212,175,95,.34); border-radius: 4px;
  cursor: pointer; -webkit-tap-highlight-color: transparent;
}
.sc-chip.selected { background: rgba(212,175,95,.82); border-color: #e7cf95; color: var(--navy); }
.sc-chip.leased { opacity: .38; }

@media (max-width: 760px) {
  .sc-chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 16px 0 4px; }   /* five to a row */
  .dt-item { grid-template-columns: minmax(0, 1fr) 132px 12px; gap: 8px; }
  .tour-nav.scrolled .nav-home { width: 88px; }
  .nav-home img { height: 40px; }
  .hero-cap-grid { flex-direction: row; align-items: flex-end; gap: 14px; flex-wrap: nowrap; }
  .hero-cap-grid > div:first-child { min-width: 0; }
  .hero-dial { flex: 0 0 auto; }
  .hero-dial svg, .hd-cap { width: 96px; height: 96px; }
  .hd-pct { font-size: 27px; } .hd-pct span { font-size: 15px; }
  .hd-lbl { font-size: 10.5px; }
  .hd-days { font-size: 11.5px; margin-top: 6px; line-height: 1.3; }
  .hd-days b { font-size: 15px; margin-right: 2px; }
  .tour-photo-cap h1 { font-size: clamp(28px, 7.4vw, 40px); }
  .tour-photo-loc { font-size: 12.5px; }
  .tour-hero-prog { gap: 7px 14px; margin-top: 12px; font-size: 13.5px; }
  .tour-hero-prog b { font-size: 17px; margin-right: 4px; }
  .prog-chip { font-size: 12px; padding: 6px 10px; }
  .st-slide-head { grid-template-columns: 1fr; gap: 14px; }
}

.foot-txt a { color: var(--ink); text-decoration: none; border-bottom: 1px solid var(--border); }
.foot-txt a:hover { border-bottom-color: var(--gold); }
.sc-intro { margin: -18px 0 22px; }

/* ---- Build your space: parking layouts · upgrades · east lot · dims · toast · inquiry modal ---- */
.tour-nav a { font-size: 16.5px; padding: 22px 18px 20px; }
.sc-dims { pointer-events: none; }
.sc-dims line { stroke: rgba(255,255,255,.55); stroke-width: 4; }
.sc-dims text { fill: rgba(255,255,255,.9); font-family: var(--sans); font-weight: 600; }
.sc-east path { fill: rgba(255,255,255,.05); stroke: rgba(255,255,255,.45); stroke-width: 6; stroke-dasharray: 20 15; stroke-linejoin: round; transition: fill .2s, stroke .2s; }
.sc-east text { fill: rgba(255,255,255,.75); font-family: var(--sans); }
.sc-east text { paint-order: stroke; stroke: #0f1f3a; stroke-width: 10; stroke-linejoin: round; stroke-linecap: round; }
.sc-east-n { font-size: 62px; font-weight: 700; }
.sc-east-l { font-size: 30px; font-weight: 600; letter-spacing: .01em; }
.sc-east.on path { fill: rgba(212,175,95,.42); stroke: #e7cf95; stroke-dasharray: none; }
.sc-east.on text { fill: #fff; }
.leaflet-control-zoom a, .leaflet-container { font-family: var(--sans) !important; }

.sc-toast { position: fixed; left: 50%; bottom: 28px; transform: translateX(-50%); background: var(--cream); color: var(--ink); font-size: 15px; font-weight: 600; padding: 14px 20px; border-radius: 4px; box-shadow: 0 16px 40px rgba(0,0,0,.35); z-index: 60; max-width: 90vw; }
.sc-t-s { font-size: 13px; color: var(--muted); margin-top: 4px; }
.sc-park { margin-top: 22px; padding-top: 18px; border-top: 1px solid var(--border); }
.sc-park-h { font-size: 16px; font-weight: 600; color: #fff; margin-bottom: 14px; }
.sc-park-h span { display: block; font-size: 14px; font-weight: 400; color: var(--muted); margin-top: 2px; }
.sc-park-opts { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 14px; }
.sc-park-opt { font: inherit; color: inherit; text-align: left; background: rgba(255,255,255,.035); border: 1px solid rgba(212,175,95,.22); border-radius: 6px; padding: 0; overflow: hidden; cursor: pointer; transition: border-color .15s, background .15s, transform .15s; }
.sc-park-opt img { display: block; width: 100%; opacity: .78; transition: opacity .15s; }
.sc-park-opt:hover img, .sc-park-opt.on img { opacity: 1; }
.sc-park-opt .sc-park-lbl { display: block; padding: 10px 13px 12px; color: var(--cream-2); font-size: 15px; border-top: 1px solid rgba(212,175,95,.18); }
.sc-park-opt .sc-park-lbl b { font-weight: 600; color: #fff; }
.sc-park-opt:hover { transform: translateY(-2px); border-color: rgba(212,175,95,.55); background: rgba(255,255,255,.06); }
.sc-park-opt.on { border-color: #d4af5f; background: rgba(212,175,95,.12); box-shadow: 0 0 0 3px rgba(212,175,95,.28); }
.sc-park-opt.on .sc-park-lbl { color: #fff; border-top-color: rgba(212,175,95,.4); }
.sc-park-note { font-size: 16px; color: #fff; }
.sc-custom-row { display: flex; flex-wrap: wrap; gap: 18px; }
.sc-custom-row label { display: grid; gap: 6px; font-size: 14px; color: var(--muted); }
.sc-custom-row input, .sc-up-detail { font: inherit; font-size: 16px; color: var(--ink); background: var(--cream); border: 1px solid transparent; border-radius: 4px; padding: 10px 12px; }
.sc-custom-row input { width: 160px; }
.sc-east-toggle { display: flex; align-items: center; gap: 10px; margin-top: 22px; font-size: 16px; color: #fff; cursor: pointer; }
.sc-east-toggle input { width: 18px; height: 18px; accent-color: #d4af5f; }
.sc-east-toggle b { font-weight: 600; color: #fff; }
.sc-east-toggle span { font-size: 14px; color: var(--muted); }
.sc-ups { margin-top: 22px; padding-top: 18px; border-top: 1px solid var(--border); }
.sc-up { display: grid; gap: 10px; padding: 12px 0; border-bottom: 1px solid rgba(255,255,255,.08); }
.sc-up-main { display: flex; align-items: center; gap: 12px; cursor: pointer; }
.sc-up-main input { width: 18px; height: 18px; accent-color: #d4af5f; flex: 0 0 auto; }
.sc-up-main span { display: flex; flex-wrap: wrap; gap: 4px 14px; align-items: baseline; }
.sc-up-main b { font-size: 16px; color: #fff; }
.sc-up-main em { font-style: normal; font-size: 14px; color: var(--muted); }
.sc-up-detail { width: 100%; max-width: 520px; margin-left: 30px; }
.sc-btn { cursor: pointer; }
button.tour-btn { cursor: pointer; }

/* inquiry modal */
.inq { position: fixed; inset: 0; z-index: 100; background: rgba(15,31,58,.55); backdrop-filter: blur(4px); display: flex; align-items: center; justify-content: center; padding: 4vh 16px; }
body.inq-open { overflow: hidden; }
.inq-card { position: relative; display: flex; flex-direction: column; width: 100%; max-width: 680px; max-height: 88vh;
  background: var(--paper); color: var(--ink); border-radius: 6px; box-shadow: 0 40px 90px rgba(0,0,0,.4); overflow: hidden; }
.inq-head { padding: 28px 32px 0; flex: 0 0 auto; }
.inq-form { display: flex; flex-direction: column; min-height: 0; flex: 1 1 auto; }
.inq-body { overflow-y: auto; padding: 0 32px 6px; flex: 1 1 auto; -webkit-overflow-scrolling: touch; }
.inq-x { position: absolute; top: 14px; right: 16px; font: inherit; font-size: 26px; line-height: 1; color: var(--muted); background: none; border: none; cursor: pointer; padding: 4px 8px; }
.inq-k { font-size: 13px; font-weight: 600; color: var(--gold); }
.inq-card h3 { font-family: var(--serif); font-weight: 400; font-size: 27px; margin: 4px 0 4px; }
.inq-sub { margin: 0 0 16px; color: var(--muted); font-size: 15.5px; }
.inq-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 16px; }
.inq-form label { display: grid; gap: 6px; font-size: 13.5px; font-weight: 600; color: var(--muted); }
.inq-form input, .inq-form select, .inq-form textarea { font: inherit; font-size: 16px; color: var(--ink); background: var(--cream); border: 1px solid var(--border); border-radius: 4px; padding: 11px 12px; width: 100%; }
.inq-form input:focus, .inq-form select:focus, .inq-form textarea:focus { outline: 2px solid var(--gold); outline-offset: 1px; border-color: transparent; }
.inq-msg { margin-top: 14px; }
.inq-sum { margin-top: 22px; padding: 16px 18px; background: var(--cream); border: 1px solid var(--border); border-radius: 4px; }
.inq-sum-h { font-size: 13px; font-weight: 600; color: var(--gold); margin-bottom: 8px; }
.inq-sum ul { list-style: none; margin: 0; padding: 0; }
.inq-sum li { display: flex; justify-content: space-between; gap: 18px; padding: 7px 0; border-bottom: 1px solid var(--border); font-size: 15px; }
.inq-sum li:last-child { border-bottom: none; }
.inq-sum li span { color: var(--muted); flex: 0 0 auto; }
.inq-sum li b { font-weight: 600; text-align: right; }
.inq-actions { display: flex; align-items: center; gap: 18px; flex: 0 0 auto; flex-wrap: wrap; padding: 16px 32px 20px; border-top: 1px solid var(--border); background: var(--paper); }
.inq-status { font-size: 14.5px; color: var(--muted); }
.inq-status.err { color: #9e2b25; }
.inq-done { text-align: center; padding: 20px 0 6px; }
.inq-done-ic { width: 56px; height: 56px; border-radius: 50%; background: var(--good); color: #fff; font-size: 28px; display: grid; place-items: center; margin: 0 auto 14px; }
.inq-done h4 { font-family: var(--serif); font-weight: 400; font-size: 26px; margin: 0 0 8px; }
.inq-done p { color: var(--text); margin: 0 0 20px; }
@media (max-width: 640px) { .inq-grid { grid-template-columns: 1fr; } .inq-card { padding: 26px 20px; } .tour-nav a { font-size: 15px; padding: 18px 14px 16px; } }

/* ---- live: two boxes ---- */
.live-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
.live-box-h { font-size: 15px; font-weight: 600; color: #fff; margin-bottom: 12px; }
.live-box .tour-ddmap, .live-box .tour-map { height: 460px; }
.live-box .tour-render { border-radius: 6px; }
.live-soon { height: 460px; border-radius: 6px; border: 1px dashed rgba(255,255,255,.3); display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 30px; background: rgba(255,255,255,.03); }
.live-soon-k { font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--gold-2); }
.live-soon-t { font-family: var(--serif); font-size: 26px; color: #fff; margin-top: 10px; }
.live-soon-s { font-size: 15px; color: var(--muted); margin-top: 8px; max-width: 300px; }
@media (max-width: 800px) { .live-grid { grid-template-columns: 1fr; } .live-box .tour-ddmap, .live-box .tour-map, .live-soon { height: 320px; } }
/* east lot count */
.sc-east-row { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 32px; margin-top: 22px; }
.sc-east-row .sc-east-toggle { margin-top: 0; }
.sc-east-n-lbl { display: flex; align-items: center; gap: 12px; font-size: 15px; color: #fff; }
.sc-east-n-lbl input { font: inherit; font-size: 16px; width: 110px; color: var(--ink); background: var(--cream); border: 1px solid transparent; border-radius: 4px; padding: 9px 12px; }
/* building specifications: aligned two-column rows */
.spec-groups { gap: 40px 64px; }
.spec-group-title { font-size: 19px; padding-bottom: 10px; border-bottom: 2px solid var(--ink); margin-bottom: 4px; }
.spec { display: grid; grid-template-columns: minmax(140px, 36%) 1fr; gap: 0 20px; align-items: baseline; padding: 11px 0; border-bottom: 1px solid var(--border); }
.spec-lbl { font-size: 14.5px; color: var(--muted); }
.spec-val { font-size: 16px; font-weight: 500; text-align: left; line-height: 1.45; }
.tour-specs-note { margin-top: 26px; }

/* dark bands: native controls render dark (no bright white checkboxes/spinners); text inputs stay cream */
.dark { color-scheme: dark; }
.dark input[type="text"], .dark input[type="number"], .dark select, .dark textarea { -webkit-appearance: none; appearance: none; background: var(--cream) !important; color: var(--ink); border: 1px solid rgba(15,31,58,.15); }
.dark input[type="number"]::-webkit-inner-spin-button, .dark input[type="number"]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }

/* on navy bands, off-white (not near-white) so controls read as cream */
.dark input[type="text"], .dark input[type="number"], .dark select, .dark textarea, .dark .sc-custom-row input, .dark .sc-up-detail, .dark .sc-east-n-lbl input { background: var(--cream-2) !important; }
.dark input::placeholder { color: #6d6a62; }

.sc-req, .inq-req { color: #d4af5f; font-weight: 600; }
.inq-req { color: var(--gold); }
.inq-ups-h { margin-top: 6px; } .inq-ups-h span { font-weight: 600; color: var(--ink) !important; }
.inq-up span::before { content: '\2191 '; color: var(--gold); }

.inq-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* chosen parking layout on the site plan */
.sc-parkplan-mask { fill: #0f1f3a; }
.sc-parkplan-edge { fill: none; stroke: #e7cf95; stroke-width: 5; }

/* Building Specifications: groups flow down two columns so short ones leave no gap */
.spec-groups { display: block; columns: 2; column-gap: 72px; }
.spec-group { break-inside: avoid; page-break-inside: avoid; margin-bottom: 28px; }
.spec-group:last-child { margin-bottom: 0; }
@media (max-width: 900px) { .spec-groups { columns: 1; } }

/* About us — a full section, last on the page */
.about-grid { display: grid; grid-template-columns: 1.15fr 0.85fr; gap: 64px; align-items: start; }
.about-lede { font-size: clamp(19px, 1.7vw, 22px); line-height: 1.55; color: var(--ink); margin: 0 0 4px; }
.about-grid .tour-bullets { margin-top: 24px; }
.about-link { margin-top: 30px; }
.about-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 20px 30px; }
.about-facts:not(:only-child) { padding-bottom: 28px; border-bottom: 1px solid var(--border); }
.about-fact-v { font-family: var(--serif); font-size: clamp(27px, 2.4vw, 34px); line-height: 1.1; color: var(--ink); }
.about-fact-l { font-size: 14.5px; color: var(--muted); margin-bottom: 4px; }
.about-credit { display: grid; gap: 6px; padding-top: 26px; }
.about-credit-l { font-size: 14.5px; color: var(--muted); }
.about-credit-n { font-family: var(--sans); font-weight: 600; font-size: 19px; color: var(--ink); }
.about-credit-b { font-size: 15.5px; line-height: 1.6; color: var(--muted); }
@media (max-width: 900px) { .about-grid { grid-template-columns: 1fr; gap: 36px; } }

/* Live: single box when only one feed exists */
.live-grid.one { grid-template-columns: 1fr; }

/* tighter page rhythm on small screens too */
@media (max-width: 640px) {
  .tour-sec, .tour-sec.dark { padding: 36px 0; }
  .sec-head { margin-bottom: 20px; }
  .inq-card { max-height: 92vh; }
  .inq-head { padding: 22px 20px 0; }
  .inq-body { padding: 0 20px 4px; }
  .inq-actions { padding: 14px 20px 16px; }
}