/* ===================================================
   GHANA TOWERS — shared stylesheet
   Used by index.html and every page under /towers/
   =================================================== */

:root{
  --pill-radius:6px;   /* badges, chips, filters: change this one number to make every pill rounder or squarer */
  --btn-radius:8px;    /* buttons */
  --black:#111214;
  --white:#FFFFFF;
  --off:#F7F7F5;
  --text-soft:#6E7076;
  --line:rgba(17,18,20,0.10);
  --green:#1F6B4A;
}
*{box-sizing:border-box; margin:0; padding:0;}
body{
  font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", Inter, Roboto, Helvetica, Arial, sans-serif;
  color:var(--black);
  background:var(--white);
  -webkit-font-smoothing:antialiased;
}
a{ color:inherit; text-decoration:none; }
img{ display:block; width:100%; height:100%; object-fit:cover; }

/* ---------- HEADER ---------- */
header.site{
  position:absolute; top:0; left:0; right:0; z-index:50;
  padding:28px 56px;
  display:flex; align-items:center; justify-content:space-between;
}
header.site.solid{
  /* relative, not static: keeps it in normal document flow exactly like
     static does, but still gives the mobile nav panel (position:absolute)
     the right element to anchor to — without this it would position
     itself against the page instead of the header on every solid-header
     page (towers.php, tower.php, contact.php, thank-you.php). */
  position:relative;
  background:var(--white);
  border-bottom:1px solid var(--line);
}
header.site.solid .wordmark, header.site.solid nav.links a{ color:var(--black) !important; }
header.site.solid .nav-cta{ border-color:var(--line) !important; }
.wordmark{ font-size:16px; font-weight:800; letter-spacing:0.01em; color:var(--white); }
header.site .wordmark{ display:flex; align-items:center; }
header.site .logo-img{ height:44px; width:auto; display:block; }
nav.links{ display:flex; align-items:center; gap:36px; }
nav.links a{ font-size:14px; font-weight:500; color:rgba(255,255,255,0.9); }
.nav-cta{
  border:1px solid rgba(255,255,255,0.55);
  padding:9px 18px; border-radius:var(--btn-radius); color:var(--white) !important;
}
.nav-cta:hover{ background:rgba(255,255,255,0.12); }

/* padding-bottom + negative margin-bottom: extends nav-drop's actual
   hoverable box down to where the menu sits, with no visual gap and no
   effect on the header's layout height — closes the dead zone that
   made the menu disappear before the cursor reached it. */
.nav-drop{ position:relative; display:flex; align-items:center; padding-bottom:16px; margin-bottom:-16px; }
.drop-trigger{ display:flex; align-items:center; gap:5px; }
.drop-trigger::after{ content:"⌄"; font-size:12px; opacity:0.7; position:relative; top:-1px; }
.drop-menu{
  position:absolute; top:100%; left:50%; transform:translate(-50%,4px);
  min-width:190px; padding:10px; z-index:60;
  background:var(--white); border-radius:14px; box-shadow:0 18px 40px rgba(0,0,0,0.18);
  display:flex; flex-direction:column; gap:2px;
  opacity:0; visibility:hidden; pointer-events:none;
  transition:opacity 0.15s ease, transform 0.15s ease;
}
.nav-drop:hover .drop-menu{ opacity:1; visibility:visible; pointer-events:auto; transform:translate(-50%,0); }
.drop-menu a{ color:var(--black) !important; font-size:14px; font-weight:500; padding:8px 12px; border-radius:8px; }
.drop-menu a:hover{ background:var(--off); }
.drop-empty{ padding:8px 12px; font-size:13px; color:var(--text-soft); }
.nav-soon{
  font-size:14px; font-weight:500; color:rgba(255,255,255,0.45); cursor:default;
}
header.site.solid .nav-soon{ color:rgba(17,18,20,0.35) !important; }

/* ---------- MOBILE MENU TOGGLE ---------- */
.nav-toggle{
  display:none; flex-direction:column; justify-content:center; gap:5px;
  width:36px; height:36px; padding:0; background:none; border:none; cursor:pointer;
}
.nav-toggle span{ width:22px; height:2px; background:var(--white); transition:background 0.2s, transform 0.2s, opacity 0.2s; }
header.site.solid .nav-toggle span{ background:var(--black); }
.nav-toggle.open span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.nav-toggle.open span:nth-child(2){ opacity:0; }
.nav-toggle.open span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

/* ---------- HERO (homepage) ---------- */
.hero{
  position:relative; height:88vh; min-height:620px;
  display:flex; align-items:center; justify-content:center;
  overflow:hidden; background:#1a1c22;
}
.hero-bg{ position:absolute; inset:0; }
.hero-bg::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(10,10,12,0.35) 0%, rgba(10,10,12,0.15) 45%, rgba(10,10,12,0.55) 100%);
}
.hero-skyline{
  position:absolute; left:0; right:0; bottom:0; width:100%;
  height:42%; z-index:1; pointer-events:none;
  object-fit:cover; object-position:center bottom;
}
@media (max-width:900px){ .hero-skyline{ height:32%; } }
.hero-content{ position:relative; z-index:2; text-align:center; color:var(--white); padding:0 24px; }
h1{ font-size:56px; font-weight:800; letter-spacing:-0.02em; line-height:1.08; }
.hero-sub{ margin-top:16px; font-size:17px; color:rgba(255,255,255,0.85); }

/* ---------- SEARCH PILL ---------- */
.search-wrap{ position:relative; z-index:10; margin-top:-40px; display:flex; justify-content:center; padding:0 24px; }
.search-pill{
  background:var(--white); border-radius:12px;
  box-shadow:0 24px 60px rgba(17,18,20,0.18);
  width:100%; max-width:820px; overflow:hidden; transition:max-width .2s;
}
.search-tabs{ display:flex; border-bottom:1px solid var(--line); padding:6px 6px 0; }
.search-tabs button{
  background:none; border:none; cursor:pointer; font-size:14px; font-weight:600;
  color:var(--text-soft); padding:14px 22px; border-bottom:2px solid transparent;
  font-family:inherit;
}
.search-tabs button.active{ color:var(--black); border-bottom-color:var(--black); }
.search-fields{ display:flex; align-items:stretch; padding:8px; }
.s-field{ flex:1; padding:12px 18px; border-right:1px solid var(--line); }
.s-field:last-of-type{ border-right:none; }
.s-field label{ display:block; font-size:11px; font-weight:600; color:var(--text-soft); margin-bottom:3px; text-transform:uppercase; letter-spacing:0.03em; }
.s-field select, .s-field input{ border:none; outline:none; width:100%; font-size:14.5px; font-weight:500; color:var(--black); font-family:inherit; background:none; }
.search-go{
  background:var(--black); color:var(--white); border:none; border-radius:var(--btn-radius);
  padding:0 30px; font-size:14.5px; font-weight:600; cursor:pointer; margin:8px; flex-shrink:0;
}
.search-go:hover{ background:#2b2d33; }

/* ---------- SECTIONS ---------- */
.section{ padding:88px 56px; max-width:1240px; margin:0 auto; }
.section.tight{ padding-top:56px; }
.section-head{ margin-bottom:40px; }
.section-head h2{ font-size:28px; font-weight:800; letter-spacing:-0.015em; }
.section-head p{ margin-top:8px; font-size:15px; color:var(--text-soft); max-width:52ch; }
.section-foot{ margin-top:32px; }
.link-arrow{ font-size:14px; font-weight:600; color:var(--black); border-bottom:1px solid var(--black); padding-bottom:2px; }

/* ---------- TILES (neighborhoods) ---------- */
.tile-grid{ display:grid; grid-template-columns:repeat(3, 1fr); gap:20px; }
.tile{ position:relative; border-radius:14px; overflow:hidden; height:220px; display:flex; align-items:flex-end; padding:20px; }
.tile::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, transparent 40%, rgba(10,10,12,0.65) 100%); z-index:1; }
.tile-label{ position:relative; z-index:2; color:var(--white); }
.tile-label .n{ font-size:18px; font-weight:700; }
.tile-label .c{ font-size:12.5px; color:rgba(255,255,255,0.75); margin-top:2px; }

