/* =====================================================================
   Aapli Property — public stylesheet (no framework, no build step)
   Brand: navy #123B78 · green #269B45 · white & warm grey
   ===================================================================== */

@font-face { font-family: "Inter"; font-style: normal; font-weight: 400; font-display: swap; src: url("../fonts/inter-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 500; font-display: swap; src: url("../fonts/inter-latin-500-normal.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 600; font-display: swap; src: url("../fonts/inter-latin-600-normal.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 700; font-display: swap; src: url("../fonts/inter-latin-700-normal.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 800; font-display: swap; src: url("../fonts/inter-latin-800-normal.woff2") format("woff2"); }
@font-face { font-family: "Noto Sans Devanagari"; font-style: normal; font-weight: 400; font-display: swap; src: url("../fonts/noto-sans-devanagari-devanagari-400-normal.woff2") format("woff2"); unicode-range: U+0900-097F, U+1CD0-1CF9, U+200C-200D, U+20A8, U+20B9, U+25CC, U+A830-A839, U+A8E0-A8FF; }
@font-face { font-family: "Noto Sans Devanagari"; font-style: normal; font-weight: 600; font-display: swap; src: url("../fonts/noto-sans-devanagari-devanagari-600-normal.woff2") format("woff2"); unicode-range: U+0900-097F, U+1CD0-1CF9, U+200C-200D, U+20A8, U+20B9, U+25CC, U+A830-A839, U+A8E0-A8FF; }
@font-face { font-family: "Noto Sans Devanagari"; font-style: normal; font-weight: 700; font-display: swap; src: url("../fonts/noto-sans-devanagari-devanagari-700-normal.woff2") format("woff2"); unicode-range: U+0900-097F, U+1CD0-1CF9, U+200C-200D, U+20A8, U+20B9, U+25CC, U+A830-A839, U+A8E0-A8FF; }

:root {
  --navy: #123B78;
  --navy-deep: #0B2346;
  --navy-soft: #E8EEF7;
  --green: #269B45;
  --green-dark: #1E7D37;
  --green-soft: #E7F4EA;
  --bg: #FFFFFF;
  --warm: #F6F5F1;
  --warm-2: #EFEDE6;
  --ink: #1C2530;
  --ink-2: #3D4853;
  --muted: #5E6873;
  --line: #E3E0D8;
  --danger: #B42318;
  --warning: #9A6700;
  --radius: 14px;
  --radius-sm: 10px;
  --shadow: 0 1px 2px rgba(16, 24, 40, .05), 0 8px 24px rgba(16, 24, 40, .06);
  --shadow-lg: 0 20px 48px rgba(11, 35, 70, .16);
  --font: "Inter", "Noto Sans Devanagari", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --container: 1200px;
  --header-h: 72px;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: calc(var(--header-h) + 12px); }
body { margin: 0; font-family: var(--font); font-size: 16px; line-height: 1.6; color: var(--ink); background: var(--bg); text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; overflow-x: hidden; }
img, video, svg, iframe { max-width: 100%; }
img { height: auto; display: block; }
a { color: var(--navy); text-underline-offset: 3px; }
a:hover { color: var(--green-dark); }
h1, h2, h3, h4 { line-height: 1.2; color: var(--navy-deep); margin: 0 0 .5em; letter-spacing: -.015em; }
h1 { font-size: clamp(2rem, 4.2vw, 3.1rem); font-weight: 800; }
h2 { font-size: clamp(1.55rem, 2.8vw, 2.2rem); font-weight: 800; }
h3, .h3 { font-size: 1.3rem; font-weight: 700; }
.h4, h4 { font-size: 1.1rem; font-weight: 700; }
p { margin: 0 0 1em; }
[lang="mr"] { font-family: "Noto Sans Devanagari", var(--font); }
:focus-visible { outline: 3px solid var(--green); outline-offset: 2px; border-radius: 4px; }
.sr-only { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.skip-link { position: absolute; left: 12px; top: -60px; z-index: 1000; background: var(--navy); color: #fff; padding: 10px 16px; border-radius: 8px; }
.skip-link:focus { top: 12px; color: #fff; }

.container { width: 100%; max-width: var(--container); margin: 0 auto; padding: 0 20px; }
.container.narrow { max-width: 820px; }
.section { padding: clamp(40px, 5vw, 64px) 0; }
.section-tight { padding: 32px 0 64px; }
.section-alt { background: var(--warm); }
.section-head { max-width: 720px; margin-bottom: 32px; }
.section-head-row { max-width: none; display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; flex-wrap: wrap; }
.eyebrow { text-transform: uppercase; letter-spacing: .12em; font-size: .78rem; font-weight: 700; color: var(--green); margin-bottom: .6em; }
.lead { font-size: 1.1rem; color: var(--muted); }
.muted { color: var(--muted); }
.fine { font-size: .85rem; color: var(--muted); }
.mt { margin-top: 24px; }
.center { justify-content: center; }
.center-text { text-align: center; }
.icon { width: 20px; height: 20px; flex-shrink: 0; vertical-align: middle; }
.icon-sm { width: 16px; height: 16px; }
.icon-xs { width: 14px; height: 14px; }
.icon-lg { width: 32px; height: 32px; }
.plain { list-style: none; margin: 0; padding: 0; }

/* ---------- Buttons ---------- */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; padding: 12px 22px; border-radius: 999px; border: 2px solid transparent; font: inherit; font-weight: 700; font-size: .98rem; line-height: 1.2; text-decoration: none; cursor: pointer; transition: background .15s, color .15s, border-color .15s, transform .15s; text-align: center; }
.btn:hover { transform: translateY(-1px); }
.btn-sm { min-height: 40px; padding: 8px 16px; font-size: .9rem; }
.btn-block { display: flex; width: 100%; }
.btn-primary { background: var(--navy); color: #fff; }
.btn-primary:hover { background: var(--navy-deep); color: #fff; }
.btn-accent { background: var(--green); color: #fff; }
.btn-accent:hover { background: var(--green-dark); color: #fff; }
.btn-outline { background: transparent; color: var(--navy); border-color: var(--navy); }
.btn-outline:hover { background: var(--navy); color: #fff; }
.btn-light { background: #fff; color: var(--navy-deep); }
.btn-light:hover { background: var(--navy-soft); color: var(--navy-deep); }
.btn-whatsapp { background: #1F8F4E; color: #fff; }
.btn-whatsapp:hover { background: #17733e; color: #fff; }
.btn-row { display: flex; flex-wrap: wrap; gap: 12px; }

/* ---------- Header ---------- */
.site-header { position: sticky; top: 0; z-index: 50; background: #fff; border-bottom: 1px solid var(--line); }
.header-inner { display: flex; align-items: center; gap: 20px; min-height: var(--header-h); }
.brand { display: inline-flex; align-items: center; text-decoration: none; color: var(--navy-deep); min-width: 0; }
.brand-mobile { display: none; }
.logo-text, .footer-logo-text { display: inline-flex; align-items: center; gap: 10px; }
.logo-mark { width: 40px; height: 40px; border-radius: 10px; background: var(--navy); color: #fff; display: grid; place-items: center; font-weight: 800; font-size: 1.3rem; box-shadow: inset 0 -6px 0 var(--green); }
.logo-words { display: flex; flex-direction: column; line-height: 1.1; }
.logo-words { white-space: nowrap; }
.logo-words strong { font-size: 1.15rem; font-weight: 800; color: var(--navy-deep); }
.logo-words small { font-size: .8rem; color: var(--green-dark); font-weight: 600; }
.main-nav { margin-left: auto; }
.main-nav ul { list-style: none; display: flex; gap: 4px; margin: 0; padding: 0; }
.main-nav a { display: block; white-space: nowrap; padding: 10px 10px; border-radius: 8px; text-decoration: none; color: var(--ink-2); font-weight: 600; font-size: .95rem; }
.main-nav a:hover, .main-nav a[aria-current="page"] { color: var(--navy); background: var(--navy-soft); }
.mobile-nav-contact { display: none; }
.header-actions { display: flex; align-items: center; gap: 12px; }
.header-phone { display: inline-flex; align-items: center; gap: 6px; font-weight: 700; color: var(--navy-deep); text-decoration: none; white-space: nowrap; }
.nav-toggle { display: none; width: 48px; height: 48px; border-radius: 10px; border: 1px solid var(--line); background: #fff; color: var(--navy-deep); cursor: pointer; place-items: center; }
.nav-toggle-close { display: none; }
.nav-open .nav-toggle-open { display: none; }
.nav-open .nav-toggle-close { display: inline; }

@media (max-width: 1280px) {
  .header-phone span { display: none; }
}
@media (max-width: 1180px) {
  :root { --header-h: 64px; }
  .brand-desktop { display: none; }
  .brand-mobile { display: inline-flex; }
  .nav-toggle { display: grid; }
  .header-cta { display: none; }
  .main-nav { display: none; position: fixed; inset: var(--header-h) 0 0 0; background: #fff; padding: 16px 20px 32px; overflow-y: auto; margin: 0; }
  .nav-open .main-nav { display: block; }
  .main-nav ul { flex-direction: column; gap: 2px; }
  .main-nav a { padding: 14px 12px; font-size: 1.05rem; border-bottom: 1px solid var(--warm-2); border-radius: 0; }
  .mobile-nav-contact { display: grid; gap: 10px; margin-top: 20px; }
  .main-nav .mobile-nav-contact a { border-bottom: 0; border-radius: 999px; padding: 12px 18px; display: flex; }
  .main-nav .mobile-nav-contact .btn-primary, .main-nav .mobile-nav-contact .btn-whatsapp { color: #fff; }
  .main-nav .mobile-nav-contact .btn-outline { color: var(--navy); }
  .nav-open .floating-contact { display: none; }
  body.nav-open { overflow: hidden; }
}

/* ---------- Hero ---------- */
.hero { position: relative; min-height: var(--hero-min-h, 88vh); display: flex; align-items: center; color: #fff; overflow: hidden; isolation: isolate; background: var(--navy-deep); }
.hero-media { position: absolute; inset: 0; z-index: -1; }
.hero-fallback img, .hero-video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.hero-video { opacity: 1; transition: opacity .4s; }
.hero.video-failed .hero-video, .hero.video-paused-rm .hero-video { opacity: 0; }
.hero-fallback { opacity: 1; transition: opacity .4s; }
.hero.hero-video-starting .hero-fallback { opacity: 0; }
.hero.video-failed .hero-fallback, .hero.video-paused-rm .hero-fallback { opacity: 1; }
.hero-overlay { position: absolute; inset: 0; }
.hero-overlay::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(11, 35, 70, .55) 0%, rgba(11, 35, 70, 0) 75%); }
.hero-content { padding-top: 64px; padding-bottom: 72px; max-width: var(--container); }
.hero-center .hero-content { text-align: center; }
.hero-center .hero-content > * { margin-left: auto; margin-right: auto; }
.hero-center .hero-actions { justify-content: center; }
.hero-label { display: inline-block; padding: 6px 14px; border-radius: 999px; background: rgba(255, 255, 255, .14); border: 1px solid rgba(255, 255, 255, .28); font-weight: 600; font-size: .9rem; letter-spacing: .02em; margin-bottom: 20px; }
.hero h1 { color: #fff; font-size: clamp(2.2rem, 5.4vw, 4rem); max-width: 15ch; margin-bottom: 18px; text-wrap: balance; }
.hero h1 .hl { color: #7FD69A; }
.hero-desc { font-size: clamp(1.02rem, 1.6vw, 1.2rem); max-width: 56ch; color: rgba(255, 255, 255, .9); margin-bottom: 28px; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.hero-btn { min-width: 180px; }
.hero-tagline { margin-top: 28px; font-size: 1.1rem; font-weight: 600; color: rgba(255, 255, 255, .92); }
.hero-pause { position: absolute; right: 16px; bottom: 16px; width: 40px; height: 40px; border-radius: 50%; border: 1px solid rgba(255, 255, 255, .5); background: rgba(0, 0, 0, .3); color: #fff; cursor: pointer; font-size: .8rem; }
.hero-pause[aria-pressed="true"] span[aria-hidden]::before { content: "▶"; }
.hero-pause[aria-pressed="true"] span[aria-hidden] { font-size: 0; }
.hero-pause[aria-pressed="true"] span[aria-hidden]::before { font-size: .85rem; }
@media (prefers-reduced-motion: reduce) {
  .hero-video { display: none; }
  .hero-fallback { opacity: 1; }
  .hero-pause { display: none; }
  html { scroll-behavior: auto; }
  * { transition: none !important; animation: none !important; }
}

/* Mobile hero: row 1 = Explore Projects + Find My Property, row 2 = Schedule a Site Visit (full width) */
@media (max-width: 767px) {
  .hero { min-height: max(560px, calc(var(--hero-min-h, 88vh) - 40px)); align-items: flex-end; }
  .hero-content { padding-top: 48px; padding-bottom: 40px; }
  .hero-overlay::after { background: linear-gradient(0deg, rgba(11, 35, 70, .7) 0%, rgba(11, 35, 70, .1) 70%); }
  .hero-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; width: 100%; }
  .hero-btn { min-width: 0; width: 100%; padding: 12px 10px; font-size: .93rem; white-space: normal; }
  .hero-btn-3 { grid-column: 1 / -1; }
  .hero-actions .hero-btn:only-child { grid-column: 1 / -1; }
  .hero-pause { bottom: auto; top: 12px; }
}

/* ---------- Search ---------- */
.section-search { padding-top: 0; margin-top: -48px; position: relative; z-index: 2; }
.search-card { background: #fff; border-radius: var(--radius); box-shadow: var(--shadow-lg); padding: 24px; border: 1px solid var(--line); }
.search-card-flat { box-shadow: var(--shadow); }
.search-card .eyebrow { margin-bottom: .3em; }
.search-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.search-alt { margin: 14px 0 0; font-size: .92rem; color: var(--muted); }
@media (max-width: 960px) { .search-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .search-grid .field-submit { grid-column: 1 / -1; } }
@media (max-width: 520px) { .search-grid { gap: 10px; } .search-grid .field label { font-size: .8rem; } .search-grid select { padding-left: 10px; padding-right: 28px; background-position: right 10px center; font-size: .92rem; } .section-search { margin-top: -24px; } .search-card { padding: 16px; } }
@media (max-width: 340px) { .search-grid { grid-template-columns: 1fr; } }
.section-search { padding-bottom: 8px; }
.search-grid .field.select-open { position: relative; z-index: 12; }
.select-enhanced { position: relative; min-width: 0; }
.select-enhanced .select-native {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  min-height: 1px !important;
  padding: 0 !important;
  border: 0 !important;
  overflow: hidden !important;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
  opacity: 0 !important;
  pointer-events: none !important;
}
.select-trigger {
  display: flex;
  width: 100%;
  min-height: 44px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 34px 10px 12px;
  border: 1px solid #D6DEE7;
  border-radius: 12px;
  background: linear-gradient(180deg, #fff, #F8FAFC);
  color: #23364D;
  font: inherit;
  font-size: .82rem;
  font-weight: 650;
  line-height: 1.35;
  text-align: left;
  cursor: pointer;
  transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
}
.select-trigger::after {
  position: absolute;
  top: 50%;
  right: 13px;
  width: 8px;
  height: 8px;
  border-right: 1.7px solid #64748B;
  border-bottom: 1.7px solid #64748B;
  content: "";
  transform: translateY(-70%) rotate(45deg);
  transition: transform .18s ease, border-color .18s ease;
}
.select-trigger:hover, .select-enhanced.is-open .select-trigger {
  border-color: #94B8A0;
  background: #fff;
}
.select-enhanced.is-open .select-trigger {
  border-color: #18824C;
  box-shadow: 0 0 0 3px rgba(24, 130, 76, .1);
}
.select-enhanced.is-open .select-trigger::after {
  border-color: #18824C;
  transform: translateY(-25%) rotate(225deg);
}
.select-trigger:focus-visible {
  outline: 3px solid rgba(24, 130, 76, .22);
  outline-offset: 2px;
}
.select-trigger.is-placeholder .select-trigger-text { color: #66758A; font-weight: 550; }
.select-menu, .select-menu[hidden] { display: none; }
.select-enhanced.is-open .select-menu {
  position: absolute;
  z-index: 30;
  top: calc(100% + 6px);
  right: 0;
  left: 0;
  width: max(100%, 240px);
  max-width: min(280px, calc(100vw - 32px));
  display: block;
  max-height: min(260px, 42vh);
  overflow-y: auto;
  padding: 5px;
  border: 1px solid #E1E7ED;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 16px 36px rgba(15, 35, 60, .18), 0 3px 8px rgba(15, 35, 60, .07);
  overscroll-behavior: contain;
  scrollbar-width: thin;
  scrollbar-color: #BFCBC6 transparent;
}
.select-enhanced.is-open.menu-align-right .select-menu { right: 0; left: auto; }
.select-option {
  min-height: 40px;
  display: flex;
  align-items: center;
  padding: 9px 11px;
  border-radius: 9px;
  color: #27384C;
  font-size: .86rem;
  font-weight: 550;
  line-height: 1.35;
  cursor: pointer;
  transition: background .14s ease, color .14s ease;
}
.select-option:hover, .select-option:focus, .select-option.is-active {
  outline: 0;
  background: #EEF6F0;
  color: #126A3D;
}
.select-option[aria-selected="true"] {
  background: #E6F2E9;
  color: #155E39;
  font-weight: 750;
}
.select-option.is-placeholder { color: #788697; }
.select-option.is-disabled { opacity: .5; cursor: not-allowed; }

/* ---------- Forms ---------- */
.field { display: flex; flex-direction: column; gap: 6px; margin-bottom: 14px; min-width: 0; }
.search-grid .field { margin-bottom: 0; }
.field label, legend { font-weight: 600; font-size: .9rem; color: var(--ink-2); }
.field small { color: var(--muted); font-size: .8rem; }
input[type=text], input[type=tel], input[type=email], input[type=number], input[type=date], input[type=search], input:not([type]), select, textarea {
  width: 100%; min-height: 48px; padding: 11px 14px; font: inherit; font-size: 1rem; color: var(--ink); background: #fff; border: 1.5px solid #CFCBC0; border-radius: var(--radius-sm); appearance: none; -webkit-appearance: none;
}
select { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none' stroke='%23123B78' stroke-width='2'%3E%3Cpath d='m1 1 5 5 5-5'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 14px center; padding-right: 38px; }
textarea { min-height: 96px; resize: vertical; }
input:focus, select:focus, textarea:focus { outline: none; border-color: var(--navy); box-shadow: 0 0 0 3px rgba(18, 59, 120, .15); }
input[aria-invalid="true"], select[aria-invalid="true"] { border-color: var(--danger); }
.field-error { color: var(--danger); font-size: .82rem; }
.field-check label { display: flex; gap: 10px; align-items: flex-start; font-weight: 500; font-size: .9rem; }
.field-check input { width: 20px; height: 20px; margin-top: 2px; accent-color: var(--navy); flex-shrink: 0; }
.field-submit { justify-content: flex-end; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 0 14px; }
@media (max-width: 520px) { .form-row { grid-template-columns: 1fr; } }
.form-note { font-size: .82rem; color: var(--muted); margin: 10px 0 0; }
fieldset { border: 0; padding: 0; margin: 0 0 18px; }
legend { font-size: 1rem; color: var(--navy-deep); margin-bottom: 10px; font-weight: 700; }
.hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.choice-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.choice { position: relative; }
.choice input { position: absolute; opacity: 0; }
.choice span { display: block; padding: 14px; border: 1.5px solid var(--line); border-radius: var(--radius-sm); font-weight: 600; cursor: pointer; text-align: center; background: #fff; }
.choice input:checked + span { border-color: var(--navy); background: var(--navy-soft); color: var(--navy-deep); }
.choice input:focus-visible + span { outline: 3px solid var(--green); outline-offset: 2px; }

/* ---------- Alerts ---------- */
.flash-wrap { padding-top: 16px; }
.alert { padding: 14px 18px; border-radius: var(--radius-sm); margin-bottom: 12px; font-weight: 500; border: 1px solid; }
.alert-success { background: var(--green-soft); border-color: #A8D8B5; color: #14532d; }
.alert-error { background: #FEF3F2; border-color: #FECDCA; color: var(--danger); }
.alert-info { background: var(--navy-soft); border-color: #C7D5EA; color: var(--navy-deep); }
.alert-warning { background: #FFF8E1; border-color: #F4D58D; color: var(--warning); }
.notice { display: flex; gap: 12px; padding: 16px 18px; border-radius: var(--radius-sm); background: var(--navy-soft); color: var(--navy-deep); margin-bottom: 28px; font-size: .95rem; }
.notice-inline { padding: 10px 14px; background: #FFF8E1; border-radius: var(--radius-sm); color: #6b4e00; }

/* ---------- Cards ---------- */
.card-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.card-grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 960px) { .card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 620px) { .card-grid, .card-grid-2 { grid-template-columns: 1fr; } }
.card { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; display: flex; flex-direction: column; box-shadow: var(--shadow); transition: transform .2s, box-shadow .2s; }
.card:hover { transform: translateY(-3px); box-shadow: var(--shadow-lg); }
.card-media { position: relative; display: block; aspect-ratio: 16 / 10; background: var(--warm); overflow: hidden; }
.card-img { width: 100%; height: 100%; object-fit: cover; }
.img-placeholder { display: grid; place-items: center; width: 100%; height: 100%; min-height: 160px; background: var(--warm) url("../images/placeholder.svg") center / cover no-repeat; color: var(--navy); }
.img-placeholder span { opacity: .35; }
.badge { position: absolute; top: 12px; left: 12px; padding: 5px 10px; border-radius: 999px; background: rgba(255, 255, 255, .95); color: var(--navy-deep); font-size: .78rem; font-weight: 700; }
.card-body { padding: 18px 20px 20px; display: flex; flex-direction: column; flex: 1; }
.card-kicker { display: flex; align-items: center; gap: 4px; color: var(--green-dark); font-weight: 600; font-size: .85rem; margin-bottom: 6px; }
.card-title { font-size: 1.15rem; margin-bottom: 6px; }
.card-title a { color: var(--navy-deep); text-decoration: none; }
.card-title a:hover { color: var(--navy); text-decoration: underline; }
.card-text { color: var(--muted); font-size: .93rem; }
.card-facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: auto 0 16px; padding: 12px 0 0; border-top: 1px solid var(--warm-2); }
.card-facts dt { font-size: .72rem; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); }
.card-facts dd { margin: 0; font-weight: 700; font-size: .88rem; color: var(--ink); }
.card-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }

/* ---------- Corridors ---------- */
.corridor-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
@media (max-width: 960px) { .corridor-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 620px) { .corridor-grid { grid-template-columns: 1fr; gap: 14px; } .corridor-media { aspect-ratio: 16 / 5; } .corridor-body { padding-top: 30px; } }
.corridor-card { display: flex; flex-direction: column; text-decoration: none; color: inherit; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow); transition: transform .2s, box-shadow .2s, border-color .2s; }
.corridor-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-lg); border-color: var(--navy); color: inherit; }
.corridor-media { position: relative; aspect-ratio: 16 / 8; background: var(--navy); overflow: hidden; }
.corridor-media img { width: 100%; height: 100%; object-fit: cover; }
.corridor-pattern { position: absolute; inset: 0; background: radial-gradient(circle at 20% 30%, rgba(38, 155, 69, .55), transparent 45%), linear-gradient(135deg, var(--navy) 0%, var(--navy-deep) 100%); }
.corridor-pattern::after { content: ""; position: absolute; inset: 0; background-image: linear-gradient(rgba(255, 255, 255, .07) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, .07) 1px, transparent 1px); background-size: 28px 28px; }
.corridor-icon { position: absolute; left: 16px; bottom: -22px; width: 52px; height: 52px; border-radius: 14px; background: #fff; color: var(--navy); display: grid; place-items: center; box-shadow: var(--shadow); }
.corridor-icon .icon { width: 26px; height: 26px; }
.corridor-icon.lg { position: static; margin-bottom: 16px; background: var(--navy-soft); }
.corridor-body { padding: 34px 20px 20px; display: flex; flex-direction: column; flex: 1; }
.corridor-body h3 { font-size: 1.12rem; }
.corridor-body p { color: var(--muted); font-size: .93rem; }
.corridor-cta { margin-top: auto; font-weight: 700; color: var(--navy); display: inline-flex; align-items: center; gap: 6px; }
.corridor-hero-grid { display: grid; grid-template-columns: 1.2fr 1fr; gap: 32px; align-items: center; }
.corridor-hero-img img { border-radius: var(--radius); }
@media (max-width: 820px) { .corridor-hero-grid { grid-template-columns: 1fr; } }

/* ---------- Featured project ---------- */
.fact-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 12px; margin: 18px 0; }
.fact-grid div { background: var(--warm); border-radius: var(--radius-sm); padding: 12px 14px; }
.fact-grid dt { font-size: .75rem; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); }
.fact-grid dd { margin: 2px 0 0; font-weight: 700; color: var(--navy-deep); }

/* ---------- Connectivity ---------- */
.conn-list { list-style: none; margin: 0 0 10px; padding: 0; display: grid; gap: 10px; }
.conn-list li { display: flex; align-items: center; gap: 14px; padding: 12px 14px; background: var(--warm); border-radius: var(--radius-sm); }
.conn-list.compact li { padding: 8px 12px; gap: 8px; }
.conn-time { min-width: 96px; font-weight: 800; color: var(--navy); }
.conn-dest { display: flex; flex-direction: column; }
.conn-dest small { color: var(--muted); }

/* ---------- Carousel ---------- */
.carousel { position: relative; }
.carousel-track { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 48px) / 3); gap: 24px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; padding-bottom: 8px; scrollbar-width: thin; overscroll-behavior-x: contain; }
.carousel-track > * { scroll-snap-align: start; }
@media (max-width: 960px) { .carousel-track { grid-auto-columns: calc((100% - 24px) / 2); } }
@media (max-width: 620px) { .carousel-track { grid-auto-columns: 88%; gap: 14px; } }
.detail-main .carousel-track { grid-auto-columns: calc((100% - 24px) / 2); }
@media (max-width: 620px) { .detail-main .carousel-track { grid-auto-columns: 92%; } }
.video-slide { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; display: flex; flex-direction: column; }
.video-frame { aspect-ratio: 16 / 9; background: #0b1220; position: relative; }
.video-frame video, .video-frame iframe { width: 100%; height: 100%; object-fit: cover; border: 0; display: block; }
.yt-lite { width: 100%; height: 100%; border: 0; background: #000 center / cover no-repeat; color: #fff; cursor: pointer; display: grid; place-items: center; }
.yt-lite .icon { width: 64px; height: 64px; background: rgba(0, 0, 0, .55); border-radius: 50%; padding: 16px; fill: #fff; }
.video-meta { padding: 16px 18px; }
.video-meta h3 { font-size: 1.05rem; }
.video-meta p { color: var(--muted); font-size: .92rem; margin-bottom: .5em; }
.video-sub { font-size: .85rem !important; }
.carousel-controls { display: flex; align-items: center; justify-content: center; gap: 16px; margin-top: 16px; }
.carousel-btn { width: 48px; height: 48px; border-radius: 50%; border: 1.5px solid var(--navy); background: #fff; color: var(--navy); display: grid; place-items: center; cursor: pointer; }
.carousel-btn:hover:not(:disabled) { background: var(--navy); color: #fff; }
.carousel-btn:disabled { opacity: .35; cursor: default; }
.carousel-status { font-size: .9rem; color: var(--muted); min-width: 64px; text-align: center; }

/* ---------- Page hero / detail ---------- */
.page-hero { background: var(--warm); padding: 28px 0 36px; border-bottom: 1px solid var(--line); }
.page-hero h1 { margin-bottom: .3em; }
.breadcrumbs ol { list-style: none; display: flex; flex-wrap: wrap; gap: 6px; padding: 0; margin: 0 0 16px; font-size: .88rem; color: var(--muted); }
.breadcrumbs li + li::before { content: "/"; margin-right: 6px; color: #b5b0a3; }
.breadcrumbs a { color: var(--muted); }
.project-hero-grid { display: grid; grid-template-columns: 1fr 360px; gap: 36px; align-items: start; }
@media (max-width: 960px) { .project-hero-grid { grid-template-columns: 1fr; } }
.project-loc { display: flex; align-items: center; gap: 6px; color: var(--ink-2); font-weight: 500; }
.price-card { background: #fff; border-radius: var(--radius); padding: 22px; box-shadow: var(--shadow); border: 1px solid var(--line); display: grid; gap: 10px; }
.price-card dl { margin: 0 0 6px; display: grid; gap: 10px; }
.price-card dt { font-size: .75rem; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); }
.price-card dd { margin: 0; font-weight: 800; font-size: 1.15rem; color: var(--navy-deep); }
.chip-list { list-style: none; display: flex; flex-wrap: wrap; gap: 8px; padding: 0; margin: 12px 0 0; }
.chip { display: inline-block; padding: 6px 12px; border-radius: 999px; background: var(--green-soft); color: var(--green-dark); font-weight: 600; font-size: .85rem; text-decoration: none; }
a.chip:hover { background: var(--green); color: #fff; }
.gallery-main img, .gallery-main .img-placeholder { width: 100%; max-height: 560px; object-fit: cover; border-radius: var(--radius); aspect-ratio: 16 / 8; }
.gallery-thumbs { list-style: none; display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 10px; padding: 0; margin: 10px 0 0; }
.gallery-thumbs img { border-radius: var(--radius-sm); aspect-ratio: 4 / 3; object-fit: cover; width: 100%; }
.detail-layout { display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: 40px; padding-top: 24px; padding-bottom: 64px; }
@media (max-width: 960px) { .detail-layout { grid-template-columns: 1fr; } }
.detail-block { margin-bottom: 36px; }
.detail-block h2 { font-size: 1.45rem; }
.detail-side { position: relative; }
.side-card { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 22px; box-shadow: var(--shadow); position: sticky; top: calc(var(--header-h) + 16px); }
.detail-side .side-card + .side-card, .contact-forms .side-card + .side-card { margin-top: 20px; position: static; }
.check-list, .amenity-grid { list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; }
.amenity-grid { grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }
.check-list li, .amenity-grid li { display: flex; gap: 10px; align-items: flex-start; }
.check-list .icon, .amenity-grid .icon { color: var(--green); margin-top: 3px; }
.map-embed { position: relative; aspect-ratio: 16 / 10; border-radius: var(--radius); overflow: hidden; border: 1px solid var(--line); }
.map-embed iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.rounded { border-radius: var(--radius); }

/* Research highlights */
.research-list { list-style: none; padding: 0; margin: 0; display: grid; gap: 14px; }
.research-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 760px) { .research-grid { grid-template-columns: 1fr; } }
.research-item { background: #fff; border: 1px solid var(--line); border-radius: var(--radius-sm); padding: 16px 18px; }
.research-head { display: flex; justify-content: space-between; gap: 12px; align-items: flex-start; }
.research-head h3 { font-size: 1.02rem; margin: 0 0 6px; }
.tag { flex-shrink: 0; font-size: .75rem; font-weight: 700; padding: 4px 9px; border-radius: 999px; background: var(--warm-2); color: var(--ink-2); }
.tag-operational, .tag-completed { background: var(--green-soft); color: var(--green-dark); }
.tag-under_construction { background: #FFF4D6; color: #7a5300; }
.tag-proposed { background: var(--navy-soft); color: var(--navy); }

/* ---------- Charts ---------- */
.chart-block { margin-bottom: 36px; }
.chart { margin: 0 0 18px; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 18px; }
.chart-title { font-weight: 700; color: var(--navy-deep); display: flex; flex-wrap: wrap; gap: 8px; align-items: baseline; margin-bottom: 8px; }
.chart-title small { color: var(--muted); font-weight: 500; }
.chart-legend { list-style: none; display: flex; flex-wrap: wrap; gap: 14px; padding: 0; margin: 0 0 8px; font-size: .88rem; color: var(--ink-2); }
.chart-legend .swatch { display: inline-block; width: 12px; height: 12px; border-radius: 3px; margin-right: 6px; vertical-align: -1px; }
.chart-wrap { overflow-x: auto; }
.chart-svg { width: 100%; min-width: 520px; height: auto; display: block; }
.chart-grid { stroke: #ECEAE4; stroke-width: 1; }
.chart-baseline { stroke: #B9B4A7; stroke-width: 1; }
.chart-axis { fill: var(--muted); font-size: 12px; font-family: var(--font); }
.chart-label, .chart-value { fill: var(--ink-2); font-size: 12px; font-weight: 600; font-family: var(--font); }
.chart-line { fill: none; stroke-width: 2.25; stroke-linejoin: round; stroke-linecap: round; }
.chart-gap { fill: none; stroke-width: 1.5; stroke-dasharray: 2 5; opacity: .7; }
.chart-dot { stroke: #fff; stroke-width: 2; cursor: pointer; }
.chart-dot:hover, .chart-bar:hover { opacity: .8; }
.chart-note { font-size: .82rem; color: var(--muted); }
.chart-table summary { cursor: pointer; font-weight: 600; color: var(--navy); padding: 6px 0; }
/* ---------- Appreciation ---------- */
.appreciation { margin-bottom: 32px; }
.appr-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 16px; margin-bottom: 20px; }
.appr-card { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 18px; box-shadow: var(--shadow); }
.appr-card header { display: flex; flex-direction: column; gap: 2px; margin-bottom: 6px; }
.appr-card h3 { font-size: 1.05rem; margin: 0; color: var(--navy-deep); }
.appr-type { font-size: .75rem; color: var(--muted); }
.appr-pct { font-size: 2rem; font-weight: 800; line-height: 1.1; margin: 6px 0 4px; display: flex; align-items: baseline; gap: 8px; }
.appr-pct small { font-size: .8rem; font-weight: 500; color: var(--muted); }
.appr-pct.is-up { color: var(--green-dark); } .appr-pct.is-down { color: var(--danger); }
.appr-spark { width: 100%; height: 48px; display: block; margin-bottom: 10px; }
.appr-spark path { fill: none; stroke-width: 2.5; stroke-linejoin: round; stroke-linecap: round; vector-effect: non-scaling-stroke; }
.appr-facts { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 12px; margin: 0; border-top: 1px solid var(--line); padding-top: 10px; }
.appr-facts dt { font-size: .75rem; color: var(--muted); }
.appr-facts dd { margin: 0; font-weight: 700; color: var(--ink); }
.appr-facts dd small { font-weight: 500; color: var(--muted); margin-left: 2px; }
.appr-calc { background: var(--navy-soft); border-radius: var(--radius); padding: 20px; margin-bottom: 12px; }
.appr-calc h3 { margin: 0 0 12px; color: var(--navy-deep); }
.appr-calc-fields { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.appr-calc-out { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin: 14px 0 8px; }
.appr-calc-out > div { background: #fff; border-radius: var(--radius-sm); padding: 12px 14px; display: flex; flex-direction: column; gap: 4px; }
.appr-calc-out span { font-size: .8rem; color: var(--muted); }
.appr-calc-out strong { font-size: 1.25rem; color: var(--navy-deep); }
@media (max-width: 640px) { .appr-calc-fields, .appr-calc-out { grid-template-columns: 1fr; } }
.chart-tip { position: fixed; z-index: 80; pointer-events: none; background: var(--navy-deep); color: #fff; font-size: .82rem; padding: 6px 10px; border-radius: 6px; box-shadow: var(--shadow); }
.table-scroll { position: relative; overflow-x: auto; }
table { width: 100%; border-collapse: collapse; font-size: .9rem; }
th, td { text-align: left; padding: 10px 12px; border-bottom: 1px solid var(--line); vertical-align: top; }
thead th { background: var(--warm); font-weight: 700; color: var(--ink-2); }
.compare-table th[scope=row] { width: 180px; background: var(--warm); }
.compare-form { display: grid; grid-template-columns: repeat(3, 1fr) auto; gap: 14px; align-items: end; }
@media (max-width: 760px) { .compare-form { grid-template-columns: 1fr; } }

/* ---------- Listing ---------- */
.results-head { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin: 28px 0 20px; flex-wrap: wrap; }
.results-count { margin: 0; font-weight: 600; }
.sort-form { display: flex; align-items: center; gap: 10px; }
.sort-form label { font-weight: 600; font-size: .9rem; }
.sort-form select { min-height: 42px; width: auto; }
.empty-state { text-align: center; padding: 48px 20px; background: var(--warm); border-radius: var(--radius); color: var(--ink-2); }
.empty-state.compact { padding: 28px 18px; }
.empty-state .icon-lg { color: var(--navy); margin-bottom: 8px; }
.pagination ul { list-style: none; display: flex; justify-content: center; flex-wrap: wrap; gap: 6px; padding: 0; margin: 32px 0 0; }
.pagination a, .pagination span { display: inline-grid; place-items: center; min-width: 44px; height: 44px; padding: 0 12px; border-radius: 10px; border: 1px solid var(--line); text-decoration: none; font-weight: 600; }
.pagination span[aria-current] { background: var(--navy); color: #fff; border-color: var(--navy); }
.location-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 20px; }
.location-card { display: block; text-decoration: none; color: inherit; border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; background: #fff; box-shadow: var(--shadow); }
.location-card:hover { border-color: var(--navy); color: inherit; }
.location-img { aspect-ratio: 16 / 10; object-fit: cover; width: 100%; }
.location-card .img-placeholder { aspect-ratio: 16 / 10; min-height: 0; }
.location-body { padding: 14px 16px; }
.location-count { font-weight: 700; color: var(--green-dark); margin: 0; }
.find-layout { display: grid; grid-template-columns: 420px minmax(0, 1fr); gap: 32px; align-items: start; }
@media (max-width: 960px) { .find-layout { grid-template-columns: 1fr; } }
.card-pad { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 22px; box-shadow: var(--shadow); }
.blog-filter { display: flex; gap: 12px; margin-bottom: 28px; flex-wrap: wrap; }
.blog-filter .field { margin: 0; flex: 1 1 220px; }

/* ---------- Why / FAQ / CTA ---------- */
.why-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 20px; }
.why-item { padding: 22px; border-radius: var(--radius); background: var(--warm); }
.why-icon { width: 40px; height: 40px; border-radius: 10px; background: var(--green); color: #fff; display: grid; place-items: center; margin-bottom: 12px; }
.faq-list { display: grid; gap: 12px; }
.faq { background: #fff; border: 1px solid var(--line); border-radius: var(--radius-sm); padding: 4px 18px; }
.faq summary { cursor: pointer; font-weight: 700; padding: 14px 0; list-style: none; display: flex; justify-content: space-between; gap: 12px; color: var(--navy-deep); }
.faq summary::after { content: "+"; font-size: 1.4rem; line-height: 1; color: var(--green); }
.faq[open] summary::after { content: "–"; }
.faq summary::-webkit-details-marker { display: none; }
.cta-band { display: flex; justify-content: space-between; align-items: center; gap: 24px; flex-wrap: wrap; background: linear-gradient(120deg, var(--navy) 0%, var(--navy-deep) 100%); color: #fff; border-radius: 20px; padding: clamp(24px, 4vw, 44px); }
.cta-band h2, .cta-band .h4 { color: #fff; }
.cta-band p { color: rgba(255, 255, 255, .85); margin: 0; }
.cta-band.small { padding: 24px; }

/* ---------- Contact ---------- */
.contact-grid { display: grid; grid-template-columns: 1fr 1.2fr; gap: 32px; align-items: start; }
@media (max-width: 900px) { .contact-grid { grid-template-columns: 1fr; } }
.contact-cards { display: grid; gap: 14px; }
.contact-card { display: flex; gap: 16px; align-items: center; padding: 18px; border: 1px solid var(--line); border-radius: var(--radius); text-decoration: none; color: var(--ink); background: #fff; }
a.contact-card:hover { border-color: var(--navy); }
.contact-card .icon-lg { color: var(--navy); }
.contact-card span { display: flex; flex-direction: column; }
.contact-card small { color: var(--muted); }
.contact-card strong { font-size: 1.05rem; color: var(--navy-deep); word-break: break-word; }

/* ---------- Calculator ---------- */
.calc-grid { display: grid; grid-template-columns: 1.2fr 1fr; gap: 28px; align-items: start; }
@media (max-width: 860px) { .calc-grid { grid-template-columns: 1fr; } }
.calc-emi { font-size: 2.4rem; font-weight: 800; color: var(--navy); margin: 0; }

/* ---------- Article / prose ---------- */
.prose { font-size: 1.05rem; color: var(--ink-2); }
.prose h2 { font-size: 1.5rem; margin-top: 1.6em; }
.prose h3 { margin-top: 1.4em; }
.prose ul, .prose ol { padding-left: 1.3em; }
.prose li { margin-bottom: .4em; }
.prose table { margin: 1em 0; }
.prose img { border-radius: var(--radius-sm); }
.article-cover { width: 100%; border-radius: var(--radius); margin: 24px 0; aspect-ratio: 16 / 8; object-fit: cover; }
.related-list { padding-left: 1.2em; }

/* ---------- Footer ---------- */
.site-footer { background: var(--navy-deep); color: rgba(255, 255, 255, .78); padding: 56px 0 24px; margin-top: 0; }
.site-footer a { color: rgba(255, 255, 255, .88); text-decoration: none; }
.site-footer a:hover { color: #fff; text-decoration: underline; }
.footer-grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1.3fr; gap: 32px; }
@media (max-width: 900px) { .footer-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .footer-grid { grid-template-columns: 1fr; } }
.brand-footer .logo-words strong { color: #fff; }
.brand-footer .logo-words small { color: #8fd9a5; }
.footer-logo-img { background: #fff; padding: 6px 10px; border-radius: 10px; box-sizing: content-box; }
.footer-tagline { margin-top: 14px; font-weight: 600; color: #fff; }
.footer-heading { color: #fff; font-size: .95rem; text-transform: uppercase; letter-spacing: .1em; margin-bottom: 14px; }
.footer-links, .footer-contact, .footer-social { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.footer-social { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 12px; }
.footer-contact li { display: flex; gap: 8px; align-items: flex-start; }
.footer-contact a { display: inline-flex; gap: 8px; align-items: center; }
.footer-bottom { border-top: 1px solid rgba(255, 255, 255, .14); margin-top: 40px; padding-top: 20px; font-size: .85rem; }
.footer-disclaimer { color: rgba(255, 255, 255, .62); max-width: 90ch; }

/* ---------- Floating contact ---------- */
.floating-contact { position: fixed; right: 16px; bottom: 16px; z-index: 60; display: grid; gap: 12px; }
.fab { width: 56px; height: 56px; border-radius: 50%; display: grid; place-items: center; color: #fff; box-shadow: 0 8px 20px rgba(0, 0, 0, .22); text-decoration: none; }
.fab .icon { width: 26px; height: 26px; }
.fab-whatsapp { background: #1F8F4E; }
.fab-call { background: var(--navy); }
.fab:hover { color: #fff; transform: scale(1.05); }
@media (max-width: 520px) { .floating-contact { right: 12px; bottom: 12px; } .fab { width: 52px; height: 52px; } }

/* ---------- Modal (works without JS via :target) ---------- */
.modal { position: fixed; inset: 0; z-index: 100; display: none; align-items: center; justify-content: center; padding: 16px; }
.modal:target, .modal.is-open { display: flex; }
.modal-backdrop { position: absolute; inset: 0; background: rgba(11, 35, 70, .6); }
.modal-panel { position: relative; background: #fff; border-radius: 18px; width: 100%; max-width: 560px; max-height: calc(100vh - 32px); overflow-y: auto; padding: 24px; box-shadow: var(--shadow-lg); }
.modal-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 12px; }
.modal-head h2 { font-size: 1.35rem; margin: 0; }
.modal-close { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 50%; color: var(--ink); }
.modal-close:hover { background: var(--warm); }
body.modal-open { overflow: hidden; }
@media (max-width: 520px) { .modal { padding: 0; align-items: flex-end; } .modal-panel { border-radius: 18px 18px 0 0; max-height: 92vh; padding: 20px 16px; } }

/* =====================================================================
   v2.1 design refresh — matches the previous Aapli Property website
   (dark navy hero with video, project slider, square-cornered buttons,
   900-weight headings, #F6F7F8 page background)
   ===================================================================== */
@font-face { font-family: "Inter"; font-style: normal; font-weight: 900; font-display: swap; src: url("../fonts/inter-latin-900-normal.woff2") format("woff2"); }

:root {
  --navy: #123B78;
  --navy-deep: #0D2A56;
  --navy-ink: #07152D;
  --green: #269B45;
  --green-dark: #20843A;
  --emerald: #34D399;
  --emerald-300: #6EE7B7;
  --amber: #FCD34D;
  --page: #F6F7F8;
  --ink: #20252B;
  --slate-400: #94A3B8;
  --slate-500: #64748B;
  --slate-600: #475569;
  --slate-200: #E2E8F0;
  --line: #E2E8F0;
  --warm: #F6F7F8;
  --warm-2: #EEF1F4;
  --radius: 12px;
  --radius-sm: 6px;
  --shadow: 0 1px 2px rgba(16, 24, 40, .05);
  --shadow-lg: 0 25px 50px -12px rgba(0, 0, 0, .25);
  --header-h: 80px;
  --container: 1280px;
}
body { background: var(--page); color: var(--ink); }
h1, h2 { font-weight: 900; letter-spacing: -.025em; color: var(--navy); }
h3 { color: var(--ink); }
.container { padding: 0 16px; }
@media (min-width: 640px) { .container { padding: 0 24px; } }
@media (min-width: 1024px) { .container { padding: 0 32px; } }
.section-alt { background: transparent; }
.dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 2px rgba(52, 211, 153, .3); flex-shrink: 0; }

/* Buttons: rounded-md, uppercase hero style */
.btn { border-radius: 6px; min-height: 44px; font-size: .9rem; }
.btn-primary, .btn-navy { background: var(--navy); color: #fff; border-color: var(--navy); }
.btn-primary:hover, .btn-navy:hover { background: var(--navy-deep); color: #fff; border-color: var(--navy-deep); }
.btn-green, .btn-accent { background: var(--green); color: #fff; border-color: var(--green); }
.btn-green:hover, .btn-accent:hover { background: var(--green-dark); color: #fff; }
.btn-outline { border-radius: 6px; }
.btn-white-sq { background: #fff; color: var(--navy); border-color: #fff; border-radius: 4px; font-weight: 700; }
.btn-white-sq:hover { background: #F1F5F9; color: var(--navy); }
.btn-outline-light-sq { background: transparent; color: #fff; border: 1px solid rgba(255, 255, 255, .3); border-radius: 4px; font-weight: 600; }
.btn-outline-light-sq:hover { border-color: #fff; color: #fff; }
.btn-ghost-light { background: rgba(255, 255, 255, .08); color: #fff; border: 1px solid rgba(255, 255, 255, .2); }
.btn-ghost-light:hover { background: rgba(255, 255, 255, .16); color: #fff; }
.btn-icon-sq { width: 40px; min-height: 40px; padding: 0; border-radius: 6px; border: 1px solid var(--line); background: #fff; color: var(--navy); }
.btn-icon-sq:hover { background: #F1F5F9; color: var(--navy); }
.btn-whatsapp { border-radius: 6px; }

/* ---------- Top bar ---------- */
.topbar { background: var(--navy); color: #fff; font-size: 11px; padding: 6px 0; }
.topbar-inner { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.topbar-left, .topbar-right { display: flex; align-items: center; gap: 12px; min-width: 0; }
.topbar-item { color: var(--slate-200); white-space: nowrap; }
.topbar-item-hl { color: var(--emerald-300); font-weight: 500; display: inline-flex; align-items: center; gap: 6px; }
.topbar-item-hl .dot { width: 6px; height: 6px; }
.topbar-sep { color: rgba(255, 255, 255, .3); }
.topbar-tagline { color: rgba(253, 230, 138, .9); }
.topbar a { text-decoration: none; }
.topbar-phone { color: var(--slate-200); font-weight: 500; white-space: nowrap; }
.topbar-phone strong { color: var(--emerald-300); font-weight: 700; }
.topbar-phone:hover { color: #fff; }
.topbar-portal { color: var(--amber); font-weight: 600; white-space: nowrap; }
.topbar-portal:hover { color: #fff; }
@media (max-width: 1023px) { .topbar-lg { display: none; } }
@media (max-width: 639px) { .topbar { display: none; } }

/* ---------- Header ---------- */
.site-header { background: #fff; border-bottom: 1px solid var(--line); box-shadow: 0 1px 2px rgba(0, 0, 0, .04); }
.header-inner { min-height: var(--header-h); gap: 16px; }
.brand img { max-width: 240px; }
.main-nav { margin: 0 auto; }
.main-nav ul { gap: 4px; }
.main-nav a { position: relative; color: #334155; font-weight: 600; font-size: .9rem; padding: 10px 12px; border-radius: 6px; }
.main-nav a:hover { color: var(--navy); background: #F1F5F9; }
.main-nav a[aria-current="page"] { color: var(--navy); background: transparent; font-weight: 700; }
.main-nav a[aria-current="page"]::after { content: ""; position: absolute; left: 12px; right: 12px; bottom: 0; height: 2.5px; border-radius: 99px; background: var(--green); }
.main-nav a.nav-hl { color: var(--green); font-weight: 700; display: inline-flex; align-items: center; gap: 4px; }
.main-nav a.nav-hl .icon { color: #F59E0B; }
.header-cta { padding: 10px 20px; min-height: 42px; font-weight: 700; white-space: nowrap; box-shadow: 0 1px 2px rgba(0, 0, 0, .06); }
.header-cta .cta-icon { color: var(--green); display: inline-flex; }
.header-cta .cta-short { display: none; }
@media (min-width: 1181px) and (max-width: 1320px) { .main-nav a { padding: 10px 8px; font-size: .86rem; } }
@media (max-width: 1180px) {
  :root { --header-h: 72px; }
  .header-actions { margin-left: auto; }
  .header-cta { display: inline-flex; padding: 8px 12px; min-height: 38px; font-size: .78rem; }
  .header-cta .cta-long { display: none; }
  .header-cta .cta-short { display: inline; }
  .nav-toggle { border: 0; width: 44px; height: 44px; color: #334155; }
  .main-nav a[aria-current="page"]::after { display: none; }
  .main-nav a[aria-current="page"] { background: #F1F5F9; }
  .main-nav a.nav-hl { display: flex; }
  .main-nav { border-top: 1px solid var(--line); box-shadow: 0 20px 25px -5px rgba(0, 0, 0, .1); }
  .main-nav .mobile-nav-contact a { border-radius: 8px; }
}
@media (max-width: 400px) { .brand img { max-width: 160px; } }

/* ---------- Hero (dark navy with background video) ---------- */
.hero { display: block; min-height: 580px; background: linear-gradient(180deg, var(--navy) 0%, var(--navy-deep) 100%); align-items: stretch; }
.hero-media { background: linear-gradient(180deg, var(--navy) 0%, var(--navy-deep) 100%); }
.hero-video { opacity: var(--hero-video-opacity, .45); transform: scale(1.05); transition: opacity 1s; }
/* max-width: none — the global iframe { max-width: 100% } would otherwise squeeze the 16:9 video on tall mobile heroes into a letterboxed band */
.hero-youtube { top: 50%; left: 50%; right: auto; bottom: auto; width: 100vw; height: 56.25vw; min-width: 177.78vh; min-height: 100vh; max-width: none; border: 0; transform: translate(-50%, -50%) scale(1.05); pointer-events: none; }
@media (max-width: 767px) { .hero-youtube { transform: translate(-50%, -50%) scale(1.2); } }
/* Hidden until main.js confirms playback; the poster image shows meanwhile */
.hero .hero-youtube { opacity: 0; }
.hero.yt-playing .hero-youtube { opacity: var(--hero-video-opacity, .45); }
@supports (width: 1cqw) {
  .hero-media { container-type: size; }
  .hero-youtube { width: max(100cqw, 177.78cqh); height: max(100cqh, 56.25cqw); min-width: 0; min-height: 0; }
}
.hero-fallback img { opacity: 1; }
.hero-overlay { background: linear-gradient(180deg, color-mix(in srgb, var(--ov, #07152D) 92%, transparent) 0%, color-mix(in srgb, var(--ov, #07152D) 80%, transparent) 50%, var(--ov, #07152D) 100%); }
.hero-overlay::after { display: none; }
.hero-dots { position: absolute; inset: 0; opacity: .1; background-image: radial-gradient(#fff 1px, transparent 1px); background-size: 24px 24px; pointer-events: none; }
.hero-inner { position: relative; padding-top: 32px; padding-bottom: 64px; }
@media (min-width: 640px) { .hero-inner { padding-top: 56px; padding-bottom: 96px; } }
.hero-kicker-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; padding-bottom: 24px; border-bottom: 1px solid rgba(255, 255, 255, .1); font-size: 12px; color: #CBD5E1; }
.hero-kicker { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.hero-kicker-text { color: #fff; font-weight: 600; text-transform: uppercase; letter-spacing: .03em; font-size: 11px; }
@media (min-width: 640px) { .hero-kicker-text { font-size: 12px; } }
.hero-kicker .sep, .hero-badges .sep { color: rgba(255, 255, 255, .4); }
.hero-kicker-mr { color: var(--amber); font-weight: 500; }
.hero-badges { list-style: none; margin: 0; padding: 0; display: flex; align-items: center; gap: 16px; font-size: 11px; font-weight: 500; color: #CBD5E1; }
.hero-badge { display: inline-flex; align-items: center; gap: 4px; }
.hero-badge-check .icon { color: var(--green); }
.hero-badge-shield .icon { color: var(--amber); }
.hero-badge-none { color: var(--slate-400); }
@media (max-width: 767px) { .hero-badges { display: none; } }
/* Mobile: Marathi line sits under the English kicker, aligned with its text, without a dangling separator */
@media (max-width: 639px) {
  .hero-kicker { row-gap: 4px; }
  .hero-kicker .sep { display: none; }
  .hero-kicker-mr { flex-basis: 100%; padding-left: 16px; }
}
.hero-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; padding-top: 48px; }
.hero-grid-single { grid-template-columns: 1fr; }
.hero-content { padding: 0; max-width: none; }
.hero-content > * + * { margin-top: 24px; }
.hero-chip { display: inline-flex; align-items: center; gap: 8px; padding: 4px 12px; border-radius: 999px; background: rgba(255, 255, 255, .1); border: 1px solid rgba(255, 255, 255, .15); color: var(--emerald-300); font-size: 12px; font-weight: 600; letter-spacing: .02em; margin: 0; }
.hero-chip .icon { color: var(--emerald); }
.hero h1 { font-weight: 900; font-size: clamp(2.25rem, 5vw, 3.75rem); line-height: 1.08; letter-spacing: -.025em; max-width: none; margin-bottom: 0; color: #fff; }
.hero h1 .hl { color: var(--emerald); }
.hero-desc { font-size: clamp(.875rem, 1.4vw, 1rem); color: #E2E8F0; line-height: 1.65; max-width: 36rem; margin-bottom: 0; }
.hero-actions { padding-top: 8px; gap: 12px; }
.hero-btn { min-width: 0; min-height: 0; padding: 14px 22px; border-radius: 6px; border: 0; font-weight: 700; font-size: .875rem; text-transform: uppercase; letter-spacing: .05em; box-shadow: 0 4px 6px -1px rgba(0, 0, 0, .1); }
.hero-btn:active { transform: scale(.98); }
.hero-btn-1 { background: var(--green); color: #fff; }
.hero-btn-1:hover { background: var(--green-dark); color: #fff; }
.hero-btn-1 .icon { transition: transform .2s; }
.hero-btn-1:hover .icon { transform: translateX(4px); }
.hero-btn-2 { background: #047857; color: #fff; border: 1px solid rgba(16, 185, 129, .5); }
.hero-btn-2:hover { background: #065F46; color: #fff; }
.hero-btn-2 .icon { color: var(--amber); }
.hero-btn-3 { background: #fff; color: var(--navy); }
.hero-btn-3:hover { background: #F1F5F9; color: var(--navy); }
.hero-assurances { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; padding-top: 16px; border-top: 1px solid rgba(255, 255, 255, .1); font-size: 12px; color: #CBD5E1; }
.hero-assurances strong { display: block; color: #fff; font-weight: 700; }
.hero-assurances span { display: block; color: var(--slate-400); font-size: 10px; }
.hero-proof-points { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); width: min(100%, 460px); margin-top: 16px; overflow: hidden; border: 1px solid rgba(255, 255, 255, .15); border-radius: 14px; background: linear-gradient(115deg, rgba(255, 255, 255, .105), rgba(255, 255, 255, .045)); box-shadow: 0 8px 24px rgba(0, 0, 0, .08); backdrop-filter: blur(8px); }
.hero-proof-point { display: flex; min-width: 0; flex-direction: column; justify-content: center; gap: 2px; padding: 11px 16px 12px; }
.hero-proof-point + .hero-proof-point { border-left: 1px solid rgba(255, 255, 255, .16); }
.hero-proof-point strong { color: #fff; font-size: 1.45rem; font-weight: 800; line-height: 1.1; letter-spacing: -.035em; font-variant-numeric: tabular-nums; }
.hero-proof-point span { color: rgba(226, 232, 240, .88); font-size: .68rem; font-weight: 600; line-height: 1.35; letter-spacing: .035em; }
.hero-tagline { color: var(--amber); }
.hero-pause { bottom: 12px; right: 12px; width: 34px; height: 34px; }

/* Project slider */
.hero-slider { background: #fff; color: var(--ink); border-radius: 12px; overflow: hidden; box-shadow: var(--shadow-lg); border: 1px solid rgba(255, 255, 255, .2); }
.slide[hidden] { display: none; }
.slide-media { position: relative; display: block; height: 320px; background: #0F172A; overflow: hidden; color: #fff; text-decoration: none; }
.slide-media img, .slide-media .img-placeholder { width: 100%; height: 100%; object-fit: cover; transition: transform .7s ease-out; }
.hero-slider:hover .slide-media img { transform: scale(1.05); }
.slide-shade { position: absolute; inset: 0; background: linear-gradient(0deg, rgba(0, 0, 0, .8) 0%, rgba(0, 0, 0, .2) 50%, transparent 100%); }
.slide-badge { position: absolute; top: 16px; left: 16px; display: inline-flex; align-items: center; gap: 6px; padding: 4px 12px; border-radius: 6px; background: var(--green); color: #fff; font-size: 11px; font-weight: 700; box-shadow: 0 4px 6px rgba(0, 0, 0, .15); }
.slide-count { position: absolute; top: 16px; right: 16px; background: rgba(0, 0, 0, .6); color: #fff; font: 11px/1.4 ui-monospace, SFMono-Regular, Menlo, monospace; padding: 4px 10px; border-radius: 6px; }
.slide-title { position: absolute; left: 16px; right: 16px; bottom: 16px; display: block; }
.slide-loc { display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--emerald-300); font-weight: 500; margin-bottom: 4px; }
.slide-loc .icon { color: var(--emerald); }
.slide-name { display: block; font-size: 1.5rem; font-weight: 900; letter-spacing: -.02em; color: #fff; line-height: 1.2; }
.slide-body { padding: 20px 20px 0; }
.slide-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; padding-bottom: 12px; border-bottom: 1px solid #F1F5F9; }
.stat-label { display: block; font-size: 10px; text-transform: uppercase; font-weight: 700; letter-spacing: .05em; color: var(--slate-400); }
.stat-value { display: block; font-size: 1.125rem; font-weight: 900; color: #1E293B; line-height: 1.4; }
.stat-value.navy, .stat-big.navy { color: var(--navy); }
.stat-sub { display: flex; align-items: center; gap: 4px; font-size: 11px; color: var(--slate-500); font-weight: 500; }
.stat-sub.green { color: #047857; font-weight: 600; }
.slider-bar { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 20px 0; }
.slider-bar .btn { min-height: 40px; padding: 10px 20px; }
.slider-ctrl { display: flex; gap: 8px; }
.sq-btn { width: 36px; height: 36px; border-radius: 6px; border: 1px solid var(--line); background: #fff; color: #334155; display: grid; place-items: center; cursor: pointer; }
.sq-btn:hover { background: #F1F5F9; }
.sq-btn .ic-play { display: none; }
.sq-btn[aria-pressed="true"] .ic-play { display: inline; color: #059669; }
.sq-btn[aria-pressed="true"] .ic-pause { display: none; }
.slider-dots { display: flex; justify-content: center; gap: 6px; padding: 14px 20px 18px; }
.sdot { width: 8px; height: 8px; border-radius: 99px; border: 0; padding: 0; background: #CBD5E1; cursor: pointer; transition: width .3s, background .3s; }
.sdot:hover { background: var(--slate-400); }
.sdot.is-active { width: 28px; background: var(--navy); }
.hero-slider:not(:has(.slider-dots)) .slider-bar { padding-bottom: 20px; }

@media (max-width: 1023px) {
  .hero-grid { grid-template-columns: 1fr; gap: 32px; padding-top: 32px; }
}
@media (min-width: 768px) and (max-width: 1023px) {
  .hero-inner { padding-top: 28px; padding-bottom: 42px; }
  .hero-grid { grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr); gap: 22px; padding-top: 26px; }
  .slide-media { height: 250px; }
}
@media (max-width: 767px) {
  .hero { min-height: 0; }
  .hero-inner { padding-top: 8px; padding-bottom: 16px; }
  .hero-kicker-row { gap: 8px; padding-bottom: 8px; }
  .hero-grid { gap: 12px; padding-top: 12px; }
  .hero-content > * + * { margin-top: 10px; }
  .hero h1 { font-size: clamp(1.8rem, 7.5vw, 2.2rem); line-height: 1; }
  .hero-desc { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; font-size: .82rem; line-height: 1.45; }
  .hero-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
  .hero-btn { padding: 10px 10px; font-size: .75rem; white-space: normal; }
  .hero-btn-3 { grid-column: 1 / -1; }
  .hero-proof-points { width: min(100%, 390px); margin-top: 12px; border-radius: 12px; }
  .hero-proof-point { gap: 2px; padding: 9px 12px 10px; }
  .hero-proof-point strong { font-size: 1.2rem; }
  .hero-proof-point span { font-size: .63rem; letter-spacing: .02em; }
  .hero-assurances { gap: 10px; }
  .slide-media { height: 126px; }
  .slide-name { font-size: 1.1rem; }
  .slide-title { left: 12px; right: 12px; bottom: 12px; }
  .slide-badge, .slide-count { top: 10px; }
  .slide-badge { left: 10px; }
  .slide-count { right: 10px; }
  .slide-body { padding: 12px 12px 0; }
  .slide-stats { gap: 8px; padding-bottom: 8px; }
  .slider-bar { padding: 10px 12px 0; }
  .slider-bar .btn { min-height: 36px; padding: 8px 12px; font-size: .75rem; }
  .slider-dots { padding: 10px 12px 12px; }
  .stat-value { font-size: 1rem; }
}

/* ---------- Search card + stats + Find My Property band ---------- */
.section-search { margin-top: 0; padding-top: 32px; padding-bottom: 0; }
@media (min-width: 640px) { .section-search { padding-top: 48px; } }
.search-card { border-radius: 12px; border: 1px solid rgba(226, 232, 240, .8); box-shadow: 0 1px 2px rgba(0, 0, 0, .05); padding: 24px; }
.search-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 6px 16px; margin-bottom: 14px; }
.eyebrow-navy { display: inline-flex; align-items: center; gap: 6px; margin: 0; color: var(--navy); font-weight: 700; font-size: 12px; text-transform: uppercase; letter-spacing: .05em; }
.eyebrow-navy .icon { color: var(--green); }
.search-title { margin: 0; font-size: .85rem; font-weight: 500; color: var(--slate-400); letter-spacing: 0; }
.search-card label, .search-card .field label { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--slate-500); }
.search-card select, .search-card input { background: var(--page); border: 1px solid #CBD5E1; border-radius: 6px; font-size: .8rem; font-weight: 600; color: #1E293B; }
.search-card .btn { border-radius: 6px; text-transform: uppercase; letter-spacing: .05em; font-size: .78rem; }
.stat-strip { margin-top: 32px; background: #fff; border: 1px solid var(--line); border-radius: 12px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); box-shadow: 0 1px 2px rgba(0, 0, 0, .04); }
.stat-strip-1 { grid-template-columns: 1fr; }
.stat-strip-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.stat-strip-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.stat-tile { padding: 24px; }
.stat-tile + .stat-tile { border-left: 1px solid var(--line); }
.stat-big { display: block; font-size: 1.5rem; font-weight: 900; color: #1E293B; margin: 4px 0; line-height: 1.25; }
.stat-big.green { color: var(--green); }
.stat-tile p { margin: 0; font-size: 12px; color: var(--slate-600); }
@media (max-width: 1023px) {
  .stat-strip, .stat-strip-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .stat-strip-1 { grid-template-columns: 1fr; }
  .stat-tile + .stat-tile { border-left: 0; }
  .stat-tile:nth-child(even) { border-left: 1px solid var(--line); }
  .stat-tile:nth-child(n+3) { border-top: 1px solid var(--line); }
}
@media (max-width: 480px) { .stat-tile { padding: 16px; } .stat-big { font-size: 1.2rem; } }
.fmp-band { position: relative; overflow: hidden; margin-top: 32px; display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: clamp(24px, 4vw, 32px); border-radius: 16px; color: #fff; background: linear-gradient(90deg, var(--navy) 0%, #0E2C5A 50%, var(--navy) 100%); border: 1px solid rgba(30, 58, 138, .5); box-shadow: 0 10px 15px -3px rgba(0, 0, 0, .1); }
.fmp-band::before { content: ""; position: absolute; right: 0; top: 0; bottom: 0; width: 24rem; background: radial-gradient(ellipse at top right, rgba(16, 185, 129, .15), transparent 70%); pointer-events: none; }
.fmp-copy { position: relative; max-width: 42rem; }
.fmp-tag { display: inline-flex; align-items: center; gap: 8px; padding: 4px 12px; border-radius: 999px; background: rgba(16, 185, 129, .2); border: 1px solid rgba(52, 211, 153, .3); font-size: 11px; font-weight: 700; color: var(--emerald-300); margin: 0 0 8px; }
.fmp-tag .icon { color: var(--amber); }
.fmp-title { color: #fff; font-size: clamp(1.5rem, 3vw, 1.875rem); font-weight: 800; margin: 0 0 8px; }
.fmp-copy p:last-child { margin: 0; font-size: .875rem; color: #CBD5E1; line-height: 1.65; }
.fmp-btn { position: relative; flex-shrink: 0; border-radius: 8px; text-transform: uppercase; letter-spacing: .05em; padding: 14px 24px; }
.fmp-btn .icon:first-child { color: var(--amber); }
@media (max-width: 767px) { .fmp-band { flex-direction: column; align-items: stretch; } }

/* ---------- Section headings ---------- */
.section-head { max-width: 760px; }
.section-head.center { margin-left: auto; margin-right: auto; text-align: center; }
.section-head h2 { font-size: clamp(1.5rem, 3vw, 1.875rem); }
.section-head-line { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 16px; padding-bottom: 16px; margin-bottom: 24px; border-bottom: 1px solid var(--line); }
.section-head-line h2 { font-size: clamp(1.5rem, 3vw, 1.875rem); margin: 4px 0 0; }
.section-head-line .lead { font-size: .875rem; color: var(--slate-600); margin: 4px 0 0; }
.eyebrow-dot { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 12px; font-weight: 700; color: var(--green); text-transform: uppercase; letter-spacing: .05em; }
.eyebrow-green { font-size: 12px; font-weight: 700; color: var(--green); text-transform: uppercase; letter-spacing: .1em; margin-bottom: 8px; }
.link-arrow { display: inline-flex; align-items: center; gap: 4px; font-size: .78rem; font-weight: 700; color: var(--navy); text-decoration: none; }
.link-arrow:hover { color: var(--navy-deep); text-decoration: underline; }
.lead { color: var(--slate-600); font-size: 1rem; }
.eyebrow { color: var(--green); font-size: 12px; letter-spacing: .08em; }

/* ---------- Project cards ---------- */
.card { border-radius: 12px; border-color: var(--line); box-shadow: 0 1px 2px rgba(0, 0, 0, .05); transition: box-shadow .3s; }
.card:hover { transform: none; box-shadow: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -4px rgba(0, 0, 0, .1); }
.project-card .card-media { aspect-ratio: auto; height: 224px; background: #F1F5F9; }
.project-card .card-img { transition: transform .5s; }
.project-card:hover .card-img { transform: scale(1.05); }
.card-badges { position: absolute; top: 12px; left: 12px; display: flex; flex-direction: column; align-items: flex-start; gap: 6px; }
.card-badges .badge { position: static; border-radius: 2px; font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; padding: 4px 10px; color: #fff; }
.badge-green { background: var(--green); }
.badge-navy { background: var(--navy); text-transform: none !important; letter-spacing: 0 !important; padding: 2px 8px !important; }
.price-pill { position: absolute; right: 12px; bottom: 12px; background: rgba(255, 255, 255, .95); color: var(--navy); font-size: 12px; font-weight: 800; padding: 6px 12px; border-radius: 4px; box-shadow: 0 1px 2px rgba(0, 0, 0, .1); }
.project-card .card-body { padding: 20px; gap: 16px; justify-content: space-between; }
.project-card .card-kicker { color: var(--slate-500); font-weight: 500; font-size: 12px; gap: 6px; margin-bottom: 4px; }
.project-card .card-kicker .icon { color: var(--green); }
.project-card .card-title { font-size: 1.125rem; font-weight: 900; margin: 0; }
.project-card .card-title a { color: #1E293B; text-decoration: none; }
.project-card .card-title a:hover { color: var(--navy); }
.project-card .card-text { font-size: 12px; color: var(--slate-600); margin: 4px 0 0; line-height: 1.6; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.project-card .card-facts { grid-template-columns: 1fr 1fr; gap: 8px; margin: 0; padding-top: 12px; border-top: 1px solid #F1F5F9; font-size: 12px; }
.project-card .card-facts dt { font-size: 10px; text-transform: uppercase; font-weight: 700; color: var(--slate-400); }
.project-card .card-facts dd { margin: 0; font-weight: 700; color: #334155; }
.project-card .card-facts dd.price { font-weight: 800; color: var(--navy); }
.card-times { list-style: none; margin: 0; padding: 8px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; background: var(--page); border-radius: 6px; font-size: 10px; text-align: center; }
.card-times li { display: flex; flex-direction: column; min-width: 0; }
.card-times span { color: var(--slate-500); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-times strong { color: var(--navy); font-size: 12px; font-weight: 800; }
.project-card .card-actions { display: flex; gap: 8px; }
.project-card .card-actions .btn-navy { flex: 1; min-height: 40px; font-size: 12px; font-weight: 700; }
@media (max-width: 1023px) { .card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 680px) { .card-grid { grid-template-columns: 1fr; } }

/* ---------- Why Aapli Property ---------- */
.why-wrap { background: #fff; border: 1px solid var(--line); border-radius: 16px; padding: clamp(24px, 5vw, 48px); box-shadow: 0 1px 2px rgba(0, 0, 0, .04); }
.why-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; }
@media (max-width: 1023px) { .why-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .why-grid { grid-template-columns: 1fr; } }
.why-item { background: var(--page); border: 1px solid #F1F5F9; border-radius: 12px; padding: 20px; }
.why-num { display: inline-grid; place-items: center; width: 40px; height: 40px; border-radius: 8px; background: var(--navy); color: #fff; font-weight: 900; font-size: .9rem; margin-bottom: 14px; }
.why-item h3 { font-size: 1rem; font-weight: 800; color: #1E293B; margin-bottom: 6px; }
.why-item p { font-size: 12px; color: var(--slate-600); line-height: 1.65; margin: 0; }

/* ---------- Growth corridors (navy) ---------- */
.section-navy { background: linear-gradient(180deg, var(--navy) 0%, var(--navy-deep) 100%); color: #fff; }
.section-navy h2 { color: #fff; }
.section-navy .lead { color: #CBD5E1; }
.tag-light { display: inline-flex; align-items: center; gap: 6px; padding: 4px 12px; border-radius: 999px; background: rgba(16, 185, 129, .15); border: 1px solid rgba(52, 211, 153, .3); color: var(--emerald-300); font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; margin-bottom: 12px; }
.section-navy .corridor-card { background: rgba(255, 255, 255, .05); border-color: rgba(255, 255, 255, .12); color: #fff; box-shadow: none; }
.section-navy .corridor-card:hover { border-color: var(--emerald); background: rgba(255, 255, 255, .08); transform: translateY(-2px); color: #fff; }
.section-navy .corridor-body h3 { color: #fff; }
.section-navy .corridor-body p { color: #CBD5E1; font-size: .875rem; }
.section-navy .corridor-cta { color: var(--emerald-300); }
.section-navy .corridor-icon { background: var(--green); color: #fff; }
@media (max-width: 1023px) { .corridor-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .corridor-grid { grid-template-columns: 1fr; } }
.axis-grid { display: grid; grid-template-columns: 7fr 5fr; gap: 24px; margin-top: 40px; }
@media (max-width: 1023px) { .axis-grid { grid-template-columns: 1fr; } }
.axis-panel, .matrix-panel { border-radius: 16px; padding: clamp(20px, 3vw, 32px); }
.axis-panel { align-self: start; background: rgba(255, 255, 255, .05); border: 1px solid rgba(255, 255, 255, .1); }
.axis-kicker { display: flex; align-items: center; gap: 8px; margin: 0 0 8px; font-size: 12px; font-weight: 700; color: var(--emerald-300); text-transform: uppercase; letter-spacing: .05em; }
.axis-title { color: #fff; font-size: 1.5rem; font-weight: 900; margin: 0 0 8px; }
.axis-text { color: #CBD5E1; font-size: .875rem; line-height: 1.65; }
.axis-list { list-style: none; margin: 20px 0 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
@media (max-width: 640px) { .axis-list { grid-template-columns: 1fr; } }
.axis-list li { display: flex; gap: 12px; padding: 14px; border-radius: 10px; background: rgba(7, 21, 45, .35); border: 1px solid rgba(255, 255, 255, .08); }
.axis-num { flex-shrink: 0; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12px; font-weight: 700; color: var(--emerald); }
.axis-list strong { display: block; color: #fff; font-size: .875rem; margin-bottom: 4px; }
.axis-list p { margin: 0; color: #CBD5E1; font-size: 12px; line-height: 1.55; }
.axis-list .axis-src { margin-top: 6px; color: var(--slate-400); font-size: 11px; }
.axis-src a { color: var(--emerald-300); }
.axis-btns { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 20px; }
.matrix-panel { align-self: start; background: #fff; color: var(--ink); box-shadow: var(--shadow-lg); display: flex; flex-direction: column; gap: 14px; }
.matrix-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-wrap: wrap; }
.matrix-head h3 { display: flex; align-items: center; gap: 6px; margin: 0; font-size: 1rem; font-weight: 800; color: var(--navy); }
.matrix-head h3 .icon { color: var(--green); }
.matrix-tag { font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; padding: 3px 8px; border-radius: 4px; background: #ECFDF5; color: #047857; border: 1px solid #A7F3D0; }
.matrix-intro { margin: 0; font-size: 12px; color: var(--slate-600); }
.matrix-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.matrix-list li { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 8px; background: var(--page); border: 1px solid #F1F5F9; }
.mx-name { display: flex; flex-direction: column; min-width: 0; }
.mx-name a { text-decoration: none; }
.mx-name strong { font-size: .875rem; color: #1E293B; }
.mx-name span { font-size: 11px; color: var(--slate-500); }
.mx-times { display: flex; flex-direction: column; align-items: flex-end; text-align: right; font-size: 11px; font-weight: 700; color: var(--navy); }
.matrix-note { margin: 0; font-size: 11px; color: var(--slate-500); line-height: 1.55; padding: 10px 12px; border-radius: 8px; background: #FFFBEB; border: 1px solid #FDE68A; }
.matrix-panel .btn-white-sq { background: var(--navy); color: #fff; border-color: var(--navy); border-radius: 6px; }
.matrix-panel .btn-white-sq:hover { background: var(--navy-deep); color: #fff; }

/* ---------- Featured / videos / trends / FAQ / CTA ---------- */
.video-slide { border-radius: 12px; }
.carousel-btn { border-radius: 6px; }
.faq { border-radius: 8px; border-color: var(--line); }
.faq summary { color: var(--navy); }
.cta-band { border-radius: 16px; background: linear-gradient(90deg, var(--navy) 0%, #0E2C5A 50%, var(--navy) 100%); }
.cta-copy { max-width: 46rem; }
.cta-band h2 { font-size: clamp(1.5rem, 3vw, 2rem); margin-bottom: 8px; }
.cta-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.cta-actions .btn { text-transform: uppercase; letter-spacing: .05em; font-size: .8rem; padding: 14px 22px; }
@media (max-width: 560px) { .cta-actions { width: 100%; } .cta-actions .btn { flex: 1 1 100%; } }

/* ---------- Footer ---------- */
.site-footer { background: var(--navy); color: #CBD5E1; padding: 0 0 24px; border-top: 1px solid var(--navy-deep); }
.footer-cta { border-bottom: 1px solid rgba(255, 255, 255, .1); }
.footer-cta-inner { display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap; padding-top: 48px; padding-bottom: 48px; }
.footer-cta-label { margin: 0 0 6px; font-size: 12px; text-transform: uppercase; letter-spacing: .1em; color: var(--green); font-weight: 600; }
.footer-cta-title { color: #fff; font-size: clamp(1.5rem, 3vw, 1.875rem); font-weight: 700; letter-spacing: -.02em; margin: 0 0 6px; }
.footer-cta-text { margin: 0; font-size: .875rem; color: #CBD5E1; max-width: 42rem; }
.footer-cta-actions { display: flex; gap: 12px; flex-wrap: wrap; }
.footer-cta-actions .btn { font-size: 12px; min-height: 44px; padding: 12px 20px; }
.footer-cta-actions .icon { color: var(--green); }
@media (max-width: 560px) { .footer-cta-actions { width: 100%; flex-direction: column; } }
.footer-grid { grid-template-columns: 4fr 3fr 3fr; gap: 40px; padding-top: 64px; }
@media (max-width: 900px) { .footer-grid { grid-template-columns: 1fr 1fr; } .footer-brand { grid-column: 1 / -1; } }
@media (max-width: 560px) { .footer-grid { grid-template-columns: 1fr; } }
.footer-logo-img { background: transparent; padding: 0; border-radius: 0; }
.footer-tagline { color: rgba(253, 230, 138, .9); font-style: italic; font-size: 12px; font-weight: 400; }
.footer-about { font-size: 12px; color: #CBD5E1; line-height: 1.65; max-width: 24rem; }
.footer-contact { font-size: 12px; gap: 10px; }
.footer-contact .icon { color: var(--emerald); margin-top: 1px; }
.footer-heading { font-size: 11px; font-weight: 700; letter-spacing: .05em; padding-bottom: 6px; border-bottom: 1px solid rgba(255, 255, 255, .1); }
.footer-links { font-size: 12px; }
.site-footer a { color: #CBD5E1; }
.site-footer a:hover { color: #fff; text-decoration: none; }
.site-footer a.footer-hl { color: var(--emerald-300); font-weight: 600; }
.footer-bottom { font-size: 11px; color: var(--slate-400); }

/* ---------- Floating Call / WhatsApp pills ---------- */
.floating-contact { right: 24px; bottom: 24px; z-index: 40; display: flex; flex-direction: column; align-items: flex-end; gap: 8px; padding-bottom: env(safe-area-inset-bottom, 0px); }
.fab { width: auto; height: auto; border-radius: 999px; display: inline-flex; align-items: center; gap: 8px; padding: 10px 14px; font-size: 13px; font-weight: 700; letter-spacing: .02em; border: 1px solid rgba(255, 255, 255, .25); box-shadow: 0 10px 15px -3px rgba(0, 0, 0, .2); transition: transform .15s, background .15s; }
.fab .fab-ic { width: 20px; height: 20px; border-radius: 50%; background: rgba(255, 255, 255, .15); display: grid; place-items: center; }
.fab .icon { width: 12px; height: 12px; }
.fab-call { background: rgba(18, 59, 120, .95); }
.fab-call .fab-ic { color: var(--emerald-300); }
.fab-call:hover { background: var(--navy); }
.fab-whatsapp { background: rgba(38, 155, 69, .95); }
.fab-whatsapp:hover { background: var(--green-dark); }
.fab:hover { transform: none; }
.fab:active { transform: scale(.95); }
@media (max-width: 639px) {
  .floating-contact { right: 12px; bottom: 12px; flex-direction: row; align-items: center; }
  .fab { padding: 8px 12px; font-size: 11px; gap: 6px; }
  .fab .fab-ic { width: 16px; height: 16px; }
  .fab .icon { width: 10px; height: 10px; }
  .site-footer { padding-bottom: 72px; }
}
@media (prefers-reduced-motion: reduce) { .hero-slider .slide-media img { transition: none; } }

/* =====================================================================
   v2.2 — Trending localities (tabs + count cards)
   ===================================================================== */
.loc-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; margin-bottom: 18px; }
.loc-head h2 { font-size: clamp(1.5rem, 3vw, 1.875rem); margin: 4px 0 0; }
.loc-arrows { display: flex; gap: 10px; }
.round-btn { width: 40px; height: 40px; border-radius: 50%; border: 0; background: var(--green-soft, #E7F4EA); color: var(--green-dark); display: grid; place-items: center; cursor: pointer; }
.round-btn:hover { background: #D3ECDA; }
.loc-tabs { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; padding-bottom: 2px; margin-bottom: 22px; }
.loc-tabs::-webkit-scrollbar { display: none; }
.loc-tab { flex: 0 0 auto; min-width: 150px; padding: 12px 20px; border-radius: 12px 12px 4px 4px; border: 1px solid #D5DBE1; border-bottom: 3px solid #D5DBE1; background: #fff; color: var(--slate-500); font: inherit; font-weight: 600; font-size: .95rem; cursor: pointer; white-space: nowrap; }
.loc-tab:hover { color: var(--green-dark); }
.loc-tab[aria-selected="true"] { background: var(--green-soft, #E7F4EA); color: var(--green-dark); border-color: var(--green); border-bottom-color: var(--green); }
.loc-track { list-style: none; margin: 0; padding: 4px 2px 14px; display: grid; grid-auto-flow: column; grid-auto-columns: minmax(230px, calc((100% - 5 * 16px) / 6)); gap: 16px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; scrollbar-width: thin; overscroll-behavior-x: contain; }
.loc-track > li { scroll-snap-align: start; }
.loc-card { position: relative; display: flex; flex-direction: column; height: 220px; padding: 18px 20px 0; border-radius: 12px; background: linear-gradient(180deg, #fff 0%, #fff 45%, #F7FAF8 100%); box-shadow: 0 6px 18px rgba(16, 24, 40, .08); text-decoration: none; color: var(--ink); overflow: hidden; transition: box-shadow .2s, transform .2s; }
.loc-card:hover { box-shadow: 0 12px 26px rgba(16, 24, 40, .14); transform: translateY(-2px); color: var(--ink); }
.loc-count { font-size: 1.05rem; color: #334155; }
.loc-count strong { font-size: 2.2rem; font-weight: 900; color: var(--ink); line-height: 1; margin-right: 2px; }
.loc-name { font-size: 1.15rem; font-weight: 700; color: var(--ink); margin-top: 4px; }
.loc-card:hover .loc-name, .loc-card:hover .loc-count strong { color: var(--green-dark); }
.loc-art { position: absolute; left: 0; right: 0; bottom: 0; height: 120px; }
.loc-sky { position: absolute; inset: 0; width: 100%; height: 100%; }
.loc-city { fill: #A9DDB8; }
.loc-card:hover .loc-city { fill: #8CD0A0; }
.loc-route { stroke: #C3CBD3; stroke-width: 1.5; stroke-dasharray: 5 5; }
.loc-pin { position: absolute; top: 12px; width: 24px; height: 24px; fill: var(--navy); transform: translateX(-50%); }
@media (max-width: 640px) { .loc-track { grid-auto-columns: 72%; } .loc-tab { min-width: 0; padding: 10px 16px; } .loc-arrows { display: none; } }

.eyebrow-amber { font-size: 13px; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; color: #F5A524; margin-bottom: 8px; }

/* =====================================================================
   v2.3 — Premium styling: Plus Jakarta Sans display type, floating pill
   header with dropdowns (KR-style), refined buttons and cards
   ===================================================================== */
@font-face { font-family: "Plus Jakarta Sans"; font-style: normal; font-weight: 500; font-display: swap; src: url("../fonts/plus-jakarta-sans-latin-500-normal.woff2") format("woff2"); }
@font-face { font-family: "Plus Jakarta Sans"; font-style: normal; font-weight: 600; font-display: swap; src: url("../fonts/plus-jakarta-sans-latin-600-normal.woff2") format("woff2"); }
@font-face { font-family: "Plus Jakarta Sans"; font-style: normal; font-weight: 700; font-display: swap; src: url("../fonts/plus-jakarta-sans-latin-700-normal.woff2") format("woff2"); }
@font-face { font-family: "Plus Jakarta Sans"; font-style: normal; font-weight: 800; font-display: swap; src: url("../fonts/plus-jakarta-sans-latin-800-normal.woff2") format("woff2"); }
@font-face { font-family: "Playfair Display"; font-style: normal; font-weight: 600; font-display: swap; src: url("../fonts/playfair-display-latin-600-normal.woff2") format("woff2"); }
@font-face { font-family: "Playfair Display"; font-style: italic; font-weight: 600; font-display: swap; src: url("../fonts/playfair-display-latin-600-italic.woff2") format("woff2"); }

:root {
  --font-display: "Plus Jakarta Sans", "Inter", "Noto Sans Devanagari", system-ui, sans-serif;
  --font-serif: "Playfair Display", Georgia, "Times New Roman", serif;
  --gold: #C9A227;
  --hdr: 88px;
  --radius: 16px;
  --shadow-soft: 0 10px 30px rgba(7, 21, 45, .08);
  --shadow-card: 0 1px 2px rgba(16, 24, 40, .04), 0 12px 32px rgba(16, 24, 40, .07);
}
h1, h2, h3, .h3, h4, .h4, .btn, .nav-link, .eyebrow, .eyebrow-dot, .eyebrow-green, .eyebrow-navy, .eyebrow-amber, .tag-light, .stat-big, .stat-value, .slide-name, .loc-count strong, .loc-name, .footer-cta-title, .fmp-title, .axis-title, .why-num, .price-pill, .card-title { font-family: var(--font-display); }
h1, h2 { font-weight: 800; letter-spacing: -.025em; }
h3 { font-weight: 700; letter-spacing: -.01em; }
.serif, .hl-serif { font-family: var(--font-serif); font-style: italic; font-weight: 600; letter-spacing: 0; }
body { font-size: 15.5px; }

/* Buttons: soft pills */
.btn { border-radius: 999px; font-weight: 700; letter-spacing: .01em; }
.btn-white-sq, .btn-outline-light-sq { border-radius: 999px; }
.hero-btn { border-radius: 999px; }
.btn-icon-sq { border-radius: 999px; }
.btn:hover { transform: translateY(-1px); }
.btn:active { transform: translateY(0) scale(.98); }

/* ---------- Floating pill header ---------- */
.site-header { position: sticky; top: 0; z-index: 60; background: transparent; border: 0; box-shadow: none; padding: 12px 0; transition: padding .2s; }
.site-header.is-scrolled { padding: 8px 0; }
.header-pill { display: flex; align-items: center; gap: 18px; min-height: 64px; padding: 8px 8px 8px 22px; background: rgba(255, 255, 255, .97); border: 1px solid rgba(18, 59, 120, .08); border-radius: 999px; box-shadow: 0 12px 34px rgba(7, 21, 45, .14); }
.header-pill .brand img { max-height: 44px; width: auto; }
.main-nav { margin: 0 auto; }
.nav-list { list-style: none; display: flex; align-items: center; gap: 2px; margin: 0; padding: 0; }
.nav-item { position: relative; display: flex; align-items: center; }
.main-nav .nav-link { display: inline-flex; align-items: center; gap: 5px; padding: 10px 10px; border-radius: 999px; font-size: 12.5px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; color: #1E293B; background: none; text-decoration: none; white-space: nowrap; }
.main-nav .nav-link:hover { color: var(--green-dark); background: none; }
.main-nav .nav-link[aria-current="page"] { color: var(--green); background: none; }
.main-nav .nav-link[aria-current="page"]::after { display: none; }
.main-nav .nav-link.nav-hl { color: var(--green); }
.sub-toggle { display: inline-grid; place-items: center; width: 22px; height: 28px; margin-left: -8px; border: 0; background: none; color: #475569; cursor: pointer; border-radius: 6px; }
.sub-toggle .icon { transition: transform .2s; }
.sub-menu { list-style: none; margin: 0; padding: 8px; position: absolute; left: -6px; top: calc(100% + 10px); min-width: 230px; background: #fff; border-radius: 16px; border: 1px solid #EEF1F4; box-shadow: 0 18px 40px rgba(7, 21, 45, .16); opacity: 0; visibility: hidden; transform: translateY(6px); transition: opacity .18s, transform .18s, visibility .18s; z-index: 70; }
.sub-menu::before { content: ""; position: absolute; left: 0; right: 0; top: -12px; height: 12px; }
.sub-menu a { display: block; padding: 9px 12px; border-radius: 10px; font-size: 14px; font-weight: 500; color: #1E293B; text-decoration: none; white-space: nowrap; letter-spacing: 0; text-transform: none; }
.sub-menu a:hover { background: var(--green-soft, #E7F4EA); color: var(--green-dark); }
@media (min-width: 1181px) {
  .has-sub:hover > .sub-menu, .has-sub:focus-within > .sub-menu, .has-sub.open > .sub-menu { opacity: 1; visibility: visible; transform: translateY(0); }
  .has-sub:hover > .sub-toggle .icon, .has-sub.open > .sub-toggle .icon { transform: rotate(180deg); }
}
.header-cta { display: inline-flex; gap: 8px; padding: 12px 22px; min-height: 48px; background: linear-gradient(135deg, var(--green) 0%, #1F7F39 100%); color: #fff; border: 0; font-size: 12.5px; letter-spacing: .07em; text-transform: uppercase; box-shadow: 0 8px 18px rgba(38, 155, 69, .3); }
.header-cta:hover { color: #fff; background: linear-gradient(135deg, #2BAA4D 0%, var(--green-dark) 100%); }
.header-cta .cta-short { display: none; }
.page-home .hero { margin-top: calc(-1 * var(--hdr)); }
.page-home .hero-inner { padding-top: calc(var(--hdr) + 28px); }
@media (min-width: 640px) { .page-home .hero-inner { padding-top: calc(var(--hdr) + 48px); } }
@media (min-width: 1181px) and (max-width: 1340px) { .main-nav .nav-link { padding: 10px 7px; font-size: 11.5px; letter-spacing: .05em; } .header-pill { gap: 10px; } .header-cta { padding: 12px 16px; } }
@media (max-width: 1180px) {
  :root { --hdr: 80px; }
  .header-pill { min-height: 56px; padding: 6px 6px 6px 16px; gap: 10px; }
  .header-pill .brand img { max-height: 36px; }
  .header-actions { margin-left: auto; display: flex; align-items: center; gap: 6px; }
  .header-cta { padding: 10px 14px; min-height: 42px; font-size: 11.5px; }
  .header-cta .cta-long { display: none; }
  .header-cta .cta-short { display: inline; }
  .nav-toggle { display: grid; width: 44px; height: 44px; border-radius: 999px; border: 1px solid #E2E8F0; background: #fff; }
  .main-nav { display: none; position: fixed; left: 12px; right: 12px; top: calc(var(--hdr) + 4px); bottom: auto; max-height: calc(100vh - var(--hdr) - 20px); overflow-y: auto; margin: 0; padding: 12px; background: #fff; border-radius: 22px; border: 1px solid #EEF1F4; box-shadow: 0 24px 48px rgba(7, 21, 45, .22); }
  .nav-open .main-nav { display: block; }
  .nav-list { flex-direction: column; align-items: stretch; gap: 0; }
  .nav-item { flex-wrap: wrap; border-bottom: 1px solid #F1F5F9; }
  .main-nav .nav-link { flex: 1; padding: 14px 10px; font-size: 13.5px; border-radius: 10px; }
  .sub-toggle { width: 44px; height: 44px; margin: 0; }
  .has-sub.open > .sub-toggle .icon { transform: rotate(180deg); }
  .sub-menu { position: static; display: none; width: 100%; min-width: 0; box-shadow: none; border: 0; padding: 0 0 8px 10px; opacity: 1; visibility: visible; transform: none; }
  .has-sub.open > .sub-menu { display: block; }
  .mobile-nav-contact { display: grid; gap: 10px; margin-top: 14px; }
  .main-nav .mobile-nav-contact a { border-radius: 999px; }
}
@media (max-width: 400px) { .header-pill .brand img { max-height: 30px; max-width: 140px; } .header-cta { padding: 9px 11px; } }

/* ---------- Premium polish ---------- */
.section-head h2, .section-head-line h2, .loc-head h2 { font-size: clamp(1.6rem, 3.2vw, 2.2rem); }
.eyebrow-dot, .eyebrow-green { letter-spacing: .12em; }
.card, .project-card, .loc-card, .why-item, .search-card, .stat-strip { border-radius: var(--radius); }
.project-card { box-shadow: var(--shadow-card); border-color: #EEF1F4; }
.project-card:hover { box-shadow: 0 18px 44px rgba(16, 24, 40, .14); }
.card-badges .badge { border-radius: 999px; }
.price-pill { border-radius: 999px; }
.search-card { box-shadow: var(--shadow-soft); border-color: #EEF1F4; }
.search-card select, .search-card input { border-radius: 12px; }
.search-card .btn { border-radius: 12px; }
.hero h1 { font-family: var(--font-display); }
.hero h1 .hl { font-family: var(--font-serif); font-style: italic; font-weight: 600; letter-spacing: -.01em; }
.hero-slider { border-radius: 22px; }
.slide-media { border-radius: 0; }
.sq-btn { border-radius: 999px; }
.fmp-band, .cta-band, .why-wrap { border-radius: 24px; }
.faq { border-radius: 14px; background: #fff; box-shadow: 0 1px 2px rgba(16, 24, 40, .04); }
.faq summary { font-family: var(--font-display); font-weight: 700; }
.main-nav .sub-menu { display: block; flex-direction: column; gap: 0; }
.main-nav .sub-menu li { display: block; border: 0; }
.main-nav .sub-menu a { border: 0; }
@media (max-width: 1180px) { .main-nav .sub-menu { display: none; } .main-nav .has-sub.open > .sub-menu { display: block; } }

/* ---------- Development in Progress cards ---------- */
.dev-count { margin: 0; font-size: .9rem; color: var(--slate-500); }
.dev-count strong { color: var(--ink); }
.dev-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 22px; }
@media (max-width: 1100px) { .dev-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .dev-grid { grid-auto-flow: column; grid-template-columns: none; grid-auto-columns: 84%; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 8px; } .dev-card { scroll-snap-align: start; } }
.dev-card { display: flex; flex-direction: column; background: #fff; border: 1px solid #EEF1F4; border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow-card); transition: box-shadow .25s, transform .25s; }
.dev-card:hover { transform: translateY(-3px); box-shadow: 0 18px 40px rgba(16, 24, 40, .13); }
.dev-thumb { position: relative; display: block; width: 100%; aspect-ratio: 16 / 9; border: 0; padding: 0; background: #0F172A; cursor: pointer; overflow: hidden; color: #fff; }
.dev-thumb img, .dev-thumb-ph { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .5s; }
.dev-thumb-ph { background: linear-gradient(135deg, var(--navy), var(--navy-deep)); }
.dev-card:hover .dev-thumb img { transform: scale(1.05); }
.dev-shade { position: absolute; inset: 0; background: linear-gradient(0deg, rgba(0, 0, 0, .55) 0%, rgba(0, 0, 0, 0) 45%, rgba(0, 0, 0, .25) 100%); }
.dev-chip { position: absolute; top: 12px; display: inline-flex; align-items: center; gap: 5px; padding: 4px 10px; border-radius: 999px; font-size: 11.5px; font-weight: 700; font-family: var(--font-display); }
.dev-stage { left: 12px; background: var(--navy); color: #fff; max-width: calc(100% - 90px); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dev-stage .icon { color: var(--emerald); }
.dev-dur { right: 12px; background: rgba(0, 0, 0, .6); color: #fff; }
.dev-play { position: absolute; left: 50%; top: 50%; width: 54px; height: 54px; margin: -27px 0 0 -27px; border-radius: 50%; background: rgba(18, 59, 120, .9); display: grid; place-items: center; box-shadow: 0 8px 20px rgba(0, 0, 0, .35); transition: transform .2s; }
.dev-play .icon { width: 22px; height: 22px; fill: #fff; stroke: none; margin-left: 3px; }
.dev-thumb:hover .dev-play { transform: scale(1.08); }
.dev-loc { position: absolute; left: 12px; bottom: 10px; display: inline-flex; align-items: center; gap: 5px; font-size: 12.5px; font-weight: 600; text-shadow: 0 1px 3px rgba(0, 0, 0, .6); }
.dev-loc .icon { color: var(--emerald); }
.dev-body { display: flex; flex-direction: column; flex: 1; padding: 16px 18px 14px; }
.dev-project { font-family: var(--font-display); font-size: 11.5px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--navy); text-decoration: none; margin-bottom: 6px; }
.dev-title { font-size: 1.05rem; font-weight: 800; line-height: 1.3; margin: 0 0 6px; color: #1E293B; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.dev-text { font-size: .85rem; color: var(--slate-600); margin: 0 0 12px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.dev-foot { margin-top: auto; display: flex; align-items: center; justify-content: space-between; padding-top: 10px; border-top: 1px solid #F1F5F9; font-size: .82rem; color: var(--slate-500); }
.dev-foot > span { display: inline-flex; align-items: center; gap: 5px; }
.dev-watch { display: inline-flex; align-items: center; gap: 4px; border: 0; background: none; font: inherit; font-weight: 800; color: var(--navy); cursor: pointer; font-family: var(--font-display); }
.dev-watch:hover { color: var(--green-dark); }

/* ---------- Reels coverflow ---------- */
.section-reels { overflow: hidden; background: linear-gradient(180deg, #fff 0%, var(--page) 100%); }
.center-flex { display: flex; align-items: center; justify-content: center; gap: 8px; }
.coverflow { position: relative; height: 540px; margin: 10px 0 8px; }
.cf-track { list-style: none; margin: 0; padding: 0; position: absolute; inset: 0; }
.cf-item { position: absolute; left: 50%; top: 20px; width: 290px; height: 480px; transition: transform .55s cubic-bezier(.2, .7, .2, 1), opacity .4s; will-change: transform; }
.reel-card { position: relative; display: block; width: 100%; height: 100%; padding: 0; border: 0; border-radius: 22px; overflow: hidden; background: #0F172A; color: #fff; cursor: pointer; box-shadow: 0 20px 40px rgba(7, 21, 45, .28); text-align: center; }
.cf-item.is-active .reel-card { box-shadow: 0 30px 60px rgba(7, 21, 45, .35), 0 0 0 4px rgba(38, 155, 69, .15); }
.reel-card img, .reel-ph, .reel-tile img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.reel-ph { background: linear-gradient(160deg, var(--navy) 0%, #0B2346 60%, #14532D 100%); }
.reel-shade { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0, 0, 0, .1) 0%, rgba(0, 0, 0, .35) 45%, rgba(0, 0, 0, .7) 100%); }
.cf-item:not(.is-active) .reel-shade { background: rgba(30, 41, 59, .55); }
.reel-info { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; padding: 18px; }
.reel-loc { display: inline-flex; align-items: center; gap: 6px; font-family: var(--font-display); font-size: 1.3rem; font-weight: 800; text-shadow: 0 2px 8px rgba(0, 0, 0, .5); }
.reel-count { font-size: .95rem; font-weight: 600; opacity: .9; }
.reel-play { display: grid; place-items: center; width: 62px; height: 62px; margin-top: 10px; border-radius: 50%; background: #fff; color: var(--green); box-shadow: 0 10px 24px rgba(0, 0, 0, .3); }
.reel-play .icon { width: 26px; height: 26px; fill: currentColor; stroke: none; margin-left: 3px; }
.reel-explore { position: absolute; bottom: 22px; display: none; align-items: center; gap: 6px; font-weight: 700; color: var(--emerald-300); font-family: var(--font-display); }
.cf-item.is-active .reel-explore { display: inline-flex; }
.cf-nav { position: absolute; top: 50%; margin-top: -24px; z-index: 200; width: 48px; height: 48px; border-radius: 50%; border: 0; background: #fff; color: var(--navy); display: grid; place-items: center; box-shadow: 0 8px 20px rgba(7, 21, 45, .18); cursor: pointer; }
.cf-prev { left: max(16px, calc(50% - 600px)); }
.cf-next { right: max(16px, calc(50% - 600px)); }
.cf-dots { position: absolute; left: 0; right: 0; bottom: 0; display: flex; justify-content: center; gap: 6px; }
.cf-dot { width: 9px; height: 9px; border-radius: 99px; border: 0; padding: 0; background: #CBD5E1; cursor: pointer; transition: width .3s, background .3s; }
.cf-dot.is-active { width: 30px; background: var(--green); }
.btn-reels { margin-top: 18px; background: #fff; color: var(--green-dark); border: 1.5px solid #D5E9DB; box-shadow: 0 6px 16px rgba(16, 24, 40, .08); }
.btn-reels:hover { background: var(--green-soft); color: var(--green-dark); }
@media (max-width: 700px) { .coverflow { height: 470px; } .cf-item { width: 240px; height: 410px; } .cf-nav { display: none; } }
.reel-group { margin-bottom: 36px; }
.reel-group h2 { display: flex; align-items: center; gap: 8px; }
.reel-grid { list-style: none; margin: 14px 0 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 16px; }
.reel-tile { position: relative; display: block; width: 100%; aspect-ratio: 9 / 16; border: 0; padding: 0; border-radius: 18px; overflow: hidden; background: #0F172A; color: #fff; cursor: pointer; box-shadow: var(--shadow-card); }
.reel-tile .reel-play { position: absolute; left: 50%; top: 45%; transform: translate(-50%, -50%); margin: 0; }
.reel-tile-title { position: absolute; left: 12px; right: 12px; bottom: 12px; text-align: left; font-weight: 700; font-size: .92rem; line-height: 1.3; }
.reel-tile-title small { display: block; font-weight: 500; opacity: .85; }

/* ---------- Video modal ---------- */
.vmodal { position: fixed; inset: 0; z-index: 120; display: flex; align-items: center; justify-content: center; padding: 16px; }
.vmodal[hidden] { display: none; }
.vmodal-backdrop { position: absolute; inset: 0; background: rgba(7, 21, 45, .85); }
.vmodal-panel { position: relative; width: min(960px, 100%); background: #0B1220; border-radius: 18px; overflow: hidden; box-shadow: 0 30px 80px rgba(0, 0, 0, .5); }
.vmodal.is-vertical .vmodal-panel { width: min(400px, 100%); }
.vmodal-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 10px 10px 18px; color: #fff; }
.vmodal-title { margin: 0; font-weight: 700; font-size: .95rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.vmodal-close { width: 40px; height: 40px; border-radius: 50%; border: 0; background: rgba(255, 255, 255, .1); color: #fff; display: grid; place-items: center; cursor: pointer; flex-shrink: 0; }
.vmodal-frame { position: relative; aspect-ratio: 16 / 9; background: #000; }
.vmodal.is-vertical .vmodal-frame { aspect-ratio: 9 / 16; max-height: calc(100vh - 140px); margin: 0 auto; }
.vmodal-frame iframe, .vmodal-frame video { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; background: #000; }
.vmodal-nav { display: flex; align-items: center; justify-content: center; gap: 14px; padding: 10px; color: #CBD5E1; font-size: .9rem; }
.vmodal-nav[hidden] { display: none; }

/* ---------- Flagship spotlight (Metrocity Greens) ---------- */
.section-spotlight { background: radial-gradient(1200px 500px at 85% 0%, rgba(38, 155, 69, .08), transparent 60%), #fff; }
.spot-grid { display: grid; grid-template-columns: 1.15fr 1fr; gap: 48px; align-items: center; }
@media (max-width: 1000px) { .spot-grid { grid-template-columns: 1fr; gap: 28px; } }
.spot-main { position: relative; display: block; border-radius: 24px; overflow: hidden; aspect-ratio: 16 / 10; background: #E2E8F0; box-shadow: 0 30px 60px rgba(7, 21, 45, .18); }
.spot-main img, .spot-main .img-placeholder { width: 100%; height: 100%; object-fit: cover; transition: transform .8s; }
.spot-main:hover img { transform: scale(1.04); }
.spot-badge { position: absolute; left: 16px; top: 16px; display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: 999px; background: var(--green); color: #fff; font-size: 12px; font-weight: 700; }
.spot-thumbs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-top: 12px; }
.spot-thumbs figure { position: relative; margin: 0; border-radius: 14px; overflow: hidden; aspect-ratio: 4 / 3; background: #E2E8F0; }
.spot-thumbs img { width: 100%; height: 100%; object-fit: cover; }
.spot-thumbs figcaption { position: absolute; left: 0; right: 0; bottom: 0; padding: 14px 8px 6px; font-size: 11px; font-weight: 600; color: #fff; background: linear-gradient(0deg, rgba(0, 0, 0, .65), transparent); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.spot-eyebrow { display: flex; align-items: center; gap: 10px; margin: 0 0 10px; font-family: var(--font-display); font-size: 12px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; color: var(--green); }
.spot-line { width: 34px; height: 2px; background: var(--green); }
.spot-title { font-family: var(--font-serif); font-weight: 600; font-size: clamp(2.2rem, 4.4vw, 3.4rem); letter-spacing: -.01em; line-height: 1.05; color: var(--navy); margin: 0 0 10px; }
.spot-loc { display: flex; align-items: center; gap: 6px; color: var(--slate-600); font-weight: 600; margin-bottom: 10px; }
.spot-loc .icon { color: var(--green); }
.spot-tagline { font-size: 1.05rem; color: #334155; }
.spot-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 18px 0; }
.spot-facts div { padding: 14px 16px; border-radius: 14px; background: var(--page); border: 1px solid #EEF1F4; }
.spot-facts dt { font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--slate-400); }
.spot-facts dd { margin: 2px 0 0; font-family: var(--font-display); font-weight: 800; font-size: 1.05rem; color: var(--navy); }
.spot-highlights { list-style: none; margin: 0 0 16px; padding: 0; display: grid; gap: 8px; }
.spot-highlights li { display: flex; gap: 8px; align-items: flex-start; color: #334155; font-size: .95rem; }
.spot-highlights .icon { color: var(--green); margin-top: 3px; }
.spot-sub { font-family: var(--font-display); font-weight: 800; font-size: .85rem; letter-spacing: .06em; text-transform: uppercase; color: var(--ink); margin: 0 0 8px; }
.spot-amen { list-style: none; margin: 0 0 20px; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.spot-amen li { padding: 6px 12px; border-radius: 999px; background: var(--green-soft); color: var(--green-dark); font-size: .82rem; font-weight: 600; }
.spot-amen li.more { background: var(--navy); }
.spot-amen li.more a { color: #fff; text-decoration: none; }
.spot-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.btn-ghost-dark { background: #fff; color: var(--ink); border: 1.5px solid #E2E8F0; }
.btn-ghost-dark:hover { border-color: var(--green); color: var(--green-dark); }
.spot-actions .btn-whatsapp { background: #16834B; color: #fff; border-color: #16834B; box-shadow: 0 8px 18px rgba(22, 131, 75, .18); }
.spot-actions .btn-whatsapp:hover { background: #116D3E; border-color: #116D3E; color: #fff; }
.spot-description { display: flex; align-items: flex-start; gap: 9px; max-width: 58ch; margin: 18px 0 0; padding: 13px 15px; border-left: 2px solid var(--green); border-radius: 0 10px 10px 0; background: linear-gradient(90deg, rgba(38, 155, 69, .07), rgba(38, 155, 69, .015)); color: #526174; font-size: .84rem; line-height: 1.65; }
.spot-description .icon { flex: 0 0 16px; margin-top: 2px; color: var(--green-dark); }
.spot-note { margin: 14px 0 0; font-size: .78rem; color: var(--slate-500); }
@media (max-width: 600px) { .spot-description { margin-top: 14px; padding: 11px 12px; font-size: .8rem; } }

/* corridor cards list our projects */
.corridor-card { display: flex; flex-direction: column; }
.corridor-media { display: block; }
.corridor-body h3 a { color: inherit; text-decoration: none; }
.corridor-projects { list-style: none; margin: 4px 0 14px; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.corridor-projects a { display: inline-flex; align-items: center; gap: 4px; padding: 5px 10px; border-radius: 999px; font-size: .78rem; font-weight: 700; text-decoration: none; background: var(--green-soft); color: var(--green-dark); }
.section-navy .corridor-projects a { background: rgba(52, 211, 153, .14); color: var(--emerald-300); border: 1px solid rgba(52, 211, 153, .3); }
.section-navy .corridor-projects a:hover { background: rgba(52, 211, 153, .25); color: #fff; }
.section-navy .corridor-body h3 a:hover { color: var(--emerald-300); }
.dev-grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } @media (max-width: 600px) { .dev-grid-2 { grid-template-columns: none; } }
.spot-grid { align-items: start; }
@media (min-width: 1001px) { .spot-media { position: sticky; top: calc(var(--hdr) + 16px); } }
.site-footer .btn-white-sq { color: var(--navy); }
.site-footer .btn-white-sq:hover { color: var(--navy); }
.site-footer .btn-outline-light-sq { color: #fff; }

/* Homepage growth corridor showcase */
.corridor-showcase-section { background: linear-gradient(180deg, #FFFFFF 0%, #F7FAF8 100%); }
.corridor-showcase-heading { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-bottom: 22px; }
.corridor-showcase-heading .eyebrow { margin-bottom: 5px; }
.corridor-showcase-heading h2 { margin: 0; color: var(--navy-deep); font-family: var(--font-serif); font-size: clamp(1.65rem, 3vw, 2.1rem); letter-spacing: -.02em; }
.corridor-showcase-subtitle { margin: 4px 0 0; color: #607083; font-size: .94rem; line-height: 1.5; }
.corridor-showcase-actions { display: flex; align-items: center; justify-content: flex-end; gap: 14px; flex: 0 0 auto; }
.corridor-showcase-all { display: inline-flex; align-items: center; gap: 6px; color: var(--green-dark); font-size: .83rem; font-weight: 800; text-decoration: none; white-space: nowrap; }
.corridor-showcase-all:hover { color: var(--navy); }
.corridor-showcase-actions .project-locality-controls { margin: 0; }
.corridor-showcase-track { display: flex; gap: 12px; min-width: 0; overflow-x: auto; padding: 2px 2px 12px; scroll-snap-type: x mandatory; scroll-behavior: smooth; scrollbar-width: thin; overscroll-behavior-x: contain; }
.corridor-showcase-track:focus-visible { outline: 3px solid rgba(16, 185, 129, .42); outline-offset: 3px; }
.corridor-showcase-track > [data-locality-card] { flex: 0 0 calc((100% - 48px) / 5); min-width: 0; scroll-snap-align: start; }
.corridor-showcase-card { height: 258px; overflow: hidden; border: 1px solid rgba(16, 42, 67, .12); border-radius: 15px; background: #102D46; box-shadow: 0 8px 20px rgba(11, 35, 70, .13); transition: transform .2s ease, box-shadow .2s ease; }
.corridor-showcase-card:hover { transform: translateY(-3px); box-shadow: 0 15px 30px rgba(11, 35, 70, .2); }
.corridor-showcase-link { position: relative; display: block; width: 100%; height: 100%; overflow: hidden; color: #fff; text-decoration: none; }
.corridor-showcase-link:hover { color: #fff; }
.corridor-showcase-visual { position: absolute; z-index: 0; inset: 0; overflow: hidden; isolation: isolate; background-color: #173A56; background-position: center; background-size: cover; }
.corridor-showcase-pattern { position: absolute; inset: 0; background: radial-gradient(ellipse at 18% 24%, rgba(88, 173, 186, .55), transparent 38%), linear-gradient(145deg, #25657B, #12324C 70%); }
.corridor-showcase-pattern::before, .corridor-showcase-pattern::after { position: absolute; content: ""; }
.corridor-showcase-pattern::before { inset: 0; opacity: .34; background: linear-gradient(155deg, transparent 45%, rgba(255,255,255,.35) 46%, transparent 48%), linear-gradient(25deg, transparent 56%, rgba(255,255,255,.24) 57%, transparent 59%), repeating-linear-gradient(0deg, transparent 0 29px, rgba(255,255,255,.12) 30px 31px); }
.corridor-showcase-pattern::after { width: 140%; height: 38%; left: -20%; top: 18%; transform: rotate(-19deg); border: 8px solid rgba(255,255,255,.12); border-right: 0; border-left: 0; }
.corridor-showcase-track > [data-locality-card]:nth-child(2) .corridor-showcase-pattern { background: radial-gradient(ellipse at 78% 12%, rgba(95, 196, 123, .55), transparent 40%), linear-gradient(150deg, #21745F, #102F46 78%); }
.corridor-showcase-track > [data-locality-card]:nth-child(3) .corridor-showcase-pattern { background: radial-gradient(ellipse at 20% 18%, rgba(243, 151, 88, .55), transparent 40%), linear-gradient(150deg, #86543E, #132E45 78%); }
.corridor-showcase-track > [data-locality-card]:nth-child(4) .corridor-showcase-pattern { background: radial-gradient(ellipse at 80% 20%, rgba(142, 122, 224, .62), transparent 40%), linear-gradient(150deg, #344D83, #102C46 78%); }
.corridor-showcase-track > [data-locality-card]:nth-child(5) .corridor-showcase-pattern { background: radial-gradient(ellipse at 24% 16%, rgba(85, 195, 160, .56), transparent 42%), linear-gradient(150deg, #1D766C, #102F46 78%); }
.corridor-showcase-shade { position: absolute; z-index: 2; inset: 0; background: linear-gradient(180deg, rgba(5, 22, 38, .02) 10%, rgba(5, 22, 38, .24) 38%, rgba(5, 22, 38, .94) 100%); }
.corridor-showcase-icon { position: absolute; z-index: 3; top: 30%; left: 13px; display: grid; width: 40px; height: 40px; place-items: center; border: 2px solid rgba(255,255,255,.85); border-radius: 50%; background: #06A9D2; color: #fff; box-shadow: 0 5px 14px rgba(0,0,0,.2); }
.corridor-showcase-icon .icon { width: 20px; height: 20px; }
.corridor-showcase-track > [data-locality-card]:nth-child(2) .corridor-showcase-icon { background: #139A62; }
.corridor-showcase-track > [data-locality-card]:nth-child(3) .corridor-showcase-icon { background: #E76835; }
.corridor-showcase-track > [data-locality-card]:nth-child(4) .corridor-showcase-icon { background: #7752CE; }
.corridor-showcase-track > [data-locality-card]:nth-child(5) .corridor-showcase-icon { background: #149F91; }
.corridor-showcase-copy { position: absolute; z-index: 3; right: 0; bottom: 0; left: 0; padding: 54px 14px 14px; }
.corridor-showcase-label { margin: 0 0 4px; color: rgba(255,255,255,.82); font-size: .58rem; font-weight: 800; letter-spacing: .075em; line-height: 1.35; text-transform: uppercase; }
.corridor-showcase-copy h3 { margin: 0 0 5px; color: #fff; font-size: clamp(.93rem, 1.15vw, 1.08rem); font-weight: 800; line-height: 1.18; }
.corridor-showcase-description { display: -webkit-box; overflow: hidden; min-height: 3.75em; margin: 0 0 7px; color: rgba(255,255,255,.88); font-size: .72rem; line-height: 1.3; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
.corridor-showcase-cta { display: inline-flex; align-items: center; gap: 5px; color: #fff; font-size: .72rem; font-weight: 800; }
.corridor-showcase-link:focus-visible { outline: 3px solid #7EE2B8; outline-offset: -4px; }
.corridor-research-band { margin-top: 36px; padding: clamp(20px, 3vw, 32px); border-radius: 20px; background: linear-gradient(180deg, var(--navy) 0%, var(--navy-deep) 100%); color: #fff; }
.research-band-heading { margin: 0 0 22px; }
.research-band-heading h3 { margin: 0; color: #fff; font-size: clamp(1.35rem, 2.5vw, 1.8rem); line-height: 1.2; }
.research-band-heading p { max-width: 620px; margin: 8px 0 0; color: rgba(255,255,255,.78); font-size: .92rem; line-height: 1.5; }
.corridor-research-band .axis-grid { margin-top: 0; }
@media (max-width: 960px) {
  .corridor-showcase-track > [data-locality-card] { flex-basis: calc((100% - 24px) / 3); }
}
@media (max-width: 640px) {
  .corridor-showcase-heading { align-items: flex-start; flex-direction: column; gap: 12px; margin-bottom: 16px; }
  .corridor-showcase-actions { width: 100%; justify-content: space-between; }
  .corridor-showcase-track { gap: 10px; margin-right: -16px; padding-right: 16px; }
  .corridor-showcase-track > [data-locality-card] { flex-basis: min(78vw, 270px); }
  .corridor-showcase-card { height: 250px; }
  .corridor-showcase-copy h3 { font-size: 1.05rem; }
}
@media (prefers-reduced-motion: reduce) {
  .corridor-showcase-card { transition: none; }
}
.vmodal { z-index: 300; }
.cf-nav { z-index: 150; }

/* Project detail: gallery-first summary, verified routes and document ledger */
.project-hero.page-hero { padding: 24px 0 clamp(34px, 5vw, 60px); background: #F5F6F7; }
.project-hero .breadcrumbs ol { align-items: center; padding-bottom: 14px; margin-bottom: clamp(20px, 3.5vw, 40px); border-bottom: 1px solid #DCE1E6; font-size: .8rem; }
.project-showcase-grid { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(380px, .82fr); gap: clamp(22px, 3vw, 36px); align-items: stretch; }
.project-showcase-media, .project-summary-card { min-width: 0; }
.project-showcase-media .gallery-main { position: relative; overflow: hidden; background: #E7EAED; }
.project-showcase-media .gallery-main img, .project-showcase-media .gallery-main .img-placeholder { width: 100%; aspect-ratio: 1.42; max-height: none; object-fit: cover; border-radius: 0; }
.project-image-badge { position: absolute; top: 16px; left: 16px; display: inline-flex; align-items: center; gap: 6px; max-width: calc(100% - 32px); padding: 8px 12px; background: var(--navy); color: #fff; font-size: .75rem; font-weight: 800; line-height: 1.3; }
.project-showcase-media .gallery-thumbs { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 30px) / 4); grid-template-columns: none; gap: 10px; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; padding-bottom: 4px; }
.project-showcase-media .gallery-thumbs a { display: block; overflow: hidden; background: #E7EAED; }
.project-showcase-media .gallery-thumbs a[aria-current="true"] { outline: 3px solid var(--navy); outline-offset: -3px; }
.project-showcase-media .gallery-thumbs a:focus-visible { outline: 3px solid var(--green); outline-offset: -3px; }
.project-showcase-media .gallery-thumbs li { min-width: 0; scroll-snap-align: start; }
.project-showcase-media .gallery-thumbs img { width: 100%; aspect-ratio: 4 / 3; border-radius: 0; object-fit: cover; transition: transform .3s ease; }
.project-showcase-media .gallery-thumbs a:hover img { transform: scale(1.04); }
.project-summary-card { align-self: stretch; padding: clamp(20px, 2.3vw, 30px); background: #fff; border: 1px solid #E0E3E6; }
.project-summary-card > .eyebrow { margin-bottom: 8px; }
.project-summary-card .project-loc { margin-bottom: 8px; color: var(--green-dark); font-size: .87rem; font-weight: 600; }
.project-summary-card h1 { margin: 0 0 8px; color: var(--navy); font-size: clamp(1.8rem, 2.8vw, 2.6rem); line-height: 1.12; letter-spacing: -.035em; }
.project-summary-tagline { margin: 0 0 16px; color: var(--ink-2); font-size: .94rem; line-height: 1.6; }
.project-summary-card .chip-list { margin: 0 0 16px; }
.project-summary-card .chip { padding: 4px 9px; font-size: .75rem; }
.project-summary-facts { display: grid; gap: 0; margin: 16px 0 18px; border-top: 1px solid #E7EAED; }
.project-summary-facts > div { display: grid; grid-template-columns: minmax(108px, .82fr) minmax(0, 1.18fr); gap: 12px; align-items: center; min-height: 48px; padding: 9px 0; border-bottom: 1px solid #E7EAED; }
.project-summary-facts dt { color: #687789; font-size: .78rem; line-height: 1.45; }
.project-summary-facts dd { margin: 0; color: var(--navy-deep); font-size: .84rem; font-weight: 700; text-align: right; overflow-wrap: anywhere; }
.project-summary-facts > div:first-child dd { font-size: clamp(.98rem, 1.5vw, 1.24rem); }
.project-summary-actions { display: grid; gap: 10px; }
.project-summary-actions .btn { min-height: 44px; border-radius: 2px; font-size: .84rem; }
.project-summary-action-row { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.project-summary-action-row .btn { padding: 10px 12px; }
.project-brochure-link { display: inline-flex; align-items: center; gap: 7px; margin-top: 4px; font-size: .84rem; font-weight: 700; }
.project-price-note { margin: 12px 0 0; line-height: 1.5; }

.detail-layout { padding-top: clamp(34px, 5vw, 56px); }
.project-proof-section { padding: clamp(36px, 5vw, 58px) 0; background: #fff; border-top: 1px solid var(--line); }
.project-proof-heading { display: flex; justify-content: space-between; align-items: end; gap: 20px; padding-bottom: 18px; margin-bottom: 22px; border-bottom: 1px solid var(--line); }
.project-proof-heading .eyebrow { margin-bottom: 6px; }
.project-proof-heading h2 { margin: 0; font-family: var(--font-display); font-size: clamp(1.3rem, 2.5vw, 1.75rem); }
.project-proof-heading > p { margin: 0; color: var(--muted); font-size: .82rem; }
.project-connectivity-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; margin: 0; padding: 0; list-style: none; }
.project-connectivity-card { display: flex; min-width: 0; min-height: 112px; flex-direction: column; align-items: flex-start; padding: 15px 16px; border: 1px solid var(--line); background: #F7F6F2; }
.project-connectivity-label { color: #728092; font-size: .66rem; font-weight: 600; line-height: 1.4; text-transform: uppercase; letter-spacing: .035em; }
.project-connectivity-name { margin-top: 5px; color: var(--navy-deep); font-size: .87rem; line-height: 1.3; }
.project-connectivity-time { margin-top: 5px; color: var(--navy); font-size: 1.3rem; font-weight: 800; line-height: 1.2; }
.project-connectivity-mode { margin-top: auto; padding-top: 6px; color: var(--green-dark); font-size: .69rem; line-height: 1.4; }
.project-proof-note { margin: 14px 0 0; line-height: 1.6; }

.project-ledger-section { padding: 0 0 clamp(38px, 5vw, 64px); }
.project-ledger-panel { padding: clamp(22px, 3vw, 34px); background: #173F76; color: #fff; }
.project-ledger-kicker { margin: 0 0 6px; color: #50D5A2; font-size: .72rem; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
.project-ledger-panel h2 { margin: 0 0 5px; color: #fff; font-family: var(--font-display); font-size: clamp(1.35rem, 2.4vw, 1.75rem); }
.project-ledger-intro { margin: 0; color: #E1EAF5; font-size: .86rem; }
.project-ledger-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin: 20px 0 0; padding: 0; list-style: none; }
.project-ledger-item { display: flex; min-width: 0; min-height: 104px; flex-direction: column; align-items: flex-start; padding: 15px; border: 1px solid rgba(210, 226, 247, .22); background: rgba(255, 255, 255, .065); }
.project-ledger-item > span { color: #AFC4DD; font-size: .65rem; line-height: 1.4; text-transform: uppercase; letter-spacing: .035em; }
.project-ledger-item strong { margin-top: 5px; color: #fff; font-size: .82rem; line-height: 1.45; overflow-wrap: anywhere; }
.project-ledger-item small { margin-top: 5px; color: #50D5A2; font-size: .72rem; line-height: 1.45; }
.project-ledger-disclaimer { margin: 16px 0 0; padding-top: 12px; border-top: 1px solid rgba(210, 226, 247, .2); color: #CAD8E9; font-size: .75rem; line-height: 1.55; }
.project-ledger-copy { margin-top: 18px; color: #E1EAF5; }
.project-ledger-copy p:last-child { margin-bottom: 0; }

@media (max-width: 1000px) {
  .project-showcase-grid { grid-template-columns: minmax(0, 1.05fr) minmax(340px, .95fr); }
  .project-connectivity-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .project-showcase-grid { grid-template-columns: 1fr; }
  .project-summary-card { padding: 22px; }
  .project-showcase-media .gallery-main img, .project-showcase-media .gallery-main .img-placeholder { aspect-ratio: 1.42; }
  .project-ledger-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 520px) {
  .project-hero.page-hero { padding-top: 16px; }
  .project-hero .breadcrumbs ol { margin-bottom: 16px; padding-bottom: 10px; font-size: .72rem; }
  .project-showcase-grid { gap: 16px; }
  .project-showcase-media .gallery-thumbs { grid-auto-columns: calc((100% - 18px) / 4); gap: 6px; }
  .project-summary-card { padding: 18px; }
  .project-summary-facts > div { grid-template-columns: minmax(94px, .75fr) minmax(0, 1.25fr); gap: 8px; }
  .project-summary-facts dt { font-size: .74rem; }
  .project-summary-facts dd { font-size: .78rem; }
  .project-summary-action-row { grid-template-columns: 1fr 1fr; }
  .project-summary-action-row .btn { min-height: 42px; font-size: .74rem; }
  .project-proof-heading { align-items: flex-start; flex-direction: column; gap: 8px; }
  .project-connectivity-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .project-connectivity-card { min-height: 104px; padding: 12px; }
  .project-connectivity-name { font-size: .78rem; }
  .project-connectivity-time { font-size: 1.18rem; }
  .project-ledger-grid { grid-template-columns: 1fr; gap: 9px; }
  .project-ledger-item { min-height: 82px; }
}

/* Homepage flagship project and construction updates */
.spot-grid { align-items: start; gap: clamp(28px, 4.5vw, 64px); }
.spot-media { position: static; min-width: 0; }
.spot-main { aspect-ratio: 1.38; border-radius: 20px; box-shadow: 0 20px 48px rgba(7, 21, 45, .14); }
.spot-thumbs { gap: 10px; }
.spot-thumbs figure { border-radius: 12px; }
.spot-body { min-width: 0; max-width: 620px; }
.spot-eyebrow { letter-spacing: .13em; }
.spot-title { max-width: 15ch; font-size: clamp(2.2rem, 4vw, 3.5rem); line-height: 1.04; }
.spot-loc { margin-bottom: 14px; }
.spot-tagline { max-width: 56ch; line-height: 1.7; }
.spot-facts { gap: 10px; }
.spot-facts div { min-height: 76px; padding: 14px 16px; border-radius: 14px; }
.spot-facts dd { line-height: 1.4; }
.spot-highlights { gap: 10px; }
.spot-highlights li { line-height: 1.6; }
.spot-actions { gap: 10px; }
.spot-actions .btn { min-height: 46px; }

.section#development { background: linear-gradient(180deg, #F8F9FA 0%, #F3F5F7 100%); }
#development .section-head-line { align-items: flex-end; padding-bottom: 18px; margin-bottom: 28px; border-bottom-color: #DDE3EA; }
#development .section-head-line h2 { margin-top: 4px; }
#development .section-head-line .lead { margin-top: 5px; }
#development .dev-count { padding: 8px 12px; border: 1px solid var(--line); border-radius: 999px; background: #fff; white-space: nowrap; }
.dev-carousel { min-width: 0; }
.dev-grid { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 40px) / 3); grid-template-columns: none; align-items: stretch; gap: 20px; overflow-x: auto; padding: 2px 2px 12px; scroll-snap-type: x mandatory; scroll-behavior: smooth; scrollbar-width: thin; overscroll-behavior-x: contain; }
.dev-grid > * { scroll-snap-align: start; }
.dev-grid:focus-visible { outline: 3px solid rgba(16, 185, 129, .42); outline-offset: 3px; }
.dev-carousel-controls { display: flex; align-items: center; justify-content: flex-end; gap: 8px; min-height: 40px; margin-top: 12px; }
.dev-carousel-btn, .dev-carousel-toggle { display: inline-flex; min-height: 38px; align-items: center; justify-content: center; gap: 7px; padding: 8px 11px; border: 1px solid #D8E1E8; border-radius: 10px; background: #fff; color: var(--navy); font: inherit; font-size: .78rem; font-weight: 700; cursor: pointer; transition: background .18s, border-color .18s, transform .18s; }
.dev-carousel-btn { width: 38px; padding: 8px; }
.dev-carousel-btn:hover, .dev-carousel-toggle:hover { border-color: #A8CDB0; background: #F1F8F3; }
.dev-carousel-btn:active, .dev-carousel-toggle:active { transform: scale(.96); }
.dev-carousel-btn:focus-visible, .dev-carousel-toggle:focus-visible { outline: 3px solid rgba(16, 185, 129, .4); outline-offset: 2px; }
.dev-carousel-status { min-width: 42px; color: #66758A; font-size: .76rem; font-variant-numeric: tabular-nums; text-align: center; }
.dev-icon-play { display: none; }
.dev-carousel-toggle[aria-pressed="true"] .dev-icon-play { display: inline-block; }
.dev-carousel-toggle[aria-pressed="true"] .dev-icon-pause { display: none; }
.dev-card { min-width: 0; height: 100%; border-color: #E1E6EC; border-radius: 16px; box-shadow: 0 4px 14px rgba(11, 35, 70, .06); }
.dev-card:hover { box-shadow: 0 16px 34px rgba(11, 35, 70, .13); }
.dev-thumb { aspect-ratio: 16 / 9; }
.dev-body { min-height: 176px; padding: 17px 18px 15px; }
.dev-project { line-height: 1.45; }
.dev-title { min-height: 2.6em; }
.dev-text { line-height: 1.65; }
.dev-foot { min-height: 38px; }
.dev-empty { display: flex; align-items: center; gap: 16px; min-height: 118px; padding: 24px 28px; border: 1px dashed #C9D2DD; border-radius: 16px; background: rgba(255, 255, 255, .8); color: var(--muted); }
.dev-empty p { margin: 0; }
.dev-empty-icon { display: grid; place-items: center; width: 48px; height: 48px; flex: 0 0 48px; border-radius: 14px; background: var(--green-soft); color: var(--green-dark); }

@media (max-width: 1000px) {
  .dev-grid { grid-auto-columns: calc((100% - 20px) / 2); gap: 20px; }
}
@media (max-width: 600px) {
  .dev-grid { grid-auto-columns: 84%; gap: 14px; padding-bottom: 10px; }
  .dev-carousel-controls { justify-content: flex-start; }
  .dev-carousel-toggle { margin-left: auto; }
}

@media (max-width: 1000px) {
  .spot-grid { align-items: start; }
  .spot-body { max-width: none; }
}
@media (max-width: 600px) {
  .spot-main { aspect-ratio: 1.18; }
  .spot-thumbs { grid-template-columns: repeat(4, minmax(72px, 1fr)); gap: 7px; }
  .spot-facts { gap: 8px; }
  .spot-facts div { min-height: 70px; padding: 11px 12px; }
  #development .section-head-line { align-items: flex-start; }
  #development .dev-count { white-space: normal; }
  .dev-body { min-height: 168px; }
  .dev-empty { min-height: 96px; padding: 18px; }
}

/* Shared premium finish for public pages */
:root {
  --warm: #F7F5F0;
  --warm-2: #EEEAE1;
  --line: #E7E2D9;
  --ink: #1B2733;
  --muted: #65717B;
  --radius: 18px;
  --radius-sm: 12px;
  --shadow: 0 8px 28px rgba(11, 35, 70, .07);
  --shadow-lg: 0 22px 56px rgba(11, 35, 70, .15);
  --gold: #C6A56B;
}

body { background: #fff; }
h1, h2, h3, h4 { letter-spacing: -.025em; }
.section { padding-top: clamp(40px, 4.5vw, 64px); padding-bottom: clamp(40px, 4.5vw, 64px); }
.section.section-search { padding-top: clamp(24px, 3vw, 40px); padding-bottom: 0; }
.section-alt, .page-hero { background: linear-gradient(145deg, #FAF9F6 0%, var(--warm) 100%); }

.topbar { background: var(--navy-deep); }
.site-header { background: rgba(255, 255, 255, .94); border-bottom-color: rgba(18, 59, 120, .06); backdrop-filter: blur(14px); }
.header-pill { border-color: rgba(18, 59, 120, .1); box-shadow: 0 10px 30px rgba(11, 35, 70, .1); }
.main-nav a { transition: color .18s ease, background .18s ease; }
.header-cta { box-shadow: 0 8px 18px rgba(18, 59, 120, .18); }

.btn { transition: background .18s ease, color .18s ease, border-color .18s ease, transform .18s ease, box-shadow .18s ease; }
.btn-primary, .btn-navy, .header-cta { box-shadow: 0 8px 18px rgba(18, 59, 120, .16); }
.btn-primary:hover, .btn-navy:hover { box-shadow: 0 12px 24px rgba(11, 35, 70, .2); }

.hero { background-color: var(--navy-ink, #07152D); }
.hero-overlay::after { background: linear-gradient(90deg, rgba(7, 21, 45, .7) 0%, rgba(7, 21, 45, .18) 72%, rgba(7, 21, 45, .06) 100%); }
.hero h1 { line-height: 1.08; letter-spacing: -.035em; }
.hero h1 .hl { color: #A8D9B4; }
.hero-kicker .dot { background: var(--gold); }
.hero-btn { box-shadow: 0 10px 24px rgba(0, 0, 0, .16); }

.section-head h2, .section-head-line h2 { font-family: var(--font-serif); font-weight: 600; letter-spacing: -.02em; }
.section-head .lead, .section-head-line .lead { max-width: 62ch; line-height: 1.75; }
.section-head-line { border-bottom-color: var(--line); }

.search-card, .card, .location-card, .contact-card, .price-card, .card-pad, .faq, .why-wrap {
  border-color: var(--line);
  box-shadow: var(--shadow);
}
.search-card { border-radius: 20px; padding: clamp(20px, 3vw, 32px); }
.card, .location-card { border-radius: 18px; }
.card { transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease; }
.card:hover { transform: translateY(-4px); border-color: rgba(18, 59, 120, .2); box-shadow: var(--shadow-lg); }
.project-card .card-media { background: var(--warm); }
.project-card .card-body { padding: 22px; }
.price-pill { border-radius: 999px; box-shadow: 0 5px 16px rgba(11, 35, 70, .14); }

.page-hero { padding-top: clamp(34px, 5vw, 58px); padding-bottom: clamp(38px, 5vw, 64px); }
.page-hero h1 { font-family: var(--font-serif); font-weight: 600; letter-spacing: -.02em; }
.breadcrumbs { font-size: .84rem; }
.project-hero-grid { gap: clamp(24px, 4vw, 48px); }
.gallery-main img, .gallery-main .img-placeholder, .spot-main { border-radius: 22px; }
.fact-grid div, .spot-facts div { background: #FAF9F6; border-color: var(--line); }
.why-wrap { border-radius: 22px; }
.why-item { border-color: var(--line); border-radius: 16px; }
.faq { border-radius: 14px; padding-left: 20px; padding-right: 20px; }
.faq[open] { border-color: rgba(18, 59, 120, .24); }
.cta-band { border: 1px solid rgba(255, 255, 255, .1); box-shadow: var(--shadow-lg); }
.stat-strip { border-color: var(--line); border-radius: 18px; box-shadow: var(--shadow); }

.site-footer { background: linear-gradient(150deg, #0D2A56 0%, #071A35 100%); }
.footer-cta { background: linear-gradient(110deg, #153F68 0%, #0D2A56 100%); }
.footer-bottom { border-top-color: rgba(255, 255, 255, .18); }
.floating-contact .fab { box-shadow: 0 10px 26px rgba(7, 21, 45, .25); }

@media (max-width: 767px) {
  .section { padding-top: 40px; padding-bottom: 40px; }
  .hero-overlay::after { background: linear-gradient(0deg, rgba(7, 21, 45, .78) 0%, rgba(7, 21, 45, .18) 78%); }
  .project-card .card-body { padding: 18px; }
}

/* ---------- Contact page ---------- */
.contact-hero { overflow: hidden; }
.contact-hero-copy { max-width: 760px; padding-top: 12px; }
.contact-hero-copy h1 { max-width: 14ch; font-size: clamp(2.4rem, 5vw, 4.2rem); line-height: 1.05; margin: 10px 0 16px; }
.contact-hero-copy .lead { max-width: 58ch; line-height: 1.7; }
.contact-hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 24px; }
.contact-section { padding-top: clamp(42px, 5vw, 68px); }
.contact-section-head { max-width: 680px; margin-bottom: 30px; }
.contact-section-head h2 { font-family: var(--font-serif); font-size: clamp(1.9rem, 3vw, 2.6rem); margin: 8px 0 10px; }
.contact-section-head p, .contact-info-head p, .contact-form-intro { color: var(--muted); line-height: 1.65; }
.contact-section-head p { margin-bottom: 0; }
.contact-grid { grid-template-columns: minmax(0, .88fr) minmax(0, 1.12fr); gap: clamp(24px, 4vw, 44px); }
.contact-cards { align-content: start; gap: 12px; }
.contact-info-head { padding: 0 4px 6px; }
.contact-info-head h3 { font-family: var(--font-display); font-size: 1.3rem; margin: 0 0 6px; color: var(--navy-deep); }
.contact-info-head p { margin: 0; font-size: .95rem; }
.contact-card { min-width: 0; gap: 14px; padding: 17px; border-radius: 16px; box-shadow: 0 8px 22px rgba(11, 35, 70, .045); transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease; }
a.contact-card:hover { transform: translateY(-2px); border-color: rgba(18, 59, 120, .32); box-shadow: var(--shadow); }
a.contact-card:focus-visible { outline: 3px solid rgba(18, 59, 120, .38); outline-offset: 3px; }
.contact-card .icon-lg { flex: 0 0 44px; width: 44px; height: 44px; padding: 10px; border-radius: 13px; background: var(--navy-soft); color: var(--navy); }
.contact-card-whatsapp .icon-lg { background: #EAF6ED; color: #1F8F4E; }
.contact-card span { min-width: 0; gap: 3px; }
.contact-card small { line-height: 1.4; }
.contact-card strong { font-size: 1rem; overflow-wrap: anywhere; }
.contact-office { align-items: flex-start; }
.contact-office .icon-lg { flex: 0 0 44px; }
.contact-office strong { line-height: 1.5; }
.contact-cards .map-embed { aspect-ratio: 16 / 9; border-radius: 16px; box-shadow: var(--shadow); }
.contact-forms .side-card { position: static; padding: clamp(20px, 3vw, 30px); border-radius: 20px; scroll-margin-top: calc(var(--header-h) + 20px); }
.contact-forms .side-card + .side-card { margin-top: 20px; }
.contact-forms .side-card h2 { margin: 6px 0 8px; }
.contact-form-intro { margin: 0 0 22px; font-size: .95rem; }
.contact-forms .form-note { line-height: 1.55; }
@media (max-width: 900px) {
  .contact-grid { grid-template-columns: 1fr; }
  .contact-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .contact-info-head, .contact-cards .map-embed { grid-column: 1 / -1; }
}
@media (max-width: 560px) {
  .contact-hero-copy { padding-top: 6px; }
  .contact-hero-copy h1 { font-size: clamp(2.2rem, 10vw, 3rem); }
  .contact-hero-actions { display: grid; grid-template-columns: 1fr; }
  .contact-hero-actions .btn { width: 100%; }
  .contact-section-head { margin-bottom: 22px; }
  .contact-cards { grid-template-columns: 1fr; }
  .contact-info-head, .contact-cards .map-embed { grid-column: auto; }
  .contact-forms .side-card { padding: 20px 16px; }
}

/* ---------- Project listing: corridor and locality explorer ---------- */
.project-corridor-explorer { margin: 0 0 34px; padding: clamp(22px, 3.5vw, 36px); border: 1px solid #D9E4EF; border-radius: 22px; background: radial-gradient(ellipse at 100% 0%, rgba(212, 237, 219, .42), transparent 34%), linear-gradient(145deg, #F8FAFC 0%, #F5F8F7 100%); box-shadow: 0 14px 36px rgba(11, 35, 70, .07); }
.project-corridor-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; }
.project-corridor-heading h2 { margin: 7px 0 8px; font-family: var(--font-serif); font-size: clamp(1.65rem, 3vw, 2.25rem); color: var(--navy-deep); }
.project-corridor-heading p:not(.eyebrow-dot) { max-width: 68ch; margin: 0; color: var(--muted); line-height: 1.6; }
.project-corridor-all { display: inline-flex; align-items: center; gap: 6px; flex: 0 0 auto; padding: 10px 14px; border: 1px solid #D7E2EC; border-radius: 999px; background: #fff; color: var(--navy); font-size: .84rem; font-weight: 700; text-decoration: none; }
.project-corridor-all:hover { border-color: var(--green); color: var(--green-dark); }
.project-corridor-tabs { display: flex; flex-wrap: wrap; gap: 9px; margin: 24px 0 20px; padding: 3px 2px; }
.project-corridor-tab { display: inline-flex; align-items: center; gap: 10px; flex: 0 0 auto; min-height: 44px; padding: 10px 15px; border: 1px solid #D7E0E8; border-radius: 999px; background: #fff; color: #34445A; font-size: .88rem; font-weight: 700; line-height: 1.25; text-decoration: none; transition: color .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease; }
.project-corridor-tab span { display: grid; min-width: 23px; height: 23px; padding: 0 5px; place-items: center; border-radius: 999px; background: #EEF2F6; color: #44546A; font-size: .72rem; }
.project-corridor-tab:hover { border-color: #8FC99F; color: var(--green-dark); }
.project-corridor-tab.is-active { border-color: var(--navy); background: var(--navy); color: #fff; box-shadow: 0 6px 15px rgba(18, 59, 120, .16); }
.project-corridor-tab.is-active span { background: rgba(255, 255, 255, .16); color: #fff; }
.project-corridor-locations { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; list-style: none; margin: 0; padding: 0; }
.project-area-card { position: relative; display: flex; min-height: 190px; flex-direction: column; overflow: hidden; padding: 18px 18px 0; border: 1px solid #E2E8EF; border-radius: 17px; background: linear-gradient(180deg, #fff 0%, #fff 45%, #F3F8F4 100%); box-shadow: 0 7px 20px rgba(16, 24, 40, .06); color: var(--ink); text-decoration: none; transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease; }
.project-area-card:hover, .project-area-card[aria-current="page"] { transform: translateY(-3px); border-color: #87C898; box-shadow: 0 13px 28px rgba(11, 35, 70, .12); color: var(--ink); }
.project-area-card:focus-visible, .project-corridor-tab:focus-visible, .project-corridor-all:focus-visible { outline: 3px solid rgba(18, 59, 120, .36); outline-offset: 3px; }
.project-area-count { position: relative; z-index: 1; color: #526174; font-size: .82rem; }
.project-area-count strong { margin-right: 3px; color: var(--navy); font-family: var(--font-display); font-size: 1.85rem; line-height: 1; }
.project-area-name { position: relative; z-index: 1; margin-top: 7px; color: var(--navy-deep); font-size: 1.05rem; font-weight: 800; line-height: 1.25; }
.project-area-region { position: relative; z-index: 1; margin-top: 4px; color: var(--muted); font-size: .75rem; }
.project-area-art { position: absolute; right: 0; bottom: 0; left: 0; height: 82px; overflow: hidden; background: linear-gradient(180deg, rgba(244, 250, 246, 0), rgba(223, 243, 228, .55)); }
.project-area-art > svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.project-area-city { fill: #A8DDB6; transition: fill .2s ease; }
.project-area-card:hover .project-area-city, .project-area-card[aria-current="page"] .project-area-city { fill: #85CC99; }
.project-area-route { stroke: #B7C6CE; stroke-width: 1.5; stroke-dasharray: 5 5; }
.project-area-pin { position: absolute; top: 10px; left: 52%; display: grid; width: 28px; height: 28px; place-items: center; border: 3px solid #fff; border-radius: 50%; background: var(--navy); color: #fff; box-shadow: 0 3px 8px rgba(7, 21, 45, .2); }
.project-area-pin .icon { width: 13px; height: 13px; }
.project-area-link { position: relative; z-index: 2; display: flex; align-items: center; gap: 6px; margin: auto -18px 0; padding: 9px 18px; background: rgba(255, 255, 255, .92); color: var(--green-dark); font-size: .78rem; font-weight: 800; }
.project-corridor-empty { margin: 0; padding: 18px; border: 1px dashed #C8D4DF; border-radius: 14px; color: var(--muted); }
@media (max-width: 1023px) { .project-corridor-locations { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 760px) { .project-corridor-heading { align-items: flex-start; flex-direction: column; } .project-corridor-locations { grid-template-columns: repeat(2, minmax(0, 1fr)); } .project-corridor-tabs { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 10px; scrollbar-width: none; } .project-corridor-tabs::-webkit-scrollbar { display: none; } }
@media (max-width: 480px) { .project-corridor-explorer { padding: 20px 15px; border-radius: 18px; } .project-corridor-tabs { margin-top: 18px; } .project-corridor-tab { min-height: 40px; padding: 9px 12px; font-size: .8rem; } .project-corridor-locations { gap: 10px; } .project-area-card { min-height: 176px; padding: 14px 12px 0; } .project-area-name { font-size: .94rem; } .project-area-link { margin-right: -12px; margin-left: -12px; padding-right: 12px; padding-left: 12px; } }

/* ---------- Homepage: premium advantages section ---------- */
.section-why { overflow: hidden; padding-top: clamp(44px, 5vw, 68px); padding-bottom: clamp(44px, 5vw, 68px); background: linear-gradient(135deg, #173D5A 0%, #214E6E 55%, #193F5D 100%); }
.section-why .why-wrap { padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.why-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 30px; margin-bottom: 30px; }
.why-heading > div { max-width: 650px; }
.why-heading .eyebrow-green { display: inline-flex; align-items: center; gap: 8px; margin: 0 0 10px; color: #B8E8C4; }
.why-heading .eyebrow-green .icon { width: 18px; height: 18px; }
.why-heading h2 { margin: 0; color: #fff; font-family: var(--font-display); font-size: clamp(1.9rem, 3.4vw, 2.65rem); letter-spacing: -.025em; }
.why-heading .lead { max-width: 460px; margin: 0; color: rgba(255, 255, 255, .78); line-height: 1.65; }
.section-why .why-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 14px; align-items: stretch; }
.section-why .why-item { display: flex; min-height: 246px; flex-direction: column; align-items: flex-start; padding: 22px 20px; border: 1px solid rgba(255, 255, 255, .78); border-radius: 17px; background: #fff; box-shadow: 0 12px 28px rgba(5, 25, 44, .12); }
.section-why .why-icon { display: grid; width: 50px; height: 50px; place-items: center; margin: 0 0 24px; border-radius: 15px; background: #E8F5EC; color: var(--green-dark); }
.section-why .why-icon .icon { width: 27px; height: 27px; }
.section-why .why-item h3 { margin: 0 0 9px; color: var(--navy-deep); font-family: var(--font-display); font-size: 1.05rem; font-weight: 800; line-height: 1.35; }
.section-why .why-item p { color: #536174; font-size: .9rem; line-height: 1.65; }
.why-highlight { position: relative; display: flex; min-height: 246px; flex-direction: column; align-items: flex-start; overflow: hidden; padding: 22px 20px; border: 1px solid rgba(255, 255, 255, .65); border-radius: 17px; background: linear-gradient(145deg, #14834D 0%, #08795B 50%, #145574 100%); color: #fff; }
.why-highlight::after { position: absolute; right: -35px; bottom: -65px; width: 170px; height: 170px; border: 1px solid rgba(255, 255, 255, .17); border-radius: 50%; box-shadow: 0 0 0 18px rgba(255, 255, 255, .05), 0 0 0 38px rgba(255, 255, 255, .04); content: ""; }
.why-highlight-icon { display: grid; width: 46px; height: 46px; place-items: center; margin-bottom: auto; border-radius: 14px; background: rgba(255, 255, 255, .14); color: #fff; }
.why-highlight-stat { margin-top: 20px; font-family: var(--font-display); font-size: clamp(2.6rem, 4vw, 3.5rem); font-weight: 900; letter-spacing: -.05em; line-height: 1; }
.why-highlight-title { max-width: 15ch; margin-top: 8px; font-size: 1.1rem; font-weight: 800; line-height: 1.3; }
.why-highlight p { position: relative; z-index: 1; margin: 8px 0 18px; color: rgba(255, 255, 255, .82); font-size: .83rem; line-height: 1.55; }
.why-highlight-link { position: relative; z-index: 1; display: inline-flex; align-items: center; gap: 8px; margin-top: auto; color: #fff; font-size: .88rem; font-weight: 800; text-decoration: none; }
.why-highlight-link:hover { color: #D5F5DD; }
.why-highlight-link:focus-visible { outline: 2px solid #fff; outline-offset: 4px; }
@media (max-width: 1100px) { .section-why .why-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 760px) { .why-heading { align-items: flex-start; flex-direction: column; gap: 12px; } .section-why .why-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 520px) { .section-why .why-grid { grid-template-columns: 1fr; } .section-why .why-item, .why-highlight { min-height: 0; } .section-why .why-icon { margin-bottom: 18px; } .why-highlight-icon { margin-bottom: 22px; } }

/* ---------- Find My Property: step-by-step finder ---------- */
.find-layout.has-find-wizard { grid-template-columns: minmax(0, 1fr); max-width: 1000px; margin: 0 auto; }
.find-form.is-wizard { padding: clamp(24px, 4vw, 40px); border-color: #DCE5EF; border-radius: 20px; box-shadow: 0 14px 38px rgba(11, 35, 70, .08); }
.find-progress { display: block; margin: 0 0 30px; padding: 0 0 20px; border-bottom: 1px solid #E7ECF2; }
.find-progress[hidden] { display: none; }
.find-progress-list { display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); gap: 8px; margin: 0; padding: 0; list-style: none; }
.find-progress-list li { min-width: 0; color: #8895A7; }
.find-progress-track { display: block; height: 6px; margin-bottom: 9px; border-radius: 999px; background: #E2E8F0; transition: background .2s ease; }
.find-progress-list li.is-active .find-progress-track, .find-progress-list li.is-complete .find-progress-track { background: var(--navy); }
.find-progress-label { display: block; overflow: hidden; font-size: .67rem; font-weight: 800; letter-spacing: .045em; text-overflow: ellipsis; text-transform: uppercase; white-space: nowrap; }
.find-progress-list li.is-active { color: var(--navy); }
.find-progress-status { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; }
.find-form.is-wizard fieldset[data-find-step] { min-height: 210px; margin: 0; padding: 0; border: 0; }
.find-form.is-wizard fieldset[data-find-step][hidden] { display: none; }
.find-form.is-wizard fieldset[data-find-step] legend { margin-bottom: 20px; color: var(--navy-deep); font-family: var(--font-display); font-size: clamp(1.35rem, 2.6vw, 1.8rem); font-weight: 800; line-height: 1.3; }
.find-form.is-wizard .choice-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.find-form.is-wizard .choice span { min-height: 88px; display: flex; flex-direction: column; justify-content: center; padding: 18px; border: 1.5px solid #DCE5EF; border-radius: 14px; text-align: left; transition: border-color .16s ease, background .16s ease, box-shadow .16s ease; }
.find-form.is-wizard .choice:hover span { border-color: #8BC69A; box-shadow: 0 5px 14px rgba(11, 35, 70, .06); }
.find-form.is-wizard .choice input:checked + span { border-color: var(--green); background: #F0F8F2; box-shadow: 0 0 0 2px rgba(38, 155, 69, .1); color: var(--navy-deep); }
.find-form.is-wizard fieldset[data-find-step] > .field { max-width: 620px; }
.find-form.is-wizard fieldset[data-find-step] > .field select { min-height: 56px; border-radius: 12px; }
.find-step-actions { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 16px; padding-top: 18px; border-top: 1px solid #E7ECF2; }
.find-step-actions .btn { min-width: 126px; }
.find-step-actions button[type="submit"] { display: inline-flex; width: auto; }
.find-step-actions .btn-primary { margin-left: auto; }
@media (max-width: 700px) { .find-progress-list { grid-template-columns: repeat(4, minmax(0, 1fr)); row-gap: 12px; } .find-form.is-wizard .choice-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .find-form.is-wizard fieldset[data-find-step] { min-height: 230px; } }
@media (max-width: 480px) { .find-form.is-wizard { padding: 22px 16px; } .find-progress { margin-bottom: 24px; } .find-progress-list { gap: 7px; } .find-progress-label { font-size: .58rem; } .find-form.is-wizard .choice-grid { grid-template-columns: 1fr; } .find-form.is-wizard .choice span { min-height: 60px; padding: 14px; } .find-form.is-wizard fieldset[data-find-step] { min-height: 0; } .find-step-actions .btn { min-width: 108px; } }

/* ---------- v2.4 Typography alignment ----------
   Plus Jakarta Sans ships only up to weight 800 and has a narrow word space. Earlier layers used weight 900
   (browser fake-bold) plus tight negative tracking, so heading and button words ran together
   ("Discoverthe", "Notsurewhich…"). One consistent scale here; this block is last so it wins. */
html { font-synthesis: none; }
h1, h2, h3, h4, .h3, .h4 { font-family: var(--font-display); letter-spacing: -.012em; word-spacing: .06em; text-wrap: balance; }
h1, h2 { font-weight: 800; line-height: 1.15; }
h3, h4, .h3, .h4 { font-weight: 700; line-height: 1.3; }
.hero h1 { font-weight: 800; line-height: 1.08; letter-spacing: -.018em; word-spacing: .08em; }
.hero h1 .hl, .spot-title, .section-head h2, .section-head-line h2, .page-hero h1, .contact-section-head h2, .project-corridor-heading h2, .serif, .hl-serif { font-family: var(--font-serif); letter-spacing: 0; word-spacing: normal; }
.loc-head h2, .why-heading h2 { font-family: var(--font-serif); font-weight: 600; letter-spacing: -.01em; word-spacing: normal; }
.slide-name, .fmp-title, .footer-cta-title, .project-summary-card h1, .project-proof-heading h2, .project-ledger-panel h2 { letter-spacing: -.012em; word-spacing: .06em; }
.why-highlight-stat { font-weight: 800; letter-spacing: -.02em; }
.btn, .hero-btn, .nav-link, .header-cta { word-spacing: .1em; }
.hero-btn, .search-card .btn, .cta-actions .btn { letter-spacing: .04em; }
.eyebrow, .eyebrow-dot, .eyebrow-green, .eyebrow-navy, .eyebrow-amber, .spot-eyebrow { word-spacing: .12em; }
.lead, .hero-desc { word-spacing: normal; letter-spacing: 0; }


/* ---------- v2.4 Projects page: zone box + city cards ---------- */
.projects-page { padding-top: clamp(28px, 4vw, 48px); }
.project-corridor-heading h1 { margin: 7px 0 8px; font-family: var(--font-serif); font-weight: 600; font-size: clamp(1.7rem, 3.2vw, 2.4rem); letter-spacing: 0; color: var(--navy-deep); }
.project-corridor-heading { align-items: flex-end; margin-bottom: 22px; }
.area-picker { position: relative; flex: 0 0 auto; min-width: 260px; }
.area-picker > summary { display: flex; align-items: center; justify-content: space-between; gap: 14px; min-height: 54px; padding: 8px 16px; border: 1px solid #D7E2EC; border-radius: 14px; background: #fff; box-shadow: 0 4px 12px rgba(11, 35, 70, .06); cursor: pointer; list-style: none; }
.area-picker > summary::-webkit-details-marker { display: none; }
.area-picker > summary:hover, .area-picker[open] > summary { border-color: var(--navy); }
.area-picker > summary:focus-visible { outline: 3px solid rgba(18, 59, 120, .36); outline-offset: 3px; }
.area-picker > summary .icon { flex: 0 0 auto; color: var(--navy); transition: transform .2s; }
.area-picker[open] > summary .icon { transform: rotate(180deg); }
.area-picker-label { display: flex; flex-direction: column; min-width: 0; line-height: 1.25; }
.area-picker-label small { color: var(--muted); font-size: .7rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.area-picker-label strong { overflow: hidden; color: var(--navy-deep); font-size: .95rem; text-overflow: ellipsis; white-space: nowrap; max-width: 280px; }
.area-menu { position: absolute; z-index: 30; top: calc(100% + 8px); right: 0; width: min(360px, calc(100vw - 32px)); max-height: 60vh; overflow-y: auto; padding: 8px; border: 1px solid #DCE4EC; border-radius: 14px; background: #fff; box-shadow: 0 18px 40px rgba(11, 35, 70, .16); }
.area-option { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 11px 12px; border-radius: 10px; color: #2E3D52; font-size: .9rem; font-weight: 600; line-height: 1.3; text-decoration: none; }
.area-option span { display: grid; flex: 0 0 auto; min-width: 24px; height: 24px; padding: 0 6px; place-items: center; border-radius: 999px; background: #EEF2F6; color: #44546A; font-size: .72rem; font-weight: 700; }
.area-option:hover { background: #F3F7FA; color: var(--navy); }
.area-option.is-active { background: var(--navy-soft, #E8EEF7); color: var(--navy); font-weight: 700; }
.area-option.is-active span { background: var(--navy); color: #fff; }
.area-menu-guides { display: flex; align-items: center; gap: 6px; margin-top: 6px; padding: 11px 12px 6px; border-top: 1px solid #EEF1F4; color: var(--green-dark); font-size: .84rem; font-weight: 700; text-decoration: none; }
.project-area-card { min-height: 0; padding: 18px 18px 0; background: #fff; }
.project-area-zones { position: relative; z-index: 1; display: flex; flex-wrap: wrap; gap: 6px; margin: 12px 0 16px; }
.zone-chip { display: inline-block; max-width: 100%; padding: 4px 9px; border-radius: 999px; background: #EAF5EE; color: #1E6B3A; font-size: .72rem; font-weight: 600; line-height: 1.35; white-space: normal; }
.zone-more { background: #EEF2F6; color: #44546A; }
.project-area-link { margin-top: auto; border-top: 1px solid #EEF2F0; background: #FAFCFB; }
.project-area-card[aria-current="page"] { border-color: var(--green); box-shadow: 0 0 0 2px rgba(38, 155, 69, .25), 0 13px 28px rgba(11, 35, 70, .12); }
.project-area-card[aria-current="page"] .project-area-link { background: var(--green); color: #fff; }
.results-summary { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 16px; scroll-margin-top: 110px; }
.results-summary .results-count { margin: 0; }
.results-clear { color: var(--navy); font-size: .88rem; font-weight: 700; }
.area-item { display: contents; }
.area-item[hidden], [data-area-card][hidden], .results-clear[hidden], .area-empty[hidden] { display: none; }
.project-corridor-locations > li { display: flex; }
.project-corridor-locations .project-area-card { flex: 1 1 auto; width: 100%; }
.area-empty { padding: 22px; border: 1px dashed #C8D4DF; border-radius: 14px; color: var(--muted); text-align: center; }
@media (max-width: 760px) {
  .project-corridor-heading { align-items: stretch; }
  .area-picker { min-width: 0; width: 100%; }
  .area-picker-label strong { max-width: none; white-space: normal; }
  .area-menu { left: 0; right: 0; width: auto; }
}
@media (max-width: 420px) { .project-corridor-locations { grid-template-columns: 1fr; } }
@media (max-width: 560px) {
  .project-corridor-locations { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .project-area-card { padding: 14px 12px 0; border-radius: 14px; }
  .project-area-count strong { font-size: 1.45rem; }
  .project-area-name { font-size: .95rem; }
  .project-area-zones { margin: 8px 0 12px; }
  .project-area-zones .zone-chip { max-width: 100%; }
  .zone-chip { font-size: .68rem; padding: 3px 8px; }
  .project-area-link { margin-right: -12px; margin-left: -12px; padding: 9px 12px; font-size: .74rem; }
  .results-head { margin-top: 22px; }
}
.project-corridor-heading { align-items: flex-start; }
.project-corridor-heading h1 { max-width: 28ch; }
.area-corridor-filters { display: flex; flex-wrap: wrap; gap: 9px; margin: 0 0 24px; }
.area-corridor-filter { display: inline-flex; min-height: 42px; align-items: center; gap: 9px; padding: 8px 13px; border: 1px solid #D7E0E8; border-radius: 999px; background: #fff; color: #34445A; font-size: .84rem; font-weight: 700; line-height: 1.25; text-decoration: none; transition: color .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease; }
.area-corridor-filter > span { display: grid; min-width: 22px; height: 22px; padding: 0 5px; place-items: center; border-radius: 999px; background: #EEF2F6; color: #44546A; font-size: .7rem; }
.area-corridor-filter:hover { border-color: #8FC99F; color: var(--green-dark); }
.area-corridor-filter.is-active { border-color: var(--navy); background: var(--navy); color: #fff; box-shadow: 0 6px 15px rgba(18, 59, 120, .15); }

/* Shared public button system */
.btn {
  min-height: 46px;
  padding: 11px 18px;
  border-width: 1px;
  border-radius: 12px;
  font-size: .9rem;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 0;
  word-spacing: normal;
  box-shadow: 0 3px 9px rgba(11, 35, 70, .08);
  position: relative;
  overflow: hidden;
  isolation: isolate;
}
.btn:hover { box-shadow: 0 7px 16px rgba(11, 35, 70, .14); }
.btn::after {
  position: absolute;
  z-index: 1;
  top: -45%;
  bottom: -45%;
  left: -55%;
  width: 36%;
  content: "";
  pointer-events: none;
  opacity: 0;
  background: linear-gradient(105deg, transparent 15%, rgba(255, 255, 255, .08) 34%, rgba(255, 255, 255, .42) 50%, rgba(255, 255, 255, .12) 64%, transparent 82%);
  transform: translateX(-140%) skewX(-18deg);
  transition: transform .65s cubic-bezier(.2, .65, .3, 1), opacity .18s ease;
}
.btn:hover::after, .btn:focus-visible::after { opacity: 1; transform: translateX(480%) skewX(-18deg); }
.btn:focus-visible, .header-cta:focus-visible {
  outline: 3px solid rgba(16, 185, 129, .48);
  outline-offset: 3px;
}
.btn:disabled, .btn[aria-disabled="true"] { cursor: not-allowed; opacity: .58; transform: none; box-shadow: none; }
.btn-primary, .btn-green, .btn-accent {
  background: var(--green);
  color: #fff;
  border-color: var(--green);
  box-shadow: 0 5px 13px rgba(16, 126, 82, .2);
}
.btn-primary:hover, .btn-green:hover, .btn-accent:hover {
  background: var(--green-dark);
  color: #fff;
  border-color: var(--green-dark);
  box-shadow: 0 8px 18px rgba(16, 126, 82, .25);
}
.btn-outline { background: #fff; color: var(--navy); border-color: #CBD5E1; }
.btn-outline:hover { background: #F1F8F3; color: var(--navy); border-color: #9BCBA8; }
.btn-white-sq { border-radius: 12px; }
.btn-outline-light-sq { border-radius: 12px; }
.btn-icon-sq { border-radius: 999px; }
.hero-btn, .header-cta { border-radius: 12px; letter-spacing: .01em; word-spacing: normal; }
.hero-btn { text-transform: none; }
.hero-btn-1 { background: var(--green); color: #fff; }
.hero-btn-1:hover { background: var(--green-dark); color: #fff; }
.hero-btn-2 { background: rgba(255, 255, 255, .1); color: #fff; border: 1px solid rgba(255, 255, 255, .3); }
.hero-btn-2:hover { background: rgba(255, 255, 255, .18); color: #fff; }
.hero-btn-3 { background: #fff; color: var(--navy); }
.hero-btn-3:hover { background: #F1F5F9; color: var(--navy); }
.search-card .btn, .cta-actions .btn { font-size: .88rem; letter-spacing: 0; text-transform: none; }
.project-summary-actions .btn { min-height: 44px; border-radius: 12px; font-size: .82rem; }
.footer-cta-actions .btn { font-size: .85rem; }
@media (prefers-reduced-motion: reduce) {
  .btn::after { display: none; transition: none; }
}

@media (max-width: 520px) {
  .project-summary-card { padding: 18px 16px; border-radius: 18px; }
  .project-summary-card > .eyebrow { margin-bottom: 7px; color: #65758B; font-size: .68rem; font-weight: 800; letter-spacing: .08em; line-height: 1.45; text-transform: uppercase; }
  .project-summary-card h1 { margin-bottom: 8px; font-family: var(--font-serif); font-size: clamp(1.9rem, 8vw, 2.25rem); font-weight: 600; line-height: 1.06; letter-spacing: -.025em; }
  .project-summary-card .project-loc { align-items: flex-start; gap: 6px; margin-bottom: 12px; color: #52647A; font-size: .82rem; font-weight: 600; line-height: 1.45; }
  .project-summary-card .project-loc .icon { flex: 0 0 16px; margin-top: 1px; color: var(--green-dark); }
  .project-summary-tagline { margin-bottom: 12px; color: #58677A; font-size: .88rem; line-height: 1.55; }
  .project-summary-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin: 14px 0; border: 0; }
  .project-summary-facts > div { display: flex; min-width: 0; min-height: 74px; flex-direction: column; align-items: flex-start; justify-content: center; gap: 5px; padding: 11px 10px; border: 1px solid #E7E8E3; border-radius: 12px; background: #F8F7F3; }
  .project-summary-facts dt { color: #8290A0; font-size: .62rem; font-weight: 800; line-height: 1.35; letter-spacing: .065em; text-transform: uppercase; }
  .project-summary-facts dd, .project-summary-facts > div:first-child dd { color: var(--navy); font-size: clamp(.82rem, 3.8vw, .96rem); font-weight: 800; line-height: 1.4; text-align: left; overflow-wrap: anywhere; }
  .project-summary-actions { gap: 8px; }
  .project-summary-actions .btn, .project-summary-action-row .btn { width: 100%; min-height: 44px; justify-content: center; padding: 10px 12px; border-radius: 12px; font-size: .82rem; line-height: 1.3; }
  .project-summary-action-row { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .project-price-note { color: #6B7787; font-size: .72rem; line-height: 1.5; }
}
.area-corridor-filter.is-active > span { background: rgba(255, 255, 255, .16); color: #fff; }
.area-corridor-filter:focus-visible, .area-corridor-guides:focus-visible { outline: 3px solid rgba(18, 59, 120, .36); outline-offset: 3px; }
.area-corridor-guides { display: inline-flex; align-items: center; gap: 6px; min-height: 42px; padding: 8px 12px; color: var(--green-dark); font-size: .84rem; font-weight: 700; text-decoration: none; }
.area-corridor-guides:hover { color: var(--navy); }
@media (max-width: 760px) {
  .area-corridor-filters { flex-wrap: nowrap; overflow-x: auto; margin-right: -4px; padding: 2px 4px 10px; scrollbar-width: thin; scrollbar-color: #BDD7C4 transparent; }
  .area-corridor-filter, .area-corridor-guides { flex: 0 0 auto; }
}
@media (max-width: 480px) {
  .project-corridor-heading h1 { font-size: clamp(1.55rem, 7vw, 2rem); }
  .area-corridor-filters { margin-bottom: 18px; }
  .area-corridor-filter { min-height: 39px; padding: 7px 11px; font-size: .78rem; }
}

/* Projects page: corridor selector and locality carousel */
.project-corridor-explorer { margin: 0 0 30px; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.project-corridor-tabs { margin: 0 0 16px; padding: 0; }
.project-locality-heading { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 18px; }
.project-locality-heading .eyebrow-dot { margin-bottom: 7px; }
.project-locality-heading h1 { margin: 0; color: var(--navy); font-family: var(--font-serif); font-size: clamp(1.7rem, 3.3vw, 2.65rem); letter-spacing: -.02em; line-height: 1.12; }
.project-locality-controls { display: flex; min-height: 40px; align-items: center; gap: 8px; flex: 0 0 auto; }
.project-locality-controls .dev-carousel-btn, .project-locality-controls .dev-carousel-toggle { width: 42px; min-height: 42px; height: 42px; padding: 8px; border: 0; border-radius: 50%; background: #E7F3E9; color: #16813A; }
.project-locality-controls .dev-carousel-btn:hover, .project-locality-controls .dev-carousel-toggle:hover { border: 0; background: #D6EBDD; }
.project-locality-controls .dev-carousel-btn .icon, .project-locality-controls .dev-carousel-toggle .icon { width: 18px; height: 18px; }
.project-locality-toggle .dev-icon-play { display: none; }
.project-locality-toggle[aria-pressed="true"] .dev-icon-play { display: inline-block; }
.project-locality-toggle[aria-pressed="true"] .dev-icon-pause { display: none; }
.project-locality-tabs { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 22px; }
.project-locality-tab { display: inline-flex; min-height: 52px; align-items: center; justify-content: center; padding: 10px 25px; border: 1px solid #D6DEE5; border-bottom-width: 3px; border-radius: 12px 12px 5px 5px; background: #fff; color: #526174; font-size: .96rem; font-weight: 700; text-decoration: none; transition: color .18s ease, border-color .18s ease, background .18s ease; }
.project-locality-tab:hover { border-color: #9CCBA7; color: var(--green-dark); }
.project-locality-tab[aria-current="true"] { border-color: #18883E; border-bottom-color: #18883E; background: #E8F4EA; color: #16813A; }
.project-locality-tab:focus-visible { outline: 3px solid rgba(18, 59, 120, .36); outline-offset: 3px; }
.project-corridor-summary { max-width: 920px; margin: 0 0 18px; padding: 0 2px; }
.project-corridor-summary[hidden] { display: none; }
.project-corridor-summary .eyebrow-dot { margin: 0 0 5px; color: var(--green-dark); }
.project-corridor-description { max-width: 84ch; margin: 0; color: #526174; font-size: .92rem; line-height: 1.65; }
.project-corridor-cta { display: inline-flex; align-items: center; gap: 6px; margin-top: 8px; color: var(--green-dark); font-size: .84rem; font-weight: 800; text-decoration: none; }
.project-corridor-cta:hover { color: var(--navy); }
.project-locality-section { margin: 0; padding: 0; border: 0; }
.project-localities {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: calc((100% - 42px) / 4);
  grid-template-columns: none;
  gap: 14px;
  overflow-x: auto;
  margin: 0;
  padding: 2px 2px 12px;
  list-style: none;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  scrollbar-width: thin;
  scrollbar-color: #BDD7C4 transparent;
  overscroll-behavior-x: contain;
}
.project-localities > li { min-width: 0; scroll-snap-align: start; }
.project-localities > li[hidden] { display: none; }
.project-locality-empty { padding: 18px 20px; border: 1px dashed #C8D4DF; border-radius: 14px; background: #FAFCFB; color: var(--muted); line-height: 1.55; }
.project-locality-empty[hidden] { display: none; }
.project-locality-card {
  display: flex;
  width: 100%;
  min-height: 205px;
  flex-direction: column;
  align-items: flex-start;
  padding: 20px 19px;
  border: 1px solid #E8ECF0;
  border-radius: 20px;
  background: linear-gradient(180deg, #fff 0%, #fff 62%, #F7FBF8 100%);
  color: var(--ink);
  text-align: left;
  text-decoration: none;
  cursor: pointer;
  box-shadow: 0 8px 24px rgba(11, 35, 70, .07);
  transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease, background .18s ease;
}
.project-locality-card:hover, .project-locality-card[aria-current="location"] { transform: translateY(-2px); border-color: #87C898; box-shadow: 0 10px 24px rgba(11, 35, 70, .1); }
.project-locality-card[aria-current="location"] { background: #F5FAF6; }
.project-locality-card:focus-visible, .project-localities:focus-visible { outline: 3px solid rgba(18, 59, 120, .36); outline-offset: 3px; }
.project-locality-region { color: var(--muted); font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; }
.project-locality-card > strong { margin-top: 7px; color: var(--navy-deep); font-size: 1.05rem; line-height: 1.3; }
.project-locality-count { display: flex; align-items: baseline; gap: 6px; margin: 0; color: #42536B; font-size: 1rem; }
.project-locality-count b { color: #1D2939; font-family: var(--font-display); font-size: 2.1rem; line-height: 1; }
.project-locality-card > strong { margin-top: 13px; color: #202B38; font-size: 1.18rem; line-height: 1.3; }
.project-locality-link { display: flex; align-items: center; gap: 5px; margin-top: auto; padding-top: 12px; color: var(--green-dark); font-size: .76rem; font-weight: 800; }
.project-locality-link .icon { transition: transform .18s ease; }
.project-locality-card:hover .project-locality-link .icon { transform: translateX(3px); }
.project-locality-controls .dev-carousel-btn:focus-visible, .project-locality-controls .dev-carousel-toggle:focus-visible { outline: 3px solid rgba(16, 185, 129, .4); outline-offset: 2px; }
.corridor-label { margin: -2px 0 9px; color: var(--green-dark); font-size: .72rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.corridor-location-list { display: flex; flex-wrap: wrap; gap: 7px; margin: 12px 0 0; padding: 0; list-style: none; }
.corridor-location-list li { padding: 5px 9px; border: 1px solid #E0E8E2; border-radius: 999px; background: #F7FAF8; color: #42536B; font-size: .75rem; font-weight: 650; }
.corridor-location-note { margin: 12px 0 0; color: var(--muted); font-size: .8rem; }
@media (max-width: 1000px) {
  .project-localities { grid-auto-columns: calc((100% - 28px) / 3); }
}
@media (max-width: 700px) {
  .project-localities { grid-auto-columns: calc((100% - 14px) / 2); gap: 14px; }
  .project-locality-tab { min-height: 46px; padding: 9px 19px; }
}
@media (max-width: 480px) {
  .project-corridor-explorer { padding: 0; }
  .project-locality-heading { align-items: flex-start; flex-wrap: wrap; gap: 10px; }
  .project-locality-heading > div:first-child { flex: 1 1 100%; }
  .project-locality-heading h1 { font-size: clamp(1.45rem, 7vw, 1.85rem); }
  .project-locality-controls { justify-content: flex-end; gap: 5px; margin-left: auto; }
  .project-locality-controls .dev-carousel-btn, .project-locality-controls .dev-carousel-toggle { width: 36px; min-height: 36px; height: 36px; }
  .project-locality-tabs { flex-wrap: nowrap; overflow-x: auto; margin-right: -2px; padding-bottom: 4px; scrollbar-width: none; }
  .project-locality-tabs::-webkit-scrollbar { display: none; }
  .project-locality-tab { min-height: 42px; flex: 0 0 auto; padding: 8px 14px; font-size: .84rem; }
  .project-localities { grid-auto-columns: 78%; gap: 10px; }
  .project-locality-card { min-height: 175px; padding: 16px; }
  .project-locality-count b { font-size: 1.8rem; }
}
@media (prefers-reduced-motion: reduce) {
  .project-localities { scroll-behavior: auto; }
  .project-area-card, .project-locality-card, .project-locality-link .icon { transition: none; }
  .project-locality-tab { transition: none; }
}
/* Consent-approved testimonials */
.section-testimonials{background:linear-gradient(135deg,#f7f9fc 0%,#fff 62%);overflow:hidden}
.testimonial-layout{display:grid;grid-template-columns:minmax(220px,.78fr) minmax(0,1.85fr);gap:18px 28px;align-items:stretch}
.testimonial-intro{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;min-width:0}
.testimonial-intro .eyebrow{margin:0 0 12px}
.testimonial-intro h2{margin:0;color:#123b78;font-size:clamp(1.85rem,3vw,2.55rem);line-height:1.12}
.testimonial-intro .lead{max-width:340px;margin:12px 0 0}
.testimonial-controls{display:flex;align-items:center;gap:10px;margin-top:24px}
.testimonial-controls .round-btn{width:40px;height:40px}
.testimonial-count{min-width:58px;text-align:center;font-size:.83rem;font-weight:750;color:#123b78;font-variant-numeric:tabular-nums}
.testimonial-featured{position:relative;min-width:0}
.testimonial-card{display:grid;grid-template-columns:minmax(190px,.78fr) minmax(0,1.22fr);min-height:285px;overflow:hidden;border:1px solid #e3eaf2;border-radius:17px;background:#fff;box-shadow:0 12px 34px rgba(16,43,77,.08)}
.testimonial-card[hidden]{display:none}
.testimonial-photo{position:relative;height:100%;min-width:0;min-height:285px;overflow:hidden;background:linear-gradient(145deg,#dce9e6,#eaf0f6)}
.testimonial-photo img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;object-position:center}
.testimonial-initial{position:absolute;inset:0;display:grid;place-items:center;width:100%;height:100%;background:linear-gradient(145deg,#dce9e6,#eaf0f6);color:#123b78;font-size:5rem;font-weight:700}
.testimonial-copy{position:relative;display:flex;flex-direction:column;justify-content:center;padding:28px clamp(20px,3vw,42px);min-width:0}
.testimonial-quote-mark{position:absolute;top:4px;right:20px;color:#dce9e3;font-family:Georgia,serif;font-size:5.8rem;line-height:1;pointer-events:none}
.testimonial-rating{position:relative;z-index:1;margin:0 0 9px;color:#be8a26;letter-spacing:2px}
.testimonial-copy blockquote{position:relative;z-index:1;margin:0;color:#26364a;font-size:clamp(.98rem,1.25vw,1.18rem);line-height:1.6;overflow-wrap:anywhere}
.testimonial-author{display:grid;gap:3px;margin-top:17px}
.testimonial-author strong{color:#123b78;font-size:.95rem}
.testimonial-author span{color:#65748a;font-size:.82rem}
.testimonial-pagination{display:flex;justify-content:center;gap:9px;margin:14px 0 0}
.testimonial-pagination button{width:9px;height:9px;padding:0;border:0;border-radius:99px;background:#c5cfda;cursor:pointer;transition:width .2s ease,background .2s ease}
.testimonial-pagination button[aria-pressed=true]{width:28px;background:#288362}
.testimonial-pagination button:focus-visible,.testimonial-preview:focus-visible{outline:3px solid #2b8a67;outline-offset:3px}
.testimonial-previews{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.testimonial-preview{display:grid;grid-template-columns:minmax(76px,100px) minmax(0,1fr) 26px;align-items:center;gap:12px;min-width:0;min-height:132px;padding:9px;border:1px solid #e1e8ef;border-radius:13px;background:#fff;color:#20364f;font:inherit;text-align:left;cursor:pointer;transition:border-color .18s ease,transform .18s ease,box-shadow .18s ease}
.testimonial-preview:hover,.testimonial-preview[aria-pressed=true]{transform:translateY(-2px);border-color:#b7d6c8;box-shadow:0 8px 22px rgba(16,43,77,.08)}
.testimonial-preview img,.testimonial-preview-initial{display:block;width:100%;height:112px;border-radius:8px;object-fit:cover;object-position:center;background:#e9f0ed}
.testimonial-preview-initial{display:grid;place-items:center;color:#17664f;font-size:2rem;font-weight:750}
.testimonial-preview-copy{display:flex;flex-direction:column;align-items:flex-start;gap:4px;min-width:0}
.testimonial-preview-rating{color:#be8a26;font-size:.82rem;letter-spacing:1px;white-space:nowrap}
.testimonial-preview-text{display:-webkit-box;overflow:hidden;color:#394b60;font-size:.77rem;line-height:1.4;-webkit-box-orient:vertical;-webkit-line-clamp:2}
.testimonial-preview strong,.testimonial-preview small{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.testimonial-preview strong{margin-top:2px;color:#123b78;font-size:.78rem}
.testimonial-preview small{color:#69798d;font-size:.7rem}
.testimonial-preview-arrow{display:grid;place-items:center;width:26px;height:26px;border:1px solid #e1e8ef;border-radius:50%;color:#27805f}
.testimonial-empty{padding:26px 30px;border:1px dashed #bfd0df;border-radius:16px;background:#fff;color:#51647b;text-align:center}
.testimonial-empty p{margin:0}
.testimonial-empty-layout .testimonial-empty{display:flex;align-items:center;justify-content:center;min-height:285px}

/* Verified location discovery map */
.section-location-map{background:#f5f8fb}
.section-location-map .section-head{margin-bottom:22px}
.map-reset{flex-shrink:0}
.map-layout{display:grid;grid-template-columns:minmax(220px,.9fr) minmax(0,2.2fr) minmax(250px,1fr);gap:14px;align-items:stretch;min-width:0}
.map-filter-drawer{min-width:0;overflow:hidden;border-radius:16px;background:#102b4d;color:#fff;box-shadow:0 12px 32px rgba(16,43,77,.13)}
.map-filter-drawer>summary{display:none}
.map-filter-panel{padding:19px 17px}
.map-panel-title{margin:0 0 9px;color:#fff;font-size:1rem;font-weight:750}
.map-filter-option{display:grid;grid-template-columns:19px 24px minmax(0,1fr);align-items:start;gap:9px;margin:0;padding:12px 0;border-bottom:1px solid rgba(255,255,255,.12);font-size:.83rem;line-height:1.4;cursor:pointer}
.map-filter-option input{width:17px;height:17px;margin:2px 0 0;accent-color:#08aa75}
.map-filter-option:focus-within{outline:2px solid #a5e7c7;outline-offset:3px;border-radius:4px}
.map-filter-option>span:last-child{min-width:0}
.map-filter-option small{display:block;margin-top:3px;color:#c2cfdd;font-size:.73rem}
.map-filter-icon{display:block;width:22px;height:22px;color:#fff}
.map-corridor-filter{margin-top:15px}
.map-corridor-filter label{display:block;margin-bottom:7px;color:#dbe6f1;font-size:.78rem;font-weight:700}
.map-corridor-filter select{width:100%;min-height:42px;padding:8px 10px;border:1px solid rgba(255,255,255,.3);border-radius:8px;background:#fff;color:#192d45;font:inherit;font-size:.83rem}
.map-corridor-info{display:grid;gap:7px;margin-top:10px;padding:11px;border-radius:10px;background:rgba(255,255,255,.09);font-size:.76rem;line-height:1.45}
.map-corridor-info p{margin:0;color:#d5e0eb}
.map-corridor-info a{color:#a5e7c7;font-weight:750;text-decoration:underline}
.map-canvas-wrap{position:relative;min-width:0;min-height:420px;overflow:hidden;border:1px solid #d9e2eb;border-radius:16px;background:#eaf0f3;box-shadow:0 10px 28px rgba(16,43,77,.08)}
.map-canvas{width:100%;height:420px;min-width:0;z-index:1}
.map-legend{position:absolute;z-index:450;bottom:11px;left:11px;display:flex;flex-wrap:wrap;gap:7px 11px;max-width:calc(100% - 22px);padding:9px 11px;border:1px solid #dfe6ed;border-radius:9px;background:rgba(255,255,255,.97);color:#34475d;font-size:.67rem;box-shadow:0 3px 12px rgba(16,43,77,.1)}
.map-legend span{display:flex;align-items:center;gap:6px;white-space:nowrap}
.map-legend-shape{display:inline-block;flex:0 0 10px;width:10px;height:10px;border:2px solid #fff;border-radius:50%;background:#27805f;box-shadow:0 0 0 1px #738396}
.map-legend-property{background:#e34c4c}
.map-legend-airport{background:#1670ed}
.map-legend-industrial{background:#ee790d}
.map-legend-health{background:#7040c8}
.map-legend-corridors{background:#27805f}
.map-infrastructure-icon{display:grid!important;place-items:center;border:0!important;background:none!important}
.map-marker-shape{display:block;width:17px;height:17px;border:2px solid #fff;border-radius:50%;box-shadow:0 1px 5px rgba(10,27,43,.48)}
.map-marker-airport,.map-marker-it_business{background:#1670ed}
.map-marker-industrial{background:#ee790d}
.map-marker-education,.map-marker-hospital{background:#7040c8}
.map-marker-major_road{background:#27805f}
.map-marker-stage-under_construction{border-style:dashed}
.map-marker-stage-proposed{border-radius:2px;transform:rotate(45deg)}
.map-marker-label{max-width:150px;padding:3px 7px!important;overflow:hidden;border:1px solid #d9e2eb!important;border-radius:6px!important;background:#fff!important;color:#183453!important;font-size:11px!important;font-weight:700!important;text-overflow:ellipsis;white-space:nowrap;box-shadow:0 2px 7px rgba(16,43,77,.15)!important}
.map-marker-label:before{border-top-color:#fff!important}
.map-status{position:absolute;z-index:500;top:12px;left:50%;width:min(90%,480px);transform:translateX(-50%);padding:9px 13px;border:1px solid #d8e5ec;border-radius:9px;background:rgba(255,255,255,.96);color:#42556d;font-size:.8rem;line-height:1.45;text-align:center;box-shadow:0 5px 16px rgba(16,43,77,.12);pointer-events:none}
.map-status.is-error{border-color:#e3b7b7;color:#8b2d2d}
.map-preview{display:flex;align-self:start;flex-direction:column;min-width:0;min-height:420px;overflow:hidden;border:1px solid #e0e7ef;border-radius:16px;background:#fff;box-shadow:0 10px 28px rgba(16,43,77,.08)}
.map-preview-empty{display:flex;flex:1;flex-direction:column;justify-content:center;align-items:flex-start;min-height:250px;padding:25px 22px}
.map-preview-pin{display:grid;place-items:center;width:44px;height:44px;margin-bottom:18px;border-radius:13px;background:#e7f2ed;color:#238361}
.map-preview-empty h3{margin:0 0 9px;color:#123b78;font-size:1.14rem}
.map-preview-empty p{margin:0;color:#64758a;font-size:.86rem;line-height:1.65}
.map-preview-image{display:block;width:100%;height:160px;flex:0 0 160px;object-fit:cover;background:#edf1f5}
.map-preview>h3,.map-preview>.map-preview-eyebrow,.map-preview>.map-preview-location,.map-preview>.map-preview-description,.map-preview>.map-status-chip,.map-preview>.map-facts,.map-preview>.map-preview-actions,.map-preview>.map-preview-corridors,.map-preview>.map-source-link{margin-right:18px;margin-left:18px}
.map-preview>h3{margin-top:4px;margin-bottom:4px;color:#123b78;font-size:1.12rem;line-height:1.35}
.map-preview-eyebrow{margin-top:15px;margin-bottom:4px;color:#27805f;font-size:.68rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase}
.map-preview-location{margin-top:0;margin-bottom:10px;color:#617287;font-size:.82rem}
.map-preview-description{color:#53647a;font-size:.83rem;line-height:1.6}
.map-status-chip{display:inline-flex;width:max-content;margin-top:8px;margin-bottom:8px;padding:4px 8px;border-radius:99px;background:#e6f3ec;color:#286c4d;font-size:.72rem;font-weight:750}
.map-status-under_construction{background:#fff0e8;color:#a64b2a}
.map-status-proposed{background:#fff4db;color:#805810}
.map-facts{display:grid;gap:0;margin-top:12px;margin-bottom:14px}
.map-fact{display:grid;grid-template-columns:minmax(76px,.7fr) minmax(0,1.3fr);gap:9px;padding:8px 0;border-bottom:1px solid #edf0f3;font-size:.75rem;line-height:1.45}
.map-fact dt{color:#718095}
.map-fact dd{margin:0;color:#253b54;font-weight:650;overflow-wrap:anywhere}
.map-preview-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:13px;margin-bottom:14px}
.map-preview-actions .btn{justify-content:center;min-width:0;padding:10px 8px;font-size:.77rem}
.map-preview-corridors{display:grid;gap:6px;margin-top:8px;margin-bottom:12px}
.map-preview-corridors p{margin:0}
.map-preview-corridors a{color:#17664f;font-size:.78rem;font-weight:700}
.map-source-link{display:inline-block;margin-top:5px;margin-bottom:18px;color:#1a5c91;font-size:.76rem;font-weight:700;text-decoration:underline}
.map-disclaimer{max-width:940px;margin:12px auto 0;color:#64758a;font-size:.73rem;line-height:1.5;text-align:center}
.leaflet-container{font-family:inherit}
.leaflet-control-attribution{font-size:10px!important}

@media (max-width: 1050px){
  .testimonial-layout{grid-template-columns:minmax(200px,.72fr) minmax(0,1.35fr);gap:16px 20px}
  .testimonial-preview{grid-template-columns:minmax(72px,82px) minmax(0,1fr) 22px;gap:9px}
  .testimonial-preview-arrow{width:22px;height:22px}
  .map-layout{grid-template-columns:minmax(190px,.78fr) minmax(0,1.8fr)}
  .map-preview{grid-column:1/-1;min-height:0}
  .map-preview-empty{min-height:190px}
}
@media (max-width: 767px){
  .testimonial-layout{grid-template-columns:minmax(0,1fr);gap:17px}
  .testimonial-intro{align-items:flex-start}
  .testimonial-intro h2{max-width:16ch}
  .testimonial-controls{margin-top:15px}
  .testimonial-card{grid-template-columns:minmax(0,1fr);min-height:0;border-radius:17px}
  .testimonial-photo{width:100%;height:auto;min-height:0;max-height:240px;aspect-ratio:16/9}
  .testimonial-initial{font-size:4rem}
  .testimonial-copy{padding:24px 22px 26px}
  .testimonial-quote-mark{top:5px;right:17px;font-size:5rem}
  .testimonial-copy blockquote{font-size:1rem;line-height:1.6}
  .testimonial-author{margin-top:15px}
  .testimonial-previews{display:flex;gap:10px;overflow-x:auto;padding:3px 3px 12px;scroll-snap-type:x mandatory;scroll-padding-inline:3px;overscroll-behavior-x:contain}
  .testimonial-preview{flex:0 0 min(84%,340px);grid-template-columns:82px minmax(0,1fr) 24px;scroll-snap-align:start}
  .testimonial-preview img,.testimonial-preview-initial{height:108px}
  .section-location-map .section-head{align-items:flex-start;flex-direction:column;gap:14px}
  .map-reset{align-self:flex-start}
  .map-layout{grid-template-columns:minmax(0,1fr);gap:11px}
  .map-filter-drawer{grid-row:1}
  .map-filter-drawer>summary{display:block;padding:13px 16px;color:#fff;font-size:.9rem;font-weight:750;cursor:pointer;list-style:none}
  .map-filter-drawer>summary::-webkit-details-marker{display:none}
  .map-filter-drawer>summary::after{content:"+";float:right;color:#a5e7c7;font-size:1.2rem;line-height:1}
  .map-filter-drawer[open]>summary::after{content:"−"}
  .map-filter-panel{padding:0 15px 15px}
  .map-panel-title{display:none}
  .map-canvas-wrap{grid-row:2;min-height:360px}
  .map-canvas{height:360px}
  .map-preview{grid-column:auto;grid-row:3;min-height:0}
  .map-preview-empty{min-height:190px;padding:20px}
  .map-preview-image{height:180px}
  .map-legend{font-size:.62rem;gap:6px 9px;max-width:calc(100% - 18px);bottom:9px;left:9px}
  .map-marker-label{max-width:120px;font-size:10px!important}
}
@media (max-width: 390px){
  .testimonial-photo{max-height:205px}
  .testimonial-copy{padding:20px 17px 22px}
  .testimonial-preview{flex-basis:88%;grid-template-columns:70px minmax(0,1fr) 22px;gap:8px;padding:8px}
  .testimonial-preview img,.testimonial-preview-initial{height:96px}
  .map-canvas-wrap{min-height:330px}
  .map-canvas{height:330px}
  .map-preview-actions{grid-template-columns:1fr}
  .map-legend{font-size:.58rem;gap:5px 7px}
}
@media (prefers-reduced-motion: reduce){
  .testimonial-pagination button,.testimonial-preview{transition:none}
}

/* ---------- Homepage spotlight: clickable photo tiles + video tile ---------- */
.spot-main-link { display: block; width: 100%; height: 100%; }
.spot-main-link[hidden], .spot-player[hidden] { display: none; }
.spot-player { position: absolute; inset: 0; background: #000; }
.spot-player iframe, .spot-player video { display: block; width: 100%; height: 100%; border: 0; object-fit: contain; background: #000; }
.spot-thumbs { grid-template-columns: repeat(var(--spot-n, 4), minmax(0, 1fr)); }
.spot-tile { position: relative; display: block; margin: 0; padding: 0; border: 0; border-radius: 12px; overflow: hidden; aspect-ratio: 4 / 3; background: #E2E8F0 center / cover no-repeat; cursor: pointer; outline: 2px solid transparent; outline-offset: 2px; transition: outline-color .2s, transform .2s; }
.spot-tile img { display: block; width: 100%; height: 100%; object-fit: cover; }
.spot-tile:hover { transform: translateY(-2px); }
.spot-tile[aria-current="true"] { outline-color: var(--green); }
.spot-tile:focus-visible { outline-color: var(--navy); }
.spot-tile-cap { position: absolute; left: 0; right: 0; bottom: 0; padding: 14px 8px 6px; font-size: 11px; font-weight: 600; text-align: left; color: #fff; background: linear-gradient(0deg, rgba(0, 0, 0, .65), transparent); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.spot-tile-video::before { content: ""; position: absolute; inset: 0; background: rgba(7, 21, 45, .35); }
.spot-tile-play { position: absolute; left: 50%; top: 45%; transform: translate(-50%, -50%); display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; background: rgba(255, 255, 255, .92); color: var(--green-dark); box-shadow: 0 6px 16px rgba(0, 0, 0, .25); }
.spot-tile-play .icon { width: 18px; height: 18px; margin-left: 2px; }
@media (max-width: 600px) { .spot-thumbs { gap: 6px; } .spot-tile { border-radius: 10px; } .spot-tile-play { width: 28px; height: 28px; } .spot-tile-play .icon { width: 14px; height: 14px; } .spot-tile-cap { font-size: 10px; padding: 12px 6px 5px; } }