/* ============================================================
   TRIDENT PARKTOWN — SINGLE FILE BUILD
   Palette: ivory #F1F0EC · green #1F4A36 · green-dk #12261C · gold #D8A860
   ============================================================ */

:root{
  --green:#1F4A36;
  --green-d:#12261C;
  --green-dd:#0E1F16;
  --gold:#D8A860;
  --gold-d:#C08A4E;
  --ivory:#F1F0EC;
  --ink:#0A0F09;
  --muted:#6A776D;
  --line:#E7E5DD;

  --optima:'Optima','Gill Sans','Segoe UI',sans-serif;
  --body:'Avant Garde','Century Gothic','Segoe UI',sans-serif;
}

*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; }
body{
  font-family:var(--body);
  color:var(--green-d);
  background:var(--ivory);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{ max-width:100%; display:block; }
a{ color:inherit; }
button{ font:inherit; cursor:pointer; }
section{ position:relative; }

/* ---------------------------------------------------------
   NAVBAR
--------------------------------------------------------- */
.nav{
  position:sticky; top:0; z-index:1000; width:100%;
  background:linear-gradient(to bottom, rgba(10,15,9,.58) 0%, rgba(10,15,9,.28) 62%, transparent 100%);
  transition:background-color .35s ease;
}
.nav.solid{
  background:rgba(18,38,28,.9);
  backdrop-filter:blur(14px);
}
.nav-inner{
  max-width:1400px; margin:0 auto;
  padding:0 clamp(18px,4vw,60px);
  display:flex; align-items:center; justify-content:space-between;
  height:76px; gap:16px;
}
.nav-logo{ display:flex; align-items:center; gap:10px; }
.nav-logo .mark{
  width:38px; height:38px; border:1.5px solid var(--gold); border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  color:var(--gold); font-family:var(--optima); font-size:15px;
}
.nav-logo .word{ color:var(--ivory); font-family:var(--optima); font-size:15px; letter-spacing:3px; }
.nav-links{ display:flex; gap:6px; }
.nav-links a{
  font-size:12px; letter-spacing:.15em; text-transform:uppercase;
  color:rgba(241,240,236,.82); text-decoration:none;
  padding:9px 13px; border-radius:2px;
  transition:color .2s,background .2s;
}
.nav-links a:hover{ color:var(--ivory); background:rgba(216,168,96,.1); }
.nav-links a.active{ color:var(--gold); font-weight:700; }
.nav-cta{
  background:linear-gradient(135deg,var(--green),var(--green-d));
  border:1px solid rgba(216,168,96,.35); border-radius:4px;
  padding:12px 26px; color:var(--ivory); text-decoration:none;
  font-size:12px; letter-spacing:.14em; text-transform:uppercase;
  white-space:nowrap; transition:transform .2s,box-shadow .2s;
}
.nav-cta:hover{ transform:translateY(-1px); box-shadow:0 6px 18px rgba(10,15,9,.5); }
.hamburger{
  display:none; flex-direction:column; gap:5px; background:none; border:none; padding:6px;
}
.hamburger span{ width:22px; height:2px; background:var(--gold); border-radius:2px; transition:.3s; }
.hamburger.open span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.hamburger.open span:nth-child(2){ opacity:0; }
.hamburger.open span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }
.mobile-menu{
  display:none; flex-direction:column;
  background:rgba(18,38,28,.97); backdrop-filter:blur(14px);
}
.mobile-menu.open{ display:flex; }
.mobile-menu a{
  padding:16px 26px; color:rgba(241,240,236,.85); text-decoration:none;
  font-size:13px; letter-spacing:.14em; text-transform:uppercase;
  border-bottom:1px solid rgba(241,240,236,.06);
}
.mobile-menu .mm-cta{ margin:16px 26px; background:linear-gradient(135deg,var(--green),var(--green-d));
  border:1px solid rgba(216,168,96,.35); border-radius:4px; text-align:center; padding:14px; }

@media (max-width:960px){
  .nav-links,.nav-cta{ display:none; }
  .hamburger{ display:flex; }
}

/* ---------------------------------------------------------
   HERO
--------------------------------------------------------- */
.hero{
  position:relative; min-height:100vh; margin-top:-76px;
  display:flex; align-items:flex-end; overflow:hidden;
}
.hero-bg{ position:absolute; inset:0; z-index:0; }
.hero-slide{
  position:absolute; inset:0; background-size:cover; background-position:center;
  opacity:0; animation:heroFade 24s infinite;
}
.hero-slide:nth-child(1){ animation-delay:0s; }
.hero-slide:nth-child(2){ animation-delay:6s; }
.hero-slide:nth-child(3){ animation-delay:12s; }
.hero-slide:nth-child(4){ animation-delay:18s; }
@keyframes heroFade{ 0%{opacity:0;} 4%{opacity:1;} 22%{opacity:1;} 28%{opacity:0;} 100%{opacity:0;} }

.hero-scrim{
  position:absolute; inset:0; z-index:1; pointer-events:none;
  background:
    linear-gradient(to top, rgba(6, 12, 8, .94) 0%, rgb(6 12 8 / 89%) 22%, rgb(6 12 8 / 58%) 46%, transparent 66%);
}
.hero-content{
  position:relative; z-index:3; width:100%;
  max-width:1400px; margin:0 auto;
  padding:0 clamp(6px,4vw,10px) clamp(40px,6vw,64px);
  display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:28px;
}
.hero-brand .divider{ width:100%; height:2px; background:linear-gradient(90deg,var(--gold),var(--ivory)); margin:7px; }
.hero-brand .logo-word{ font-family:var(--optima); font-size:14px; letter-spacing:6px; color:var(--gold); }
.hero-brand .project{ font-family:var(--optima); font-size:32px; font-weight:700; color:var(--ivory); letter-spacing:3px; margin-top:4px; }
.hero-brand .line{ font-size:12px; letter-spacing:1.8px; text-transform:uppercase; color:rgba(241,240,236,.86); margin-top:14px; }
.hero-brand .price{ display:flex; align-items:baseline; gap:8px; margin-top:16px; }
.hero-brand .price .lbl{ font-size:11px; letter-spacing:1px;font-weight: bold; text-transform:uppercase; color:var(--gold); }
.hero-brand .price .val{ font-family:var(--optima); font-weight:700; font-size:30px; color:var(--ivory); }
.hero-brand .price .val sup{ font-size:13px; color:var(--gold); }

