/* ===========================================================
   PERFECT BUILDERS — DESIGN SYSTEM (Light Theme)
   Palette:  --ink #121212 (near-black, dark bookend sections) / --bg #ffffff
             --panel #f7f7f7 (matches logo backdrop) / --panel-2 #f0eeec / --panel-3 #e4e1dd
             --gold #D9A94C (rich burgundy — borders/glows/icons)
             --gold-light #8C6A16 (deep wine, darker for AA-safe text on white)
             --paper #1a1a1a (body text) / --ash #6e6e6e (muted text)
   Type:     Display  "Fraunces"  (luxury slab-serif, editorial weight)
             Body     "Manrope"   (clean geometric sans)
             Utility  "Space Mono" (data / labels / coordinates)
   Signature: burgundy "survey-mark" corner brackets — a blueprint / theodolite
              viewport frame — on every image, card and hero, tying the
              luxury visuals back to the firm's engineering discipline.
   Dark bookends: topbar, header-on-scroll, hero/CTA photo overlays and the
   footer keep a near-black backdrop for contrast against the light body —
   each of those sections scopes --paper/--ash/--line locally to stay legible.
   =========================================================== */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,300;0,9..144,400;0,9..144,500;0,9..144,600;0,9..144,700;1,9..144,500&family=Manrope:wght@300;400;500;600;700;800&family=Space+Mono:wght@400;700&display=swap');

:root{
  --ink:#121212;
  --bg:#ffffff;
  --panel:#f7f7f7;
  --panel-2:#f0eeec;
  --panel-3:#e4e1dd;
  --gold:#D9A94C;
  --gold-light:#8C6A16;
  --gold-dim:rgba(217,169,76,.1);
  --gold-line:rgba(217,169,76,.35);
  --paper:#1a1a1a;
  --paper-dim:#4d4d4d;
  --ash:#6e6e6e;
  --ash-dim:#9b9b9b;
  --line:rgba(217,169,76,.18);
  --success:#2f9e44;
  --radius:14px;
  --radius-lg:26px;
  --maxw:1320px;
  --shadow-lg: 0 40px 80px -30px rgba(20,20,20,.18);
}

*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth; overflow-x:hidden; max-width:100%;}
body{
  background:var(--bg);
  color:var(--paper);
  font-family:'Manrope',sans-serif;
  font-weight:400;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%; display:block;}
a{color:inherit; text-decoration:none;}
ul{list-style:none;}
button{font-family:inherit; cursor:pointer;}
input,select,textarea{font-family:inherit;}