/* ---------- TOWER CARDS ---------- */
.tower-grid{ display:grid; grid-template-columns:repeat(3, 1fr); gap:28px; }
.tower-card{ cursor:pointer; display:block; }
.tower-media{ height:210px; border-radius:14px; overflow:hidden; position:relative; margin-bottom:14px; }
.tower-badge{ position:absolute; top:14px; left:14px; z-index:2; background:rgba(255,255,255,0.92); color:var(--black); font-size:11.5px; font-weight:600; padding:6px 12px; border-radius:var(--pill-radius); }
.tower-area{ font-size:12.5px; color:var(--text-soft); font-weight:500; }
.tower-name{ font-size:18px; font-weight:700; margin-top:2px; }
.tower-price{ font-size:14px; color:var(--black); margin-top:6px; font-weight:600; }
.tower-avail{ font-size:12.5px; color:var(--green); font-weight:600; margin-top:2px; }

/* ---------- CONCIERGE / BENEFITS ---------- */
.concierge{ background:var(--off); }
.concierge-inner{ max-width:1240px; margin:0 auto; padding:96px 56px; display:grid; grid-template-columns:1fr 1fr; gap:72px; align-items:center; }
.concierge-media{ height:340px; border-radius:16px; background:#dfe3e8 url('../images/credit-assist.jpg') center/cover no-repeat; }
.concierge-copy h2{ font-size:32px; font-weight:800; letter-spacing:-0.015em; line-height:1.2; margin-bottom:16px; }
.concierge-copy p{ font-size:15.5px; line-height:1.65; color:var(--text-soft); margin-bottom:28px; max-width:44ch; }
.concierge-list{ display:flex; flex-direction:column; gap:16px; margin-bottom:32px; }
.c-item{ display:flex; gap:12px; align-items:flex-start; font-size:14.5px; }
.c-item .dot{ width:5px; height:5px; border-radius:50%; background:var(--black); margin-top:8px; flex-shrink:0; }
.btn-black{ display:inline-block; background:var(--black); color:var(--white); padding:14px 26px; border-radius:var(--btn-radius); font-size:14px; font-weight:600; }
.btn-black:hover{ background:#2b2d33; }

/* ---------- LATEST GRID ---------- */
.latest-grid{ display:grid; grid-template-columns:repeat(4, 1fr); gap:22px; }
.latest-card{ border:1px solid var(--line); border-radius:14px; padding:18px; display:block; }
.latest-thumb{ height:110px; border-radius:9px; margin-bottom:14px; background:linear-gradient(135deg,#e4e7eb,#cfd4da); }
.latest-name{ font-size:15px; font-weight:700; }
.latest-area{ font-size:12.5px; color:var(--text-soft); margin-top:2px; }
.latest-meta{ display:flex; justify-content:space-between; align-items:center; margin-top:12px; padding-top:12px; border-top:1px solid var(--line); font-size:12px; color:var(--text-soft); }
.latest-meta b{ color:var(--black); }

/* ---------- FOOTER ---------- */
footer{ background:var(--black); padding:64px 56px 32px; }
.footer-top{ max-width:1240px; margin:0 auto; display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr; gap:40px; padding-bottom:40px; border-bottom:1px solid rgba(255,255,255,0.12); }
.footer-brand .wordmark{ color:var(--white); margin-bottom:12px; }
.footer-brand p{ font-size:13px; color:rgba(255,255,255,0.5); max-width:32ch; line-height:1.6; }
.footer-col h4{ font-size:12px; font-weight:600; color:rgba(255,255,255,0.4); text-transform:uppercase; letter-spacing:0.04em; margin-bottom:14px; }
.footer-col a{ display:block; font-size:13px; color:rgba(255,255,255,0.7); margin-bottom:10px; }
.footer-col a:hover{ color:var(--white); }
.footer-bottom{ max-width:1240px; margin:0 auto; padding-top:24px; display:flex; justify-content:space-between; font-size:12px; color:rgba(255,255,255,0.4); }

/* ---------- BUILDING DETAIL PAGE ---------- */
.b-hero{
  position:relative; height:52vh; min-height:380px;
  display:flex; align-items:flex-end; overflow:hidden;
  padding-bottom:40px;
}
.b-hero::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, transparent 30%, rgba(10,10,12,0.7) 100%); }
.b-hero-inner{ position:relative; z-index:1; max-width:1240px; margin:0 auto; padding:0 56px; width:100%; color:var(--white); }
.b-badge{ background:rgba(255,255,255,0.9); color:var(--black); font-size:11.5px; font-weight:600; padding:6px 12px; border-radius:var(--pill-radius); display:inline-block; text-transform:capitalize; }
.b-hero-inner h1{ font-size:34px; margin-top:16px; }
.b-hero-inner .b-sub{ margin-top:6px; font-size:15px; color:rgba(255,255,255,0.8); }

.b-body{ max-width:1240px; margin:0 auto; padding:56px; display:grid; grid-template-columns:1.6fr 1fr; gap:56px; }
.b-desc{ font-size:15.5px; line-height:1.7; color:var(--text-soft); max-width:70ch; }
.amenities{ display:flex; flex-wrap:wrap; gap:10px; margin-top:32px; }
.amenity{ border:1px solid var(--line); padding:7px 14px; border-radius:var(--pill-radius); font-size:13px; font-weight:500; }

.units{ margin-top:48px; }
.units h2{ font-size:22px; font-weight:800; letter-spacing:-0.01em; }
.unit-row{
  display:grid; grid-template-columns:1.4fr 1fr 1fr auto;
  align-items:center; gap:12px; padding:20px 0;
  border-bottom:1px solid var(--line);
}
.unit-row:first-of-type{ border-top:1px solid var(--line); margin-top:20px; }
.unit-type{ font-size:15.5px; font-weight:700; }
.unit-size{ font-size:12.5px; color:var(--text-soft); margin-top:2px; }
.unit-price{ font-size:14.5px; font-weight:600; }
.unit-updated{ font-size:12.5px; color:var(--text-soft); }
.unit-status{ font-size:12.5px; font-weight:600; color:var(--green); }
.unit-status.rented{ color:var(--text-soft); text-transform:capitalize; }

.enquiry-card{ border:1px solid var(--line); border-radius:14px; padding:26px; position:sticky; top:24px; height:fit-content; }
.enquiry-card h3{ font-size:15px; font-weight:700; }
.enquiry-card p{ font-size:13.5px; color:var(--text-soft); margin-top:6px; }
.enquiry-card form{ display:flex; flex-direction:column; gap:12px; margin-top:20px; }
.enquiry-card input, .enquiry-card textarea{
  border:1px solid var(--line); border-radius:10px; padding:12px 14px;
  font-size:14px; font-family:inherit; outline:none;
}
.enquiry-card input:focus, .enquiry-card textarea:focus{ border-color:var(--black); }
.enquiry-card button{
  background:var(--black); color:var(--white); border:none; border-radius:var(--btn-radius);
  padding:14px; font-size:14px; font-weight:600; cursor:pointer; margin-top:4px;
}
.enquiry-card button:hover{ background:#2b2d33; }

/* ---------- RESPONSIVE ---------- */
@media (max-width: 900px){
  header.site{ padding:20px 20px; }
  header.site .logo-img{ height:32px; }
  .nav-toggle{ display:flex; }

  /* Collapsed by default; the hamburger toggles the .open class (see
     the script in site-header.php). max-height (not display) is what
     animates, and it's generous so a tall list never gets clipped. */
  nav.links{
    position:absolute; top:100%; left:0; right:0;
    flex-direction:column; align-items:stretch; gap:0;
    background:var(--white); box-shadow:0 16px 30px rgba(0,0,0,0.15);
    max-height:0; overflow:hidden; transition:max-height 0.25s ease;
  }
  nav.links.open{ max-height:80vh; overflow-y:auto; }
  nav.links a, nav.links .nav-soon, nav.links .drop-trigger{
    display:flex !important; align-items:center; width:100%; box-sizing:border-box;
    padding:16px 24px; font-size:15px; color:var(--black) !important;
    border-bottom:1px solid var(--line);
  }
  nav.links .nav-cta{
    border:1px solid var(--line) !important; border-radius:var(--btn-radius); margin:14px 24px;
    width:auto; justify-content:center; padding:12px;
  }

  /* Properties / Neighbourhoods become tap-to-expand accordions —
     there's no hover on a touch screen. */
  .nav-drop{ display:block; padding-bottom:0; margin-bottom:0; width:100%; }
  .drop-trigger{ justify-content:space-between; }

  /* Repeats the ":hover" selector so this beats the desktop hover rule
     at equal specificity (mobile block comes later in the file) — some
     mobile browsers keep a tapped element's :hover state "stuck", which
     would otherwise leave the desktop position/transform active and
     push these links off-screen. */
  .drop-menu, .nav-drop:hover .drop-menu{
    position:static; left:auto; transform:none; opacity:1; visibility:visible; pointer-events:auto;
    background:var(--off); box-shadow:none; border-radius:0; padding:0; min-width:0;
    max-height:0; overflow:hidden; transition:max-height 0.2s ease;
  }
  .nav-drop.expanded .drop-menu{ max-height:400px; }
  .drop-menu a{ border-bottom:1px solid var(--line); border-radius:0; padding:14px 24px 14px 40px; }
  .drop-empty{ padding:14px 24px 14px 40px; }

  h1{ font-size:34px; }
  .search-fields{ flex-direction:column; }
  .s-field{ border-right:none; border-bottom:1px solid var(--line); }
  .search-go{ margin:8px 0 0; }
  .section{ padding:56px 20px; }
  .tile-grid{ grid-template-columns:1fr 1fr; }
  .tower-grid{ grid-template-columns:1fr; }
  .concierge-inner{ grid-template-columns:1fr; padding:56px 20px; gap:32px; }
  .latest-grid{ grid-template-columns:1fr 1fr; }
  .footer-top{ grid-template-columns:1fr 1fr; gap:32px; }
  .b-hero-inner{ padding:0 20px; }
  .b-body{ grid-template-columns:1fr; padding:20px; gap:32px; }
  .unit-row{ grid-template-columns:1fr 1fr; row-gap:6px; }
  .unit-updated{ display:none; }
}

/* ---------- ALL TOWERS (directory) PAGE ---------- */
.page-banner{
  background:linear-gradient(180deg,#2b3040 0%,#0e0f13 100%);
  padding:64px 56px 48px;
  color:var(--white);
}
.page-banner h1{ font-size:34px; }
.page-banner p{ margin-top:8px; font-size:15px; color:rgba(255,255,255,0.7); }

.filter-bar{
  max-width:1240px; margin:0 auto;
  padding:22px 56px;
  display:flex; gap:14px; flex-wrap:wrap;
  border-bottom:1px solid var(--line);
}
.filter-bar select{
  border:1px solid var(--line); border-radius:8px;
  padding:10px 14px; font-size:13.5px; font-weight:500;
  color:var(--black); background:var(--white); font-family:inherit;
}
.filter-count{
  margin-left:auto; align-self:center;
  font-size:13px; color:var(--text-soft);
}

.all-towers-grid{
  max-width:1240px; margin:0 auto;
  padding:48px 56px 96px;
  display:grid; grid-template-columns:repeat(3, 1fr); gap:28px;
}
.no-results{
  display:none; text-align:center; padding:64px 20px;
  color:var(--text-soft); font-size:14.5px;
}

/* ---------- THANK YOU PAGE ---------- */
.thanks{
  max-width:520px; margin:0 auto; padding:140px 24px 160px; text-align:center;
}
.thanks h1{ font-size:28px; }
.thanks p{ margin-top:12px; font-size:15px; color:var(--text-soft); }
.thanks a{ display:inline-block; margin-top:28px; }

@media (max-width: 900px){
  .page-banner{ padding:44px 20px 36px; }
  .filter-bar{ padding:18px 20px; }
  .all-towers-grid{ padding:32px 20px 56px; grid-template-columns:1fr; }
}

/* ---------- CONTACT PAGE ---------- */
.contact-body{
  max-width:1000px; margin:0 auto; padding:56px;
  display:grid; grid-template-columns:1fr 1.3fr; gap:64px;
}
.contact-item{ margin-bottom:32px; }
.contact-item h4{ font-size:12px; font-weight:600; color:var(--text-soft); text-transform:uppercase; letter-spacing:0.04em; margin-bottom:6px; }
.contact-item p{ font-size:15px; line-height:1.6; }
.contact-item a{ color:var(--black); text-decoration:underline; text-underline-offset:3px; }
.contact-error{ background:#fdecec; color:#8a2c2c; border-radius:10px; padding:12px 16px; font-size:13.5px; margin-bottom:16px; }
.contact-sent{ border:1px solid var(--line); border-radius:14px; padding:32px; text-align:center; }
.contact-sent h3{ font-size:17px; font-weight:700; }
.contact-sent p{ margin-top:8px; font-size:14px; color:var(--text-soft); }

@media (max-width: 900px){
  .contact-body{ grid-template-columns:1fr; padding:36px 20px 56px; gap:36px; }
}

/* ---------- ADMIN PANEL ---------- */
.admin-body{ background:var(--off); min-height:100vh; }
.admin-header{
  background:var(--black); padding:18px 32px;
  display:flex; align-items:center; justify-content:space-between;
}
.admin-header .wordmark{ color:var(--white); font-size:15px; }
.admin-header a.out{ color:rgba(255,255,255,0.65); font-size:13px; }
.admin-header a.out:hover{ color:var(--white); }
.admin-header a.out.active-nav{ color:var(--white); font-weight:600; }
.reorder-links a{ color:var(--text-soft); font-size:13px; text-decoration:none; padding:2px 3px; }
.reorder-links a:hover{ color:var(--black); }
.inline-rename{ display:flex; gap:8px; align-items:center; }
.inline-rename input[type=text]{
  border:1px solid transparent; padding:6px 8px; border-radius:6px;
  font-size:14px; font-family:inherit; background:none; width:220px;
}
.inline-rename input[type=text]:focus{ border-color:var(--line); outline:none; }
.inline-rename .btn{ padding:6px 12px; font-size:12px; }
.add-inline-form{
  margin-bottom:28px; padding:20px 24px; background:var(--white);
  border:1px solid var(--line); border-radius:12px;
  display:flex; gap:12px; align-items:flex-end;
}
.admin-wrap{ max-width:1000px; margin:0 auto; padding:40px 24px 80px; }
.admin-top{ display:flex; justify-content:space-between; align-items:center; margin-bottom:28px; }
.admin-top h1{ font-size:24px; font-weight:800; }
.btn{
  display:inline-block; background:var(--black); color:var(--white);
  padding:11px 20px; border-radius:8px; font-size:13.5px; font-weight:600;
  border:none; cursor:pointer; font-family:inherit;
}
.btn:hover{ background:#2b2d33; }
.btn.secondary{ background:var(--white); color:var(--black); border:1px solid var(--line); }
.btn.danger{ background:#9B4A3C; }
.admin-table{ width:100%; background:var(--white); border-radius:12px; overflow:hidden; border:1px solid var(--line); border-collapse:collapse; }
.admin-table th{ text-align:left; font-size:12px; text-transform:uppercase; letter-spacing:0.04em; color:var(--text-soft); padding:14px 18px; background:var(--off); border-bottom:1px solid var(--line); }
.admin-table td{ padding:14px 18px; border-bottom:1px solid var(--line); font-size:14px; }
.admin-table tr:last-child td{ border-bottom:none; }
.admin-table .row-actions{ display:flex; gap:14px; }
.admin-table .row-actions a{ font-size:13px; font-weight:600; }
.badge-featured{ background:var(--black); color:#fff; font-size:11px; font-weight:600; padding:3px 8px; border-radius:var(--pill-radius); margin-left:8px; }
.flash{ background:#e9f5ef; border:1px solid var(--green); color:var(--green); padding:12px 16px; border-radius:8px; font-size:13.5px; margin-bottom:24px; }
.flash.error{ background:#fbeceA; border-color:#9B4A3C; color:#9B4A3C; }

.admin-form{ background:var(--white); border:1px solid var(--line); border-radius:12px; padding:32px; }
.form-row{ margin-bottom:18px; }
.form-row label{ display:block; font-size:13px; font-weight:600; margin-bottom:6px; }
.form-row input[type=text], .form-row input[type=number], .form-row select, .form-row textarea{
  width:100%; border:1px solid var(--line); border-radius:8px; padding:10px 13px;
  font-size:14px; font-family:inherit; outline:none;
}
.form-row input:focus, .form-row select:focus, .form-row textarea:focus{ border-color:var(--black); }
.form-grid2{ display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.form-check{ display:flex; align-items:center; gap:8px; font-size:14px; font-weight:500; }

.units-table{ width:100%; border-collapse:collapse; margin-top:10px; }
.units-table th{ text-align:left; font-size:11px; text-transform:uppercase; color:var(--text-soft); padding:8px 6px; }
.units-table td{ padding:6px; vertical-align:top; }
.units-table input, .units-table select{ width:100%; border:1px solid var(--line); border-radius:6px; padding:8px 9px; font-size:13px; font-family:inherit; }
.remove-unit{ background:none; border:none; color:#9B4A3C; font-size:18px; cursor:pointer; line-height:1; padding:6px; }
.add-unit-btn{ margin-top:10px; }

/* Areas admin table: small thumbnail + inline upload/remove links */
.photo-cell{
  width:56px; height:40px; border-radius:6px; background-size:cover; background-position:center;
}
.photo-upload-form{ margin-top:8px; display:flex; align-items:center; gap:2px; }
.photo-link{ font-size:12.5px; font-weight:600; color:var(--text-soft); cursor:pointer; text-decoration:underline; text-underline-offset:2px; }
.photo-link:hover{ color:var(--black); }

/* Building form: uploaded-photo grid, first one marked as the cover */
.photo-grid{ display:flex; flex-wrap:wrap; gap:12px; margin-bottom:16px; }
.photo-grid-item{ position:relative; width:120px; }
.photo-grid-thumb{ width:120px; height:90px; border-radius:8px; background-size:cover; background-position:center; border:1px solid var(--line); }
.photo-cover-badge{
  position:absolute; top:6px; left:6px; background:rgba(17,18,20,0.75); color:#fff;
  font-size:10.5px; font-weight:600; padding:2px 7px; border-radius:8px;
}
.photo-grid-remove{
  display:block; text-align:center; font-size:12px; font-weight:600; color:#9B4A3C;
  margin-top:6px; text-decoration:none;
}
.photo-grid-remove:hover{ text-decoration:underline; }

/* Public tower page: extra photos below the hero photo */
.photo-gallery{ display:grid; grid-template-columns:repeat(3, 1fr); gap:10px; margin-bottom:28px; }
.photo-gallery-item{ display:block; height:140px; border-radius:10px; background-size:cover; background-position:center; cursor:zoom-in; transition:opacity .15s; }
.photo-gallery-item:hover{ opacity:.88; }
.photo-gallery-item.first{ grid-column:1 / -1; height:340px; }
@media (max-width:900px){
  .photo-gallery{ grid-template-columns:repeat(2, 1fr); }
}

.login-wrap{ max-width:360px; margin:120px auto; padding:0 24px; }
.login-card{ background:var(--white); border:1px solid var(--line); border-radius:14px; padding:32px; }
.login-card h1{ font-size:20px; margin-bottom:6px; }
.login-card p{ font-size:13.5px; color:var(--text-soft); margin-bottom:20px; }

/* Area intro text (top of an area's page) + admin textarea */
.page-banner .area-about-text{ max-width:720px; line-height:1.65; font-size:15.5px; }
.area-about{ display:block; width:100%; margin-top:8px; padding:8px 10px; font:inherit; font-size:13px; border:1px solid var(--border, #ddd); border-radius:8px; resize:vertical; }
.inline-rename{ flex-wrap:wrap; }

/* ---------- AREA PAGE: towers + "Nearby" sidebar ---------- */
.area-layout{ max-width:1240px; margin:0 auto; }
.area-layout:not(.no-side){
  display:grid; grid-template-columns:1fr 300px; gap:40px; align-items:start;
  padding:0 56px;
}
.area-layout:not(.no-side) .all-towers-grid{
  padding:48px 0 96px; grid-template-columns:repeat(2, 1fr); margin:0; max-width:none; min-width:0;
}
.nearby{
  margin-top:48px; border:1px solid var(--line); border-radius:12px;
  padding:22px 22px 8px; background:var(--white);
  position:sticky; top:20px; max-height:calc(100vh - 40px); overflow-y:auto;
}
.nearby h2{ font-size:16px; margin-bottom:10px; }
.nearby-group{ border-top:1px solid var(--line); padding:12px 0; }
.nearby-group:first-of-type{ border-top:none; }
.nearby-group summary{
  cursor:pointer; font-size:13px; font-weight:700; list-style:none;
  display:flex; justify-content:space-between; align-items:center;
}
.nearby-group summary::-webkit-details-marker{ display:none; }
.nearby-group summary span{ font-weight:500; color:var(--text-soft); font-size:12px; }
.nearby-group ul{ list-style:none; margin:10px 0 0; padding:0; }
.nearby-group li{ margin-bottom:10px; }
.nearby-name{ font-size:13.5px; font-weight:500; }
.nearby-name:hover{ text-decoration:underline; }
.nearby-note{ font-size:12px; color:var(--text-soft); margin-top:1px; }
.place-add-form{ flex-wrap:wrap; align-items:flex-end; }
@media (max-width: 900px){
  .area-layout:not(.no-side){ grid-template-columns:1fr; padding:0 20px; gap:0; }
  .area-layout:not(.no-side) .all-towers-grid{ padding:32px 0 24px; grid-template-columns:1fr; }
  .nearby{ position:static; max-height:none; margin:0 0 56px; }
}
.admin-table td input[type=text], .admin-table td select{
  border:1px solid var(--line); border-radius:8px; padding:8px 10px;
  font:inherit; font-size:13px; background:var(--white); box-sizing:border-box;
}

/* ---------- PROJECTS FORUM ---------- */
.link-btn{ background:none; border:none; padding:0; font:inherit; font-size:13px; font-weight:600; color:inherit; cursor:pointer; text-decoration:none; }
.link-btn:hover{ text-decoration:underline; }
.link-btn.danger{ color:#9B4A3C; }

.auth-wrap{ max-width:460px; margin:0 auto; padding:56px 20px 96px; }
.auth-card{ background:var(--white); border:1px solid var(--line); border-radius:14px; padding:32px; }
.auth-card h1{ font-size:24px; }
.auth-sub{ font-size:14px; color:var(--text-soft); margin:6px 0 20px; }
.auth-card label{ display:block; font-size:13px; font-weight:600; margin:14px 0 6px; }
.auth-card .hint{ font-weight:400; color:var(--text-soft); }
.auth-card input[type=text], .auth-card input[type=email], .auth-card input[type=password]{
  width:100%; box-sizing:border-box; border:1px solid var(--line); border-radius:8px;
  padding:11px 13px; font:inherit; font-size:14.5px;
}
.auth-card input:focus{ outline:none; border-color:var(--black); }
.auth-card .btn-black{ margin-top:22px; width:100%; border:none; cursor:pointer; }
.auth-alt{ font-size:13.5px; color:var(--text-soft); margin-top:16px; text-align:center; }
.auth-alt a{ color:var(--black); font-weight:600; text-decoration:underline; }
.hp-field{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }

.forum-flash{ background:#e9f5ef; border:1px solid var(--green); color:var(--green); padding:12px 16px; border-radius:8px; font-size:13.5px; margin-bottom:20px; }
.forum-flash.error{ background:#fbecea; border-color:#9B4A3C; color:#9B4A3C; }

.forum-bar{ border-bottom:1px solid var(--line); background:var(--off); }
.forum-bar-inner{ max-width:1000px; margin:0 auto; padding:12px 24px; display:flex; justify-content:space-between; align-items:center; font-size:13.5px; }
.forum-bar .crumb{ font-weight:600; }
.forum-bar-user{ display:flex; gap:16px; align-items:center; }
.forum-bar-user a, .forum-bar-user .link-btn{ font-weight:600; }
.forum-bar-user .reg{ background:var(--black); color:var(--white); padding:6px 14px; border-radius:var(--btn-radius); }

.forum-wrap{ max-width:1000px; margin:0 auto; padding:32px 24px 96px; }
.forum-filters{ display:flex; gap:8px; flex-wrap:wrap; margin-bottom:24px; }
.forum-filters a{ border:1px solid var(--line); border-radius:var(--pill-radius); padding:7px 15px; font-size:13px; font-weight:500; }
.forum-filters a.on{ background:var(--black); color:var(--white); border-color:var(--black); }

.project-list{ display:flex; flex-direction:column; gap:14px; }
.project-row{ display:grid; grid-template-columns:150px 1fr 170px; gap:20px; align-items:center; border:1px solid var(--line); border-radius:14px; padding:14px; background:var(--white); }
.project-row:hover{ border-color:var(--black); }
.project-thumb{ height:100px; border-radius:10px; background-size:cover; background-position:center; }
.project-title{ font-size:17px; font-weight:700; margin-bottom:8px; }
.project-meta{ display:flex; gap:6px 14px; flex-wrap:wrap; font-size:13px; color:var(--text-soft); align-items:center; }
.project-stats{ font-size:12.5px; color:var(--text-soft); text-align:right; }
.project-stats strong{ color:var(--black); font-size:15px; }

.status-pill{ display:inline-block; font-size:11.5px; font-weight:700; padding:3px 10px; border-radius:var(--pill-radius); background:#eee; color:#333; }
.status-pill.s-under_construction{ background:#fff1d6; color:#8a5a00; }
.status-pill.s-topped_out{ background:#e1ecff; color:#1e4a9a; }
.status-pill.s-completed{ background:#e0f3e8; color:#1f6b43; }
.status-pill.s-planning{ background:#ececf3; color:#4a4a6a; }
.status-pill.s-on_hold{ background:#f6e1de; color:#9B4A3C; }
.project-banner-meta{ display:flex; gap:8px 16px; flex-wrap:wrap; align-items:center; font-size:13px; color:rgba(255,255,255,0.7); margin-bottom:12px; }

.thread-head{ display:flex; justify-content:space-between; align-items:center; font-size:13px; color:var(--text-soft); margin-bottom:14px; }
.pager{ display:flex; gap:6px; }
.pager a{ border:1px solid var(--line); border-radius:6px; padding:4px 10px; font-weight:600; color:var(--black); }
.pager a.on{ background:var(--black); color:var(--white); border-color:var(--black); }

.fpost{ display:grid; grid-template-columns:130px 1fr; gap:20px; border:1px solid var(--line); border-radius:14px; padding:18px; margin-bottom:14px; background:var(--white); }
.fpost:target{ border-color:var(--black); }
.fpost-side{ text-align:center; }
.avatar{ width:48px; height:48px; border-radius:50%; background:#dfe3ea; color:#333; font-weight:700; font-size:19px; display:flex; align-items:center; justify-content:center; margin:0 auto 8px; }
.avatar.admin{ background:var(--black); color:var(--white); }
.fpost-user{ font-size:13.5px; font-weight:700; word-break:break-word; }
.badge-admin{ display:inline-block; margin-top:4px; font-size:10.5px; font-weight:700; letter-spacing:0.05em; text-transform:uppercase; background:var(--black); color:var(--white); padding:2px 8px; border-radius:var(--pill-radius); }
.fpost-main{ min-width:0; }
.fpost-top{ display:flex; gap:12px; align-items:center; font-size:12.5px; color:var(--text-soft); margin-bottom:10px; flex-wrap:wrap; }
.fpost-top .edited{ font-style:italic; }
.fpost-actions{ margin-left:auto; display:flex; gap:14px; align-items:center; }
.fpost-actions a{ font-weight:600; color:var(--black); font-size:13px; }
.fpost-body{ font-size:15px; line-height:1.65; overflow-wrap:anywhere; }
.fpost-body a{ text-decoration:underline; }
.fpost-photos{ display:grid; grid-template-columns:repeat(auto-fill, minmax(200px, 1fr)); gap:10px; margin-top:14px; }
.fpost-photos img{ width:100%; height:160px; object-fit:cover; border-radius:10px; display:block; }

.edit-form textarea, .composer textarea{ width:100%; box-sizing:border-box; border:1px solid var(--line); border-radius:10px; padding:12px 14px; font:inherit; font-size:14.5px; resize:vertical; }
.edit-form textarea:focus, .composer textarea:focus{ outline:none; border-color:var(--black); }
.edit-actions{ display:flex; gap:16px; align-items:center; margin-top:10px; font-size:13.5px; }
.edit-actions .btn-black{ border:none; cursor:pointer; padding:10px 22px; }

.composer{ border:1px solid var(--line); border-radius:14px; padding:22px; margin-top:28px; background:var(--off); }
.composer h3{ font-size:16px; margin-bottom:12px; }
.composer-row{ display:flex; justify-content:space-between; align-items:center; gap:14px; margin-top:12px; flex-wrap:wrap; }
.composer-row .btn-black{ border:none; cursor:pointer; padding:11px 30px; }
.photo-pick{ font-size:13px; font-weight:600; }
.photo-pick input{ display:block; margin-top:6px; font-weight:400; font-size:12.5px; }
.composer-note{ font-size:12.5px; color:var(--text-soft); margin-top:10px; }
.composer-note a{ text-decoration:underline; font-weight:600; color:var(--black); }

.member-actions{ display:flex; gap:14px; align-items:center; flex-wrap:wrap; }
.pw-form{ display:flex; gap:6px; align-items:center; }
.pw-form input[type=text]{ width:130px; border:1px solid var(--line); border-radius:6px; padding:5px 8px; font:inherit; font-size:12.5px; }

@media (max-width: 900px){
  .project-row{ grid-template-columns:1fr; gap:12px; }
  .project-thumb{ height:150px; }
  .project-stats{ text-align:left; }
  .fpost{ grid-template-columns:1fr; gap:10px; padding:16px; }
  .fpost-side{ display:flex; align-items:center; gap:10px; text-align:left; }
  .avatar{ margin:0; width:36px; height:36px; font-size:15px; }
  .forum-wrap{ padding:24px 16px 72px; }
  .forum-bar-inner{ padding:10px 16px; }
}

/* ---------- DEVELOPER LABELS ---------- */
.tower-dev{ font-size:12.5px; color:var(--text-soft); margin-top:2px; }
.latest-dev{ font-size:12px; color:var(--text-soft); margin-top:1px; }
.b-hero-inner .b-dev{ margin-top:4px; font-size:14px; color:rgba(255,255,255,0.8); }
.b-hero-inner .b-dev a{ color:var(--white); font-weight:600; text-decoration:underline; }

/* ---------- MAPS ---------- */
.map-section .home-map{ height:460px; border-radius:16px; overflow:hidden; border:1px solid var(--line); background:#e8ebef; z-index:0; }
.b-map{ margin:36px 0; }
.b-map h2{ font-size:20px; margin-bottom:14px; }
.b-map iframe{ width:100%; height:320px; border:0; border-radius:14px; background:#e8ebef; display:block; }
.b-map-links{ display:flex; gap:20px; margin-top:12px; font-size:13.5px; font-weight:600; }
.b-map-links a{ text-decoration:underline; }
.map-pop{ min-width:170px; font-family:inherit; }
.map-pop-name{ font-size:15px; font-weight:700; color:#111; text-decoration:underline; display:block; margin-bottom:4px; }
.map-pop-sub{ font-size:12.5px; color:#666; margin-top:1px; }
.map-pop-price{ font-size:13.5px; font-weight:700; color:#111; margin-top:4px; }
@media (max-width: 900px){ .map-section .home-map{ height:360px; } }
.map-pop{ width:220px; }
.map-pop-photo{ display:block; margin:-2px 0 8px; }
.map-pop-photo img{ width:220px; height:130px; object-fit:cover; border-radius:8px; display:block; background:#e8ebef; }

/* Building page banner: homepage gradient + skyline silhouette, same height as before */
.b-hero-sky{ background:linear-gradient(180deg,#2b3040 0%,#0e0f13 100%); }
.b-hero-sky::after{ display:none; }
.b-hero-sky .hero-skyline{ height:70%; z-index:0; }
.b-hero-sky .b-hero-inner{ z-index:2; }
@media (max-width:900px){ .b-hero-sky .hero-skyline{ height:55%; } .photo-gallery-item.first{ height:240px; } }

/* Photo viewer (js/lightbox.js) */
.lb{ position:fixed; inset:0; z-index:9999; background:rgba(8,9,12,0.92); display:none; align-items:center; justify-content:center; }
.lb.lb-open{ display:flex; }
.lb-lock{ overflow:hidden; }
.lb-fig{ margin:0; max-width:92vw; max-height:92vh; display:flex; flex-direction:column; align-items:center; }
.lb-img{ max-width:92vw; max-height:84vh; object-fit:contain; border-radius:6px; background:#111; }
.lb-cap{ color:rgba(255,255,255,0.75); font-size:13px; margin-top:12px; text-align:center; }
.lb-close, .lb-nav{ position:absolute; background:rgba(255,255,255,0.12); color:#fff; border:none; cursor:pointer; border-radius:50%; width:44px; height:44px; font-size:28px; line-height:1; display:flex; align-items:center; justify-content:center; }
.lb-close:hover, .lb-nav:hover{ background:rgba(255,255,255,0.25); }
.lb-close{ top:18px; right:18px; }
.lb-nav{ top:50%; transform:translateY(-50%); }
.lb-prev{ left:18px; } .lb-next{ right:18px; }
.lb-single .lb-nav{ display:none; }
@media (max-width:600px){ .lb-nav{ top:auto; bottom:18px; transform:none; } .lb-prev{ left:24px; } .lb-next{ right:24px; } }

/* ---------- NEIGHBOURHOODS PAGE ---------- */
.hood-wrap{ max-width:1240px; margin:0 auto; padding:48px 56px 96px; }
.hood-grid{ display:grid; grid-template-columns:repeat(3, 1fr); gap:28px; }
.hood-card{ display:block; border:1px solid var(--line); border-radius:14px; overflow:hidden; background:var(--white); transition:border-color .15s, transform .15s; }
.hood-card:hover{ border-color:var(--black); transform:translateY(-2px); }
.hood-media{ height:190px; background-size:cover; background-position:center; }
.hood-body{ padding:18px 20px 22px; }
.hood-name{ font-size:18px; font-weight:700; }
.hood-count{ font-size:12.5px; font-weight:600; color:var(--green); margin-top:2px; }
.hood-teaser{ font-size:13.5px; line-height:1.55; color:var(--text-soft); margin-top:10px; }
.drop-menu a.drop-all{ font-weight:700; border-bottom:1px solid var(--line); border-radius:0; margin-bottom:4px; }
@media (max-width: 900px){
  .hood-wrap{ padding:32px 20px 64px; }
  .hood-grid{ grid-template-columns:1fr; gap:20px; }
}
.area-map{ max-width:1240px; margin:32px auto 0; padding:0 56px; }
.area-map iframe{ width:100%; height:340px; border:0; border-radius:14px; background:#e8ebef; display:block; }
@media (max-width:900px){ .area-map{ padding:0 16px; } .area-map iframe{ height:260px; } }

/* Book Hotel search mode */
.search-pill.is-hotel{ max-width:1020px; }
.s-field[hidden]{ display:none; }
.s-field.s-narrow{ flex:0 0 96px; }
.s-hint{ text-transform:none; letter-spacing:0; font-weight:500; color:var(--text-soft); }
.s-field input[type=date], .s-field input[type=number]{ min-height:22px; }
.booking-summary{ max-width:1240px; margin:0 auto; padding:20px 56px; border-bottom:1px solid var(--line); display:flex; gap:10px 22px; flex-wrap:wrap; align-items:center; font-size:14.5px; }
.booking-summary b{ font-weight:700; }
.booking-summary a{ text-decoration:underline; font-weight:600; margin-left:auto; }
.booking-error{ max-width:760px; margin:40px auto; padding:22px 26px; border:1px solid var(--line); border-radius:12px; }
.booking-error ul{ margin:10px 0 18px 20px; }
@media (max-width:900px){ .booking-summary{ padding:16px; } .s-field.s-narrow{ flex:1; } }

/* Hotel booking */
.hotel-card .hotel-book{ display:block; text-align:center; margin-top:14px; }
.hotel-card-link{ display:block; }
.book-wrap{ max-width:760px; margin:0 auto; padding:48px 24px 96px; }
.book-head h1{ font-size:30px; margin:4px 0 8px; }
.book-head p{ color:var(--text-soft); font-size:14.5px; margin-bottom:28px; }
.book-form h2{ font-size:16px; font-weight:700; margin:28px 0 12px; }
.book-form label{ display:block; font-size:12px; font-weight:600; color:var(--text-soft); text-transform:uppercase; letter-spacing:.03em; }
.book-form label small{ text-transform:none; letter-spacing:0; font-weight:500; }
.book-form input, .book-form select, .book-form textarea{ display:block; width:100%; margin-top:6px; padding:12px 14px; border:1px solid var(--line); border-radius:var(--btn-radius); font:inherit; font-size:15px; color:var(--black); background:#fff; text-transform:none; letter-spacing:0; font-weight:500; }
.book-form input:focus, .book-form select:focus, .book-form textarea:focus{ outline:none; border-color:var(--black); }
.book-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
.book-grid.two{ grid-template-columns:1fr 1fr; }
.book-full{ margin-top:14px; }
.book-actions{ display:flex; align-items:center; gap:22px; margin-top:28px; flex-wrap:wrap; }
.book-back{ font-size:14px; font-weight:600; text-decoration:underline; }
.hp-field{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
@media (max-width:700px){ .book-grid, .book-grid.two{ grid-template-columns:1fr 1fr; } }

/* Contact form (redone) */
.contact-body{ max-width:1100px; align-items:start; }
.contact-form{ border:1px solid var(--line); border-radius:14px; padding:32px; display:flex; flex-direction:column; gap:18px; background:#fff; }
.contact-form h2{ font-size:20px; font-weight:700; }
.contact-form label{ display:block; font-size:12px; font-weight:600; color:var(--text-soft); text-transform:uppercase; letter-spacing:.03em; }
.contact-form input, .contact-form textarea{ display:block; width:100%; margin-top:6px; padding:13px 14px; border:1px solid var(--line); border-radius:var(--btn-radius); font:inherit; font-size:15px; font-weight:500; color:var(--black); background:#fff; text-transform:none; letter-spacing:0; box-sizing:border-box; }
.contact-form textarea{ resize:vertical; min-height:140px; }
.contact-form input:focus, .contact-form textarea:focus{ outline:none; border-color:var(--black); }
.contact-form .cf-row{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.contact-form .btn-black{ align-self:flex-start; border:0; cursor:pointer; font:inherit; font-weight:600; }
@media (max-width:700px){ .contact-form{ padding:22px; } .contact-form .cf-row{ grid-template-columns:1fr; } }

/* Footer logo + contact links, static pages */
.footer-logo{ display:inline-block; margin-bottom:14px; }
.footer-logo img{ height:44px; width:auto; display:block; }
.footer-col a.fc-address{ line-height:1.6; margin-bottom:16px; }
.footer-col a.fc-line{ margin-bottom:8px; }
.footer-col a.fc-address:hover, .footer-col a.fc-line:hover{ color:var(--white); text-decoration:underline; text-underline-offset:3px; }
.static-page{ max-width:780px; margin:0 auto; padding:56px 24px 96px; }
.static-page h2{ font-size:20px; font-weight:700; margin:34px 0 10px; }
.static-page p, .static-page li{ font-size:15.5px; line-height:1.75; color:#2b2d33; margin-bottom:12px; }
.static-page ul{ margin:0 0 12px 22px; }
.static-page a{ text-decoration:underline; text-underline-offset:3px; }
.static-page .updated{ color:var(--text-soft); font-size:13.5px; }
.static-page .legal-note{ border:1px solid var(--line); border-radius:12px; padding:14px 18px; font-size:13.5px; color:var(--text-soft); margin-top:40px; }
/* Hotel search box on the hotels pages (sits under the banner) */
.hotel-search-wrap{ margin-top:-18px; margin-bottom:36px; }

/* Footer on tablets / phones: never wider than the screen */
footer{ overflow:hidden; }
.footer-logo img{ max-width:100%; }
@media (max-width:900px){
  footer{ padding:44px 20px 24px; }
  .footer-top{ grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:32px 24px; }
  .footer-brand{ grid-column:1 / -1; }
  .footer-brand p{ max-width:none; }
  .footer-logo img{ height:38px; }
  .footer-col a{ overflow-wrap:anywhere; }
  .footer-bottom{ flex-direction:column; gap:6px; }
}
@media (max-width:480px){
  .footer-top{ grid-template-columns:minmax(0,1fr); }
}

.filter-chips{ max-width:1240px; margin:0 auto; padding:16px 56px 0; display:flex; gap:8px 10px; flex-wrap:wrap; align-items:center; font-size:13.5px; color:var(--text-soft); }
.filter-chips b{ background:#f1f2f4; color:var(--black); font-weight:600; padding:6px 12px; border-radius:var(--pill-radius); }
.filter-chips a{ margin-left:6px; text-decoration:underline; font-weight:600; color:var(--black); }
@media (max-width:900px){ .filter-chips{ padding:14px 16px 0; } }

/* Homepage search: extra fields by building type */
.s-field.s-price{ flex:1.6; }
.price-inputs{ display:flex; align-items:center; gap:6px; }
.price-inputs select{ flex:0 0 52px; width:52px; }
.price-inputs input{ min-width:0; }
.price-inputs span{ color:var(--text-soft); }
@media (max-width:900px){ .s-field.s-price{ flex:1; } }
@media (max-width:900px){ .search-go{ flex-shrink:0; min-height:48px; } .search-fields{ gap:0; } }

/* Search box tabs centered */
.search-tabs{ justify-content:center; }

/* ---- Unit detail page + clickable unit rows ---- */
a.unit-row.unit-link{ color:inherit; text-decoration:none; transition:background .15s; }
a.unit-row.unit-link:hover{ background:#f5f5f3; }
a.unit-row.unit-link .unit-updated{ color:var(--black); font-weight:600; }
.unit-crumb{ margin:0 0 10px; font-size:13.5px; }
.unit-crumb a{ color:rgba(255,255,255,.8); }
.unit-crumb a:hover{ color:#fff; }
.unit-facts{ display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:12px; margin:24px 0 8px; }
.unit-fact{ border:1px solid var(--line); border-radius:12px; padding:14px 16px; display:flex; flex-direction:column; gap:4px; }
.unit-fact span{ font-size:11.5px; text-transform:uppercase; letter-spacing:.06em; color:var(--text-soft); font-weight:600; }
.unit-fact b{ font-size:16px; }
.unit-fact b.ok{ color:var(--green); }
.unit-fact b.off{ color:var(--text-soft); }
.unit-h{ font-size:20px; font-weight:800; margin:32px 0 12px; }
.unit-mini{ display:flex !important; flex-direction:column; gap:6px; font-size:12.5px; color:var(--text-soft); font-weight:600; margin:0; }
.unit-mini input, .unit-mini select{ width:100%; box-sizing:border-box; }
.enquiry-card select{ border:1px solid var(--line); border-radius:10px; padding:12px 14px; font-size:14px; font-family:inherit; background:#fff; }
.unit-details-link{ display:block; margin-top:6px; font-size:12px; font-weight:600; }
.unit-details-link.muted{ color:var(--text-soft); font-weight:400; }
.enquiry-card .booking-error{ padding:12px 14px; font-size:13px; line-height:1.45; }
.enquiry-card .booking-error ul{ margin:0; padding-left:18px; }
.group-jump{ display:flex; flex-wrap:wrap; gap:8px; margin:4px 0 8px; }
.group-jump a{ border:1px solid var(--line); border-radius:999px; padding:6px 14px; font-size:13px; font-weight:600; }
.group-jump a span{ color:var(--text-soft); font-weight:500; margin-left:4px; }
.group-title{ font-size:18px; font-weight:800; margin:32px 0 6px; display:flex; align-items:center; gap:10px; scroll-margin-top:20px; }
.group-count{ font-size:12px; font-weight:600; background:#f0f0ee; color:var(--text-soft); border-radius:999px; padding:2px 10px; }
.group-title ~ .admin-table{ table-layout:fixed; }
.group-title ~ .admin-table th:nth-child(1){ width:28%; }
.group-title ~ .admin-table th:nth-child(2){ width:17%; }
.group-title ~ .admin-table th:nth-child(3){ width:17%; }
.group-title ~ .admin-table th:nth-child(4){ width:13%; }
.group-title ~ .admin-table th:nth-child(5){ width:12%; }
.nav-badge{ display:inline-block; min-width:18px; padding:1px 6px; margin-left:4px; border-radius:999px; background:#d93025; color:#fff; font-size:11px; font-weight:700; line-height:16px; text-align:center; vertical-align:middle; }
.new-tag{ display:inline-block; background:#d93025; color:#fff; font-size:10.5px; font-weight:700; border-radius:4px; padding:1px 6px; margin-right:4px; }
.forum-wrap .map-section{ padding-left:0; padding-right:0; margin-top:0; }
.pager{ display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:8px; margin:40px auto 8px; }
.pager a, .pager span.on{ min-width:38px; height:38px; padding:0 12px; display:inline-flex; align-items:center; justify-content:center; border:1px solid var(--line); border-radius:var(--pill-radius); font-size:13.5px; font-weight:600; }
.pager a:hover{ border-color:var(--black); }
.pager span.on{ background:var(--black); color:var(--white); border-color:var(--black); }
.pager .pager-gap{ color:var(--text-soft); }
@media (max-width:600px){ .pager a, .pager span.on{ min-width:34px; height:34px; padding:0 9px; } }

/* Project details */
.proj-details{ margin:8px 0 36px; }
.proj-details h2{ font-size:24px; font-weight:800; margin:0 0 4px; }
.proj-units{ border-top:1px solid var(--line); }
.proj-units-row{ display:grid; grid-template-columns:2fr 1fr 1.6fr; gap:12px; padding:14px 4px; border-bottom:1px solid var(--line); font-size:15px; align-items:center; }
.proj-units-row.head{ font-size:11.5px; text-transform:uppercase; letter-spacing:.06em; color:var(--text-soft); font-weight:600; padding:10px 4px; }
.pu-type{ font-weight:700; }
.pu-price{ font-weight:700; }
.proj-note{ font-size:13.5px; color:var(--text-soft); margin:12px 0 0; }
@media (max-width:640px){ .proj-units-row{ grid-template-columns:1fr 1fr; row-gap:4px; } .proj-units-row.head{ display:none; } .pu-type{ grid-column:1 / -1; } }

/* Project video */
.proj-video{ margin:8px 0 36px; }
.proj-video h2{ font-size:24px; font-weight:800; margin:0 0 14px; }
.video-frame{ position:relative; padding-top:56.25%; border-radius:14px; overflow:hidden; background:#000; }
.video-frame iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; }
.video-link{ display:inline-block; margin-top:10px; font-size:13.5px; font-weight:600; }

/* Project enquiry modal */
.enq-modal{ margin:auto; border:0; border-radius:16px; padding:0; width:min(480px, calc(100% - 32px)); max-height:calc(100vh - 32px); }
.enq-modal::backdrop{ background:rgba(0,0,0,.55); }
.enq-form{ padding:28px 26px 26px; display:flex; flex-direction:column; gap:14px; position:relative; }
.enq-form h2{ font-size:22px; font-weight:800; margin:0; padding-right:28px; }
.enq-sub{ margin:0; color:var(--text-soft); font-size:14px; }
.enq-form label{ display:flex; flex-direction:column; gap:6px; font-size:13px; font-weight:600; }
.enq-form input[type=text], .enq-form input[type=email], .enq-form select, .enq-form textarea{ border:1px solid var(--line); border-radius:10px; padding:12px 14px; font-size:14px; font-family:inherit; background:#fff; width:100%; box-sizing:border-box; }
.enq-close{ position:absolute; top:12px; right:14px; background:none; border:0; font-size:28px; line-height:1; cursor:pointer; }
.enq-submit{ border:0; cursor:pointer; padding:14px; font-size:15px; }

/* Project page bar: login / logout buttons */
.forum-bar .bar-btn{ display:inline-block; border:1px solid var(--black); background:#fff; color:var(--black); padding:6px 14px; border-radius:var(--btn-radius); font-size:13.5px; font-weight:600; font-family:inherit; cursor:pointer; line-height:1.2; }
.forum-bar .bar-btn:hover{ background:var(--black); color:#fff; }
@media (max-width:640px){ .forum-bar-inner{ flex-wrap:wrap; gap:8px; } }