.hero-points{ display:flex; flex-direction:column; align-items:flex-end; gap:16px; }
.hero-points-label{ font-size:12px; letter-spacing:1.5px; text-transform:uppercase; color:var(--gold); text-align:right; }
.hero-point .row{ display:flex; align-items:center; gap:11px; }
.hero-point .dot{ width:6px; height:6px; background:var(--gold); transform:rotate(45deg); flex-shrink:0; }
.hero-point .txt{ font-size:14px; font-weight:600; letter-spacing:0.5px; text-transform:uppercase; color:var(--ivory); white-space:nowrap; }
.hero-point .rule{ width:100%; height:1px; margin-top:8px; background:linear-gradient(90deg,rgba(216,168,96,0) 0%,rgba(216,168,96,.35) 45%,var(--gold) 100%); }

.hero-center{ display:flex; flex-direction:column; align-items:center; gap:18px; text-align:center; margin:0 auto; }
.offer-pill{
  font-size:12px; font-weight:700; letter-spacing:1.5px; text-transform:uppercase; color:var(--green-d);
  background:linear-gradient(135deg,#EBCB8E 0%,var(--gold) 48%,var(--gold-d) 100%);
  border-radius:100px; padding:9px 26px; white-space:nowrap;
}
.btn-main{
  background:linear-gradient(135deg,var(--green),var(--green-d));
  border:1px solid rgba(216,168,96,.35); border-radius:4px; padding:15px 34px;
  color:var(--ivory); text-decoration:none; font-size:14px; letter-spacing:1.5px; text-transform:uppercase;
  display:inline-block; transition:transform .15s,box-shadow .2s;
}
.btn-main:hover{ transform:translateY(-1px); box-shadow:0 6px 20px rgba(10,15,9,.6); }

@media (max-width:880px){
  .hero-content{ flex-direction:column; align-items:center; text-align:center; }
  .hero-brand{ display:flex; flex-direction:column; align-items:center; }
  .hero-points{ align-items:center; }
  .hero-point .txt{ font-size:12px; }
}

/* ---------------------------------------------------------
   OVERVIEW
--------------------------------------------------------- */
.overview{
  background-image: url(images/bg.png);
  background-size: cover;
  background-repeat: no-repeat; 
   color:var(--ivory);
  padding:clamp(56px,6.5vw,104px) clamp(24px,6vw,96px);
}
.ov-inner{ max-width:1180px; margin:0 auto; }
.ov-head{ text-align:center; max-width:820px; margin:0 auto clamp(34px,4vw,60px); }
.ov-eyebrow{ font-size:11px; font-weight:600; letter-spacing:.42em; text-transform:uppercase; color:var(--gold); margin-bottom:22px; }
.ov-title{
  font-family:var(--optima); font-weight:bold; font-size:clamp(22px,3.4vw,40px);
  line-height:1.2; letter-spacing:.2em; text-transform:uppercase; color:var(--ivory);
}
.ov-title .c1{ color:#E8B93E; } .ov-title .c2{ color:#5FA6C9; } .ov-title .c3{ color:#7FBF93; } .ov-title .c4{ color:#E0894A; }
.ov-rule{ width:58px; height:1px; background:linear-gradient(90deg,transparent,var(--gold),transparent); margin:26px auto 0; }
.ov-lede{ font-size:15px; line-height:1.85; color:rgba(241,240,236,.82); max-width:720px; margin:26px auto 0; }

.ov-grid{ display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid rgba(216,168,96,.22); border-left:1px solid rgba(216,168,96,.22); margin-top:clamp(40px,4.5vw,66px); }
.ov-cell{ padding:clamp(30px,3vw,46px) clamp(12px,1.4vw,36px); border-right:1px solid rgba(216,168,96,.22); border-bottom:1px solid rgba(216,168,96,.22); transition:background .35s; }
.ov-cell:hover{ background:#1421168a; }
.ov-num{ font-family:var(--optima); font-size:clamp(24px,3.4vw,44px); color:var(--ivory); }
.ov-num sup{ font-size:.4em; color:var(--gold); }
.ov-numline{ width:34px; height:1px; margin:16px 0 14px; background:linear-gradient(90deg,var(--gold),rgba(216,168,96,0)); }
.ov-label{ font-size:14px; font-weight:600; letter-spacing:1px; text-transform:uppercase; color:rgba(241,240,236,.92); }
.ov-sub{ font-size:12.5px; line-height:1.6; color:rgba(241,240,236,.62); margin-top:8px; }
.ov-foot{ text-align:center; margin-top:36px; font-size:12px; letter-spacing:.18em;font-weight: bold; text-transform:uppercase; color:rgba(241,240,236,.6); }
.ov-foot b{ color:var(--gold); }
@media (max-width:900px){ .ov-grid{ grid-template-columns:repeat(2,1fr); } }

/* ---------------------------------------------------------
   SEVEN CHAKRAS
--------------------------------------------------------- */
.chakras{ background:#F6F5F1; padding:clamp(52px,5vw,88px) 0; overflow:hidden; }
.cn-inner{ max-width:1220px; margin:0 auto; padding:0 clamp(24px,1vw,90px); }
.cn-eyebrow{ font-size:11px; font-weight:600; letter-spacing:.34em; text-transform:uppercase; color:var(--gold-d); margin-bottom:14px; }
.cn-head{ display:flex; align-items:flex-end; gap:24px; flex-wrap:wrap; }
.cn-seven{ font-family:var(--optima); font-weight:700; font-size:clamp(46px,8vw,96px); line-height:.86; color:var(--green-d); }
.cn-stack{ font-family:var(--optima); font-style:italic; font-size:clamp(15px,1.9vw,23px); line-height:1.3; color:var(--green); }
.cn-spectrum{ height:3px; width:100%; margin-top:22px; border-radius:3px; background:linear-gradient(90deg,#7B5EA7,#3F4E9C,#3E7CB1,#4C9A6C,#E4B02E,#E0762F,#C0392B); }
.cn-lede{ font-size:14px; line-height:1.85; color:var(--green-d); max-width:760px; margin-top:22px; }

.cn-viewport{ position:relative; margin-top:36px; overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent); }
.cn-track{ display:flex; gap:20px; width:max-content; animation:cnScroll 42s linear infinite; }
.cn-viewport:hover .cn-track{ animation-play-state:paused; }
@keyframes cnScroll{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }

.cn-card{ --c:#4C9A6C; flex:0 0 auto; width:250px; background:#fff; border:1px solid rgba(31,74,54,.1); border-radius:4px; overflow:hidden; box-shadow:0 10px 30px -18px rgba(18,38,28,.4); transition:transform .3s; }
.cn-card:hover{ transform:translateY(-6px); }
.cn-img{ position:relative; aspect-ratio:3/3.7; overflow:hidden; }
.cn-img img{ width:100%; height:100%; object-fit:cover; }
.cn-tab{ position:absolute; top:0; left:0; right:0; height:4px; background:var(--c); z-index:2; }
.cn-body{ padding:16px 18px 20px; }
.cn-name{ font-family:var(--optima); font-style:italic; font-size:19px; color:var(--green-d); margin-bottom:8px; }
.cn-insp{ display:flex; align-items:center; gap:8px; font-size:12px;font-weight: bold; color:var(--muted); }
.cn-dot{ width:9px; height:9px; border-radius:50%; background:var(--c); }
.cn-core{ font-size:10px; font-weight:600; letter-spacing:.18em; text-transform:uppercase; color:var(--c); margin-top:12px; }

.cn-cta-row{ text-align:center; margin-top:44px; display:flex; flex-direction:column; align-items:center; gap:14px; }
.cn-cta-note{ font-size:12px; color:var(--muted); }
.btn-dark{
  display:inline-flex; align-items:center; gap:10px; background:linear-gradient(135deg,var(--green),var(--green-d));
  border:1px solid rgba(216,168,96,.4); border-radius:4px; padding:15px 34px; text-decoration:none; color:#F6F5F1;
  font-size:12px; font-weight:600; letter-spacing:.15em; text-transform:uppercase; transition:transform .2s,box-shadow .2s;
}
.btn-dark:hover{ transform:translateY(-1px); box-shadow:0 12px 28px -10px rgba(18,38,28,.6); }
.btn-dark .arw{ color:var(--gold); }

/* ---------------------------------------------------------
   PROJECT HIGHLIGHTS
--------------------------------------------------------- */
.highlights{ background:var(--green); color:var(--ivory); }
.ph-card{ display:flex; flex-wrap:wrap; align-items:stretch; }
.ph-media{ flex:1.3 1 280px; position:relative; min-height:520px; overflow:hidden; background:var(--green-dd); }
.ph-media img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.ph-media::after{ content:''; position:absolute; inset:0; pointer-events:none; background:linear-gradient(to top,rgba(14,31,22,.66),transparent 46%); }
.ph-caption{ position:absolute; z-index:2; left:32px; bottom:32px; }
.ph-caption .name{ font-family:var(--optima); font-size:clamp(27px,2.6vw,30px); color:var(--ivory);font-weight:bold }
.ph-caption .tag{ font-size:12px; font-weight: bold; letter-spacing:2px; text-transform:uppercase; color:var(--gold); margin-top:10px; }
.ph-body{ flex:1 1 420px; display:flex; flex-direction:column; justify-content:center; padding:clamp(48px,3vw,90px) clamp(30px,2vw,80px); }
.ph-eyebrow{ font-size:11px; font-weight:600; letter-spacing:.34em; text-transform:uppercase; color:var(--gold); margin-bottom:18px; }
.ph-title{ font-family:var(--optima); font-size:clamp(30px,3.4vw,42px); line-height:1.14; margin-bottom:18px;font-weight:500 }
.ph-intro{ font-size:14px; line-height:1.8; color:rgba(241,240,236,.78); max-width:100%; margin-bottom:20px; }
.ph-list{ display:flex; flex-direction:column; }
.ph-item{ display:flex; align-items:center; gap:20px; padding:16px 0; border-top:1px solid rgba(216,168,96,.24); transition:background .3s; }
.ph-item:last-child{ border-bottom:1px solid rgba(216,168,96,.24); }
.ph-item:hover{ background:rgba(216,168,96,.06); }
.ph-num{ font-family:var(--optima); font-size:15px; color:var(--gold); min-width:120px; white-space:nowrap; }
.ph-tx{ font-size:13px; color:rgba(241,240,236,.88); }
.ph-link{
  display:inline-flex; align-items:center; gap:10px; margin-top:32px; width:100%;    justify-content: center;
  font-size:12px; font-weight:600; letter-spacing:.16em; text-transform:uppercase; color:var(--green-d)!important;
  text-decoration:none!important; background:var(--gold); border:1px solid var(--gold); border-radius:4px; padding:16px 34px;
  transition:background .3s, transform .2s;
}
.ph-link:hover{ background:#E4B877; transform:translateY(-1px); }
@media (max-width:880px){ .ph-card{ flex-direction:column; } .ph-media{ min-height:100%; } }

/* ---------------------------------------------------------
   AMENITIES
--------------------------------------------------------- */
.amenities{ background:url(images/amenities-bg.webp);background-size:cover;background-repeat: no-repeat;
 color:var(--ivory); padding:clamp(48px,5vw,84px) 0; }
 .amenities::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.51);
  z-index: -1;
}
.amenities {
  position: relative;
  isolation: isolate;
}

.am-inner{ max-width:1320px; margin:0 auto; padding:0 clamp(22px,5vw,64px); }
.am-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:30px; flex-wrap:wrap; margin-bottom:34px; }
.am-title{ font-family:var(--optima); font-size:clamp(26px,4vw,42px); }
.am-sub{ font-size:15px; line-height:1.7; color:rgba(241,240,236,.82); margin-top:12px; max-width:60ch; }
.am-nav{ display:flex; gap:12px; }
.am-arrow{ width:48px; height:48px; border:1px solid rgba(216,168,96,.5); background:rgba(14,31,22,.3); color:var(--ivory); display:flex; align-items:center; justify-content:center; transition:.3s; }
.am-arrow:hover{ background:var(--gold); color:var(--green-d); }
.am-arrow:disabled{ opacity:.3; cursor:default; }
.am-arrow svg{ width:18px; height:18px; }

.am-viewport{ overflow:hidden; }
.am-track{ display:flex; gap:18px; transition:transform .6s cubic-bezier(.22,.61,.36,1); }
.am-card{ position:relative; flex:0 0 auto; width:calc((100% - 36px)/3); height:250px; overflow:hidden; background:linear-gradient(150deg,#28563f,#12261C); }
.am-card img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.am-card::after{ content:''; position:absolute; inset:0; background:linear-gradient(to top,rgba(14,31,22,.85),transparent 55%); }
.am-content{ position:absolute; z-index:2; left:0; right:0; bottom:0; padding:22px; }
.am-name{ font-family:var(--optima); font-size:21px; }
.am-progress{ margin-top:30px; height:2px; width:100%; background:rgba(241,240,236,.18); position:relative; overflow:hidden; }
.am-progress span{ position:absolute; top:0; left:0; height:100%; background:linear-gradient(90deg,var(--gold),var(--ivory)); transition:.6s; }

.am-cols{ display:grid; grid-template-columns:repeat(5,1fr); gap:26px; border-top:1px solid rgba(216,168,96,.22); padding-top:26px; margin-top:44px; }
.am-cat h4{ font-size:11px; font-weight:600; letter-spacing:.2em; text-transform:uppercase; color:var(--gold); margin-bottom:12px; }
.am-cat ul{ list-style:none; display:flex; flex-direction:column; gap:8px; }
.am-cat li{ font-size:12.5px; color:rgba(241,240,236,.86); display:flex; gap:8px; }
.am-cat li::before{ content:''; width:5px; height:5px; margin-top:5px; background:var(--gold); flex:none; transform:rotate(45deg); }
.am-cta-row{ margin-top:36px; }
.am-cta{
  display:inline-flex; align-items:center; gap:10px; font-size:12px; font-weight:600; letter-spacing:.16em; text-transform:uppercase;
  color:var(--green-d)!important; text-decoration:none!important; background:var(--gold); border:1px solid var(--gold); border-radius:4px;
  padding:16px 34px; transition:background .3s;
}
.am-cta:hover{ background:#E4B877; }
.am-note{ font-size:11.5px; line-height:1.6; margin-top:20px; max-width:74ch; color:rgba(241,240,236,.6); }
@media (max-width:1024px){ .am-card{ width:calc((100% - 18px)/2); } .am-cols{ grid-template-columns:repeat(3,1fr); } }
@media (max-width:640px){ .am-card{ width:82%; } .am-cols{ grid-template-columns:repeat(2,1fr); } .am-head{ flex-direction:column; align-items:flex-start; } }

/* ---------------------------------------------------------
   LOCATION ADVANTAGE
--------------------------------------------------------- */
.location{ background:#fff; padding:clamp(48px,5vw,80px) 0; }
.la-inner{ max-width:1280px; margin:0 auto; padding:0 clamp(22px,5vw,56px); }
.la-grid{ display:grid; grid-template-columns:1.05fr 1fr; gap:clamp(28px,4vw,56px); align-items:center; }
.la-eyebrow{ font-size:11px; font-weight:bold; letter-spacing:.34em; text-transform:uppercase; color:var(--gold-d); margin-bottom:12px; }
.la-title{ font-family:var(--optima); font-size:clamp(24px,3vw,38px); line-height:1.15; margin-bottom:26px; font-weight: 500}
.la-cards{ display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.la-cell{ background:#fff; border:1px solid var(--line); border-left:3px solid var(--gold); padding:12px 15px; display:flex; align-items:center; gap:11px; transition:.25s; }
.la-cell:hover{ transform:translateY(-2px); box-shadow:0 12px 26px -16px rgba(18,38,28,.4); border-left-color:var(--green); }
.la-pin svg{ width:17px; height:17px; stroke:var(--gold-d); fill:none; }
.la-place{ font-size:13.5px; font-weight:600; color:var(--green-d); }
.la-dist{ font-family:var(--optima); font-size:13px; color:var(--gold-d); margin-top:2px; }
.la-cta{
  display:inline-flex; align-items:center; gap:10px; margin-top:24px; font-size:12px; font-weight:600; letter-spacing:.15em; text-transform:uppercase;
  color:#fff!important; text-decoration:none!important; background:linear-gradient(135deg,var(--green),var(--green-d)); border:1px solid rgba(216,168,96,.4);
  border-radius:4px; padding:15px 34px; transition:transform .2s;
}
.la-cta:hover{ transform:translateY(-2px); }
.la-note{ font-size:11px; color:var(--muted); margin-top:16px; }
.la-media{ position:relative; min-height:440px; height:100%; overflow:hidden; background:linear-gradient(150deg,#28563f,#12261C); border:1px solid rgba(31,74,54,.12); }
.la-media img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.la-media::after{ content:''; position:absolute; inset:0; background:linear-gradient(to top,rgba(14,31,22,.6),transparent 45%); }
.la-caption{ position:absolute; z-index:2; left:28px; bottom:28px; }
.la-caption .name{ font-family:var(--optima); font-size:26px; color:#F1F0EC; }
.la-caption .tag{ font-size:11px; letter-spacing:2px; text-transform:uppercase; color:var(--gold); margin-top:8px; }
@media (max-width:880px){ .la-grid{ grid-template-columns:1fr; } .la-media{ min-height:300px; order:-1; } }
@media (max-width:480px){ .la-cards{ grid-template-columns:1fr; } }

/* ---------------------------------------------------------
   GALLERY
--------------------------------------------------------- */
.gallery{ background:#132c23; padding:clamp(48px,6vw,88px) 0; color:var(--ivory); }
.gl-inner{ max-width:1320px; margin:0 auto; padding:0 clamp(22px,5vw,64px); }
.gl-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:30px; flex-wrap:wrap; margin-bottom:34px; }
.gl-eyebrow{ font-size:11px; font-weight:600; letter-spacing:.34em; text-transform:uppercase; color:var(--gold); margin-bottom:14px; }
.gl-title{ font-family:var(--optima); font-size:clamp(26px,4vw,40px); }
.gl-note{ font-size:12px; color:rgba(241,240,236,.72); }
.gl-grid{ display:grid; grid-template-columns:repeat(12,1fr); grid-auto-rows:190px; gap:14px; }
.gl-item:nth-child(1){ grid-column:span 6; grid-row:span 2; }
.gl-item:nth-child(2){ grid-column:span 3; }
.gl-item:nth-child(3){ grid-column:span 3; }
.gl-item:nth-child(4){ grid-column:span 3; }
.gl-item:nth-child(5){ grid-column:span 3; }
.gl-item:nth-child(6){ grid-column:span 12; }
.gl-item{ position:relative; overflow:hidden; cursor:pointer; background:linear-gradient(150deg,#28563f,#12261C); }
.gl-item img{ width:100%; height:100%; object-fit:cover; transition:transform .5s; }
.gl-item:hover img{ transform:scale(1.08); }
.gl-cap{ position:absolute; z-index:2; left:16px; bottom:14px; font-size:12px; font-weight:600; letter-spacing:1.4px; text-transform:uppercase; color:#fff; text-shadow:0 2px 10px rgba(0,0,0,.5); }
@media (max-width:900px){
  .gl-grid{ grid-auto-rows:170px; }
  .gl-item:nth-child(1){ grid-column:span 12; grid-row:span 2; }
  .gl-item:nth-child(2),.gl-item:nth-child(3),.gl-item:nth-child(4),.gl-item:nth-child(5){ grid-column:span 6; }
  .gl-item:nth-child(6){ grid-column:span 12; }
}

/* lightbox */
.lightbox{ position:fixed; inset:0; z-index:9999; background:rgba(9,15,10,.95); display:flex; align-items:center; justify-content:center; padding:clamp(20px,5vw,80px); opacity:0; visibility:hidden; transition:.35s; }
.lightbox.open{ opacity:1; visibility:visible; }
.lightbox img{ max-width:100%; max-height:100%; object-fit:contain; box-shadow:0 30px 80px -20px rgba(0,0,0,.75); }
.lb-close,.lb-arrow{ position:absolute; background:none; border:1px solid rgba(241,240,236,.55); color:var(--ivory); display:flex; align-items:center; justify-content:center; cursor:pointer; transition:.3s; }
.lb-close{ top:26px; right:30px; width:46px; height:46px; }
.lb-arrow{ top:50%; transform:translateY(-50%); width:50px; height:50px; }
.lb-prev{ left:20px; } .lb-next{ right:20px; }
.lb-close:hover,.lb-arrow:hover{ background:rgba(216,168,96,.35); border-color:var(--gold); }
.lb-close svg,.lb-arrow svg{ width:20px; height:20px; }

/* ---------------------------------------------------------
   FOOTER
--------------------------------------------------------- */
.footer{ background:#000; color:var(--ivory); }
.ft-accent{ height:2px; background:linear-gradient(90deg,var(--gold) 0%,rgba(216,168,96,.25) 70%,transparent 100%); }
.ft-top{ border-bottom:1px solid rgba(216,168,96,.16); padding:32px 28px; }
.ft-top-inner{ max-width:1200px; margin:0 auto; display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:22px; }
.ft-logo{ font-family:var(--optima); letter-spacing:3px; font-size:15px; }
.ft-contact-label{ font-size:9px; font-weight:700; letter-spacing:2.5px; text-transform:uppercase; color:rgba(241,240,236,.42); margin-bottom:6px; }
.ft-contact-number{ font-size:19px; font-weight:700; color:var(--ivory); text-decoration:none; }
.ft-contact-number:hover{ color:var(--gold); }
.ft-mid{ padding:16px 28px; border-bottom:1px solid rgba(216,168,96,.1); }
.ft-mid-inner{ max-width:1200px; margin:0 auto; display:flex; justify-content:space-between; flex-wrap:wrap; gap:14px; }
.ft-nav a{ font-size:11px; color:rgba(241,240,236,.58); text-decoration:none; padding:5px 11px; }
.ft-nav a:hover{ color:#fff; }
.ft-copy{ font-size:11px; color:rgba(241,240,236,.38); }
.ft-disclaimer{ padding:22px 28px; border-bottom:1px solid rgba(216,168,96,.1); }
.ft-disclaimer-inner{ max-width:1200px; margin:0 auto; }
.ft-disclaimer-label{ font-size:9px; font-weight:700; letter-spacing:2px; text-transform:uppercase; color:var(--gold); margin-bottom:8px; }
.ft-disclaimer-text{ font-size:10px; line-height:1.75; color:rgba(241,240,236,.32); }
.ft-bottom{ padding:13px 28px; text-align:center; }
.ft-bottom span{ font-size:10px; color:rgba(241,240,236,.28); }

/* ---------------------------------------------------------
   MOBILE STICKY CTA
--------------------------------------------------------- */
.mobile-cta-bar{ display:none; position:fixed; left:0; right:0; bottom:0; z-index:990; box-shadow:0 -8px 28px rgba(0,0,0,.4); }
.mobile-cta-bar .row{ display:flex; }
.mobile-cta-bar a{ flex:1; display:flex; align-items:center; justify-content:center; gap:9px; padding:16px 10px; font-size:12px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; text-decoration:none; }
.mcb-ghost{ background:var(--green-d); color:var(--ivory)!important; }
.mcb-solid{ background:var(--gold); color:var(--green-d)!important; border-left:1px solid rgba(18,38,28,.18); }
@media (max-width:640px){ .mobile-cta-bar{ display:block; } body{ padding-bottom:56px; } }

/* ---------------------------------------------------------
   ENQUIRY MODAL
--------------------------------------------------------- */
.modal-overlay{ position:fixed; inset:0; z-index:2000; background:rgba(0,0,0,.7); display:none; align-items:center; justify-content:center; padding:20px; }
.modal-overlay.open{ display:flex; }
.modal-box{ position:relative; width:100%; max-width:440px; background:linear-gradient(160deg,#100e0b,#08070500 60%),#0c0b09; padding:36px 34px; box-shadow:0 30px 80px rgba(0,0,0,.6); }
.modal-box::before{ content:''; position:absolute; top:0; left:0; right:0; height:2px; background:linear-gradient(90deg,#D8B87A,rgba(216,184,122,.15) 70%,transparent); }
.modal-close{ position:absolute; top:16px; right:16px; width:30px; height:30px; display:grid; place-items:center; background:none; border:none; color:#8f8a80; border-radius:50%; }
.modal-close:hover{ color:#D8B87A; background:rgba(216,184,122,.08); }
.modal-title{ font-family:'Optima',sans-serif; font-size:22px; font-weight:300; letter-spacing:.2em; text-transform:uppercase; color:#f2ede4; text-align:center; }
.modal-title b{ font-weight:700; color:#fff; }
.modal-sub{ font-size:12px; letter-spacing:.1em; color:#D8B87A; text-align:center; margin:6px 0 26px; }
.mf-field{ margin-bottom:20px; }
.mf-field input{ width:100%; background:transparent; border:none; border-bottom:1px solid rgba(242,237,228,.16); padding:11px 2px; font-size:14px; color:#f2ede4; outline:none; }
.mf-field input::placeholder{ color:#8f8a80; }
.mf-field input:focus{ border-bottom-color:#D8B87A; }
.mf-check{ display:flex; align-items:flex-start; gap:11px; margin-bottom:24px; font-size:11.5px; color:#8f8a80; line-height:1.5; }
.mf-submit{ display:block; width:100%; padding:15px; border:none; border-radius:999px; background:#D8B87A; color:#0c0b09; font-size:12px; font-weight:700; letter-spacing:.22em; text-transform:uppercase; transition:.25s; }
.mf-submit:hover{ background:linear-gradient(#e6c890,#c39f57); transform:translateY(-2px); }



/* =========================
   CONTACT US - LIGHT THEME
========================= */

.contact-us {
  position: relative;
  background: #fff;
  padding: 110px 5%;
  overflow: hidden;
  color: #183126;
}

.contact-wrap {
  max-width: 1180px;
  margin: 0 auto;

  display: grid;
  grid-template-columns: 1fr 0.9fr;
  gap: 100px;

  align-items: center;
}


/* =========================
   LEFT CONTENT
========================= */

.contact-eyebrow {
  margin-bottom: 18px;

  color: #b68b3b;

  font-size: 9px;
  font-weight: 600;

  letter-spacing: 3px;
}

.contact-title {
  margin: 0;

  color: #183126;

  font-family: Georgia, "Times New Roman", serif;

  font-size: clamp(42px, 4vw, 62px);
  font-weight: 400;

  line-height: 1.08;

  letter-spacing: -1px;
}

.contact-title em {
  color: #a9792b;
  font-style: italic;
}

.contact-description {
  max-width: 500px;

  margin: 26px 0 0;

  color: #667069;

  font-size: 13px;
  line-height: 1.9;
}


/* GOLD LINE */

.contact-line {
  width: 100%;
  max-width: 470px;

  height: 1px;

  margin: 38px 0;

  background: linear-gradient(
    to right,
    #c79d4d,
    rgba(199, 157, 77, 0.15)
  );
}


/* =========================
   PROJECT DETAILS
========================= */

.contact-details {
  display: flex;
  gap: 70px;
}

.contact-detail {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.contact-detail span {
  color: #b68b3b;

  font-size: 8px;
  font-weight: 600;

  letter-spacing: 2px;
}

.contact-detail strong {
  color: #193126;

  font-size: 13px;
  font-weight: 500;
}


/* =========================
   FORM BOX
========================= */

.contact-form-box {
  padding: 48px 45px;

  background: #ffffff;

  border: 1px solid #d8d2c5;

  box-shadow: 0 15px 40px rgba(17, 40, 30, 0.06);
}

.form-header {
  padding-bottom: 28px;
  margin-bottom: 30px;

  border-bottom: 1px solid #e5e1d8;
}

.form-header span {
  display: block;

  margin-bottom: 12px;

  color: #b68b3b;

  font-size: 9px;
  font-weight: 600;

  letter-spacing: 2.5px;
}

.form-header h3 {
  margin: 0;

  color: #183126;

  font-family: Georgia, "Times New Roman", serif;

  font-size: 30px;
  font-weight: 400;
}

.form-header p {
  margin: 12px 0 0;

  color: #707870;

  font-size: 12px;

  line-height: 1.7;
}


/* =========================
   FORM FIELDS
========================= */

.contact-field {
  margin-bottom: 26px;
}

.contact-field label {
  display: block;

  margin-bottom: 10px;

  color: #a07b39;

  font-size: 9px;
  font-weight: 600;

  letter-spacing: 1.5px;
}

.contact-field input {
  width: 100%;
  height: 48px;

  box-sizing: border-box;

  background: transparent;

  border: none;
  border-bottom: 1px solid #d6d3cb;

  border-radius: 0;

  color: #183126;

  font-size: 13px;

  outline: none;

  transition: 0.3s ease;
}

.contact-field input::placeholder {
  color: #a4a8a4;
}

.contact-field input:focus {
  border-bottom-color: #b68b3b;
}


/* =========================
   BUTTON
========================= */

.contact-submit {
  width: 100%;
  height: 52px;

  margin-top: 10px;

  border: none;

  background: #183126;
  color: #ffffff;

  cursor: pointer;

  font-size: 9px;
  font-weight: 600;

  letter-spacing: 2px;

  transition: 0.3s ease;
}

.contact-submit span {
  display: inline-block;

  margin-left: 12px;

  font-size: 16px;

  transition: 0.3s ease;
}

.contact-submit:hover {
  background: #b68b3b;
}

.contact-submit:hover span {
  transform: translateX(5px);
}


/* =========================
   TABLET
========================= */

@media (max-width: 900px) {

  .contact-us {
    padding: 80px 25px;
  }

  .contact-wrap {
    grid-template-columns: 1fr;
    gap: 55px;
  }

  .contact-form-box {
    max-width: 650px;
  }

}


/* =========================
   MOBILE
========================= */

@media (max-width: 550px) {

  .contact-us {
    padding: 65px 18px;
  }

  .contact-title {
    font-size: 36px;
  }

  .contact-description {
    font-size: 12px;
  }

  .contact-details {
    gap: 30px;
    flex-direction: column;
  }

  .contact-line {
    margin: 30px 0;
  }

  .contact-form-box {
    padding: 32px 22px;
  }

  .form-header h3 {
    font-size: 27px;
  }

}




/* ==========================================
   MOBILE QUICK ENQUIRY
========================================== */

.mobile-quick-enquiry {
  display: none;
}


/* ==========================================
   MOBILE ONLY
========================================== */

@media (max-width: 767px) {

  .mobile-quick-enquiry {
    display: block;

    position: relative;

    background: #f4f2ec;

    /*padding: 0 16px 42px;*/

    color: #193126;

    overflow: hidden;
  }


  /* CARD */

  .mqe-card {
    position: relative;

   

    padding: 25px 18px 20px;

    background: #183126;

    color: #ffffff;

    box-shadow:
      0 18px 35px rgba(13, 30, 23, 0.18);

    z-index: 2;

    overflow: hidden;
  }


  /* DECORATIVE BACKGROUND */

  .mqe-card::before {
    content: "";

    position: absolute;

    width: 180px;
    height: 180px;

    top: -90px;
    right: -70px;

    border: 1px solid rgba(199, 157, 77, 0.25);

    border-radius: 50%;
  }


  .mqe-card::after {
    content: "";

    position: absolute;

    width: 120px;
    height: 120px;

    bottom: -75px;
    left: -60px;

    border: 1px solid rgba(199, 157, 77, 0.18);

    border-radius: 50%;
  }


  /* TOP GOLD LINE */

  .mqe-top-line {
    position: absolute;

    top: 0;
    left: 0;

    width: 100%;
    height: 2px;

    background: linear-gradient(
      90deg,
      transparent,
      #d3aa5c 20%,
      #f0cd87 50%,
      #d3aa5c 80%,
      transparent
    );
  }


  /* HEADER */

  .mqe-heading {
    position: relative;

    display: flex;
    align-items: center;

    gap: 12px;

    z-index: 1;
  }


  .mqe-icon {
    width: 38px;
    height: 38px;

    display: flex;
    align-items: center;
    justify-content: center;

    border: 1px solid rgba(213, 173, 92, 0.65);

    color: #d8ae61;

    font-size: 16px;

    flex-shrink: 0;
  }


  .mqe-eyebrow {
    display: block;

    margin-bottom: 4px;

    color: #d7ad61;

    font-size: 8px;

    font-weight: 600;

    letter-spacing: 2px;
  }


  .mqe-heading h3 {
    margin: 0;

    color: #ffffff;

    font-family: Georgia, "Times New Roman", serif;

    font-size: 25px;

    font-weight: 400;

    line-height: 1;
  }


  /* DESCRIPTION */

  .mqe-text {
    position: relative;

    margin: 15px 0 22px;

    color: rgba(255, 255, 255, 0.68);

    font-size: 11px;

    line-height: 1.7;

    z-index: 1;
  }


  /* ==========================================
     FIELDS
  ========================================== */

  .mqe-field {
    position: relative;

    display: flex;
    align-items: center;

    height: 50px;

    margin-bottom: 11px;

    padding: 0 14px;

    background: rgba(255, 255, 255, 0.07);

    border: 1px solid rgba(255, 255, 255, 0.12);

    z-index: 1;

    transition: 0.3s ease;
  }


  .mqe-field:focus-within {
    border-color: #d2a85d;

    background: rgba(255, 255, 255, 0.1);
  }


  .mqe-field-icon {
    width: 24px;

    color: #d4aa5d;

    font-size: 13px;
  }


  .mqe-field input {
    width: 100%;
    height: 100%;

    background: transparent;

    border: none;

    outline: none;

    color: #ffffff;

    font-size: 12px;

    font-family: inherit;
  }


  .mqe-field input::placeholder {
    color: rgba(255, 255, 255, 0.48);
  }


  /* ==========================================
     SUBMIT BUTTON
  ========================================== */

  .mqe-submit {
    position: relative;

    width: 100%;
    height: 52px;

    margin-top: 5px;

    padding: 0 18px;

    border: none;

    background: #d1a658;

    color: #172e24;

    display: flex;
    align-items: center;
    justify-content: space-between;

    font-size: 9px;

    font-weight: 700;

    letter-spacing: 1.8px;

    cursor: pointer;

    z-index: 1;

    transition: 0.3s ease;
  }


  .mqe-submit i {
    font-size: 18px;

    font-style: normal;

    transition: 0.3s ease;
  }


  .mqe-submit:active i {
    transform: translateX(5px);
  }


  /* BOTTOM TRUST */

  .mqe-bottom {
    position: relative;

    display: flex;
    align-items: center;

    gap: 10px;

    margin-top: 18px;

    color: rgba(255, 255, 255, 0.42);

    z-index: 1;
  }


  .mqe-bottom span {
    flex: 1;

    height: 1px;

    background: rgba(255, 255, 255, 0.12);
  }


  .mqe-bottom small {
    white-space: nowrap;

    font-size: 8px;

    letter-spacing: 0.5px;
  }

}



@media screen and (max-width: 567px){
    #plogo{
width: 210px!important;
    }
    #deskhide{
display: none;
font-weight: bold;
    }
    .hero-points{
        display: none;
    }
    .offer-pill{
        display: none;
    }
    .hero-content{
        gap: 10px;
    }
}



@media screen and (min-width: 567px){
  
    #webhide{
display: none;

    }
}
#webhide{
    font-weight: bold;
        font-size: 11px;
    letter-spacing: 0.3px;
    margin-top: 4px!important;
}


/* =========================================
   DESKTOP SIDE CALL & WHATSAPP
========================================= */

.desktop-side-icon {
  position: fixed;
  top: 50%;
  z-index: 9999;

  width: 58px;
  height: 58px;

  display: flex;
  align-items: center;

  text-decoration: none;
  overflow: hidden;

  box-sizing: border-box;

  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.15);

  transition:
    width 0.35s ease,
    background 0.35s ease,
    color 0.35s ease;
}


/* =========================================
   LEFT SIDE - CALL
========================================= */

.desktop-call {
  left: 0;

  background: #ffffff;
  color: #183126;

  border: 1px solid #d8d2c5;

  transform: translateY(-50%);

  justify-content: flex-start;
}

.desktop-call:hover {
  width: 185px;
}


/* =========================================
   RIGHT SIDE - WHATSAPP
========================================= */

.desktop-whatsapp {
  right: 0;

  background: #16bb59;
  color: #ffffff;

  transform: translateY(-50%);

  justify-content: flex-end;
}

.desktop-whatsapp:hover {
  width: 185px;
color:black;
  background: white;
}


/* =========================================
   ICON CONTAINER
========================================= */

.side-icon-circle {
  width: 58px;
  min-width: 58px;
  height: 58px;

  display: flex;
  align-items: center;
  justify-content: center;

  flex-shrink: 0;
}


/* SVG ICONS */

.side-icon-circle svg {
  width: 23px;
  height: 23px;

  display: block;

  fill: currentColor;
}


/* =========================================
   TEXT LABEL - COMMON
========================================= */

.side-icon-label {
  white-space: nowrap;

  font-size: 9px;
  font-weight: 700;

  letter-spacing: 1.8px;

  line-height: 1;

  opacity: 0;

  pointer-events: none;

  transition:
    opacity 0.25s ease,
    transform 0.35s ease;
}


/* =========================================
   CALL - LEFT TO RIGHT
========================================= */

.desktop-call .side-icon-circle {
  order: 1;
}

.desktop-call .side-icon-label {
  order: 2;

  padding-left: 15px;

  transform: translateX(-10px);
}

.desktop-call:hover .side-icon-label {
  opacity: 1;

  transform: translateX(0);
}


/* =========================================
   WHATSAPP - RIGHT TO LEFT
========================================= */

.desktop-whatsapp .side-icon-label {
  order: 1;

  flex: 1;

  padding-left: 15px;
  padding-right: 15px;

  text-align: left;

  transform: translateX(10px);
}

.desktop-whatsapp .side-icon-circle {
  order: 2;
}

.desktop-whatsapp:hover .side-icon-label {
  opacity: 1;

  transform: translateX(0);
}


/* =========================================
   ICON HOVER EFFECT
========================================= */

.desktop-side-icon:hover .side-icon-circle svg {
  transform: scale(1.08);
}

.side-icon-circle svg {
  transition: transform 0.3s ease;
}


/* =========================================
   MOBILE - HIDE
========================================= */

@media (max-width: 767px) {

  .desktop-side-icon {
    display: none;
  }

}

/* =========================================
   FORM SUBMISSION WAIT POPUP
========================================= */

.form-wait-overlay {
  position: fixed;

  inset: 0;

  display: none;

  align-items: center;
  justify-content: center;

  padding: 20px;

  background: rgba(8, 25, 18, 0.72);

  backdrop-filter: blur(5px);

  z-index: 999999;
}

.form-wait-overlay.is-active {
  display: flex;
}


.form-wait-box {
  width: 100%;
  max-width: 330px;

  padding: 40px 30px;

  text-align: center;

  background: #ffffff;

  border-top: 3px solid #b68b3b;

  box-shadow:
    0 25px 70px rgba(0, 0, 0, 0.25);
}


.form-wait-spinner {
  width: 42px;
  height: 42px;

  margin: 0 auto 22px;

  border: 2px solid #e5ddd0;
  border-top-color: #b68b3b;

  border-radius: 50%;

  animation: formWaitSpin 0.8s linear infinite;
}


@keyframes formWaitSpin {

  to {
    transform: rotate(360deg);
  }

}


.form-wait-box h3 {
  margin: 0 0 8px;

  color: #183126;

  font-family: Georgia, "Times New Roman", serif;

  font-size: 26px;

  font-weight: 400;
}


.form-wait-box p {
  margin: 0;

  color: #6f766f;

  font-size: 13px;

  line-height: 1.6;
}


/* Block interaction while submitting */

body.form-is-submitting {
  overflow: hidden;
}