::selection{background:var(--gold); color:#fff;}
::-webkit-scrollbar{width:10px;}
::-webkit-scrollbar-track{background:var(--panel);}
::-webkit-scrollbar-thumb{background:var(--gold); border:3px solid var(--panel);}

a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible{
  outline:2px solid var(--gold-light);
  outline-offset:3px;
}

.wrap{max-width:var(--maxw); margin:0 auto; padding:0 40px;}

h1,h2,h3,h4{
  font-family:'Fraunces',serif;
  font-weight:500;
  letter-spacing:-.01em;
  color:var(--paper);
}
h1{font-size:clamp(2.6rem,5vw,4.6rem); line-height:1.03; font-weight:400;}
h2{font-size:clamp(2rem,3.4vw,3rem); line-height:1.08;}
h3{font-size:1.5rem; line-height:1.25;}
h4{font-size:1.15rem;}
.italic{font-style:italic; font-weight:500; color:var(--gold-light);}

/* ---------- HOME PAGE TYPE + ANIMATION OVERRIDES (index.html only) ----------
   Scoped to body.home (set only on index.html) rather than edited into the
   rules above — client wants to trial bolder/heavier type, slightly larger
   headings and light entrance animation on the home page first, then decide
   whether to roll it out site-wide. */
body.home{font-weight:500;}
body.home h1,body.home h2,body.home h3,body.home h4{font-weight:700;}
body.home h1{font-size:clamp(2.85rem,5.4vw,5rem);}
body.home h2{font-size:clamp(2.2rem,3.7vw,3.3rem);}
body.home h3{font-size:1.65rem;}
body.home h4{font-size:1.26rem;}
body.home .lede{font-weight:500;}

@keyframes homeFadeRise{
  from{opacity:0; transform:translateY(22px);}
  to{opacity:1; transform:translateY(0);}
}
body.home .hero-dark .hd-badge{animation:homeFadeRise .7s ease both;}
body.home .hero-dark h1{animation:homeFadeRise .9s .1s ease both;}
body.home .hero-dark .hd-lede{animation:homeFadeRise .9s .22s ease both;}
body.home .hero-dark .hd-search{animation:homeFadeRise .9s .34s ease both;}

.eyebrow{
  display:inline-flex; align-items:center; gap:10px;
  font-family:'Space Mono',monospace;
  font-size:.72rem; letter-spacing:.22em; text-transform:uppercase;
  color:var(--gold-light);
}
.eyebrow::before{content:''; width:22px; height:1px; background:var(--gold);}

.eyebrow-highlight{
  background:var(--gold-dim);
  border:1px solid var(--gold);
  border-radius:999px;
  padding:8px 20px;
}
.eyebrow-highlight::before{display:none;}

.lede{color:var(--ash); font-size:1.08rem; max-width:640px; line-height:1.75;}

/* ---------- SURVEY-MARK SIGNATURE FRAME (corner brackets disabled) ---------- */
.frame{position:relative;}
.frame::before,.frame::after,
.frame .fc-tl,.frame .fc-tr,.frame .fc-bl,.frame .fc-br{
  display:none;
}

/* ---------- BUTTONS ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  padding:15px 30px; font-size:.85rem; font-weight:700;
  letter-spacing:.04em; text-transform:uppercase; font-family:'Manrope',sans-serif;
  border-radius:999px; border:1px solid transparent; transition:.25s ease;
  white-space:nowrap;
}
.btn-gold{background:linear-gradient(135deg,var(--gold),var(--gold-light)); color:#1a1305;}
.btn-gold:hover{filter:brightness(1.1); transform:translateY(-1px);}
.btn-ghost{border-color:var(--gold-line); color:var(--paper);}
.btn-ghost:hover{background:var(--gold-dim); border-color:var(--gold);}
.btn-line{border-bottom:1px solid var(--gold); color:var(--gold-light); padding:6px 0; letter-spacing:.08em;}
.btn-sm{padding:10px 18px; font-size:.72rem;}
.btn-block{width:100%;}
.btn svg{width:16px; height:16px; stroke:currentColor; flex-shrink:0;}

/* ---------- TOPBAR ---------- */
.topbar{
  --ash:var(--gold);
  background:linear-gradient(180deg,#181818,var(--ink)); border-bottom:1px solid var(--line);
  font-family:'Space Mono',monospace; font-size:.72rem; font-weight:700; color:var(--ash);
}
.topbar .wrap{display:flex; justify-content:space-between; align-items:center; height:44px;}
.topbar a{color:var(--ash); transition:.2s;}
.topbar a:hover{color:#fff;}
.topbar .tb-left,.topbar .tb-right{display:flex; align-items:center; min-width:0;}
.topbar .tb-item{display:flex; align-items:center; gap:8px; white-space:nowrap;}
.topbar .tb-item+.tb-item{margin-left:28px; padding-left:28px; border-left:1px solid rgba(217,169,76,.22);}
.topbar .tb-ic{width:14px; height:14px; stroke:currentColor; flex-shrink:0;}
.topbar .tb-addr{min-width:0;}
.topbar .tb-addr-viewport{display:inline-block; overflow:hidden; max-width:clamp(140px,24vw,360px); white-space:nowrap; vertical-align:middle;}
.topbar .tb-addr-text{
  display:inline-block; white-space:nowrap;
  animation:tb-marquee var(--tb-marquee-dur,12s) ease-in-out infinite;
  animation-play-state:paused;
}
.topbar .tb-addr-text.tb-marquee-on{animation-play-state:running;}
@keyframes tb-marquee{
  0%,8%{transform:translateX(0);}
  50%{transform:translateX(var(--tb-scroll-dist,0px));}
  92%,100%{transform:translateX(0);}
}
@media(prefers-reduced-motion:reduce){
  .topbar .tb-addr-text{animation:none !important;}
}

/* ---------- NAV ---------- */
header.site{position:sticky; top:0; z-index:100; background:rgba(255,255,255,.86); backdrop-filter:blur(14px); border-bottom:1px solid var(--line);}
.nav{display:flex; align-items:center; justify-content:space-between; height:104px; gap:18px;}
.logo{display:flex; align-items:center; gap:14px; flex-shrink:0;}
.logo .mark{width:54px; height:54px; position:relative; display:flex; align-items:center; justify-content:center; flex-shrink:0;}
.logo .mark img{width:100%; height:100%; object-fit:contain;}
.logo .word{font-family:'Fraunces',serif; font-size:1.6rem; font-weight:700; letter-spacing:.02em; line-height:1.05;}
.logo .word b{color:var(--gold-light); font-weight:700; display:block; font-size:.66rem; letter-spacing:.28em; font-family:'Space Mono',monospace; margin-top:3px;}

.menu{display:flex; align-items:center; gap:2px; flex:1; justify-content:center;}
.menu>li{position:relative;}
.menu>li>a{
  display:flex; align-items:center; gap:6px; padding:16px 11px; white-space:nowrap;
  font-family:'Fraunces',serif; font-size:17px; font-weight:500; letter-spacing:-.01em;
  color:var(--paper); border-radius:var(--radius);
}
.menu>li>a .car{width:8px; height:8px; border-right:2px solid var(--ash); border-bottom:2px solid var(--ash); transform:rotate(45deg); margin-top:-3px; transition:.2s;}
.menu>li:hover>a{color:var(--gold-light);}
.menu>li:hover>a .car{border-color:var(--gold-light); transform:rotate(225deg); margin-top:2px;}
.menu>li.current>a{color:var(--gold-light);}

/* desktop-only: dropdown as a hover-revealed absolute overlay (mobile uses a static accordion — see ≤1180px block). Must stay in sync with the nav-drawer breakpoint and js/main.js's mq, or hover-dropdown positioning leaks into the mobile accordion (this happened once with the old 860px pair, see CLAUDE.md). */
@media(min-width:1181px){
  .dropdown{
    position:absolute; top:100%; left:50%;
    transform:translateX(-50%) translateY(6px) scale(.97); transform-origin:top center;
    min-width:250px; background:#fff; border:1px solid var(--line); border-top:2px solid var(--gold); border-radius:var(--radius);
    padding:10px; opacity:0; visibility:hidden;
    transition:opacity .3s ease, transform .4s cubic-bezier(.22,1,.36,1), visibility .3s;
    box-shadow:var(--shadow-lg);
  }
  .menu>li:hover .dropdown{opacity:1; visibility:visible; transform:translateX(-50%) translateY(0) scale(1);}
  .dropdown>*{opacity:0; transform:translateY(6px); transition:opacity .28s ease, transform .28s ease;}
  .menu>li:hover .dropdown>*{opacity:1; transform:translateY(0);}
  .dropdown>*:nth-child(1){transition-delay:.03s;}
  .dropdown>*:nth-child(2){transition-delay:.06s;}
  .dropdown>*:nth-child(3){transition-delay:.09s;}
  .dropdown>*:nth-child(4){transition-delay:.12s;}
  .dropdown>*:nth-child(5){transition-delay:.15s;}
  .dropdown>*:nth-child(6){transition-delay:.18s;}
  .dd-flyout-item{position:relative;}
  .dd-flyout-item .flyout{
    position:absolute; top:0; left:100%; margin-left:8px;
    min-width:220px; background:#fff; border:1px solid var(--line); border-radius:var(--radius);
    padding:10px; opacity:0; visibility:hidden; transform:translateX(-8px); transition:.2s ease; box-shadow:var(--shadow-lg);
  }
  .dd-flyout-item:hover > .flyout{opacity:1; visibility:visible; transform:translateX(0);}
  .dd-flyout-item .flyout>*{opacity:0; transform:translateY(4px); transition:opacity .22s ease, transform .22s ease;}
  .dd-flyout-item:hover > .flyout>*{opacity:1; transform:translateY(0);}
  .dd-flyout-item .flyout>*:nth-child(1){transition-delay:.03s;}
  .dd-flyout-item .flyout>*:nth-child(2){transition-delay:.06s;}
  .dd-flyout-item .flyout>*:nth-child(3){transition-delay:.09s;}
  .dd-flyout-item .flyout>*:nth-child(4){transition-delay:.12s;}
  .dd-flyout-item .flyout>*:nth-child(5){transition-delay:.15s;}
  .dd-flyout-item .flyout>*:nth-child(6){transition-delay:.18s;}

  /* sliding nav indicator — a soft gold rounded-rect that glides between top-level items on hover.
     border-radius uses the site's standard --radius (not a full pill) deliberately: a pill radius
     on a short single-word item like "Blog" ends up nearly as tall as it is wide and renders as a
     circle, which read as a stray dot rather than an indicator — fixed by capping the radius. */
  .wrap.nav{position:relative;}
  .menu>li{z-index:1;}
  .nav-indicator{
    position:absolute; top:50%; left:0; z-index:0;
    background:linear-gradient(135deg, rgba(255,255,255,.55), rgba(217,169,76,.2));
    backdrop-filter:blur(12px) saturate(180%); -webkit-backdrop-filter:blur(12px) saturate(180%);
    border:1px solid rgba(217,169,76,.45); border-radius:var(--radius);
    box-shadow:0 10px 30px -12px rgba(140,106,22,.35), inset 0 1px 1px rgba(255,255,255,.65);
    opacity:0; transition:transform .45s cubic-bezier(.22,1,.36,1), width .45s cubic-bezier(.22,1,.36,1), height .3s ease, opacity .25s ease;
    pointer-events:none;
  }
  .nav-indicator.on{opacity:1;}

  /* header compacts slightly once scrolled, for a bit of scroll-driven motion beyond the shadow/bg fade */
  .nav{transition:height .35s cubic-bezier(.4,0,.2,1);}
  header.site.scrolled .nav{height:84px;}
}
/* between the nav-drawer breakpoint (≤1180px) and ~1280px, the full horizontal
   menu (8 items) is back but still doesn't have room for the phone pill too —
   drop just that one redundant element (still reachable via the drawer just
   below, the topbar, and the WhatsApp button) rather than shrinking text further */
@media(min-width:1181px) and (max-width:1280px){
  .nav-cta .nav-phone{display:none;}
}
.dropdown a{display:block; padding:11px 14px; font-size:.84rem; color:var(--ash); border-radius:var(--radius);}
.dropdown a:hover{background:var(--gold-dim); color:var(--gold-light);}
.dropdown .dd-note{font-family:'Space Mono',monospace; font-size:.6rem; letter-spacing:.15em; color:var(--ash-dim); padding:8px 14px 4px; text-transform:uppercase;}
.dropdown.wide{min-width:560px; display:grid; grid-template-columns:1fr 1fr; gap:4px;}
.dd-flyout-item>a{display:flex; align-items:center; justify-content:space-between; gap:10px;}
.dd-flyout-item .flyout-car{color:var(--ash-dim); font-family:'Space Mono',monospace; flex-shrink:0;}

.nav-cta{display:flex; align-items:center; gap:10px; flex-shrink:0;}
.menu-cta{display:none;}
.nav-phone{display:flex; align-items:center; gap:8px; padding:9px 13px; border:1px solid var(--line); font-size:.76rem; font-weight:600; font-family:'Space Mono',monospace; white-space:nowrap;}
.nav-cta .btn{padding:10px 18px; font-size:.68rem; white-space:nowrap;}
.nav-burger{display:none; position:relative; z-index:160; flex-direction:column; justify-content:center; align-items:center; gap:5px; width:44px; height:44px; border:1px solid var(--line); border-radius:var(--radius); background:transparent; flex-shrink:0; padding:0;}
.nav-burger span{display:block; width:20px; height:2px; background:var(--paper); border-radius:2px; transition:transform .3s ease, opacity .3s ease;}
header.site.nav-open .nav-burger span:nth-child(1){transform:translateY(7px) rotate(45deg);}
header.site.nav-open .nav-burger span:nth-child(2){opacity:0;}
header.site.nav-open .nav-burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
.nav-backdrop{position:fixed; inset:0; z-index:140; background:rgba(10,10,10,.5); backdrop-filter:blur(2px); opacity:0; visibility:hidden; transition:opacity .3s ease, visibility .3s ease;}
header.site.nav-open .nav-backdrop{opacity:1; visibility:visible;}
body.no-scroll{overflow:hidden;}
body.no-scroll .whatsapp-fab{display:none;}
body.no-scroll .social-fab-stack{display:none;}

/* ---------- HERO / PAGE-HERO (inner pages) ---------- */
.hero{position:relative; min-height:92vh; display:flex; align-items:flex-end; overflow:hidden;}
.hero-bg{position:absolute; inset:0; z-index:0;}
.hero-bg img{width:100%; height:100%; object-fit:cover;}
.hero-bg.slider img{position:absolute; inset:0; opacity:0; transition:opacity 1.6s ease;}
.hero-bg.slider img.on{opacity:1;}
.hero-scrim{position:absolute; inset:0; z-index:1; background:linear-gradient(120deg, rgba(8,8,11,.88) 0%, rgba(10,9,10,.7) 42%, rgba(38,23,10,.42) 72%, rgba(8,8,11,.6) 100%);}
.hero-scrim.side{background:linear-gradient(90deg,var(--ink) 0%,rgba(8,8,11,.75) 30%,rgba(8,8,11,.25) 60%,rgba(8,8,11,.55) 100%);}
.hero-content{position:relative; z-index:2; padding:0 0 70px;}
.hero-badge{display:inline-flex; align-items:center; gap:8px; padding:9px 20px; border:1px solid rgba(217,169,76,.4); background:rgba(217,169,76,.12); border-radius:999px; font-family:'Space Mono',monospace; font-size:.7rem; letter-spacing:.18em; text-transform:uppercase; color:var(--gold); margin-bottom:26px;}
.hero h1{max-width:820px; margin-bottom:20px; color:#fff; text-shadow:0 6px 30px rgba(0,0,0,.5);}
.hero .lede{color:rgba(255,255,255,.8); font-size:1.15rem; max-width:560px; margin-bottom:34px;}
.page-hero{min-height:52vh; align-items:center; padding-top:60px;}
.page-hero .hero-content{padding-bottom:0;}
.crumbs{font-family:'Space Mono',monospace; font-size:.72rem; color:rgba(255,255,255,.55); letter-spacing:.05em; margin-bottom:22px;}
.crumbs a{color:rgba(255,255,255,.55);} .crumbs a:hover{color:var(--gold);}
.crumbs span{color:var(--gold);}

/* ---------- DARK GOLD HERO (homepage) ---------- */
.hero-dark{
  --hd-gold:#D9A94C; --hd-gold-light:#F0C868; --hd-dark:#0A0C10; --hd-panel:rgba(18,20,26,.55); --hd-line:rgba(217,169,76,.28);
  position:relative; overflow:hidden; display:flex; align-items:center; padding:130px 0 56px;
}
.hero-dark .hero-bg{position:absolute; inset:0; z-index:0;}
.hero-dark .hero-bg img{width:100%; height:100%; object-fit:cover;}
.hero-dark-scrim{position:absolute; inset:0; z-index:1; background:linear-gradient(115deg, rgba(6,7,10,.92) 0%, rgba(10,8,10,.72) 38%, rgba(40,24,10,.35) 65%, rgba(10,8,10,.55) 100%);}
.hero-dark-content{position:relative; z-index:2; width:100%;}
.hd-grid{display:grid; grid-template-columns:1.55fr .95fr; gap:50px; align-items:start;}

.hd-badge{display:inline-flex; align-items:center; gap:8px; padding:8px 18px; border:1px solid var(--hd-line); background:rgba(217,169,76,.1); border-radius:999px; font-family:'Space Mono',monospace; font-size:.68rem; letter-spacing:.16em; text-transform:uppercase; color:var(--hd-gold); margin-bottom:20px;}
.hd-text h1{font-family:'Fraunces',serif; font-weight:400; font-size:clamp(2.2rem,3.8vw,3.4rem); line-height:1.08; color:#fff; margin-bottom:16px; text-shadow:0 8px 30px rgba(0,0,0,.5);}
.hd-gold{color:var(--hd-gold);}
.hd-lede{color:rgba(255,255,255,.78); font-size:1rem; line-height:1.65; max-width:520px; margin-bottom:26px;}

.hd-search{
  background:var(--hd-panel); backdrop-filter:blur(22px) saturate(1.3); -webkit-backdrop-filter:blur(22px) saturate(1.3);
  border:1px solid var(--hd-line); border-radius:20px; padding:22px 24px;
  box-shadow:0 30px 70px -30px rgba(0,0,0,.6), inset 0 1px 0 rgba(255,255,255,.06);
}
.hd-tabs{display:flex; gap:24px; margin-bottom:16px; border-bottom:1px solid rgba(255,255,255,.12); padding-bottom:0;}
.hd-tabs a{font-size:.85rem; font-weight:700; color:rgba(255,255,255,.55); padding-bottom:12px; border-bottom:2px solid transparent;}
.hd-tabs a.on{color:var(--hd-gold); border-color:var(--hd-gold);}
.hd-fields{display:grid; grid-template-columns:repeat(4,1fr) auto; gap:12px; align-items:end;}
.hd-field label{display:block; font-family:'Space Mono',monospace; font-size:.62rem; letter-spacing:.1em; text-transform:uppercase; color:rgba(255,255,255,.5); margin-bottom:7px;}
.hd-field select{width:100%; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.16); color:#fff; padding:11px 12px; font-size:.85rem; border-radius:10px;}
.hd-field select option{color:#1a1305; background:#fff;}
.hd-search-btn{
  display:flex; align-items:center; justify-content:center; gap:8px; white-space:nowrap;
  background:linear-gradient(135deg,var(--hd-gold-light),var(--hd-gold)); color:#1a1305; font-weight:700; font-size:.82rem;
  border:none; border-radius:10px; padding:12px 22px; letter-spacing:.02em; box-shadow:0 10px 26px -8px rgba(217,169,76,.5);
}
.hd-search-btn svg{width:16px; height:16px; stroke:#1a1305;}
.hd-popular{display:flex; align-items:center; gap:10px; margin-top:16px; flex-wrap:wrap; font-size:.76rem; color:rgba(255,255,255,.55);}
.hd-pill{padding:6px 13px; border:1px solid rgba(255,255,255,.18); border-radius:30px; font-size:.74rem; color:rgba(255,255,255,.75);}

.hd-side{
  background:var(--hd-panel); backdrop-filter:blur(22px) saturate(1.3); -webkit-backdrop-filter:blur(22px) saturate(1.3);
  border:1px solid var(--hd-line); border-radius:20px; padding:28px;
  box-shadow:0 30px 70px -30px rgba(0,0,0,.6), inset 0 1px 0 rgba(255,255,255,.06);
}
.hd-side h3{font-family:'Fraunces',serif; font-size:1.2rem; color:var(--hd-gold); font-weight:600; margin-bottom:18px;}
.hd-why{display:flex; flex-direction:column; gap:16px;}
.hd-why li{display:flex; gap:12px; align-items:flex-start;}
.hd-ficon{width:34px; height:34px; border:1px solid var(--hd-line); border-radius:10px; display:flex; align-items:center; justify-content:center; flex-shrink:0;}
.hd-ficon svg{width:16px; height:16px; stroke:var(--hd-gold);}
.hd-why b{display:block; font-size:.88rem; color:#fff;}
.hd-why span{font-size:.76rem; color:rgba(255,255,255,.55);}
.hd-divider{height:1px; background:rgba(255,255,255,.12); margin:22px 0 16px;}
.hd-expert-label{font-family:'Space Mono',monospace; font-size:.66rem; letter-spacing:.12em; text-transform:uppercase; color:var(--hd-gold); margin-bottom:6px;}
.hd-phone{font-family:'Fraunces',serif; font-size:1.3rem; color:#fff; font-weight:600;}
.hd-hours{font-size:.78rem; color:rgba(255,255,255,.5); margin-bottom:18px;}
.hd-enquire{display:flex; align-items:center; justify-content:center; gap:8px; width:100%; padding:13px; background:linear-gradient(135deg,var(--hd-gold-light),var(--hd-gold)); color:#1a1305; font-weight:700; font-size:.82rem; text-transform:uppercase; letter-spacing:.04em; border-radius:10px; box-shadow:0 10px 26px -8px rgba(217,169,76,.5); transition:transform .25s ease;}
.hd-enquire:hover{transform:translateY(-2px);}
.hd-enquire svg{width:15px; height:15px; stroke:#1a1305;}

/* ---------- DARK STATS STRIP ---------- */
.hd-stats{
  background-color:#fdfaf4;
  background-image:radial-gradient(ellipse 700px 400px at 15% 0%, rgba(217,169,76,.1), transparent 60%), radial-gradient(ellipse 700px 400px at 85% 100%, rgba(217,169,76,.08), transparent 60%);
  padding:56px 0;
}
.hd-stats-row{display:grid; grid-template-columns:repeat(5,1fr); gap:20px; padding:0 40px;}
.hd-stat{
  display:flex; align-items:center; gap:14px; padding:26px 22px;
  background:linear-gradient(160deg, #fff 0%, #fdf8ee 100%);
  border:1px solid var(--gold-line); border-radius:var(--radius-lg);
  box-shadow:0 2px 4px rgba(20,20,20,.03), 0 20px 40px -24px rgba(20,20,20,.18), 0 0 0 1px rgba(217,169,76,.06), inset 0 1px 0 rgba(255,255,255,.9);
  transition:transform .3s ease, box-shadow .3s ease;
}
.hd-stat:hover{
  transform:translateY(-5px);
  box-shadow:0 2px 4px rgba(20,20,20,.04), 0 30px 55px -24px rgba(217,169,76,.35), 0 0 0 1px rgba(217,169,76,.15), inset 0 1px 0 rgba(255,255,255,.9);
}
.hd-stat .ficon-wrap{width:48px; height:48px; border-radius:50%; background:var(--gold-dim); display:flex; align-items:center; justify-content:center; flex-shrink:0;}
.hd-stat svg{width:24px; height:24px; stroke:var(--gold); flex-shrink:0;}
.hd-stat b{display:block; font-family:'Fraunces',serif; font-size:1.5rem; color:var(--paper); font-weight:500;}
.hd-stat span{font-size:.76rem; color:var(--ash);}

/* ---------- COLLAGE HERO (homepage) ---------- */
.hero-collage{
  padding:18px 0 24px; overflow:hidden; position:relative;
  background-color:#fefbfc;
  background-image:
    radial-gradient(ellipse 900px 520px at 12% 0%, rgba(217,169,76,.1), transparent 60%),
    radial-gradient(ellipse 700px 500px at 92% 20%, rgba(140,106,22,.08), transparent 55%),
    url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20width%3D%2756%27%20height%3D%2756%27%3E%3Cpath%20d%3D%27M56%200H0V56%27%20fill%3D%27none%27%20stroke%3D%27rgba%28222%2C14%2C110%2C0.13%29%27%20stroke-width%3D%271%27/%3E%3C/svg%3E"),
    linear-gradient(180deg, #fdf6f9 0%, #fefbfc 55%, var(--bg) 100%);
  background-repeat:no-repeat, no-repeat, repeat, no-repeat;
  background-size:auto, auto, 56px 56px, auto;
}
.hcl-grid{display:grid; grid-template-columns:1fr .9fr; gap:44px; align-items:center;}
.hcl-text h1{margin-bottom:14px; max-width:560px; font-size:clamp(2rem,3.4vw,3.1rem);}
.hcl-text .hero-badge{margin-bottom:14px;}
.hcl-text .lede{margin-bottom:0; font-size:1rem;}
.hcl-text .cta-row{margin-top:20px !important;}
.hcl-trust{display:flex; align-items:center; gap:12px; margin-top:16px; font-size:.82rem; color:var(--ash); flex-wrap:wrap;}
.hcl-stars{color:var(--gold); letter-spacing:2px;}
.hcl-trust b{color:var(--paper); font-family:'Fraunces',serif;}

.hcl-media{position:relative; min-height:260px;}
.hcl-blob{position:absolute; top:-40px; right:-40px; width:300px; height:300px; border-radius:50%; background:radial-gradient(circle,rgba(217,169,76,.16),transparent 68%); filter:blur(10px); z-index:0;}
.hcl-photo{position:relative; z-index:2; overflow:hidden; border-radius:var(--radius-lg); box-shadow:0 30px 60px -24px rgba(20,20,20,.3);}
.hcl-photo img{width:100%; height:100%; object-fit:cover; display:block;}
.hcl-photo-main{width:82%; height:244px;}
.hcl-photo-sub{position:absolute; right:0; bottom:-30px; width:52%; height:140px; z-index:3; border:5px solid #fff;}
.hcl-chip{left:-10px; bottom:14px; z-index:4; padding:14px 18px !important;}
.hcl-chip .num{font-size:1.5rem !important;}
.hcl-float-badge{position:absolute; top:14px; left:14px; z-index:4; background:rgba(255,255,255,.92); backdrop-filter:blur(10px); border:1px solid rgba(255,255,255,.9); border-radius:999px; padding:7px 14px; font-family:'Space Mono',monospace; font-size:.64rem; letter-spacing:.08em; color:var(--gold-light); box-shadow:0 14px 30px -14px rgba(20,20,20,.3);}

.hcl-search{margin:18px auto 0; max-width:980px; text-align:left;}
.search-panel{
  position:relative; z-index:2; overflow:hidden;
  background:linear-gradient(160deg, rgba(255,255,255,.92) 0%, rgba(255,255,255,.68) 100%);
  backdrop-filter:blur(30px) saturate(1.6); -webkit-backdrop-filter:blur(30px) saturate(1.6);
  border:1.5px solid rgba(255,255,255,.95);
  border-radius:28px;
  padding:24px 28px;
  text-align:left;
  box-shadow:
    0 2px 4px rgba(20,20,20,.04),
    0 24px 48px -16px rgba(20,20,20,.2),
    0 60px 120px -40px rgba(140,106,22,.3),
    0 0 0 1px rgba(217,169,76,.08),
    inset 0 1.5px 0 rgba(255,255,255,.95),
    inset 0 -1px 0 rgba(255,255,255,.25);
  transform:perspective(1400px) rotateX(1.2deg);
  transition:transform .4s ease, box-shadow .4s ease;
}
.search-panel:hover{
  transform:perspective(1400px) rotateX(0deg) translateY(-3px);
  box-shadow:
    0 2px 4px rgba(20,20,20,.04),
    0 30px 60px -16px rgba(20,20,20,.24),
    0 70px 140px -40px rgba(140,106,22,.36),
    0 0 0 1px rgba(217,169,76,.1),
    inset 0 1.5px 0 rgba(255,255,255,.95),
    inset 0 -1px 0 rgba(255,255,255,.25);
}
.search-panel::before{
  content:''; position:absolute; inset:0; z-index:0; pointer-events:none;
  background:linear-gradient(180deg, rgba(255,255,255,.55) 0%, transparent 45%);
}
.search-panel::after{
  content:''; position:absolute; top:-40%; left:-10%; width:60%; height:80%; z-index:0; pointer-events:none;
  background:radial-gradient(ellipse, rgba(217,169,76,.14), transparent 70%);
  filter:blur(20px);
}
.search-panel>*{position:relative; z-index:1;}

/* ---------- WHY-CHOOSE-US GRID ---------- */
.why-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:24px; list-style:none;}
.why-grid li{background:#fff; border:1px solid var(--line); border-radius:var(--radius-lg); padding:30px 26px; transition:transform .3s ease, box-shadow .3s ease, border-color .3s ease;}
.why-grid li:hover{transform:translateY(-4px); border-color:var(--gold-line); box-shadow:0 30px 60px -30px rgba(20,20,20,.18);}
.why-grid .ficon{width:44px; height:44px; border:1px solid var(--gold-line); background:var(--gold-dim); display:flex; align-items:center; justify-content:center; border-radius:var(--radius); margin-bottom:18px;}
.why-grid .ficon svg{width:20px; height:20px; stroke:var(--gold-light);}
.why-grid b{display:block; font-size:1rem; margin-bottom:6px;}
.why-grid span{font-size:.85rem; color:var(--ash);}
.search-tabs{display:flex; gap:26px; margin-bottom:14px; border-bottom:1px solid var(--line); padding-bottom:0;}
.search-tabs a{font-size:.86rem; font-weight:700; color:var(--ash); padding-bottom:14px; border-bottom:2px solid transparent;}
.search-tabs a.on{color:var(--gold-light); border-color:var(--gold);}
.search-grid{display:grid; grid-template-columns:repeat(4,1fr) auto; gap:14px; align-items:end;}
.field label{display:block; font-family:'Space Mono',monospace; font-size:.65rem; letter-spacing:.12em; text-transform:uppercase; color:var(--ash); margin-bottom:8px;}
.field select,.field input{width:100%; background:rgba(255,255,255,.9); border:1px solid var(--line); color:#1a1a1a; padding:12px 14px; font-size:.88rem; border-radius:var(--radius);}
.popular{display:flex; align-items:center; gap:10px; margin-top:12px; flex-wrap:wrap; font-size:.78rem; color:var(--ash);}
.pill{padding:7px 14px; border:1px solid var(--line); border-radius:30px; font-size:.76rem; color:var(--paper-dim);}
.pill:hover{border-color:var(--gold); color:var(--gold-light);}

/* ---------- STATS STRIP ---------- */
.stats{border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:var(--panel);}
.stats .wrap{display:grid; grid-template-columns:repeat(5,1fr); padding:38px 40px;}
.stats.stats-4 .wrap{grid-template-columns:repeat(4,1fr);}
.stat{display:flex; align-items:center; gap:16px; border-left:1px solid var(--line); padding-left:24px;}
.stat:first-child{border-left:none; padding-left:0;}
.stat .num{font-family:'Fraunces',serif; font-size:2rem; color:var(--gold-light); font-weight:500;}
.stat .lbl{font-size:.78rem; color:var(--ash); margin-top:2px;}
.stat svg{flex-shrink:0; width:34px; height:34px; stroke:var(--gold);}

/* ---------- SECTIONS ---------- */
section{padding:110px 0;}
.section-head{display:flex; flex-direction:column; align-items:center; text-align:center; margin:0 auto 56px; gap:22px; max-width:720px;}
.on-panel{background:var(--panel);}
.on-panel-2{background:var(--panel-2);}
.tight{padding:70px 0;}

/* ---------- LOCATIONS: left filter sidebar (locations.html) ---------- */
.loc-explorer{padding:70px 0 110px;}
.loc-layout{display:flex; align-items:flex-start; gap:56px;}
.loc-sidebar{flex:0 0 240px; width:240px; position:sticky; top:130px;}
.loc-sidebar-label{display:flex; align-items:center; gap:9px; font-family:'Space Mono',monospace; font-size:.7rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--gold-light); margin:0 0 16px 18px;}
.loc-sidebar-label::before{content:''; width:18px; height:1px; background:var(--gold); flex:0 0 auto;}
.loc-sidebar-label-2{margin-top:28px; padding-top:24px; border-top:1px solid var(--line);}
.loc-tabs{display:flex; flex-direction:column; gap:6px;}
.loc-tab{display:flex; align-items:center; justify-content:space-between; gap:10px; width:100%; text-align:left; padding:13px 18px; border-radius:12px; border:1px solid transparent; background:transparent; color:var(--ash); font-family:'Manrope',sans-serif; font-size:.92rem; font-weight:600; cursor:pointer; transition:background .25s ease, border-color .25s ease, color .25s ease;}
.loc-tab:hover{background:var(--panel); color:var(--paper);}
.loc-tab.on{background:var(--gold-dim); border-color:var(--gold-line); color:var(--gold-light);}
.loc-tab .loc-count{flex:0 0 auto; font-family:'Space Mono',monospace; font-size:.7rem; color:var(--ash-dim); background:var(--panel-2); padding:2px 9px; border-radius:20px;}
.loc-tab.on .loc-count{background:var(--gold); color:#fff;}
.loc-content{flex:1; min-width:0;}
.loc-panel{padding-bottom:100px; scroll-margin-top:140px;}
.loc-panel:last-child{padding-bottom:0;}
.loc-hide{display:none;}

@media(max-width:1180px){
  .loc-layout{gap:34px;}
  .loc-sidebar{flex:0 0 200px; width:200px; top:104px;}
  .loc-panel{scroll-margin-top:110px;}
}
@media(max-width:860px){
  .loc-layout{flex-direction:column; gap:0;}
  .loc-sidebar{position:sticky; top:0; z-index:20; width:100%; flex:1 1 auto; background:rgba(255,255,255,.94); backdrop-filter:blur(10px); margin:0 -20px 36px; padding:14px 20px; border-bottom:1px solid var(--line);}
  .loc-sidebar-inner{max-width:100%;}
  .loc-sidebar-label{margin-left:2px;}
  .loc-sidebar-label-2{margin-top:14px; padding-top:14px;}
  .loc-tabs{flex-direction:row; flex-wrap:nowrap; overflow-x:auto; gap:10px; padding-bottom:2px; -webkit-overflow-scrolling:touch;}
  .loc-tab{flex:0 0 auto; width:auto; white-space:nowrap; padding:10px 16px; border:1px solid var(--line);}
  .loc-panel{padding-bottom:70px; scroll-margin-top:96px;}
}
@media(max-width:480px){
  .loc-sidebar{margin:0 -18px 28px; padding:12px 18px;}
  .loc-panel{padding-bottom:54px;}
}

/* Anchor targets for nav deep links (Projects submenu + top-level "Projects" link,
   apartments-villas.html) that jump straight to the content section past the
   page-hero, same pattern as .loc-panel above. */
#ready-to-go, #ongoing-projects, #completed-projects, #apartments-villas, #projects-listing{scroll-margin-top:140px;}
@media(max-width:1180px){
  #ready-to-go, #ongoing-projects, #completed-projects, #apartments-villas, #projects-listing{scroll-margin-top:110px;}
}
@media(max-width:860px){
  #ready-to-go, #ongoing-projects, #completed-projects, #apartments-villas, #projects-listing{scroll-margin-top:96px;}
}

/* ---------- CARDS: PROJECTS ---------- */
.grid-4{display:grid; grid-template-columns:repeat(4,1fr); gap:26px;}
.grid-3{display:grid; grid-template-columns:repeat(3,1fr); gap:30px;}
.grid-2{display:grid; grid-template-columns:1fr 1fr; gap:30px;}

/* ---------- FEATURED PROJECTS: 2 large + horizontal scroll ---------- */
.fp-large{margin-bottom:34px;}
.pcard.fp-big .pimg{height:500px;}
.pcard.fp-big h4{font-size:1.5rem;}
.pcard.fp-big .pmeta{font-size:.88rem;}
.pcard.fp-big .price{font-size:1.6rem;}

.fp-scroll{overflow-x:auto; margin:0 -40px; padding:0 40px 14px; scrollbar-width:thin;}
.fp-scroll-track{display:flex; gap:22px; scroll-snap-type:x proximity;}
.pcard.fp-sm{flex:0 0 300px; scroll-snap-align:start;}
.pcard.fp-sm .pimg{height:200px;}

/* ---------- EXCLUSIVE UNIT SHOWCASE (section hidden 2026-08-03, rules kept for restore) ---------- */
.exclusive-unit{padding:110px 0; background:linear-gradient(180deg,#fdf8ee 0%,#fff 100%);}
.eu-grid{display:grid; grid-template-columns:1.05fr .95fr; gap:70px; align-items:center;}
.eu-media{position:relative; overflow:hidden; border-radius:var(--radius-lg); box-shadow:0 50px 100px -40px rgba(20,20,20,.35); background:var(--panel);}
.eu-media img{width:100%; height:620px; object-fit:contain; display:block;}
.eu-badge{position:absolute; top:24px; left:24px; z-index:4; background:linear-gradient(135deg,var(--gold),var(--gold-light)); color:#1a1305; font-weight:700; font-family:'Space Mono',monospace; font-size:.7rem; letter-spacing:.1em; text-transform:uppercase; padding:9px 18px; border-radius:999px; box-shadow:0 14px 30px -12px rgba(217,169,76,.6);}
.eu-text h2{margin-bottom:18px;}
.eu-specs{display:grid; grid-template-columns:1fr 1fr; gap:22px; margin:30px 0 34px; padding:26px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line);}
.eu-specs li{list-style:none;}
.eu-specs b{display:block; font-family:'Fraunces',serif; font-size:1.3rem; color:var(--paper);}
.eu-specs span{font-size:.8rem; color:var(--ash);}

.pcard{background:#fff; border:1px solid var(--line); border-radius:var(--radius-lg); overflow:hidden; transition:.3s ease; position:relative;}
.pcard:hover{border-color:var(--gold-line); transform:translateY(-4px); box-shadow:var(--shadow-lg);}
.pcard-clickable{cursor:pointer;}
.pcard .pimg{position:relative; height:230px; overflow:hidden; background:var(--panel);}
.pcard .pimg img{width:100%; height:100%; object-fit:contain; transition:.5s ease;}
.pcard:hover .pimg img{transform:scale(1.06);}
.tag{position:absolute; top:16px; left:16px; z-index:4; padding:6px 13px; font-family:'Space Mono',monospace; font-size:.62rem; letter-spacing:.1em; text-transform:uppercase; border-radius:999px;}
.tag.uc{background:rgba(217,169,76,.92); color:#fff;}
.tag.rtm{background:rgba(127,174,122,.92); color:#0c1a0b;}
.tag.nl{background:rgba(140,106,22,.94); color:#fff;}
.tag.fin{background:rgba(198,190,174,.92); color:#050505;}
.pcard .pbody{padding:22px;}
.pcard .ploc{display:flex; align-items:center; gap:6px; font-size:.76rem; color:var(--gold-light); margin-bottom:8px; font-family:'Space Mono',monospace; letter-spacing:.03em;}
.pcard h4{margin-bottom:6px;}
.pcard .pmeta{font-size:.8rem; color:var(--ash); margin-bottom:16px;}
.pcard .pfoot{display:flex; justify-content:space-between; align-items:flex-end; border-top:1px solid var(--line); padding-top:14px;}
.pcard .price{font-family:'Fraunces',serif; font-size:1.28rem; color:var(--gold-light);}
.pcard .price small{display:block; font-family:'Manrope',sans-serif; font-size:.68rem; color:var(--ash); font-weight:600;}

.p-specs{display:grid; grid-template-columns:repeat(2,1fr); gap:14px 20px; margin:16px 0 18px; padding-top:16px; border-top:1px solid var(--line);}
.p-specs div b{display:block; color:var(--paper); font-family:'Fraunces',serif; font-size:.94rem; font-weight:500;}
.p-specs div span{display:block; color:var(--ash); font-size:.66rem; text-transform:uppercase; letter-spacing:.05em; margin-top:2px;}
.pcard .pfoot-multi{display:flex; justify-content:space-between; align-items:center; border-top:1px solid var(--line); padding-top:14px; gap:12px;}
.pcard .pfoot-multi .price{font-family:'Fraunces',serif; font-size:1.28rem; color:var(--gold-light);}
.pcard .pfoot-multi .plinks{display:flex; gap:16px;}

/* ---------- WHY / FEATURE PANEL ---------- */
.feature-panel{background:rgba(255,255,255,.68); backdrop-filter:blur(24px) saturate(1.5); -webkit-backdrop-filter:blur(24px) saturate(1.5); border:1px solid rgba(255,255,255,.7); border-radius:var(--radius-lg); padding:34px;}
.feature-panel .fp-title{color:var(--gold-light); margin-bottom:22px;}
.flist{display:flex; flex-direction:column; gap:20px;}
.flist li{display:flex; gap:16px; align-items:flex-start;}
.flist .ficon{width:38px; height:38px; border:1px solid var(--gold-line); display:flex; align-items:center; justify-content:center; flex-shrink:0; border-radius:var(--radius);}
.flist .ficon svg{width:18px; height:18px; stroke:var(--gold-light);}
.flist b{display:block; font-size:.92rem; margin-bottom:2px;}
.flist span{font-size:.8rem; color:var(--ash);}

/* ---------- TIMELINE / PROCESS ---------- */
.process{display:grid; grid-template-columns:repeat(4,1fr); gap:0; position:relative;}
.process.cols-5{grid-template-columns:repeat(5,1fr);}
.process::before{content:''; position:absolute; top:26px; left:0; right:0; height:1px; background:var(--line);}
.pstep{position:relative; padding-right:20px;}
.pstep .pnum{width:52px; height:52px; border:1px solid var(--gold-line); background:var(--bg); display:flex; align-items:center; justify-content:center; font-family:'Space Mono',monospace; color:var(--gold-light); margin-bottom:26px; position:relative; z-index:2;}
.pstep h4{margin-bottom:10px;}
.pstep p{font-size:.85rem; color:var(--ash); text-align:justify; text-align-last:left;}

/* ---------- TESTIMONIAL ---------- */
.tcard{background:#fff; border:1px solid var(--line); border-radius:var(--radius-lg); padding:34px; height:100%; display:flex; flex-direction:column;}
.tcard .stars{color:var(--gold); font-size:.9rem; margin-bottom:18px; letter-spacing:2px;}
.tcard p.quote{font-family:'Fraunces',serif; font-style:italic; font-size:1.08rem; color:var(--paper-dim); flex:1; margin-bottom:22px;}
.tcard .tperson{display:flex; align-items:center; gap:12px; border-top:1px solid var(--line); padding-top:18px;}
.tavatar{width:44px; height:44px; border-radius:50%; background:var(--gold-dim); display:flex; align-items:center; justify-content:center; font-family:'Fraunces',serif; color:var(--gold-light); font-size:1.1rem; flex-shrink:0;}
.tperson b{font-size:.88rem;} .tperson span{font-size:.74rem; color:var(--ash);}

/* ---------- CTA BAND ---------- */
.cta-band{position:relative; padding:100px 0; overflow:hidden; text-align:center;}
.cta-band .hero-bg{position:absolute; inset:0;}
.cta-band .hero-bg img{width:100%; height:100%; object-fit:cover; filter:saturate(.85) brightness(.8);}
.cta-band .hero-scrim{
  background:
    radial-gradient(ellipse 820px 440px at 50% 42%, rgba(9,7,5,.5), transparent 70%),
    linear-gradient(180deg, rgba(9,7,5,.72) 0%, rgba(9,7,5,.42) 38%, rgba(9,7,5,.5) 62%, rgba(9,7,5,.86) 100%);
}
.cta-band .cbc{position:relative; z-index:2; max-width:700px; margin:0 auto;}
.cta-band h2{margin-bottom:18px; color:#fff;}
.cta-band .lede{margin:0 auto 34px; text-align:center; color:rgba(255,255,255,.82); text-shadow:0 2px 18px rgba(0,0,0,.6);}
.cta-band .btn-ghost{border-color:rgba(255,255,255,.5); color:#fff;}
.cta-band .btn-ghost:hover{background:rgba(255,255,255,.12); border-color:#fff;}
.cta-row{display:flex; gap:16px; justify-content:center;}

/* seam dividers — a soft glowing gold hairline marks the dark-section
   boundary (CTA -> footer) so the dark "bookend" sections read as
   distinct moments instead of one undifferentiated black slab */
.cta-band::after{
  content:''; position:absolute; left:50%; bottom:0; transform:translateX(-50%);
  width:min(260px,70%); height:1px; z-index:5; pointer-events:none;
  background:linear-gradient(90deg, transparent, rgba(217,169,76,.65), transparent);
  box-shadow:0 0 14px 1px rgba(217,169,76,.4);
}

/* ---------- FOOTER ---------- */
footer.site{
  --paper:#fff; --paper-dim:rgba(255,255,255,.85); --ash:rgba(255,255,255,.58); --ash-dim:rgba(255,255,255,.4); --line:rgba(255,255,255,.14);
  background:linear-gradient(180deg,#181410 0%, var(--ink) 260px, var(--ink) 100%);
  border-top:1px solid var(--line); padding-top:80px;
}
footer.site .logo .word{color:#fff; font-weight:700;}
footer.site .logo .word b{color:var(--gold);}
footer.site .social a{color:rgba(255,255,255,.8);}

/* footer-light — white-theme variant of the footer, used on the home page
   only (index.html adds this modifier class). Resets the dark-bookend
   custom properties back to the site's default light-theme values instead
   of the near-black backdrop the footer uses everywhere else. */
footer.site.footer-light{
  --paper:#1a1a1a; --paper-dim:#4d4d4d; --ash:#6e6e6e; --ash-dim:#9b9b9b; --line:rgba(217,169,76,.18);
  background:#fff;
  border-top:1px solid var(--line);
}
footer.site.footer-light .logo .word{color:var(--paper);}
footer.site.footer-light .logo .word b{color:var(--gold-light);}
footer.site.footer-light .social a{color:var(--ash);}
/* --gold reads at ~2.2:1 on white (fine on the near-black default footer,
   fails AA here) — swap to --gold-light, same fix already used for badges,
   stat-chips and other gold-on-white text elsewhere in the site */
footer.site.footer-light .foot-col h5{color:var(--gold-light); font-size:.82rem;}
footer.site.footer-light .foot-col a:hover,
footer.site.footer-light .foot-bottom a:hover{color:var(--gold-light);}
/* bolder body/link weight + justified brand blurb, home page only */
footer.site.footer-light .foot-brand p{text-align:justify; font-weight:500; max-width:320px;}
footer.site.footer-light .foot-col a,
footer.site.footer-light .foot-bottom{font-weight:700;}
footer.site.footer-light .foot-col a{position:relative; display:inline-block;}
footer.site.footer-light .foot-col a::after{
  content:''; position:absolute; left:0; bottom:-3px; width:100%; height:1px;
  background:var(--gold-light); transform:scaleX(0); transform-origin:left;
  transition:transform .25s ease;
}
footer.site.footer-light .foot-col a:hover::after{transform:scaleX(1);}
.foot-grid{display:grid; grid-template-columns:1.2fr 1fr 1fr 1fr 1fr; gap:56px; padding-bottom:60px; border-bottom:1px solid var(--line);}
.foot-grid>div:nth-child(2){margin-left:5px;}
.foot-brand p{color:var(--ash); font-size:.94rem; margin:18px 0 22px; max-width:280px;}
/* margin-top nudges the heading down to the baseline of the about
   paragraph's first line — the brand column's logo block sits taller than
   a heading, so without this the nav headings start well above "Building
   relationships..." instead of level with it. Value is measured against
   the logo block's rendered height + the paragraph's 18px top margin, so
   it's reset per breakpoint where the logo shrinks or the grid stacks. */
.foot-col h5{font-family:'Space Mono',monospace; font-size:.74rem; font-weight:700; letter-spacing:.15em; text-transform:uppercase; color:var(--gold); margin-top:96.9px; margin-bottom:22px;}
.foot-col li{margin-bottom:14px;}
.foot-col a{font-size:.96rem; font-weight:600; color:var(--ash);}
.foot-col a:hover{color:var(--gold);}
.social{display:flex; gap:12px; margin-top:20px;}
.social a{width:42px; height:42px; border:1px solid var(--line); display:flex; align-items:center; justify-content:center; border-radius:50%; transition:.2s ease;}
.social a svg{width:18px; height:18px;}
.social a:hover{border-color:var(--gold); color:var(--gold); background:var(--gold-dim);}
.foot-bottom{display:flex; justify-content:space-between; align-items:center; padding:26px 0; font-size:.82rem; font-weight:600; color:var(--ash-dim); flex-wrap:wrap; gap:10px;}
.foot-bottom a{color:var(--ash-dim); text-decoration:underline;} .foot-bottom a:hover{color:var(--gold);}

.whatsapp-fab{position:fixed; bottom:26px; right:26px; z-index:200; width:58px; height:58px; border-radius:50%; background:#25D366; display:flex; align-items:center; justify-content:center; box-shadow:0 10px 26px rgba(0,0,0,.4);}
.whatsapp-fab svg{width:28px; height:28px; fill:#fff;}

/* Floating social sidebar (social-media.html only) — stacks above .whatsapp-fab, same right edge */
.social-fab-stack{position:fixed; bottom:96px; right:26px; z-index:200; display:flex; flex-direction:column; gap:12px;}
.social-fab{width:48px; height:48px; border-radius:50%; display:flex; align-items:center; justify-content:center; box-shadow:0 10px 22px rgba(0,0,0,.35); color:#fff; transition:transform .2s ease, box-shadow .2s ease;}
.social-fab svg{width:22px; height:22px;}
.social-fab:hover{transform:translateX(-4px); box-shadow:0 12px 26px rgba(0,0,0,.45);}
.sf-instagram{background:linear-gradient(45deg,#f09433,#e6683c,#dc2743,#cc2366,#bc1888);}
.sf-facebook{background:#1877F2;}
.sf-linkedin{background:#0A66C2;}
.sf-youtube{background:#FF0000;}
@media(max-width:480px){
  /* aligns with .whatsapp-fab's own ≤480px override: bottom:16px; right:16px; 50px diameter */
  .social-fab-stack{bottom:76px; right:16px; gap:10px;}
  .social-fab{width:40px; height:40px;}
  .social-fab svg{width:18px; height:18px;}
}
@media(max-width:360px){
  .social-fab-stack{bottom:74px; right:16px; gap:8px;}
  .social-fab{width:36px; height:36px;}
  .social-fab svg{width:16px; height:16px;}
}

/* ---------- GENERIC UI ---------- */
.badge-row{display:flex; gap:10px; flex-wrap:wrap; margin-bottom:20px;}
.badge{padding:6px 13px; border:1px solid var(--gold-line); font-family:'Space Mono',monospace; font-size:.66rem; letter-spacing:.08em; text-transform:uppercase; color:var(--gold-light);}
.divider{height:1px; background:var(--line); margin:60px 0;}
.divider.sm{margin:34px 0;}

.two-col{display:grid; grid-template-columns:1.1fr .9fr; gap:70px; align-items:center;}
.two-col.rev{grid-template-columns:.9fr 1.1fr;}
.two-col.single{grid-template-columns:1fr;}
.two-col.single>*{max-width:720px;}
.img-frame{position:relative;}
.img-frame img{width:100%; border-radius:var(--radius);}
.img-frame.tall img{height:640px; object-fit:contain; background:var(--panel);}
.stat-chip{position:absolute; bottom:-24px; left:-24px; background:#fff; border:1px solid var(--gold-line); border-radius:var(--radius-lg); padding:20px 26px; z-index:5;}
.stat-chip .num{font-family:'Fraunces',serif; font-size:2.1rem; color:var(--gold-light);}
.stat-chip .lbl{font-size:.74rem; color:var(--ash); margin-top:2px;}

.accordion-item{border-bottom:1px solid var(--line);}
.accordion-item summary{list-style:none; display:flex; justify-content:space-between; align-items:center; padding:24px 4px; cursor:pointer; font-family:'Fraunces',serif; font-size:1.08rem;}
.accordion-item summary::-webkit-details-marker{display:none;}
.accordion-item summary::after{content:'+'; font-family:'Manrope',sans-serif; font-size:1.6rem; color:var(--gold-light); font-weight:300; transition:.2s;}
.accordion-item[open] summary::after{content:'–';}
.accordion-item .a-body{padding:0 4px 24px; color:var(--ash); font-size:.9rem; max-width:760px;}

table.spec-table{width:100%; border-collapse:collapse;}
table.spec-table tr{border-bottom:1px solid var(--line);}
table.spec-table td{padding:16px 4px; font-size:.9rem;}
table.spec-table td:first-child{color:var(--ash); width:40%; font-family:'Space Mono',monospace; font-size:.78rem; letter-spacing:.03em;}
table.spec-table td:last-child{color:var(--paper);}

.amen-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:2px; background:var(--line);}
.amen{background:#fff; padding:28px 22px; display:flex; flex-direction:column; gap:14px; border-radius:var(--radius);}
.amen svg{width:26px; height:26px; stroke:var(--gold-light);}
.amen span{font-size:.86rem;}

.form-card{background:#fff; border:1px solid var(--line); border-radius:var(--radius-lg); padding:40px;}
.form-row{display:grid; grid-template-columns:1fr 1fr; gap:18px; margin-bottom:18px;}
.form-row.cols-3{grid-template-columns:1fr 1fr 1fr;}
.form-group label{display:block; font-family:'Space Mono',monospace; font-size:.65rem; letter-spacing:.1em; text-transform:uppercase; color:var(--ash); margin-bottom:9px;}
.form-group input,.form-group select,.form-group textarea{width:100%; background:#fff; border:1px solid var(--line); color:var(--paper); padding:13px 14px; font-size:.9rem; border-radius:var(--radius);}
.form-group input:focus,.form-group select:focus,.form-group textarea:focus{border-color:var(--gold);}
.form-group textarea{resize:vertical; min-height:110px;}
.form-success{text-align:center; padding:30px 10px;}
.form-success::before{content:"✓"; display:flex; align-items:center; justify-content:center; width:52px; height:52px; margin:0 auto 18px; border-radius:50%; background:var(--gold); color:#fff; font-size:1.3rem;}
.form-error{text-align:center; padding:30px 10px;}
.form-error::before{content:"!"; display:flex; align-items:center; justify-content:center; width:52px; height:52px; margin:0 auto 18px; border-radius:50%; background:#b3452b; color:#fff; font-size:1.3rem; font-weight:700;}
.form-consent{display:flex; align-items:flex-start; gap:10px; font-size:.82rem; color:var(--ash); margin:4px 0 24px;}
.form-consent input[type=checkbox]{width:16px; height:16px; min-width:16px; margin-top:3px; accent-color:var(--gold);}

/* jv-intake: larger, bolder-headed variant of the shared form-card, scoped to joint-venture.html's landowner intake form */
.jv-intake .wrap{max-width:1080px;}
.jv-intake .section-head h2{font-weight:700;}
.jv-intake .form-card{padding:52px;}
.jv-intake h4{font-size:1.45rem; font-weight:700;}
.jv-intake .form-row{gap:20px; margin-bottom:20px;}
.jv-intake .form-group label{font-size:.7rem;}
.jv-intake .form-group input,.jv-intake .form-group select{padding:15px 16px; font-size:.95rem;}

.blog-card{border:1px solid var(--line); background:#fff; border-radius:var(--radius-lg); overflow:hidden;}
.blog-card .bimg{height:260px; overflow:hidden; background:var(--panel);} .blog-card .bimg img{width:100%; height:100%; object-fit:contain; transition:.5s ease;}
.blog-card:hover .bimg img{transform:scale(1.06);}
.blog-card .bbody{padding:22px;}
.blog-meta{font-family:'Space Mono',monospace; font-size:.66rem; letter-spacing:.08em; text-transform:uppercase; color:var(--gold-light); margin-bottom:12px;}
.blog-card p{font-size:.84rem; color:var(--ash); margin:12px 0 16px;}

.team-card{text-align:left; border-radius:var(--radius-lg); overflow:hidden;}
.team-card .timg{height:320px; overflow:hidden; position:relative; background:var(--panel);} .team-card .timg img{width:100%; height:100%; object-fit:contain; filter:grayscale(.3);}
.team-card .tinfo{padding:18px 4px;}
.team-card .role{font-family:'Space Mono',monospace; font-size:.68rem; letter-spacing:.08em; color:var(--gold-light); text-transform:uppercase; margin-top:4px;}

.pkg-card{background:#fff; border:1px solid var(--line); border-radius:var(--radius-lg); padding:36px; display:flex; flex-direction:column; height:100%;}
.pkg-card.pop{border-color:var(--gold); background:linear-gradient(180deg,var(--panel-2),#fff);}
.pkg-card .pk-badge{align-self:flex-start; margin-bottom:16px;}
.pkg-card .pk-price{font-family:'Fraunces',serif; font-size:2.4rem; color:var(--gold-light); margin:14px 0 4px;}
.pkg-card .pk-price span{font-size:.85rem; color:var(--ash); font-family:'Manrope',sans-serif;}
.pkg-card ul{margin:26px 0; display:flex; flex-direction:column; gap:13px; flex:1;}
.pkg-card ul li{display:flex; gap:10px; font-size:.86rem; color:var(--paper-dim); align-items:flex-start;}
.pkg-card ul li svg{width:16px; height:16px; stroke:var(--gold-light); flex-shrink:0; margin-top:3px;}

.gallery-masonry{display:grid; grid-template-columns:repeat(4,1fr); gap:14px;}
.gallery-masonry .gitem{position:relative; overflow:hidden; aspect-ratio:4/5; border-radius:var(--radius-lg); border:1px solid var(--line); transition:opacity .3s ease, transform .3s ease, border-color .3s ease; background:var(--panel);}
.gallery-masonry .gitem:hover{border-color:var(--gold-line);}
.gallery-masonry .gitem.gi-hide{opacity:0; transform:scale(.94);}
/* fixed aspect-ratio (not a fixed pixel height) keeps every tile the same
   shape at any column width with no per-breakpoint override needed;
   object-fit:cover fills that shape edge-to-edge — most of these photos
   are already close to 4:5, so cropping is minor except on outlier
   aspect ratios (e.g. Sastha's very tall elevation shot) */
.gallery-masonry .gitem img,.gallery-masonry .gitem video{width:100%; height:100%; object-fit:cover; display:block; transition:.4s;}
.gallery-masonry .gitem:hover img,.gallery-masonry .gitem:hover video{transform:scale(1.05);}
.gitem .glabel{position:absolute; bottom:0; left:0; right:0; padding:16px; background:linear-gradient(0deg,rgba(0,0,0,.9),transparent); font-size:.78rem; opacity:0; transition:.25s; color:#fff;}
.gitem:hover .glabel{opacity:1;}
.gitem .gplay{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:52px; height:52px; border-radius:50%; background:rgba(8,8,8,.55); border:1px solid rgba(255,255,255,.45); color:#fff; display:flex; align-items:center; justify-content:center; font-size:.95rem; padding-left:3px; pointer-events:none; backdrop-filter:blur(3px); transition:.25s;}
.gitem:hover .gplay{background:var(--gold); border-color:var(--gold); color:#fff;}

.gallery-properties{display:flex; flex-direction:column; gap:44px;}
.gallery-property-name{font-size:1.3rem; margin-bottom:16px; padding-bottom:10px; border-bottom:1px solid var(--line);}

/* ---------- REEL ROW (horizontal-scroll video strip) ---------- */
.reel-division{margin-bottom:56px;}
.reel-division:last-child{margin-bottom:0;}
.reel-division-head{display:flex; align-items:flex-end; justify-content:space-between; gap:24px; margin-bottom:22px;}
.reel-division-head p{font-size:.9rem; color:var(--ash); max-width:560px; margin-top:8px;}
.reel-row{display:flex; gap:16px; overflow-x:auto; overflow-y:hidden; padding:4px 4px 14px; scroll-snap-type:x proximity; -webkit-overflow-scrolling:touch;}
.reel-row::-webkit-scrollbar{height:7px;}
.reel-row::-webkit-scrollbar-track{background:var(--panel-2);border-radius:8px;}
.reel-row::-webkit-scrollbar-thumb{background:var(--line); border-radius:8px;}
.reel-row::-webkit-scrollbar-thumb:hover{background:var(--gold);}
.reel-card{position:relative; flex:0 0 216px; aspect-ratio:9/16; border-radius:var(--radius); overflow:hidden; background:var(--panel); scroll-snap-align:start; box-shadow:0 20px 40px -28px rgba(0,0,0,.4); transition:transform .35s ease, box-shadow .35s ease;}
.reel-card:hover{transform:translateY(-4px); box-shadow:0 28px 52px -26px rgba(0,0,0,.5);}
.reel-card img{width:100%; height:100%; object-fit:cover; display:block; transition:.5s;}
.reel-card:hover img{transform:scale(1.06);}
.reel-badge{position:absolute; top:12px; right:12px; display:flex; align-items:center; gap:5px; background:rgba(8,8,8,.6); color:#fff; font-size:.62rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; padding:5px 9px 5px 7px; border-radius:20px; backdrop-filter:blur(3px);}
.reel-badge svg{width:12px; height:12px;}
.reel-card .gplay{width:46px; height:46px; font-size:.85rem;}
.reel-card .rlabel{position:absolute; bottom:0; left:0; right:0; padding:14px 12px; background:linear-gradient(0deg,rgba(0,0,0,.9),transparent); font-size:.72rem; line-height:1.4; color:#fff;}
@media(max-width:680px){.reel-card{flex-basis:168px;}}
@media(max-width:360px){.reel-card{flex-basis:148px;}}

/* ---------- FLOOR PLANS (home teaser) ---------- */
.flrp-section{background:var(--panel); padding:100px 0;}
.flrp-head{margin-bottom:6px; text-align:center;}
.flrp-head h2{max-width:760px; margin:0 auto;}

.flrp-building{display:grid; grid-template-columns:1fr 1fr; gap:0; background:#fff; border:1px solid var(--line); border-radius:var(--radius-lg); overflow:hidden; margin:36px 0 0; box-shadow:0 30px 60px -40px rgba(20,20,20,.16);}
.flrp-bld-media{position:relative; min-height:480px; overflow:hidden; background:var(--panel);}
.flrp-bld-media img{width:100%; height:100%; object-fit:contain; display:block; transition:.6s ease;}
.flrp-bld-media:hover img{transform:scale(1.05);}
.flrp-bld-info{padding:44px; display:flex; flex-direction:column; justify-content:center; color:var(--paper);}
.flrp-bld-tag{font-family:'Space Mono',monospace; font-size:.68rem; letter-spacing:.14em; text-transform:uppercase; color:var(--gold-light); margin-bottom:14px;}
.flrp-bld-info h3{font-family:'Fraunces',serif; font-size:2rem; font-weight:500; color:var(--paper);}
.flrp-bld-info p{color:var(--ash); margin:16px 0 26px; font-size:.9rem; line-height:1.75; max-width:440px;}
.flrp-bld-specs{display:grid; grid-template-columns:1fr 1fr; gap:20px 24px; margin-bottom:32px; padding-top:26px; border-top:1px solid var(--line);}
.flrp-bld-specs b{display:block; color:var(--paper); font-family:'Fraunces',serif; font-size:1.02rem; font-weight:500;}
.flrp-bld-specs span{font-size:.68rem; color:var(--ash-dim); text-transform:uppercase; letter-spacing:.06em;}
.flrp-bld-cta{display:flex; gap:14px; flex-wrap:wrap;}
.flrp-bld-cta svg{width:16px; height:16px; stroke:currentColor;}

.flrp-tabs{display:flex; justify-content:center; gap:34px; flex-wrap:wrap; border-bottom:1px solid var(--line); margin:40px 0 36px; padding-bottom:0;}
.flrp-tab{background:none; border:none; cursor:pointer; font-family:'Fraunces',serif; font-size:1.02rem; font-weight:600; color:var(--ash); padding:0 0 16px; position:relative; transition:.2s;}
.flrp-tab:hover{color:var(--paper-dim);}
.flrp-tab.on{color:var(--paper);}
.flrp-tab.on::after{content:''; position:absolute; left:50%; bottom:-1px; transform:translateX(-50%); width:5px; height:5px; border-radius:50%; background:var(--gold);}

.flrp-panel{display:none;}
.flrp-panel.on{display:block; animation:flrpIn .35s ease;}
@keyframes flrpIn{from{opacity:0; transform:translateY(6px);} to{opacity:1; transform:translateY(0);}}

/* ---------- SPEC TABS: category-tabbed specifications (extends .flrp-tab/.flrp-panel) ---------- */
.spec-tabs.flrp-tabs{justify-content:flex-start; gap:6px; border-bottom:none; margin:36px 0 40px; padding:8px; background:var(--panel-2); border-radius:18px;}
.spec-tab.flrp-tab{display:flex; flex-direction:column; align-items:center; gap:9px; flex:1 1 140px; padding:16px 14px; border-radius:12px; font-family:'Fraunces',serif; font-size:1rem; font-weight:400; letter-spacing:.02em; text-transform:uppercase; color:var(--ash); text-align:center;}
.spec-tab.flrp-tab:hover{color:var(--paper); background:rgba(255,255,255,.6);}
.spec-tab.flrp-tab.on{color:var(--ink); background:var(--gold); box-shadow:0 14px 30px -14px rgba(217,169,76,.6); font-weight:700; -webkit-text-stroke:.4px currentColor;}
.spec-tab.flrp-tab.on::after{display:none;}
.spec-tab-icon{width:34px; height:34px; border-radius:10px; background:var(--panel); display:flex; align-items:center; justify-content:center; transition:background .25s ease, color .25s ease;}
.spec-tab-icon svg{width:17px; height:17px; stroke:var(--gold-light);}
.spec-tab.flrp-tab.on .spec-tab-icon{background:rgba(18,18,18,.14);}
.spec-tab.flrp-tab.on .spec-tab-icon svg{stroke:var(--ink);}

.spec-grid{display:grid; grid-template-columns:1fr 1fr; gap:22px;}
.spec-card{display:flex; gap:18px; align-items:flex-start; background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:26px; transition:transform .3s ease, box-shadow .3s ease, border-color .3s ease;}
.spec-card:hover{transform:translateY(-5px); box-shadow:var(--shadow-lg); border-color:var(--gold-line);}
.spec-card-icon{flex:0 0 auto; width:46px; height:46px; border-radius:12px; background:var(--gold-dim); display:flex; align-items:center; justify-content:center;}
.spec-card-icon svg{width:21px; height:21px; stroke:var(--gold-light);}
.spec-card h4{margin:0 0 8px; font-size:1.02rem;}
.spec-card p{margin:0 0 14px; font-size:.85rem; color:var(--ash); line-height:1.65;}
.spec-card .spec-tag{display:inline-block; font-family:'Space Mono',monospace; font-size:.66rem; font-weight:700; letter-spacing:.03em; color:var(--gold-light); background:var(--gold-dim); border:1px solid var(--gold-line); padding:5px 12px; border-radius:999px;}

@media(max-width:860px){
  .spec-grid{grid-template-columns:1fr;}
  .spec-tabs.flrp-tabs{justify-content:flex-start; flex-wrap:nowrap; overflow-x:auto; -webkit-overflow-scrolling:touch; gap:8px;}
  .spec-tab.flrp-tab{flex:0 0 auto; min-width:104px;}
}

.flrp-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(320px,1fr)); gap:20px; justify-content:center;}
.flrp-card{background:#fff; border-radius:var(--radius); overflow:hidden; border:1px solid var(--line); box-shadow:0 20px 40px -32px rgba(20,20,20,.2); transition:.3s ease;}
.flrp-card:hover{box-shadow:0 26px 50px -30px rgba(20,20,20,.26); transform:translateY(-3px);}
.flrp-blueprint{display:block; width:100%; height:auto; background:#fff;}
.flrp-blueprint .rm{fill:none; stroke:#1a1a1a; stroke-width:2.5;}
.flrp-blueprint .rm-bal{fill:#f0eeea; stroke:#1a1a1a; stroke-width:2;}
.flrp-blueprint .rm-outer{fill:none; stroke:#1a1a1a; stroke-width:4;}
.flrp-blueprint .rm-label{font-family:'Space Mono',monospace; font-size:10.5px; font-weight:700; fill:#1a1a1a; text-anchor:middle; letter-spacing:.02em;}
.flrp-blueprint .rm-dim{font-family:'Space Mono',monospace; font-size:7.5px; fill:#8a8a8a; text-anchor:middle;}
.flrp-cap{padding:14px 16px; font-family:'Space Mono',monospace; font-size:.66rem; letter-spacing:.02em; color:var(--paper); border-top:1px solid var(--line); line-height:1.6;}
.flrp-cap b{display:block; color:var(--gold-light); font-size:.7rem; letter-spacing:.04em; margin-bottom:2px; font-family:'Manrope',sans-serif;}

/* zoomable images / blueprints + lightbox */
.zoomable{cursor:zoom-in;}
.flrp-zoom-wrap{position:relative;}
.flrp-zoom-hint{position:absolute; top:12px; right:12px; width:34px; height:34px; border-radius:50%; background:rgba(20,20,20,.6); backdrop-filter:blur(6px); display:flex; align-items:center; justify-content:center; color:#fff; opacity:0; transition:.25s; pointer-events:none;}
.flrp-zoom-hint svg{width:16px; height:16px;}
.flrp-zoom-wrap:hover .flrp-zoom-hint,.flrp-photo:hover .flrp-zoom-hint,.flrp-bld-media:hover .flrp-zoom-hint,.flrp-amen-feature:hover .flrp-zoom-hint{opacity:1;}
.flrp-photo{position:relative; height:150px; overflow:hidden; border-top:1px solid var(--line); background:var(--panel);}
.flrp-photo img{width:100%; height:100%; object-fit:contain; display:block; transition:.5s ease;}
.flrp-photo:hover img{transform:scale(1.06);}
.flrp-photo-label{position:absolute; bottom:0; left:0; right:0; padding:8px 12px; background:linear-gradient(0deg,rgba(0,0,0,.75),transparent); color:#fff; font-size:.62rem; letter-spacing:.08em; text-transform:uppercase; font-family:'Space Mono',monospace;}

.flrp-lightbox{position:fixed; inset:0; background:rgba(8,8,8,.94); z-index:999; display:none; align-items:center; justify-content:center; padding:60px 40px; backdrop-filter:blur(6px);}
.flrp-lightbox.open{display:flex;}
.flrp-lightbox-inner{max-width:min(1100px,92vw); max-height:88vh; display:flex; align-items:center; justify-content:center;}
.flrp-lightbox-inner img{max-width:100%; max-height:88vh; display:block; border-radius:var(--radius-lg); box-shadow:0 60px 120px -30px rgba(0,0,0,.65);}
.flrp-lightbox-inner svg{width:100%; height:auto; max-height:88vh; border-radius:var(--radius-lg); box-shadow:0 60px 120px -30px rgba(0,0,0,.65);}
.flrp-lightbox-inner video{max-width:100%; max-height:88vh; display:block; border-radius:var(--radius-lg); box-shadow:0 60px 120px -30px rgba(0,0,0,.65);}
.flrp-lightbox-close{position:absolute; top:26px; right:34px; width:44px; height:44px; border-radius:50%; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.2); color:#fff; font-size:1.7rem; line-height:1; cursor:pointer; transition:.2s;}
.flrp-lightbox-close:hover{background:rgba(255,255,255,.18);}

/* amenities — feature card + icon grid */
.flrp-amen-feature{position:relative; border-radius:var(--radius-lg); overflow:hidden; min-height:260px; margin-bottom:20px; box-shadow:0 30px 60px -40px rgba(20,20,20,.2); background:var(--panel);}
.flrp-amen-feature img{position:absolute; inset:0; width:100%; height:100%; object-fit:contain; transition:.6s ease;}
.flrp-amen-feature:hover img{transform:scale(1.04);}
.flrp-amen-feature::after{content:''; position:absolute; inset:0; background:linear-gradient(0deg,rgba(8,8,8,.88),rgba(8,8,8,.1) 65%);}
.fa-content{position:relative; z-index:2; height:100%; min-height:260px; display:flex; flex-direction:column; justify-content:flex-end; padding:36px; color:#fff;}
.fa-tag{font-family:'Space Mono',monospace; font-size:.66rem; letter-spacing:.14em; text-transform:uppercase; color:var(--gold); margin-bottom:10px;}
.fa-content h4{font-family:'Fraunces',serif; font-size:1.7rem; font-weight:500; color:#fff;}
.fa-content p{font-size:.85rem; color:rgba(255,255,255,.72); margin-top:8px; max-width:480px; line-height:1.65;}
.flrp-amen-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:16px;}
.flrp-amen{background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:24px 20px; display:flex; flex-direction:column; gap:16px; color:var(--paper); transition:.3s ease;}
.flrp-amen:hover{transform:translateY(-4px); border-color:var(--gold-line); box-shadow:0 24px 46px -30px rgba(217,169,76,.35);}
.flrp-amen .fa-icon-circle{width:46px; height:46px; border-radius:50%; background:var(--gold-dim); display:flex; align-items:center; justify-content:center; flex-shrink:0;}
.flrp-amen .fa-icon-circle svg{width:22px; height:22px; stroke:var(--gold-light);}
.flrp-amen span{font-size:.84rem; color:var(--ash);}

.flrp-cta{text-align:center; margin-top:46px;}

.value-strip{display:flex; justify-content:space-between; border:1px solid var(--line); padding:0;}
.vitem{flex:1; padding:30px; border-right:1px solid var(--line); text-align:center;}
.vitem:last-child{border-right:none;}
.vitem .vnum{font-family:'Space Mono',monospace; color:var(--gold-light); font-size:.75rem; margin-bottom:10px;}

.job-row{display:flex; justify-content:space-between; align-items:center; padding:26px 4px; border-bottom:1px solid var(--line); gap:20px;}
.job-row h4{margin-bottom:6px;} .job-row .jmeta{font-size:.8rem; color:var(--ash); display:flex; gap:14px; flex-wrap:wrap;}
.job-row .jmeta span{display:flex; align-items:center; gap:6px;}

.filter-bar{display:flex; gap:12px; flex-wrap:wrap; margin-bottom:50px;}
#galleryFilter{justify-content:center;}
.fbtn{padding:11px 20px; border:1px solid var(--line); font-size:.8rem; font-weight:600; border-radius:30px; color:var(--ash);}
.fbtn.on{background:var(--gold); color:#fff; border-color:var(--gold);}
.fbtn:hover{border-color:var(--gold); color:var(--gold-light);}
.no-results{padding:40px 0; text-align:center; color:var(--ash); font-size:.95rem;}
.no-results a{color:var(--gold); font-weight:600; text-decoration:underline;}

.proj-layout{display:grid; grid-template-columns:250px 1fr; gap:44px; align-items:start;}
.proj-sidebar{display:flex; flex-direction:column; gap:28px; padding:28px 22px; border:1px solid var(--line); border-radius:16px;}
.pf-group h5{font-family:'Space Mono',monospace; font-size:.68rem; letter-spacing:.09em; text-transform:uppercase; color:var(--ash); margin-bottom:12px;}
.pf-opts{display:flex; flex-direction:column; gap:8px;}
.pf-opt{display:block; width:100%; text-align:left; padding:9px 14px; border:1px solid var(--line); border-radius:30px; font-size:.8rem; font-weight:600; color:var(--ash); background:none; cursor:pointer;}
.pf-opt.on{background:var(--gold); color:#fff; border-color:var(--gold);}
.pf-opt:hover{border-color:var(--gold); color:var(--gold-light);}
.pf-clear{align-self:flex-start; font-size:.78rem; font-weight:700; color:var(--gold); text-decoration:underline; background:none; border:none; cursor:pointer; padding:0;}
.proj-count{font-size:.85rem; color:var(--ash); margin-bottom:20px;}
@media(max-width:1180px){
  .proj-layout{grid-template-columns:1fr; gap:28px;}
  .proj-sidebar{flex-direction:row; flex-wrap:wrap; gap:22px 34px; padding:22px;}
  .pf-opts{flex-direction:row; flex-wrap:wrap; gap:10px;}
  .pf-opt{width:auto;}
  .pf-group{flex:1 1 220px;}
}
@media(max-width:480px){
  .proj-sidebar{gap:18px 24px; padding:18px;}
  .pf-group{flex:1 1 100%;}
}

.calc-shell{display:grid; grid-template-columns:1fr 1fr; gap:0; border:1px solid var(--gold-line);}
.calc-in{padding:44px; background:var(--panel);}
.calc-out{padding:44px; background:var(--panel-2); display:flex; flex-direction:column;}
.range-row{margin-bottom:26px;}
.range-row label{display:flex; justify-content:space-between; font-size:.85rem; margin-bottom:10px;}
.range-row label b{color:var(--gold-light); font-family:'Space Mono',monospace;}
input[type=range]{-webkit-appearance:none; width:100%; height:2px; background:var(--line); outline:none;}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none; width:18px; height:18px; border-radius:50%; background:var(--gold); cursor:pointer; border:3px solid #fff;}
.out-line{display:flex; justify-content:space-between; padding:14px 0; border-bottom:1px solid rgba(140,106,22,.12); font-size:.9rem; color:var(--ash);}
.out-line b{color:var(--paper); font-weight:600;}
.out-total{display:flex; justify-content:space-between; align-items:baseline; margin-top:22px; padding-top:22px; border-top:1px solid var(--gold-line);}
.out-total .tv{font-family:'Fraunces',serif; font-size:2.4rem; color:var(--gold-light);}

.map-block{height:420px; background:var(--panel) url('') center/cover; border:1px solid var(--line); position:relative; overflow:hidden;}

.sub-nav{display:flex; gap:0; border-bottom:1px solid var(--line); margin-bottom:60px; overflow-x:auto;}
.sub-nav a{padding:18px 26px; font-size:.85rem; font-weight:600; color:var(--ash); border-bottom:2px solid transparent; white-space:nowrap;}
.sub-nav a.on{color:var(--gold-light); border-color:var(--gold);}

/* ---------- HOME v2: tilt / statement / who-we-are / slider / 3D icons ---------- */
.tilt{transition:transform .3s cubic-bezier(.2,.8,.2,1); will-change:transform;}

.about-statement{padding:130px 0 104px; text-align:center; position:relative;}
.about-statement .wrap{max-width:880px;}
.about-statement .as-mark{font-family:'Fraunces',serif; font-style:italic; font-size:4.5rem; color:var(--gold-dim); line-height:1; margin-bottom:6px;}
.about-statement .eyebrow{justify-content:center; margin:0 auto 22px;}
.about-statement h2{font-size:clamp(1.9rem,3.6vw,2.9rem); line-height:1.3;}
.about-statement p{font-size:1.14rem; color:var(--ash); line-height:1.95; margin:28px auto 0; max-width:740px;}

.wwa-grid{display:grid; grid-template-columns:1fr 1fr; gap:70px; align-items:center;}
.wwa-media{position:relative;}
.wwa-slider{position:relative; height:560px; border-radius:36px; overflow:hidden; box-shadow:0 40px 90px -30px rgba(20,20,20,.38); cursor:zoom-in; background:var(--panel);}
.wwa-slide{position:absolute; inset:0; width:100%; height:100%; object-fit:contain; opacity:0; transition:opacity 1.4s ease;}
.wwa-slide.on{opacity:1;}
.wwa-collage{position:absolute; width:56%; bottom:-46px; left:-46px; z-index:3; border-radius:30px; overflow:hidden; border:7px solid var(--bg); box-shadow:0 40px 80px -30px rgba(20,20,20,.4); background:var(--panel);}
.wwa-collage img{width:100%; height:230px; object-fit:contain; display:block;}
.wwa-stats-row{display:flex; gap:0; margin-top:34px; border-top:1px solid var(--line); padding-top:28px;}
.wwa-stats-row div{flex:1; padding-right:20px;}
.wwa-stats-row b{display:block; font-family:'Fraunces',serif; font-size:1.7rem; color:var(--gold-light); font-weight:500;}
.wwa-stats-row span{font-size:.76rem; color:var(--ash); text-transform:uppercase; letter-spacing:.05em;}

/* sliding carousel (touch swipe + arrows + dots) */
.pslider{position:relative;}
.pslider-stage{position:relative;}
.pslider-arrow{position:absolute; top:50%; transform:translateY(-50%); z-index:5; width:48px; height:48px; border-radius:50%; border:1px solid var(--gold-line); background:rgba(255,255,255,.92); backdrop-filter:blur(6px); display:flex; align-items:center; justify-content:center; cursor:pointer; transition:.25s ease; box-shadow:0 14px 30px -16px rgba(20,20,20,.3);}
.pslider-prev{left:-24px;}
.pslider-next{right:-24px;}
.pslider-arrow:hover{background:var(--gold); border-color:var(--gold); transform:translateY(-50%) scale(1.08); box-shadow:0 14px 26px -12px rgba(217,169,76,.5);}
.pslider-arrow svg{width:18px; height:18px; stroke:var(--paper); transition:.2s;}
.pslider-arrow:hover svg{stroke:#fff;}
.pslider-viewport{overflow-x:auto; scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch; scrollbar-width:none; margin:0 -6px;}
.pslider-viewport::-webkit-scrollbar{display:none;}
.pslider-track{display:flex; gap:24px; padding:6px;}
.pslider-track>.pcard{flex:0 0 calc(50% - 12px); scroll-snap-align:start;}
.pslider-dots{display:flex; gap:9px; justify-content:center; margin-top:32px;}
.pslider-dot{width:8px; height:8px; border-radius:50%; background:var(--line); border:none; padding:0; cursor:pointer; transition:.3s ease;}
.pslider-dot.on{background:var(--gold); width:24px; border-radius:5px;}

/* 3D flip icon badges (How We Work) */
.pstep-ico{width:76px; height:76px; margin-bottom:26px; perspective:700px; position:relative; z-index:2;}
.pstep-ico-inner{width:100%; height:100%; position:relative; transform-style:preserve-3d; transition:transform .7s cubic-bezier(.2,.8,.2,1); animation:icoFloat 4.5s ease-in-out infinite;}
.pstep:hover .pstep-ico-inner{transform:rotateY(180deg); animation-play-state:paused;}
.pstep-ico-face{position:absolute; inset:0; border-radius:50%; display:flex; align-items:center; justify-content:center; backface-visibility:hidden; -webkit-backface-visibility:hidden;}
.pstep-ico-front{background:linear-gradient(145deg,#fff,var(--panel-2)); box-shadow:9px 12px 22px -10px rgba(20,20,20,.22), 0 0 0 1px var(--gold-line);}
.pstep-ico-front svg{width:30px; height:30px; stroke:var(--gold-light);}
.pstep-ico-back{background:linear-gradient(145deg,var(--gold),var(--gold-light)); transform:rotateY(180deg); box-shadow:9px 12px 22px -10px rgba(217,169,76,.55);}
.pstep-ico-back span{font-family:'Fraunces',serif; font-size:1.5rem; color:#fff; font-weight:500;}
@keyframes icoFloat{0%,100%{transform:translateY(0);} 50%{transform:translateY(-9px);}}

.gitem.big{grid-column:span 2; grid-row:span 2;}

@media(max-width:1180px){
  .grid-4{grid-template-columns:repeat(2,1fr);}
  .foot-grid{grid-template-columns:1fr 1fr; gap:36px 60px;}
  /* only the Company column shares row 1 with the brand column at this 2-up
     layout — the rest fall to their own rows, so giving them the offset too
     would just add dead space above them. Logo shrinks at this breakpoint
     (see .logo .word below), so the offset shrinks with it. */
  .foot-col h5{margin-top:0;}
  .foot-grid>div:nth-child(2) h5{margin-top:76.4px;}
  .amen-grid{grid-template-columns:repeat(2,1fr);}
  .process{grid-template-columns:1fr 1fr; row-gap:40px;}
  .process.cols-5{grid-template-columns:1fr 1fr;}
  .process::before{display:none;}
  .stats .wrap{grid-template-columns:repeat(2,1fr); row-gap:26px;}
  .stat{border-left:none; padding-left:0;}
  .why-grid{grid-template-columns:repeat(2,1fr);}
  .hd-grid{grid-template-columns:1fr;}
  .hd-stats-row{grid-template-columns:repeat(2,1fr);}
  .flrp-grid{grid-template-columns:repeat(2,1fr);}
  .flrp-amen-grid{grid-template-columns:repeat(2,1fr);}
  .flrp-building{grid-template-columns:1fr;}
  .form-row.cols-3{grid-template-columns:1fr 1fr;}
  .jv-intake .form-card{padding:40px 32px;}
  .flrp-bld-media{min-height:340px;}
  .wwa-grid{grid-template-columns:1fr; gap:80px 0;}
  .wwa-collage{width:64%;}

  /* nav drawer activates here (not the shared ≤860px mobile block below) — with
     8 top-level menu items + phone + CTA button, the horizontal desktop nav
     no longer fits by ~1180px even before the general mobile layout collapse;
     js/main.js's mq must stay in sync with this breakpoint */
  .nav-cta .nav-phone,.nav-cta .btn{display:none;}
  .nav-burger{display:flex;}
  .nav{height:84px;}
  .logo .word{font-size:1.32rem;}

  /* off-canvas menu drawer */
  .menu{
    position:fixed; top:0; right:0; z-index:150;
    width:min(84vw,360px); height:100vh; height:100dvh;
    background:#fff; flex-direction:column; align-items:stretch; justify-content:flex-start;
    gap:0; padding:100px 22px 40px; overflow-y:auto;
    transform:translateX(100%); transition:transform .35s cubic-bezier(.2,.8,.2,1);
    box-shadow:-30px 0 60px -20px rgba(0,0,0,.35);
  }
  header.site.nav-open .menu{transform:translateX(0);}
  .menu>li{width:100%; border-bottom:1px solid var(--line); opacity:0; transform:translateX(16px); transition:opacity .35s ease, transform .35s ease;}
  header.site.nav-open .menu>li{opacity:1; transform:translateX(0);}
  header.site.nav-open .menu>li:nth-child(1){transition-delay:.05s;}
  header.site.nav-open .menu>li:nth-child(2){transition-delay:.1s;}
  header.site.nav-open .menu>li:nth-child(3){transition-delay:.15s;}
  header.site.nav-open .menu>li:nth-child(4){transition-delay:.2s;}
  header.site.nav-open .menu>li:nth-child(5){transition-delay:.25s;}
  header.site.nav-open .menu>li:nth-child(6){transition-delay:.3s;}
  .menu>li>a{width:100%; padding:16px 4px; justify-content:space-between;}
  .menu>li>a .car{margin-top:0; padding:8px; margin:-8px;}
  .dropdown,.dropdown.wide{
    position:static; transform:none; opacity:1; visibility:visible;
    display:none; min-width:0; width:100%; grid-template-columns:1fr;
    background:transparent; border:none; box-shadow:none; padding:0 0 12px 10px;
  }
  .menu>li.dd-open>.dropdown{display:grid;}
  .menu>li.dd-open>a .car{transform:rotate(225deg); margin-top:6px; border-color:var(--gold-light);}
  .dropdown a{color:var(--ash); padding:12px 10px;}
  .dropdown .dd-note{padding:10px 10px 2px;}
  .dd-flyout-item>a{display:flex; align-items:center; justify-content:space-between; gap:10px;}
  .dd-flyout-item .flyout-car{color:var(--ash-dim); font-family:'Space Mono',monospace;}
  .dd-flyout-item .flyout{padding-left:10px; margin-left:10px; border-left:1px solid var(--line);}

  .menu-cta{display:flex; flex-direction:column; gap:14px; border-bottom:none; margin-top:24px; padding-top:22px; border-top:1px solid var(--line);}
  .menu-cta .nav-phone{border:1px solid var(--line); border-radius:var(--radius); padding:13px 16px; justify-content:center; width:100%;}
  .menu-cta .btn{width:100%;}
}
@media(max-width:860px){
  .two-col,.two-col.rev,.grid-4,.grid-3,.grid-2,.search-grid,.calc-shell,.hcl-grid,.hd-fields,.eu-grid{grid-template-columns:1fr;}
  .eu-media img{height:420px;}
  .pcard.fp-big .pimg{height:320px;}
  /* project card photos: drop the fixed-height contain box on mobile so the
     photo's own aspect ratio sets the box height — fills edge-to-edge with
     no left/right letterbox bars, and nothing gets cropped either */
  .pcard .pimg,.pcard.fp-big .pimg,.pcard.fp-sm .pimg{height:auto; background:none;}
  .pcard .pimg img{height:auto;}
  .fp-scroll{margin:0 -20px; padding:0 20px 14px;}
  .foot-grid{grid-template-columns:1fr;}
  .foot-col h5{margin-top:0;} /* columns stack here, so the alignment offset would just add dead space */
  section{padding:70px 0;}
  .wrap{padding:0 20px;}
  .gallery-masonry{grid-template-columns:repeat(2,1fr);}
  .hcl-media{order:-1; min-height:380px; margin-bottom:20px;}
  .hcl-photo-main{width:100%; height:320px;}
  .hcl-search{margin-top:24px;}
  .hero-dark{padding:110px 0 40px; min-height:auto;}
  .why-grid{grid-template-columns:1fr;}
  .flrp-section{padding:70px 0;}
  .flrp-grid{grid-template-columns:1fr;}
  .flrp-amen-grid{grid-template-columns:1fr 1fr;}
  .flrp-tabs{gap:20px 26px;}
  .flrp-bld-specs{gap:16px 18px;}
  .flrp-bld-info{padding:30px;}
  .flrp-lightbox{padding:24px;}
  .flrp-lightbox-close{top:14px; right:16px;}
  .about-statement{padding:80px 0 60px;}
  .wwa-slider{height:340px; border-radius:24px;}
  .wwa-collage{position:static; width:100%; margin-top:20px; border-width:0; border-radius:20px;}
  .wwa-stats-row{display:grid; grid-template-columns:1fr 1fr; row-gap:24px; column-gap:20px;}
  .wwa-stats-row div{padding-right:0;}
  .pslider-track>.pcard{flex:0 0 88%;}
  .pslider-prev{left:6px;}
  .pslider-next{right:6px;}
  .pslider-arrow{width:40px; height:40px;}
  .gitem.big{grid-column:span 1; grid-row:span 1;}
}

/* ---------- RESPONSIVE: TOPBAR SIMPLIFICATION (own ≤860px breakpoint — no longer tied to the nav drawer, which now activates at ≤1180px; the topbar itself has room to stay in its full form down to 861px) ---------- */
@media(max-width:860px){
  .topbar .tb-left a:last-child,
  .topbar .tb-right a:first-child{display:none;}
  .topbar .wrap{height:40px;}
  .topbar .tb-item+.tb-item{margin-left:0; padding-left:0; border-left:none;}
}

/* ---------- RESPONSIVE: SMALL TABLET / PHABLET (≤680px) ---------- */
@media(max-width:680px){
  .cta-row{flex-wrap:wrap;}
  .eu-specs{gap:16px 18px;}
  .gallery-properties{gap:32px;}
  .form-row,.form-row.cols-3{grid-template-columns:1fr;}
  .calc-in,.calc-out{padding:28px 24px;}
  .value-strip{flex-direction:column;}
  .stat-chip{left:16px; bottom:-20px; padding:14px 20px;}
  .vitem{border-right:none; border-bottom:1px solid var(--line); padding:22px;}
  .vitem:last-child{border-bottom:none;}
  .job-row{flex-wrap:wrap; align-items:flex-start;}
  .form-card{padding:28px 22px;}
  .jv-intake .form-card{padding:30px 24px;}
  .jv-intake h4{font-size:1.25rem;}
  .flrp-bld-info{padding:26px 22px;}
  .pslider-arrow{width:36px; height:36px;}
  .pslider-prev{left:2px;} .pslider-next{right:2px;}
}

/* ---------- RESPONSIVE: MOBILE PHONES (≤480px) ---------- */
@media(max-width:480px){
  .wrap{padding:0 18px;}
  section{padding:56px 0;}
  .tight{padding:46px 0;}
  .topbar{display:none;}
  .nav{height:76px;}
  .logo .mark{width:44px; height:44px;}
  .logo .word{font-size:1.14rem;}
  h1{font-size:clamp(2rem,8vw,2.8rem);}
  .hero{min-height:82vh;}
  .page-hero{min-height:auto; padding-top:112px; padding-bottom:40px;}
  .hero-badge{font-size:.64rem; padding:7px 14px;}
  .hero .lede,.hd-lede,.hcl-text .lede{font-size:.95rem;}
  .cta-row{flex-direction:column; align-items:stretch;}
  .cta-row .btn{width:100%;}
  .stats .wrap{grid-template-columns:1fr; padding:30px 20px; gap:20px;}
  .stat{border-left:none; padding-left:0; border-top:1px solid var(--line); padding-top:20px;}
  .stat:first-child{border-top:none; padding-top:0;}
  .stat-chip{bottom:-16px; padding:12px 16px;}
  .stat-chip .num{font-size:1.6rem;}
  .hd-stats-row{grid-template-columns:1fr; padding:0 20px;}
  .process{grid-template-columns:1fr; row-gap:30px;}
  .process.cols-5{grid-template-columns:1fr;}
  .amen-grid{grid-template-columns:1fr;}
  .flrp-amen-grid{grid-template-columns:1fr;}
  .gallery-masonry{grid-template-columns:repeat(2,1fr); gap:8px;}
  .eu-specs{grid-template-columns:1fr 1fr; gap:14px;}
  .eu-media img{height:300px;}
  .pcard.fp-big .pimg{height:auto;}
  .pkg-card,.form-card{padding:26px 20px;}
  .calc-in,.calc-out{padding:24px 18px;}
  .foot-bottom{flex-direction:column; text-align:center;}
  .whatsapp-fab{width:50px; height:50px; bottom:16px; right:16px;}
  .whatsapp-fab svg{width:24px; height:24px;}
}

/* ---------- RESPONSIVE: VERY SMALL PHONES (≤360px) ---------- */
@media(max-width:360px){
  .wrap{padding:0 14px;}
  .gallery-masonry{grid-template-columns:1fr;}
  .eu-specs{grid-template-columns:1fr;}
  .btn{padding:13px 22px; font-size:.78rem;}
  .menu{width:100vw;}
}

/* ---------- RESPONSIVE: LARGE DESKTOP / TV (≥1600px) ---------- */
@media(min-width:1600px){
  :root{--maxw:1480px;}
}

/* ===========================================================
   LUXURY ENHANCEMENT LAYER — depth, motion, pink glow
   =========================================================== */

/* ambient background tint */
body{
  background-color:var(--bg);
  background-image:
    radial-gradient(ellipse 900px 560px at 12% -8%, rgba(217,169,76,.05), transparent 60%),
    radial-gradient(ellipse 800px 560px at 92% 8%, rgba(217,169,76,.04), transparent 62%),
    radial-gradient(ellipse 700px 500px at 50% 100%, rgba(217,169,76,.03), transparent 60%);
  background-attachment:fixed;
}

/* pink gradient text utility */
.gold-grad, h1 .italic{
  background:linear-gradient(110deg,#e8c98a 0%,#8C6A16 35%,#5c4409 55%,#D9A94C 80%,#e8c98a 100%);
  background-size:250% auto;
  -webkit-background-clip:text; background-clip:text; color:transparent;
  animation:goldSheen 7s linear infinite;
  font-style:italic; font-weight:500;
}
@keyframes goldSheen{0%{background-position:0% 50%;}100%{background-position:250% 50%;}}

.cta-band h2{text-shadow:0 6px 40px rgba(0,0,0,.55);}
.hero h1{letter-spacing:-.015em;}

/* eyebrow flourish */
.eyebrow::after{content:'';width:5px;height:5px;border-radius:50%;background:var(--gold);margin-left:2px;box-shadow:0 0 8px 2px rgba(217,169,76,.6);}

/* logo glow + hover flourish */
.logo .mark img{filter:drop-shadow(0 0 6px rgba(140,106,22,.28)); transition:filter .4s ease;}
.logo .mark{transition:transform .5s cubic-bezier(.22,1,.36,1);}
.logo:hover .mark{transform:rotate(-8deg) scale(1.08);}
.logo:hover .mark img{filter:drop-shadow(0 0 6px rgba(140,106,22,.28)) drop-shadow(0 0 14px rgba(217,169,76,.45));}
.logo .word{position:relative;}

/* nav underline sweep + scrolled state */
.menu>li>a{position:relative;}
.menu>li>a::before{content:'';position:absolute;left:16px;right:16px;bottom:9px;height:1px;background:linear-gradient(90deg,var(--gold),var(--gold-light));transform:scaleX(0);transform-origin:left;transition:transform .35s cubic-bezier(.2,.8,.2,1);}
.menu>li:hover>a::before,.menu>li.current>a::before{transform:scaleX(1);}
header.site{transition:box-shadow .3s ease, background .3s ease;}
header.site.scrolled{box-shadow:0 20px 50px -20px rgba(20,20,20,.15); background:rgba(255,255,255,.97);}

/* hero badge shimmer sweep */
.hero-badge{position:relative; overflow:hidden; box-shadow:0 0 0 1px rgba(217,169,76,.15), 0 10px 30px -10px rgba(217,169,76,.3);}
.hero-badge::after{content:'';position:absolute; top:0; left:-160%; width:55%; height:100%;
  background:linear-gradient(120deg,transparent,rgba(255,255,255,.35),transparent);
  animation:badgeSweep 3.4s ease-in-out infinite;}
@keyframes badgeSweep{0%{left:-160%;}55%{left:160%;}100%{left:160%;}}

/* hero ambient glow blobs */
.hero{isolation:isolate;}
.hero-content{position:relative;}
.hero-content::before{content:''; position:absolute; z-index:-1; width:640px; height:640px; right:-160px; top:-260px;
  background:radial-gradient(circle,rgba(217,169,76,.2),transparent 68%); filter:blur(10px); pointer-events:none;}

/* buttons: shine sweep + lift + glow */
.btn{position:relative; overflow:hidden; transition:transform .3s cubic-bezier(.2,.8,.2,1), box-shadow .3s ease, filter .3s ease;}
.btn-gold{box-shadow:0 10px 30px -10px rgba(140,106,22,.45), inset 0 1px 0 rgba(255,255,255,.35);}
.btn-gold:hover{box-shadow:0 16px 40px -12px rgba(140,106,22,.6), inset 0 1px 0 rgba(255,255,255,.4); transform:translateY(-2px);}
.btn::after{content:''; position:absolute; top:0; left:-75%; width:45%; height:100%;
  background:linear-gradient(120deg,transparent,rgba(255,255,255,.55),transparent); transform:skewX(-18deg); transition:left .55s ease;}
.btn-gold:hover::after{left:135%;}
.btn-ghost:hover{transform:translateY(-2px); box-shadow:0 10px 26px -14px rgba(217,169,76,.3);}

/* stat numbers — glow */
.stat .num{text-shadow:0 0 24px rgba(217,169,76,.2);}
.stat{transition:transform .3s ease;}
.stat:hover{transform:translateY(-3px);}

/* project / info cards — lift, glow border, image zoom */
.pcard, .tcard, .blog-card, .team-card, .pkg-card{transition:transform .45s cubic-bezier(.2,.8,.2,1), box-shadow .45s ease, border-color .45s ease;}
.pcard:hover, .blog-card:hover{transform:translateY(-8px); border-color:var(--gold); box-shadow:0 40px 70px -30px rgba(217,169,76,.3), var(--shadow-lg);}
.tcard:hover, .team-card:hover{transform:translateY(-6px);}
.team-card .timg img{transition:transform .6s ease, filter .4s ease;}
.team-card:hover .timg img{transform:scale(1.06); filter:grayscale(0);}

/* package "popular" — animated glow ring */
@keyframes pkgGlow{0%,100%{box-shadow:0 0 0 1px var(--gold), 0 25px 55px -25px rgba(217,169,76,.35);}50%{box-shadow:0 0 0 1px var(--gold-light), 0 30px 65px -20px rgba(217,169,76,.55);}}
.pkg-card.pop{animation:pkgGlow 3.2s ease-in-out infinite;}
.pkg-card{transition:transform .4s ease, box-shadow .4s ease;}
.pkg-card:hover{transform:translateY(-6px);}

/* image frames — subtle zoom + pink vignette */
.img-frame{overflow:hidden;}
.img-frame img{transition:transform .8s cubic-bezier(.2,.8,.2,1);}
.img-frame:hover img{transform:scale(1.045);}
.stat-chip{box-shadow:0 25px 60px -20px rgba(20,20,20,.16), 0 0 0 1px rgba(217,169,76,.15);}


/* ornamental divider */
.divider{position:relative; height:1px; background:linear-gradient(90deg,transparent,var(--gold-line) 45%,var(--gold-line) 55%,transparent); margin:60px 0;}
.divider::after{content:'◆'; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); background:var(--bg); color:var(--gold); font-size:.62rem; padding:0 16px;}
.divider.sm{margin:34px 0;}

/* feature panel glow border */
.feature-panel{position:relative; box-shadow:0 30px 70px -30px rgba(20,20,20,.14), 0 0 0 1px rgba(217,169,76,.1);}
.flist .ficon{transition:.3s ease;}
.flist li:hover .ficon{background:var(--gold-dim); box-shadow:0 0 16px rgba(217,169,76,.3); border-color:var(--gold);}

/* CTA band ken-burns */
.cta-band .hero-bg img{animation:kenburns 18s ease-in-out infinite alternate;}
@keyframes kenburns{0%{transform:scale(1);}100%{transform:scale(1.08);}}

/* marquee ticker */
.gold-ticker{border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:var(--panel); overflow:hidden; padding:16px 0;}
.gold-ticker .track{display:flex; width:max-content; gap:0; animation:tickerScroll 32s linear infinite;}
.gold-ticker .track span{display:flex; align-items:center; gap:12px; padding:0 34px; font-family:'Space Mono',monospace; font-size:.74rem; letter-spacing:.16em; text-transform:uppercase; color:var(--gold-light); white-space:nowrap;}
.gold-ticker .track span::after{content:'✦'; color:var(--gold); margin-left:34px;}
@keyframes tickerScroll{from{transform:translateX(0);}to{transform:translateX(-50%);}}

/* scroll reveal */
.reveal{opacity:0; transform:translateY(30px); transition:opacity .9s cubic-bezier(.2,.7,.2,1), transform .9s cubic-bezier(.2,.7,.2,1);}
.reveal.in{opacity:1; transform:translateY(0);}
@media (prefers-reduced-motion: reduce){
  .reveal{opacity:1; transform:none; transition:none;}
  .gold-ticker .track, .cta-band .hero-bg img, .hero-badge::after, .gold-grad, .pkg-card.pop{animation:none;}
  .hero-bg.slider img{transition:none;}
}

/* section heading rule accent */
.section-head h2{position:relative;}

/* footer glow — ambient gold wash spilling down from the seam with the
   CTA band above it, so the footer reads as its own lit moment rather
   than a plain continuation of the same black */
footer.site{position:relative; overflow:hidden;}
footer.site::before{content:''; position:absolute; top:-120px; left:50%; transform:translateX(-50%); width:1100px; height:420px; background:radial-gradient(ellipse closest-side,rgba(217,169,76,.22),transparent 72%); pointer-events:none;}

/* whatsapp fab pulse */
.whatsapp-fab{animation:fabPulse 2.6s ease-in-out infinite;}

/* ===========================================================
   EMI CALCULATOR (glassmorphic, light, animated) — homepage, final section
   =========================================================== */
.emi-section{
  --emi-dark:var(--bg); --emi-panel:rgba(255,255,255,.7); --emi-line:var(--gold-line);
  --emi-gold:#D9A94C; --emi-gold-light:var(--gold-light);
  position:relative; overflow:hidden; padding:110px 0;
  background:
    radial-gradient(ellipse 900px 600px at 15% 8%, rgba(217,169,76,.1), transparent 60%),
    radial-gradient(ellipse 800px 560px at 88% 92%, rgba(217,169,76,.08), transparent 60%),
    var(--emi-dark);
  isolation:isolate;
}
.emi-section .emi-eyebrow{color:var(--emi-gold-light);}
.emi-section .emi-eyebrow::before{background:var(--emi-gold);}
.emi-h2{color:var(--paper); text-shadow:none;}
.emi-lede{color:var(--ash); margin-top:-8px; margin-bottom:44px;}

/* floating ambient orbs */
.emi-orb{position:absolute; z-index:0; border-radius:50%; filter:blur(60px); pointer-events:none; opacity:.35;}
.emi-orb-a{width:420px; height:420px; top:-120px; left:-100px; background:radial-gradient(circle,rgba(217,169,76,.35),transparent 70%); animation:emiFloat 13s ease-in-out infinite;}
.emi-orb-b{width:360px; height:360px; bottom:-140px; right:-80px; background:radial-gradient(circle,rgba(217,169,76,.22),transparent 70%); animation:emiFloat 16s ease-in-out infinite reverse;}
.emi-orb-c{width:260px; height:260px; top:40%; right:12%; background:radial-gradient(circle,rgba(240,200,104,.18),transparent 70%); animation:emiFloat 10s ease-in-out infinite;}
@keyframes emiFloat{0%,100%{transform:translate(0,0) scale(1);} 50%{transform:translate(24px,-30px) scale(1.08);}}

.emi-section .wrap{position:relative; z-index:1;}

.emi-glass{
  display:grid; grid-template-columns:1.1fr .9fr; gap:0;
  background:var(--emi-panel);
  backdrop-filter:blur(26px) saturate(1.4); -webkit-backdrop-filter:blur(26px) saturate(1.4);
  border:1px solid var(--emi-line); border-radius:var(--radius-lg);
  box-shadow:var(--shadow-lg), inset 0 1px 0 rgba(255,255,255,.6);
  overflow:hidden;
}
.emi-in{padding:48px; border-right:1px solid rgba(140,106,22,.12);}
.emi-out{padding:48px; display:flex; flex-direction:column; align-items:center; text-align:center;}

.emi-range label{color:var(--paper-dim);}
.emi-range label b{color:var(--emi-gold-light);}
.emi-range{margin-bottom:32px;}

.emi-range-amt label{margin-bottom:0;}
.emi-amt-head{display:flex; justify-content:space-between; align-items:center; margin-bottom:10px;}
.emi-amt-field{display:flex; align-items:center; gap:4px; background:rgba(140,106,22,.05); border:1px solid rgba(140,106,22,.2); border-radius:8px; padding:7px 12px; transition:border-color .2s ease, background .2s ease, box-shadow .2s ease;}
.emi-amt-field:focus-within{border-color:var(--emi-gold); background:rgba(217,169,76,.08); box-shadow:0 0 0 3px rgba(217,169,76,.14);}
.emi-amt-prefix{font-family:'Space Mono',monospace; font-size:.85rem; color:var(--emi-gold-light);}
.emi-amt-input{background:transparent; border:none; outline:none; width:118px; color:var(--emi-gold-light); font-family:'Space Mono',monospace; font-size:.85rem; font-weight:700; text-align:right; font-variant-numeric:tabular-nums;}
.emi-amt-input::selection{background:var(--emi-gold); color:#1a1305;}
.emi-range-amt input[type=range]{margin-top:14px;}
.emi-in input[type=range]{background:var(--line);}
.emi-in input[type=range]::-webkit-slider-thumb{background:linear-gradient(135deg,var(--emi-gold),#B5893A); border-color:#fff; box-shadow:0 0 0 4px rgba(217,169,76,.18);}
.emi-in input[type=range]::-moz-range-thumb{width:18px; height:18px; border-radius:50%; background:linear-gradient(135deg,var(--emi-gold),#B5893A); border:3px solid #fff; cursor:pointer;}
.emi-note{font-size:.76rem; color:var(--ash); line-height:1.7; margin-top:8px;}

.emi-ring-wrap{position:relative; width:200px; height:200px; margin-bottom:30px;}
.emi-ring{width:100%; height:100%; transform:rotate(-90deg);}
.emi-ring-track{fill:none; stroke:rgba(140,106,22,.12); stroke-width:14;}
.emi-ring-seg{fill:none; stroke-width:14; stroke-linecap:round; transition:stroke-dasharray 1s cubic-bezier(.2,.8,.2,1), stroke-dashoffset 1s cubic-bezier(.2,.8,.2,1);}
.emi-ring-principal{stroke:var(--ash-dim);}
.emi-ring-interest{stroke:url(#emiGoldGrad); filter:drop-shadow(0 0 8px rgba(217,169,76,.4));}
.emi-ring-center{position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px;}
.emi-ring-label{font-family:'Space Mono',monospace; font-size:.64rem; letter-spacing:.12em; text-transform:uppercase; color:var(--ash);}
.emi-ring-value{font-family:'Fraunces',serif; font-size:1.7rem; color:var(--paper); font-variant-numeric:tabular-nums;}

.emi-stats{width:100%; display:flex; flex-direction:column; gap:0; margin-bottom:26px;}
.emi-stat{display:flex; align-items:center; gap:10px; padding:13px 0; border-bottom:1px solid rgba(140,106,22,.12); font-size:.86rem; color:var(--ash);}
.emi-stat span:nth-child(2){flex:1; text-align:left;}
.emi-stat b{color:var(--paper); font-family:'Fraunces',serif; font-weight:500; font-variant-numeric:tabular-nums;}
.emi-dot{width:9px; height:9px; border-radius:50%; flex-shrink:0;}
.emi-dot-principal{background:var(--ash-dim);}
.emi-dot-interest{background:linear-gradient(135deg,var(--emi-gold),#B5893A); box-shadow:0 0 8px rgba(217,169,76,.5);}
.emi-stat-total{border-bottom:none; padding-top:16px; margin-top:4px; border-top:1px solid var(--emi-line);}
.emi-stat-total b{font-size:1.15rem; color:var(--emi-gold-light);}
.emi-cta{margin-top:6px;}

@media(max-width:1180px){
  .emi-in{padding:40px;} .emi-out{padding:40px;}
}
@media(max-width:860px){
  .emi-section{padding:80px 0;}
  .emi-glass{grid-template-columns:1fr;}
  .emi-in{border-right:none; border-bottom:1px solid rgba(255,255,255,.08);}
}
@media(max-width:680px){
  .emi-in,.emi-out{padding:32px 26px;}
  .emi-ring-wrap{width:180px; height:180px;}
}
@media(max-width:480px){
  .emi-section{padding:64px 0;}
  .emi-in,.emi-out{padding:26px 20px;}
  .emi-ring-wrap{width:160px; height:160px;}
  .emi-ring-value{font-size:1.4rem;}
  .emi-orb{filter:blur(40px);}
}
@media(max-width:360px){
  .emi-in,.emi-out{padding:22px 16px;}
  .emi-ring-wrap{width:150px; height:150px;}
  .emi-amt-input{width:92px; font-size:.78rem;}
}
@media (prefers-reduced-motion: reduce){
  .emi-orb{animation:none;}
}

/* ===========================================================
   CONTACT PAGE — quick-action cards (contact.html)
   =========================================================== */
.qc-card{display:flex; flex-direction:column; align-items:flex-start; gap:12px; padding:30px 26px;}
.qc-icon{width:52px; height:52px; border-radius:50%; background:var(--gold-dim); display:flex; align-items:center; justify-content:center; transition:transform .4s cubic-bezier(.2,.8,.2,1), background .3s ease;}
.qc-icon svg{width:22px; height:22px; stroke:var(--gold-light); transition:stroke .3s ease;}
.qc-card:hover .qc-icon{transform:rotate(-8deg) scale(1.08); background:var(--gold);}
.qc-card:hover .qc-icon svg{stroke:#fff;}
.qc-card h4{margin-top:2px;}
.qc-card .qc-sub{font-size:.82rem; color:var(--ash); line-height:1.55;}
.qc-arrow{margin-top:auto; padding-top:14px; display:flex; align-items:center; gap:6px; font-family:'Space Mono',monospace; font-size:.7rem; letter-spacing:.06em; text-transform:uppercase; color:var(--gold-light);}
.qc-arrow svg{width:14px; height:14px; stroke:var(--gold-light); transition:transform .3s ease;}
.qc-card:hover .qc-arrow svg{transform:translateX(4px);}
.qc-whatsapp .qc-icon{animation:qcPulse 2.6s ease-in-out infinite;}
@keyframes qcPulse{0%,100%{box-shadow:0 0 0 0 rgba(217,169,76,.4);} 50%{box-shadow:0 0 0 9px rgba(217,169,76,0);}}
@media(max-width:480px){
  .qc-grid{grid-template-columns:1fr;}
}
@media (prefers-reduced-motion: reduce){
  .qc-whatsapp .qc-icon{animation:none;}
}
@keyframes fabPulse{0%,100%{box-shadow:0 10px 26px rgba(0,0,0,.4), 0 0 0 0 rgba(37,211,102,.5);}50%{box-shadow:0 10px 26px rgba(0,0,0,.4), 0 0 0 10px rgba(37,211,102,0);}}

/* ===========================================================
   SERVICE PAGES — capability / material / technology showcase grid
   (services-construction.html, services-architecture.html, services-interior.html)
   =========================================================== */
.mat-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:18px;}
.mat-card{display:flex; align-items:center; gap:14px; background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:20px; position:relative; overflow:hidden; transition:transform .35s cubic-bezier(.2,.8,.2,1), border-color .35s ease, box-shadow .35s ease;}
.mat-card .mat-icon{width:42px; height:42px; border-radius:50%; background:var(--gold-dim); display:flex; align-items:center; justify-content:center; flex-shrink:0;}
.mat-card .mat-icon svg{width:19px; height:19px; stroke:var(--gold-light);}
.mat-card b{display:block; font-size:.86rem;}
.mat-card span{font-size:.72rem; color:var(--ash);}
.mat-card::after{content:''; position:absolute; top:0; left:-75%; width:45%; height:100%; background:linear-gradient(120deg,transparent,rgba(217,169,76,.3),transparent); transform:skewX(-18deg); transition:left .6s ease; pointer-events:none;}
.mat-card:hover{transform:translateY(-4px); border-color:var(--gold-line); box-shadow:0 24px 46px -30px rgba(217,169,76,.32);}
.mat-card:hover::after{left:135%;}
@media(max-width:1180px){.mat-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:480px){.mat-grid{grid-template-columns:1fr;}}

/* Follow Us icon row (social-media.html) — reuses .mat-card/.mat-icon, 5 columns instead of 4 */
.follow-grid{display:grid; grid-template-columns:repeat(5,1fr); gap:18px;}
.follow-grid .mat-icon{color:var(--gold-light);}
@media(max-width:1180px){.follow-grid{grid-template-columns:repeat(3,1fr);}}
@media(max-width:680px){.follow-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:480px){.follow-grid{grid-template-columns:1fr;}}

/* ===========================================================
   SINGLE-PROJECT DETAIL PAGES — glassmorphic icon/description
   cards for Specifications + Amenities (project-perfect-prajaya.html
   and any future single-project detail page)
   =========================================================== */
.gs-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:24px;}
.gs-grid.gs-cols-3{grid-template-columns:repeat(3,1fr);}
.gs-card{
  position:relative; overflow:hidden;
  background:rgba(255,255,255,.6);
  backdrop-filter:blur(22px) saturate(1.6);
  -webkit-backdrop-filter:blur(22px) saturate(1.6);
  border:1px solid rgba(255,255,255,.7);
  border-radius:28px;
  padding:32px 26px;
  box-shadow:0 30px 60px -38px rgba(20,20,20,.3), inset 0 1px 0 rgba(255,255,255,.6);
  transition:opacity .9s cubic-bezier(.2,.7,.2,1), transform .5s cubic-bezier(.2,.8,.2,1), box-shadow .5s ease, border-color .5s ease;
}
.gs-card::before{content:''; position:absolute; top:-60px; right:-60px; width:160px; height:160px; border-radius:50%; background:radial-gradient(circle,rgba(217,169,76,.28),transparent 70%); filter:blur(6px); pointer-events:none; transition:transform .6s ease;}
.gs-card::after{content:''; position:absolute; top:0; left:-75%; width:45%; height:100%; background:linear-gradient(120deg,transparent,rgba(255,255,255,.6),transparent); transform:skewX(-18deg); transition:left .7s ease; pointer-events:none;}
.gs-card:hover{transform:translateY(-8px); box-shadow:0 46px 80px -30px rgba(217,169,76,.4), inset 0 1px 0 rgba(255,255,255,.7); border-color:rgba(217,169,76,.55);}
.gs-card:hover::before{transform:scale(1.35);}
.gs-card:hover::after{left:135%;}
.gs-icon{position:relative; z-index:1; width:58px; height:58px; border-radius:50%; display:flex; align-items:center; justify-content:center; margin-bottom:20px; background:linear-gradient(145deg,var(--gold-light),var(--gold)); box-shadow:0 16px 30px -12px rgba(217,169,76,.6); animation:gsFloat 5s ease-in-out infinite; transition:transform .5s cubic-bezier(.2,.8,.2,1);}
.gs-icon svg{width:25px; height:25px; stroke:#fff;}
.gs-card:hover .gs-icon{transform:rotate(-10deg) scale(1.12); animation-play-state:paused;}
.gs-card h4{position:relative; z-index:1; margin-bottom:8px; font-size:1rem;}
.gs-card p{position:relative; z-index:1; font-size:.83rem; color:var(--ash); line-height:1.65; margin:0;}
@keyframes gsFloat{0%,100%{transform:translateY(0);} 50%{transform:translateY(-6px);}}
@media(max-width:1180px){.gs-grid,.gs-grid.gs-cols-3{grid-template-columns:repeat(2,1fr);}}
@media(max-width:480px){.gs-grid,.gs-grid.gs-cols-3{grid-template-columns:1fr;}}
@media (prefers-reduced-motion: reduce){.gs-icon{animation:none;}}

/* simple bulleted place-name list (used inside .feature-panel for location highlights) */
.loc-list{display:flex; flex-direction:column; gap:12px; margin-top:18px;}
.loc-list li{position:relative; padding-left:18px; font-size:.86rem; color:var(--ash); line-height:1.5;}
.loc-list li::before{content:''; position:absolute; left:0; top:.55em; width:5px; height:5px; border-radius:50%; background:var(--gold);}

/* bank/financial-institution approval banner (pill, animated gold sheen) */
.approve-banner{
  display:flex; align-items:center; justify-content:center; gap:12px; flex-wrap:wrap; text-align:center;
  background:linear-gradient(90deg,var(--gold-light),var(--gold),var(--gold-light));
  background-size:220% auto;
  color:#fff; font-family:'Space Mono',monospace; font-size:.8rem; letter-spacing:.08em; text-transform:uppercase; font-weight:700;
  padding:20px 26px; border-radius:999px;
  box-shadow:0 20px 44px -18px rgba(217,169,76,.55);
  animation:goldSheen 7s linear infinite;
}
.approve-banner svg{width:20px; height:20px; stroke:#fff; flex-shrink:0;}
@media(max-width:480px){.approve-banner{font-size:.68rem; padding:16px 18px; border-radius:20px;}}

/* ===========================================================
   PACKAGE DEEP-DIVE PAGES — tier switch + full comparison table
   (packages-construction.html, packages-architecture.html, packages-interior.html)
   =========================================================== */
.tier-switch{display:flex; justify-content:center; gap:14px; flex-wrap:wrap; margin-bottom:40px;}
.ts-btn{background:#fff; border:1px solid var(--line); border-radius:999px; padding:12px 28px; font-family:'Fraunces',serif; font-weight:600; font-size:.95rem; color:var(--ash); cursor:pointer; transition:transform .3s cubic-bezier(.2,.8,.2,1), background .3s ease, border-color .3s ease, box-shadow .3s ease, color .3s ease;}
.ts-btn:hover{border-color:var(--gold-line); color:var(--paper-dim);}
.ts-btn.on{background:var(--gold); border-color:var(--gold); color:#fff; box-shadow:0 14px 30px -14px rgba(217,169,76,.55); transform:translateY(-2px);}
.ts-btn small{display:block; font-family:'Space Mono',monospace; font-size:.58rem; letter-spacing:.1em; text-transform:uppercase; opacity:.75; margin-top:3px; font-weight:400;}

.cmp-scroll{overflow-x:auto; -webkit-overflow-scrolling:touch; border-radius:var(--radius-lg); box-shadow:0 30px 70px -40px rgba(20,20,20,.2); border:1px solid var(--line);}
.cmp-scroll.compact{overflow-x:visible;}
table.cmp-table{width:100%; min-width:760px; border-collapse:collapse; background:#fff;}
table.cmp-table.compact{min-width:0;}
table.cmp-table th,table.cmp-table td{padding:16px 22px; font-size:.85rem; text-align:center; border-bottom:1px solid var(--line); transition:background .3s ease;}
table.cmp-table thead th{padding:26px 22px 20px; font-family:'Fraunces',serif; font-size:1.05rem; font-weight:600; color:var(--paper); background:var(--panel); white-space:nowrap;}
table.cmp-table thead th span{display:block; font-family:'Space Mono',monospace; font-size:.7rem; color:var(--gold-light); font-weight:700; margin-top:8px; letter-spacing:.02em;}
table.cmp-table .cmp-row-label{text-align:left; font-family:'Space Mono',monospace; font-size:.72rem; letter-spacing:.02em; color:var(--ash); font-weight:700; white-space:nowrap; position:sticky; left:0; background:#fff; z-index:2; box-shadow:1px 0 0 var(--line);}
table.cmp-table thead .cmp-row-label{background:var(--panel); z-index:3;}
table.cmp-table tbody tr:last-child td{border-bottom:none;}
table.cmp-table tbody tr:hover td:not(.cmp-row-label){background:var(--panel-2);}
table.cmp-table .cmp-active{background:var(--gold-dim); box-shadow:inset 0 0 0 1px var(--gold-line);}
table.cmp-table thead th.cmp-active{background:linear-gradient(180deg,var(--panel-2),#fff);}
table.cmp-table .cmp-yes{color:var(--gold-light); font-weight:700;}
table.cmp-table .cmp-no{color:var(--ash-dim);}
@media(max-width:680px){
  table.cmp-table th,table.cmp-table td{padding:13px 16px; font-size:.8rem;}
  table.cmp-table thead th{padding:20px 16px 16px; font-size:.92rem;}
}
@media(max-width:480px){
  .tier-switch{gap:10px; margin-bottom:30px;}
  .ts-btn{padding:10px 20px; font-size:.86rem;}
}

/* ===========================================================
   BLOG — featured post card, byline, category filter (blog.html)
   =========================================================== */
.featured-post{display:grid; grid-template-columns:1.1fr .9fr; gap:0; border:1px solid var(--gold-line); border-radius:var(--radius-lg); overflow:hidden; background:#fff; margin-bottom:60px;}
.featured-post.no-img{grid-template-columns:1fr;}
.featured-post .fp-img{position:relative; overflow:hidden; min-height:340px; background:var(--panel);}
.featured-post .fp-img img{width:100%; height:100%; object-fit:contain; transition:transform .6s ease; display:block;}
.featured-post:hover .fp-img img{transform:scale(1.05);}
.featured-post .fp-tag{position:absolute; top:20px; left:20px; background:var(--gold); color:#fff; font-family:'Space Mono',monospace; font-size:.66rem; letter-spacing:.08em; text-transform:uppercase; padding:7px 14px; border-radius:30px;}
.featured-post .fp-body{padding:44px; display:flex; flex-direction:column; justify-content:center;}
.featured-post h3{font-size:1.7rem; margin:14px 0 16px; line-height:1.2;}
.featured-post p{color:var(--ash); font-size:.92rem; line-height:1.7; margin-bottom:22px;}
.fp-avatar{width:36px; height:36px; border-radius:50%; background:var(--gold-dim); color:var(--gold-light); display:flex; align-items:center; justify-content:center; font-family:'Fraunces',serif; font-weight:600; flex-shrink:0; font-size:.9rem;}
.blog-byline{display:flex; align-items:center; gap:10px;}
.featured-post .blog-byline{margin-top:6px;}
.blog-byline b{display:block; font-size:.84rem; color:var(--paper);}
.blog-byline span{font-size:.76rem; color:var(--ash);}
.blog-card .blog-byline{margin-top:14px; padding-top:14px; border-top:1px solid var(--line);}
.blog-card .fp-avatar{width:26px; height:26px; font-size:.68rem;}

.blog-card{transition:opacity .3s ease, transform .3s ease;}
.blog-card.bc-hide{opacity:0; transform:scale(.96); pointer-events:none;}

.form-row.nl-row{grid-template-columns:1fr auto; align-items:center;}
@media(max-width:680px){
  .form-row.nl-row{grid-template-columns:1fr;}
}

@media(max-width:860px){
  .featured-post{grid-template-columns:1fr;}
  .featured-post .fp-img{min-height:260px;}
  .featured-post .fp-body{padding:32px;}
}
@media(max-width:480px){
  .featured-post .fp-body{padding:26px 22px;}
  .featured-post h3{font-size:1.4rem;}
}

/* ===========================================================
   COST ESTIMATOR — live segmented cost-breakdown bar (cost-estimator.html)
   =========================================================== */
.cost-bar-wrap{margin:30px 0 6px;}
.cost-bar-label{display:flex; justify-content:space-between; font-family:'Space Mono',monospace; font-size:.64rem; letter-spacing:.06em; text-transform:uppercase; color:var(--ash); margin-bottom:10px;}
.cost-bar{display:flex; width:100%; height:14px; border-radius:30px; overflow:hidden; background:var(--panel-2); box-shadow:inset 0 0 0 1px var(--line);}
.cost-seg{height:100%; width:0; transition:width .7s cubic-bezier(.2,.8,.2,1); min-width:0;}
.cost-seg-con{background:var(--gold);}
.cost-seg-arc{background:var(--gold-light);}
.cost-seg-int{background:#c9a96e;}
.cost-seg-gst{background:var(--ash-dim);}
.cost-bar-legend{display:flex; flex-wrap:wrap; gap:16px; margin-top:14px;}
.cost-bar-legend span{display:flex; align-items:center; gap:7px; font-size:.74rem; color:var(--ash);}
.cost-bar-legend i{width:9px; height:9px; border-radius:50%; display:inline-block;}
@media(max-width:480px){
  .cost-bar-legend{gap:10px 14px;}
}

/* ===========================================================
   BLOG ARTICLE — single-post detail pages (blog-perfect-*.html)
   =========================================================== */
.article-body{max-width:760px; margin:48px auto 0;}
.article-body p{font-size:1.05rem; line-height:1.85; color:var(--paper-dim); margin-bottom:24px;}
.article-body h2{font-size:clamp(1.5rem,2.4vw,2.1rem); margin:52px 0 20px; line-height:1.18;}
.article-body h2:first-child{margin-top:0;}
.article-body .lede-drop{font-size:1.14rem; color:var(--paper); font-family:'Fraunces',serif;}

.article-byline{display:flex; align-items:center; gap:14px; margin-bottom:40px; padding-bottom:26px; border-bottom:1px solid var(--line);}
.article-byline .fp-avatar{width:46px; height:46px; font-size:1.1rem; flex-shrink:0;}
.article-byline b{display:block; font-size:.94rem; color:var(--paper);}
.article-byline span{font-size:.78rem; color:var(--ash);}

.quickfacts{background:var(--panel); border:1px solid var(--gold-line); border-radius:var(--radius-lg); padding:32px 36px; margin:8px 0 46px; display:grid; grid-template-columns:repeat(2,1fr); gap:24px 32px;}
.quickfacts .qf-head{grid-column:1/-1; font-family:'Space Mono',monospace; font-size:.68rem; letter-spacing:.14em; text-transform:uppercase; color:var(--gold-light); margin:0;}
.qf-item{display:flex; flex-direction:column; gap:5px;}
.qf-item b{font-family:'Fraunces',serif; font-size:1.08rem; color:var(--paper); line-height:1.3;}
.qf-item span{font-size:.7rem; letter-spacing:.07em; text-transform:uppercase; color:var(--ash);}

.pull-quote{margin:46px 0; padding:4px 0 4px 28px; border-left:3px solid var(--gold); font-family:'Fraunces',serif; font-style:italic; font-size:1.4rem; line-height:1.5; color:var(--paper);}

.article-img{margin:44px 0;}
.article-img .img-frame img{border-radius:var(--radius-lg);}
.article-img-cap{text-align:center; font-size:.78rem; color:var(--ash); margin-top:14px; letter-spacing:.02em;}

.article-body .grid-3{margin:0 0 46px;}
.article-body .feature-panel{padding:28px;}
.article-body .feature-panel .fp-title{margin-bottom:16px; font-size:1rem;}

@media(max-width:680px){
  .quickfacts{grid-template-columns:1fr 1fr; padding:26px 22px; gap:20px 22px;}
  .pull-quote{font-size:1.2rem; padding-left:20px;}
}
@media(max-width:480px){
  .quickfacts{grid-template-columns:1fr; padding:24px 20px;}
  .article-byline{gap:12px;}
}