:root{
  --ink:#ffffff;
  --palm:#f5faf8;
  --palm-2:#f0f6f4;
  --sage:#5a7a5d;
  --brass:#c8a15c;
  --brass-dim:#a88050;
  --sand:#1a1a1a;
  --sand-dim:#4a4a4a;
  --line: rgba(26,26,26,0.08);
  --line-gold: rgba(200,161,92,0.35);
  --ff-display:'Fraunces', Georgia, serif;
  --ff-body:'Inter', Arial, sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  background:var(--ink);
  color:var(--sand);
  font-family:var(--ff-body);
  font-weight:300;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
:focus-visible{outline:2px solid var(--brass);outline-offset:4px;}
button{font:inherit;}
button:disabled{cursor:not-allowed;opacity:.6;}
.eyebrow{
  font-family:var(--ff-body);
  text-transform:uppercase;
  letter-spacing:0.32em;
  font-size:11px;
  color:var(--brass);
  font-weight:500;
  display:flex;align-items:center;gap:12px;
  margin-bottom:10px;
}
.eyebrow::before{content:'';width:28px;height:1px;background:var(--brass);display:inline-block;}
h1,h2,h3,h4{font-family:var(--ff-display);font-weight:400;line-height:1.05;letter-spacing:-0.01em;}
section{position:relative;}
.wrap{max-width:1280px;margin:0 auto;padding:0 clamp(20px,5vw,72px);}
.reveal{opacity:1;transform:none;}
.js-reveal-ready .reveal{opacity:0;transform:translateY(24px);transition:opacity 0.65s cubic-bezier(0.16, 1, 0.3, 1),transform 0.65s cubic-bezier(0.16, 1, 0.3, 1);}
.js-reveal-ready .reveal.is-visible{opacity:1;transform:none;}
::selection{background:var(--brass);color:var(--ink);}

/* ===== NAV HEADER ===== */
header.nav{
  position:fixed;top:0;left:0;right:0;z-index:100;
  display:flex;align-items:center;justify-content:space-between;
  padding:18px clamp(20px,5vw,60px);
}
.nav-logo-wrap{
  display:flex;
  align-items:center;
  gap:12px;
  font-family:var(--ff-display);
  font-size:20px;
  letter-spacing:0.04em;
  color:var(--sand);
}
.nav-logo-img{
  height:auto;
  width: 100px;
  object-fit:contain;
}
.nav-logo-wrap em{color:var(--brass);font-style:normal;}
.nav-links{display:flex;gap:36px;font-size:12px;letter-spacing:0.14em;text-transform:uppercase;}
.nav-links a{color:black;transition:opacity .3s;}
.nav-links a:hover{opacity:0.8;}
.nav-menu-toggle{display:none;align-items:center;justify-content:center;width:42px;height:42px;border:1px solid var(--line);background:rgba(255,255,255,.92);color:var(--sand);font-size:20px;cursor:pointer;}
@media(max-width:820px){
  .nav-menu-toggle{display:flex;}
  .nav-links{display:flex;position:fixed;top:78px;left:18px;right:18px;padding:22px;background:#fff;box-shadow:0 18px 44px rgba(0,0,0,.14);flex-direction:column;gap:20px;}
  .js-nav-ready .nav-links{display:none;}
  .js-nav-ready .nav-links.is-open{display:flex;}
}

/* ===== HERO (CANVAS SCROLLING HERO) ===== */
.hero-canvas-wrap {
  position: relative;
  height: var(--hero-scroll-height, 650vh);
  background: var(--ink);
}

.hero-sticky {
  position: sticky;
  top: 0;
  height: 100vh;
  width: 100%;
  overflow: hidden;
}

#cinematic-canvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  z-index: 1;
}

.hero-sticky::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0,0,0,0.35) 0%, rgba(0,0,0,0.15) 40%, rgba(0,0,0,0.4) 100%);
  z-index: 2;
  pointer-events: none;
}

.hero-content {
  position: absolute;
  inset: 0;
  z-index: 3;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 0 clamp(20px,5vw,72px) 80px;
  pointer-events: none;
  transition: opacity 0.4s ease-out;
}

.hero-content * {
  pointer-events: auto;
}

.hero-content .eyebrow { color: #ffffff; }
.hero-content .eyebrow::before { background: #ffffff; }
.hero-title { font-size: clamp(46px,8vw,108px); margin-top: 18px; max-width: 14ch; color: #ffffff; }
.hero-title em { font-style: italic; color: var(--brass); }
.hero-sub { margin-top: 22px; max-width: 44ch; font-size: 16px; color: #f0f0f0; font-weight: 300; }
.hero-note { position: absolute; bottom: 26px; right: clamp(20px,5vw,72px); z-index: 3; font-size: 10px; letter-spacing: .14em; text-transform: uppercase; color: #f0f0f0; }
.scroll-cue { position: absolute; left: clamp(20px,5vw,72px); bottom: 30px; z-index: 3; display: flex; align-items: center; gap: 10px; font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: #f0f0f0; }
.scroll-cue .line { width: 1px; height: 34px; background: #f0f0f0; position: relative; overflow: hidden; }
.scroll-cue .line::after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: var(--brass); transform: translateY(-100%); animation: cue 2s infinite; }
@keyframes cue { to { transform: translateY(200%); } }

/* ===== QUICK SPECS & OVERVIEW ===== */
.specs-section {

  padding: min(10vw, 120px) 0;
  position: relative;
  z-index: 5;
}

.specs-grid {
  display: grid;
  grid-template-columns: 1.2fr 0.8fr;
  gap: 36px;
  align-items: stretch;
  margin-bottom: 60px;
}

.specs-media {
  position: relative;
  border-radius: 12px;
  overflow: hidden;
  border: 1px solid var(--line-gold);
  box-shadow: 0 30px 60px rgba(0,0,0,0.6);
  min-height: 440px;
}

.specs-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 1.2s cubic-bezier(0.16, 1, 0.3, 1);
}

.specs-media:hover img {
  transform: scale(1.06);
}

.specs-media-tag {
  position: absolute;
  top: 24px;
  left: 24px;
  /* background: rgba(255, 255, 255, 0.95); */
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border: 1px solid var(--line-gold);
  color: var(--brass);
  padding: 8px 16px;
  border-radius: 30px;
  font-size: 10px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  font-weight: 500;
  display: flex;
  align-items: center;
  gap: 8px;
}

.specs-media-tag span.live-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #61ce70;
  box-shadow: 0 0 10px #61ce70;
  animation: pulseDot 1.8s infinite;
}
@keyframes pulseDot { 0%, 100% { opacity: 1; transform: scale(1); } 50% { opacity: 0.4; transform: scale(1.3); } }

.specs-card {
  background: rgba(243, 238, 224, 0.03);
  border: 1px solid var(--line-gold);
  border-radius: 12px;
  padding: 40px 36px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  box-shadow: 0 20px 50px rgba(0,0,0,0.3);
  transition: border-color 0.4s ease, transform 0.4s ease;
}

.specs-card:hover {
  border-color: var(--brass);
  transform: translateY(-4px);
}

.spec-item {
  border-bottom: 1px solid rgba(243,238,224,0.08);
  padding-bottom: 18px;
  margin-bottom: 18px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.spec-item:last-of-type {
  border-bottom: none;
  margin-bottom: 0;
}

.spec-label {
  font-size: 11px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--sand-dim);
}

.spec-value {
  font-family: var(--ff-display);
  font-size: 20px;
  color: var(--sand);
  font-weight: 400;
  text-align: right;
}

.spec-value.gold { color: var(--brass); }

.spec-call-btn {
  background: linear-gradient(135deg, var(--brass) 0%, #a88344 100%);
  color: var(--ink);
  padding: 20px 24px;
  border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  font-size: 12px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  font-weight: 600;
  transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
  margin-top: 24px;
  cursor: pointer;
  border: none;
  width: 100%;
  box-shadow: 0 8px 20px rgba(200,161,92,0.25);
}

.spec-call-btn:hover {
  background: var(--sand);
  color: var(--ink);
  transform: translateY(-3px);
  box-shadow: 0 14px 30px rgba(200,161,92,0.4);
}

/* Executive Overview Card */


.overview-top {
  margin-bottom: 44px;
  border-bottom: 1px solid var(--line);
  padding-bottom: 36px;
}

.overview-top h2 {
  font-size: clamp(28px, 3.8vw, 48px);
  margin-bottom: 18px;
  background: linear-gradient(135deg, var(--sand) 30%, var(--brass) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.overview-top p {
  color: var(--sand-dim);
  font-size: 16.5px;
  line-height: 1.85;
  font-weight: 300;
}

.overview-split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 50px;
  align-items: center;
}

.overview-split-text h3 {
  font-size: clamp(24px, 2.6vw, 36px);
  margin-bottom: 18px;
}

.overview-split-text p {
  color: var(--sand-dim);
  font-size: 15px;
  line-height: 1.8;
  font-weight: 300;
}

.overview-split-media {
  border-radius: 8px;
  overflow: hidden;
  border: 1px solid var(--line-gold);
  position: relative;
  aspect-ratio: 16/10;
  box-shadow: 0 15px 35px rgba(0,0,0,0.5);
}

.overview-split-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.8s ease;
}

.overview-split-media:hover img {
  transform: scale(1.06);
}

/* ===== MARQUEE TICKER BANNER ===== */
.marquee-section {
  /* background: var(--palm-2); */
  border-top: 1px solid var(--brass-dim);
  border-bottom: 1px solid var(--brass-dim);
  padding: 22px 0;
  overflow: hidden;
  position: relative;
  z-index: 10;
}
.marquee-track {
  display: flex;
  width: max-content;
  animation: marqueeScroll 32s linear infinite;
  will-change: transform;
}
.marquee-track:hover {
  animation-play-state: paused;
}
.marquee-item {
  display: flex;
  align-items: center;
  gap: 36px;
  padding-right: 36px;
  font-family: var(--ff-display);
  font-size: 14px;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: var(--sand);
}
.marquee-item span.dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--brass);
  display: inline-block;
}
@keyframes marqueeScroll {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

/* ===== SECTION HEADERS ===== */
.section-pad{padding:min(14vw,150px) 0;}
.head-row{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;margin-bottom:64px;flex-wrap:wrap;}
.head-row h2{font-size:clamp(34px,4.6vw,58px);max-width:14ch;}
.head-row p{max-width:36ch;color:var(--sand-dim);font-size:15px;line-height:1.7;}

/* ===== ABOUT ===== */
.about{background:var(--ink);}
.about.section-pad{padding-bottom:40px;}
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center;}
.about-media{position:relative;}
.about-media img{border-radius:2px;filter:saturate(0.9);}
.about-media .frame{position:absolute;inset:18px;border:1px solid var(--brass-dim);z-index:-1;}
.about-text .eyebrow{margin-bottom:20px;}
.about-text h3{font-size:clamp(28px,3.4vw,42px);margin-bottom:24px;font-weight:400;}
.about-text p{color:var(--sand-dim);font-size:15.5px;line-height:1.85;margin-bottom:18px;font-weight:300;}
.about-stats{display:flex;gap:48px;margin-top:44px;border-top:1px solid var(--line);padding-top:28px;}
.about-stats div b{display:block;font-family:var(--ff-display);font-size:28px;color:var(--brass);font-weight:400;}
.about-stats div span{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--sand-dim);}

/* ===== VALUE PILLARS ===== */
.pillars{background:var(--palm);position:relative;padding-bottom:100px;}
.pillars > .wrap.section-pad{padding-top:40px;}
.pillars-grid{display:grid;grid-template-columns:0.9fr 1.1fr;gap:70px;}
.pillars-sticky{position:sticky;top:110px;align-self:start;height:fit-content;z-index:15;}
.pillars-sticky h2{font-size:clamp(30px,4vw,50px);margin:18px 0 30px;}
.pillar-visual{position:relative;width:100%;aspect-ratio:4/5;border-radius:6px;overflow:hidden;background:var(--ink);box-shadow: 0 20px 40px rgba(0,0,0,0.5);}
.pillar-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .7s ease, transform 1.4s ease;transform:scale(1.08);filter:saturate(0.85);}
.pillar-bg.active{opacity:1;transform:scale(1);}
 .pillar-visual-overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0.25) 0%,rgba(0,0,0,0.65) 100%);pointer-events:none;} 
.pillar-big-num{position:absolute;left:22px;bottom:22px;font-family:var(--ff-display);font-style:italic;font-size:64px;color:#ffffff;z-index:2;line-height:1;}
.pillar-big-tag{position:absolute;left:22px;bottom:90px;z-index:2;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--brass);}
.pillar-progress{display:flex;gap:6px;margin-top:22px;}
.pillar-progress span{flex:1;height:2px;background:var(--line);position:relative;overflow:hidden;}
.pillar-progress span i{position:absolute;inset:0;background:var(--brass);transform:scaleX(0);transform-origin:left;transition:transform .4s ease;}
.pillar-progress span.done i{transform:scaleX(1);}

.pillars-list{display:flex;flex-direction:column;}
.pillar-row{
  min-height: 60vh;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 60px 0;
  border-bottom: 1px solid var(--line);
  cursor: default;
  opacity: 0.25;
  transition: opacity .6s ease, transform .6s ease;
}
.pillar-row.active{opacity:1;}
.pillar-row .pn{font-family:var(--ff-display);font-style:italic;font-size:18px;color:var(--brass-dim);min-width:32px;margin-bottom:12px;display:block;transition:color .4s;}
.pillar-row.active .pn{color:var(--brass);}
.pillar-row-body h4{font-size:clamp(24px,2.8vw,36px);font-weight:400;margin-bottom:14px;transition:transform .5s ease;}
.pillar-row.active .pillar-row-body h4{transform:translateX(6px);}
.pillar-row-body p{font-size:15px;color:var(--sand-dim);line-height:1.8;max-width:48ch;font-weight:300;}

@media(max-width:900px){
  .pillars-grid{grid-template-columns:1fr;gap:30px;}
  .pillars-sticky{
    position:sticky;
    top:65px;
    z-index:25;
    background:var(--palm);
    padding-top:14px;
    padding-bottom:16px;
    margin-bottom:20px;
    border-bottom:1px solid var(--line-gold);
  }
  .pillars-sticky h2{font-size:24px;margin:8px 0 16px;}
  .pillar-visual{aspect-ratio:16/9;max-height:220px;border-radius:6px;}
  .pillar-big-num{font-size:36px;left:14px;bottom:14px;}
  .pillar-big-tag{font-size:9px;left:14px;bottom:54px;}
  .pillar-progress{margin-top:12px;}
  .pillar-row{min-height:35vh;padding:30px 0;}
  .pillar-row-body h4{font-size:22px;}
  .pillar-row-body p{font-size:14px;}
}

/* ===== AMENITIES ===== */
.amenities{background:var(--ink);overflow:hidden;padding-top:100px;padding-bottom:100px;}
.amen-head{margin-bottom:40px;}
.amen-progress{width:100%;height:2px;background:var(--line);margin-top:30px;position:relative;overflow:hidden;}
.amen-progress-bar{position:absolute;left:0;top:0;height:100%;width:100%;background:var(--brass);transform:scaleX(0);transform-origin:left;}

.amen-pin{height:80vh;min-height:520px;display:flex;align-items:center;overflow:hidden;}
.amen-track{display:flex;align-items:center;flex:0 0 100%;width:100%;height:100%;min-width:0;gap:28px;padding:0 clamp(20px,5vw,72px);overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scrollbar-width:thin;scrollbar-color:var(--brass) transparent;overscroll-behavior-inline:contain;}
.amen-card{position:relative;flex:0 0 clamp(280px,28vw,380px);height:min(60vh,500px);border-radius:6px;overflow:hidden;background:var(--palm-2);}
.amen-card,.amen-end-note{scroll-snap-align:start;}
.amen-card-img{position:absolute;inset:0;background-size:cover;background-position:center;transform:scale(1.08);transition:transform .7s cubic-bezier(.2,.8,.2,1);}
.amen-card:hover .amen-card-img{transform:scale(1.18);}
.amen-card-overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0.2) 30%,rgba(0,0,0,0.85) 100%);display:flex;flex-direction:column;justify-content:flex-end;padding:28px;}
.amen-card-num{position:absolute;top:22px;left:24px;font-family:var(--ff-display);font-style:italic;font-size:16px;color:var(--brass);z-index:2;}
.amen-card-overlay h4{font-size:22px;font-weight:400;margin-bottom:8px;color:#ffffff;}
.amen-card-overlay p{font-size:13.5px;color:#f0f0f0;line-height:1.65;max-width:32ch;opacity:0.9;transform:translateY(0);}
.amen-card::after{content:'';position:absolute;inset:0;border:1px solid rgba(243,238,224,0.15);border-radius:6px;pointer-events:none;}
.amen-end-note{flex:0 0 clamp(240px,24vw,320px);display:flex;flex-direction:column;justify-content:center;padding-right:40px;}
.amen-end-note span{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--brass);margin-bottom:14px;display:block;}
.amen-end-note p{font-size:14px;color:var(--sand-dim);line-height:1.7;}

/* ===== REDESIGNED BENTO GALLERY / OVERVIEW ===== */
.overview{background:var(--ink);}
.gal-bento{display:grid;grid-template-columns:repeat(12,1fr);grid-auto-rows:140px;gap:14px;}
.gal-item{position:relative;border-radius:4px;overflow:hidden;border:1px solid var(--line);cursor:pointer;}
.gal-item img{width:100%;height:100%;object-fit:cover;filter:saturate(0.9) contrast(1.02);transition:transform 0.8s cubic-bezier(.2,.8,.2,1), filter 0.5s;}
.gal-item-cap{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0.3) 50%,rgba(0,0,0,0.85) 100%);display:flex;align-items:flex-end;padding:20px;opacity:0;transition:opacity 0.4s ease;}
.gal-item-cap span{font-family:var(--ff-display);font-size:16px;color:#ffffff;}
.gal-item:hover img{transform:scale(1.08);filter:saturate(1.05) contrast(1.05);}
.gal-item:hover .gal-item-cap{opacity:1;}

.gal-item.g1{grid-column:span 8;grid-row:span 3;}
.gal-item.g2{grid-column:span 4;grid-row:span 2;}
.gal-item.g3{grid-column:span 4;grid-row:span 2;}
.gal-item.g4{grid-column:span 4;grid-row:span 2;}
.gal-item.g5{grid-column:span 4;grid-row:span 2;}
.gal-item.g6{grid-column:span 4;grid-row:span 2;}
@media(max-width:900px){
  .gal-bento{grid-template-columns:1fr;grid-auto-rows:220px;}
  .gal-item.g1,.gal-item.g2,.gal-item.g3,.gal-item.g4,.gal-item.g5,.gal-item.g6{grid-column:span 1;grid-row:span 1;}
}

.locate{display:grid;grid-template-columns:1.1fr 1fr;gap:60px;margin-top:80px;align-items:stretch;}
.locate-info{display:flex;flex-direction:column;justify-content:center;}
.locate-info h3{font-size:clamp(24px,2.8vw,34px);margin-bottom:18px;font-weight:400;}
.locate-info p{color:var(--sand-dim);font-size:15px;margin-bottom:26px;line-height:1.7;}
.btn{display:inline-flex;align-items:center;gap:10px;border:1px solid var(--brass);color:var(--brass);padding:14px 26px;font-size:12px;letter-spacing:.14em;text-transform:uppercase;width:fit-content;transition:all .4s;background:none;font-family:var(--ff-body);cursor:pointer;}
.btn:hover{background:var(--brass);color:var(--ink);}
.btn.solid{background:var(--brass);color:var(--ink);}
.btn.solid:hover{background:var(--sand);border-color:var(--sand);}
.btn.pulse{animation:pulseBtn 2.4s infinite;}
@keyframes pulseBtn{0%,100%{outline:0 solid rgba(200,161,92,0.35);}50%{outline:8px solid rgba(200,161,92,0);}}
.locate-map iframe{width:100%;height:100%;min-height:340px;border:0;filter:grayscale(0.4) invert(0.92) contrast(0.9);border-radius:2px;}
@media(max-width:900px){.locate{grid-template-columns:1fr;}}

/* ===== FLOOR PLANS ===== */
.plans{background:var(--palm);}
.plan-tabs{display:flex;gap:0;border-bottom:1px solid var(--line);margin-bottom:56px;flex-wrap:wrap;}
.plan-tab{padding:18px 28px;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--sand-dim);cursor:pointer;position:relative;background:none;border:none;font-family:var(--ff-body);transition:color .3s;}
.plan-tab.active{color:var(--brass);}
.plan-tab::after{content:'';position:absolute;left:0;bottom:-1px;width:0;height:1px;background:var(--brass);transition:width .4s;}
.plan-tab.active::after{width:100%;}
.plan-view{display:none;grid-template-columns:1fr 1fr;gap:70px;align-items:center;}
.plan-view.active{display:grid;}
.plan-img{position:relative;background:var(--ink);padding:20px;border-radius:2px;overflow:hidden;cursor:zoom-in;}
.plan-img:focus-visible{outline-offset:2px;}
.plan-img .zoom-frame{overflow:hidden;position:relative;border-radius:2px;}
.plan-img img{width:100%;transition:transform .5s cubic-bezier(.2,.8,.2,1);will-change:transform;}
.plan-img:hover img{transform:scale(1.18);}
.plan-zoom-badge{position:absolute;top:34px;right:34px;z-index:3;display:flex;align-items:center;gap:8px;background:rgba(10,19,15,0.72);border:1px solid var(--line);color:#ffffff;font-size:10px;letter-spacing:.12em;text-transform:uppercase;padding:8px 12px;border-radius:20px;pointer-events:none;}
.plan-zoom-badge svg{width:13px;height:13px;stroke:var(--brass);fill:none;stroke-width:1.4;}
.plan-info h3{font-family:var(--ff-display);font-size:clamp(24px,3vw,34px);font-weight:400;margin-bottom:10px;}
.plan-info .meta{color:var(--brass);font-size:13px;letter-spacing:.06em;margin-bottom:32px;}
.room-list{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:12px 24px;margin-bottom:36px;}
.room-list li{display:flex;gap:12px;align-items:baseline;font-size:13.5px;color:var(--sand-dim);border-bottom:1px solid var(--line);padding-bottom:10px;}
.room-list li b{color:var(--brass);font-family:var(--ff-display);font-style:italic;font-weight:400;min-width:18px;}
.plan-cta-row{display:flex;gap:14px;flex-wrap:wrap;}
@media(max-width:900px){
  .plan-tabs{overflow-x:auto;flex-wrap:nowrap;padding-bottom:8px;}
  .plan-tab{padding:12px 18px;font-size:11px;flex-shrink:0;}
  .plan-view.active{grid-template-columns:1fr;gap:36px;}
  .room-list{grid-template-columns:1fr 1fr;}
  .plan-img:hover img{transform:none;}
}

/* ===== ZOOM MODAL ===== */
.zoom-modal{position:fixed;inset:0;background:rgba(255,255,255,0.98);z-index:999;display:none;align-items:center;justify-content:center;backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px);}
.zoom-modal.open{display:flex;}
.zoom-stage{width:min(88vw,1100px);height:min(82vh,800px);overflow:hidden;position:relative;border:1px solid var(--line);cursor:grab;touch-action:none;}
.zoom-stage.grabbing{cursor:grabbing;}
.zoom-stage img{position:absolute;top:0;left:0;max-width:none;width:100%;transform-origin:0 0;user-select:none;pointer-events:none; -webkit-user-select:none;}
.zoom-close{position:absolute;top:26px;right:clamp(20px,4vw,60px);width:42px;height:42px;border:1px solid var(--line);border-radius:50%;background:none;color:var(--sand);font-size:16px;cursor:pointer;z-index:2;transition:border-color .3s;}
.zoom-close:hover{border-color:var(--brass);color:var(--brass);}
.zoom-hint{position:absolute;bottom:26px;left:50%;transform:translateX(-50%);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--sand-dim);}
body.modal-open{overflow:hidden;}

/* ===== CONTACT =====
.contact{background:var(--ink);position:relative;}
.contact-grid{display:grid;grid-template-columns:0.9fr 1.1fr;gap:70px;}
.contact-info h2{font-size:clamp(32px,4vw,50px);margin-bottom:26px;}
.contact-info p{color:var(--sand-dim);font-size:15px;line-height:1.8;margin-bottom:34px;max-width:36ch;}
.contact-line{display:flex;flex-direction:column;gap:16px;margin-bottom:34px;}
.contact-line a{font-size:15px;color:var(--sand);border-bottom:1px solid var(--line);padding-bottom:10px;width:fit-content;transition:color .3s,border-color .3s;}
.contact-line a:hover{color:var(--brass);border-color:var(--brass);}
form{display:flex;flex-direction:column;gap:0;}
.field{position:relative;border-bottom:1px solid var(--line);padding:18px 0;}
.field input,.field textarea{width:100%;background:none;border:none;outline:none;color:var(--sand);font-family:var(--ff-body);font-size:15px;font-weight:300;resize:none;}
.field label{position:absolute;left:0;top:18px;color:var(--sand-dim);font-size:15px;pointer-events:none;transition:all .3s;}
.field input:focus + label,.field input:not(:placeholder-shown) + label,
.field textarea:focus + label,.field textarea:not(:placeholder-shown) + label{top:-2px;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--brass);}
form .btn{margin-top:30px;}
@media(max-width:900px){.contact-grid{grid-template-columns:1fr;}} */

/* ===== 4-LOGO MARQUEE (EXACT 4 LOGOS IN VIEWPORT PREVIEW) ===== */
.logo-marquee-section {
  background: var(--palm);
  border-top: 1px solid var(--line-gold);
  border-bottom: 1px solid var(--line-gold);
  padding: 32px 0;
  overflow: hidden;
  position: relative;
}

.logo-marquee-track {
  display: flex;
  width: max-content;
  align-items: center;
  gap: 0;
  animation: logoMarqueeScroll 20s linear infinite;
  will-change: transform;
}

.logo-marquee-track:hover {
  animation-play-state: paused;
}

.logo-marquee-item {
  width: 25vw; /* Exactly 4 logos visible across 100vw viewport width! */
  display: flex;
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
}

.logo-marquee-img {
  height: 80px;
  max-width: 80%;
  object-fit: contain;
  filter: brightness(1) contrast(1.05);
  opacity: 0.88;
  transition: all 0.4s ease;
  border-radius: 6px;
}

.logo-marquee-img:hover {
  opacity: 1;
  transform: scale(1.1);
  filter: brightness(1.2);
}

@media(max-width:768px){
  .logo-marquee-item { width: 50vw; } /* 2 logos in view on mobile */
}

@keyframes logoMarqueeScroll {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
  .logo-marquee-track { animation: none; transform: none; }
}

/* Shared visual system: quiet forest, warm brass, pale sage and clear type. */
:root {
  --green: #173f2b;
  --green-soft: #315c43;
  --gold: var(--brass);
  --cream: #f7f8f5;
  --paper: #fff;
  --muted: #59665e;
}

html { scroll-padding-top: 1.5rem; }
body > section[id] { scroll-margin-top: 1.5rem; }

header.nav {
  padding-top: 14px;
  padding-bottom: 14px;
  background: rgba(248, 250, 247, .94);
  border-bottom: 1px solid rgba(23, 63, 43, .09);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
}
.nav-links { gap: clamp(16px, 2.4vw, 36px); }
.nav-links a { color: var(--green); font-weight: 500; }
.nav-links a:hover { color: var(--brass-dim); }

button, .btn { -webkit-tap-highlight-color: transparent; }
button:focus-visible, a:focus-visible, select:focus-visible, input:focus-visible, textarea:focus-visible {
  outline: 2px solid var(--green-soft);
  outline-offset: 3px;
}
.btn { border-radius: 2px; font-weight: 500; transition: color .2s ease, background-color .2s ease, border-color .2s ease, transform .2s ease; }
.btn:active, button:active { transform: translateY(1px); }
.btn.pulse { animation: none; }

.about-text h3, .dossier__headline h2, .plan-info h3, .intro h2,
.contact .left h2 { font-family: var(--ff-display); }
.dossier__number { background: var(--green); }
.dossier__facts { background: var(--green); }
.dossier__call { display: block; }
.dossier__fact span, .dossier__fact small, .dossier__call span, .dossier__call b { color: rgba(255,255,255,.78); }
.dossier__fact { border-color: rgba(255,255,255,.2); }

.hero-content { padding-bottom: clamp(76px, 9vh, 100px); }
.hero-title { max-width: 12ch; font-size: clamp(40px, 7.5vw, 104px); line-height: .98; }
.hero-sub { max-width: 48ch; }
.nav-menu-toggle { border-radius: 2px; color: var(--green); }

.gal-item {
  display: block;
  width: 100%;
  padding: 0;
  text-align: left;
  color: inherit;
  background: var(--palm-2);
}
.gal-item-cap { opacity: 1; background: linear-gradient(180deg, transparent 36%, rgba(0,0,0,.68) 100%); }
.gal-item:hover .gal-item-cap, .gal-item:focus-visible .gal-item-cap { background: linear-gradient(180deg, rgba(0,0,0,.12), rgba(0,0,0,.76)); }
.gal-item:focus-visible { outline-offset: 4px; z-index: 2; }
.gal-item img { transition: transform .45s ease; }

.landmark-picker {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 12px;
  margin: 0 auto 20px;
  color: var(--green);
  font-size: 12px;
}
.landmark-picker label { font-weight: 500; }
.landmark-picker select {
  min-width: min(300px, 88vw);
  min-height: 44px;
  padding: 0 38px 0 13px;
  border: 1px solid rgba(23,63,43,.2);
  border-radius: 2px;
  background: #fff;
  color: var(--green);
  font: inherit;
}
.pin-label { max-width: 150px; white-space: normal; text-align: center; }
.map-pins-pending .pin { visibility: hidden; }

.contact-enquiry-form .note { max-width: 35ch; font-size: 11px; line-height: 1.55; }
.contact-enquiry-select { min-height: 44px; }

.marquee-section, .logo-marquee-section { position: relative; }
.marquee-track, .logo-marquee-track { animation-duration: 42s; }
.marquee-track:hover, .marquee-track:focus, .logo-marquee-track:hover, .logo-marquee-track:focus {
  animation-play-state: paused;
}
.motion-toggle {
  position: absolute;
  z-index: 15;
  top: 50%;
  right: 18px;
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  transform: translateY(-50%);
  border: 1px solid rgba(23,63,43,.22);
  border-radius: 50%;
  background: rgba(255,255,255,.96);
  color: var(--green);
  cursor: pointer;
}
.motion-toggle:hover { background: var(--palm); }
.motion-paused .marquee-track, .motion-paused .logo-marquee-track { animation-play-state: paused !important; }
.marquee-track.is-offscreen, .logo-marquee-track.is-offscreen { animation-play-state: paused !important; }

@media (max-width: 820px) {
  header.nav { padding: 10px 18px; }
  .nav-links { top: 68px; }
  .hero-sticky { height: 100svh; min-height: min(540px, 100svh); }
  .hero-content { padding-bottom: 90px; }
  .hero-title { max-width: 11ch; font-size: clamp(38px, 10vw, 64px); }
  .hero-sub { max-width: 38ch; font-size: 14px; }
  .hero-note { bottom: 22px; font-size: 9px; }
  .scroll-cue { bottom: 18px; }
  .marquee-item { font-size: 11px; gap: 20px; padding-right: 20px; }
  .motion-toggle { right: 8px; width: 30px; height: 30px; }
  .landmark-picker { align-items: stretch; flex-direction: column; margin-inline: 4vw; }
  .landmark-picker select { width: 100%; }
}

@media (max-height: 650px) and (max-width: 820px) {
  .hero-content { padding-bottom: 70px; }
  .hero-title { font-size: clamp(34px, 7vh, 50px); }
  .hero-sub { margin-top: 12px; font-size: 12px; }
}

@media (prefers-reduced-motion: reduce) {
  .marquee-track, .logo-marquee-track, .scroll-cue .line::after { animation: none !important; }
  .gal-item img, .pillar-bg, .amen-card-img { transition: none !important; }
}

/* ===== FOOTER LOGO ===== */
.foot-logo-wrap {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 16px;
}
.foot-logo-img {
  height: auto;
  width: 150px;
  object-fit: contain;
  border-radius: 4px;
}
.foot-logo {
  font-family: var(--ff-display);
  font-size: 26px;
  color: #ffffff;
}
.foot-logo em {
  color: var(--brass);
  font-style: normal;
}

footer{background:#0a0a0a;border-top:1px solid var(--line);padding:70px 0 30px;}
.foot-top{display:flex;justify-content:space-between;flex-wrap:wrap;gap:40px;margin-bottom:60px;}
.foot-links{display:flex;gap:60px;flex-wrap:wrap; align-items: flex-end;}
.foot-col h5{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--brass);margin-bottom:16px;}
.foot-col a,.foot-col span{display:block;font-size:14px;color:#ffffff;margin-bottom:10px;}
.foot-bottom{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;border-top:1px solid var(--line);padding-top:26px;font-size:12px;color:#ffffff;}

/* ===== PROJECT BRIEF / HOME SECTION TWO ===== */
.project-brief { border-top: 1px solid var(--line-gold); }
.project-brief__intro { display:grid; grid-template-columns:1.05fr .75fr; gap:clamp(32px,7vw,120px); align-items:end; padding:0 0 clamp(32px,5vw,62px); }
.project-brief__intro .eyebrow { margin-bottom:17px; }
.project-brief__intro h2 { font-size:clamp(40px,5.3vw,76px); line-height:.98; letter-spacing:-.045em; margin:0; color:var(--sand); }
.project-brief__intro h2 em { color:var(--brass); font-weight:400; }
.project-brief__intro p { margin:0 0 5px; max-width:44ch; color:var(--sand-dim); font-size:15px; line-height:1.8; }
.project-brief__stage { display:grid; grid-template-columns:minmax(0,1.45fr) minmax(330px,.7fr); min-height:560px; border:1px solid var(--line-gold); background:#0d0d0d; }
.project-brief__image { position:relative; min-height:560px; overflow:hidden; }
.project-brief__image img { width:100%; height:100%; position:absolute; inset:0; object-fit:cover; transition:transform 1s cubic-bezier(.16,1,.3,1); }
.project-brief__image:hover img { transform:scale(1.045); }
.project-brief__image-shade { position:absolute; inset:0; background:linear-gradient(180deg,rgba(4,4,4,.1) 30%,rgba(4,4,4,.83) 100%); }
.project-brief__status { position:absolute; top:24px; left:24px; display:flex; gap:9px; align-items:center; padding:9px 12px; border:1px solid rgba(243,238,224,.35); background:rgba(10,10,10,.32); backdrop-filter:blur(8px); -webkit-backdrop-filter: blur(8px); color:var(--sand); font-size:10px; text-transform:uppercase; letter-spacing:.13em; }
.project-brief__status span { width:7px; height:7px; border-radius:50%; background:#83bf72; box-shadow:0 0 12px #83bf72; }
.project-brief__caption { position:absolute; left:clamp(24px,4vw,52px); right:clamp(24px,4vw,52px); bottom:35px; display:flex; justify-content:space-between; align-items:end; color:var(--sand); }
.project-brief__caption small { font-size:10px; letter-spacing:.18em; }
.project-brief__caption strong { font-family:var(--ff-display); font-size:clamp(22px,2.3vw,34px); font-weight:400; }
.project-brief__details { padding:30px; display:flex; flex-direction:column; background:linear-gradient(145deg,rgba(200,161,92,.11),rgba(15,15,15,.3) 42%); }
.project-brief__details-head { display:flex; justify-content:space-between; gap:12px; padding-bottom:19px; border-bottom:1px solid var(--line-gold); color:var(--brass); font-size:10px; text-transform:uppercase; letter-spacing:.13em; }
.project-facts { margin:0; display:grid; grid-template-columns:1fr 1fr; }
.project-facts div { padding:25px 12px 22px 0; min-height:112px; border-bottom:1px solid rgba(243,238,224,.12); }
.project-facts div:nth-child(odd) { border-right:1px solid rgba(243,238,224,.12); padding-right:18px; }
.project-facts div:nth-child(even) { padding-left:18px; }
.project-facts dt { margin-bottom:8px; color:var(--sand-dim); font-size:9px; letter-spacing:.13em; text-transform:uppercase; }
.project-facts dd { margin:0; color:var(--sand); font-family:var(--ff-display); font-size:clamp(18px,1.75vw,25px); line-height:1.08; }
.project-facts small { font-family:var(--ff-body); font-size:10px; color:var(--brass); letter-spacing:.06em; }
.project-brief__note { margin-top:24px; color:var(--sand-dim); font-size:13px; line-height:1.65; }
.project-brief__cta { margin-top:auto; padding:17px 0 0; border:0; border-top:1px solid var(--line-gold); background:transparent; color:var(--sand); cursor:pointer; display:flex; justify-content:space-between; align-items:center; font-size:11px; font-weight:600; text-transform:uppercase; letter-spacing:.14em; transition:color .25s ease; }
.project-brief__cta b { width:34px; height:34px; display:grid; place-items:center; border:1px solid var(--brass); border-radius:50%; color:var(--brass); font-size:20px; font-weight:400; transition:background .25s ease,color .25s ease,transform .25s ease; }
.project-brief__cta:hover { color:var(--brass); }.project-brief__cta:hover b { background:var(--brass); color:var(--ink); transform:rotate(45deg); }
@media(max-width:800px) { .specs-section { padding:70px 0; } .project-brief__intro { grid-template-columns:1fr; gap:22px; } .project-brief__stage { grid-template-columns:1fr; min-height:0; } .project-brief__image { min-height:420px; } .project-brief__details { min-height:430px; } }
@media(max-width:480px) { .project-brief__intro h2 { font-size:42px; } .project-brief__image { min-height:360px; } .project-brief__details { padding:22px; } .project-facts div { min-height:98px; padding-top:20px; } .project-brief__caption { bottom:24px; flex-direction:column; align-items:start; gap:9px; } }

/* Bright, editorial treatment for the project brief */
.specs-section { padding:clamp(72px,9vw,130px) 0; background:#edf3ef; overflow:hidden; }
.specs-section::before { content:'PALMS'; position:absolute; top:22px; right:-12px; color:rgba(90,122,93,.075); font-family:var(--ff-display); font-size:clamp(100px,19vw,270px); font-weight:700; line-height:.7; letter-spacing:-.08em; pointer-events:none; }
.project-brief { position:relative; border-top:2px solid var(--sage); }
.project-brief__intro { grid-template-columns:1fr 1fr; padding:clamp(28px,4vw,56px) 0; }
.project-brief__intro h2 { color:#173f2b; font-weight:500; letter-spacing:-.06em; }
.project-brief__intro h2 em { color:var(--sage); }
.project-brief__intro p { color:#45604d; font-weight:400; line-height:1.85; }
.project-brief__stage { grid-template-columns:minmax(0,.92fr) minmax(400px,1.08fr); min-height:540px; border:0; background:#fff; box-shadow:0 24px 65px rgba(39,73,53,.12); }
.project-brief__image { min-height:540px; }
.project-brief__image-shade { background:linear-gradient(180deg,rgba(14,48,31,.04) 35%,rgba(14,48,31,.72)); }
.project-brief__status { border:0; background:#fff; color:#315c43; box-shadow:0 8px 22px rgba(27,62,42,.16); font-weight:600; }
.project-brief__caption { color:#fff; }
.project-brief__details { padding:clamp(28px,4vw,55px); background:#fff; }
.project-brief__details-head { border-color:rgba(90,122,93,.28); color:var(--sage); font-weight:600; }
.project-facts { margin-top:8px; }
.project-facts div { border-color:rgba(90,122,93,.17); min-height:122px; }
.project-facts div:nth-child(odd) { border-color:rgba(90,122,93,.17); }
.project-facts dt { color:#718278; font-weight:600; }
.project-facts dd { color:#173f2b; font-weight:500; }
.project-facts small { color:var(--sage); font-weight:600; }
.project-brief__note { color:#50675a; font-weight:400; border-left:2px solid var(--brass); padding-left:15px; }
.project-brief__cta { border-top-color:rgba(90,122,93,.3); color:#173f2b; }
.project-brief__cta b { border-color:var(--sage); color:var(--sage); }
.project-brief__cta:hover { color:var(--sage); }.project-brief__cta:hover b { background:var(--sage); color:#fff; }
@media(max-width:800px) { .project-brief__intro { grid-template-columns:1fr; } .project-brief__stage { grid-template-columns:1fr; } }

/* ===== PROJECT DOSSIER — DISTINCT HOME SECTION TWO ===== */
.specs-section { background:#f7f5ef; }
.specs-section::before { content:'01'; right:4vw; top:45px; color:rgba(200,161,92,.16); font-family:var(--ff-display); font-size:clamp(115px,19vw,255px); font-weight:400; }
.dossier { position:relative; color:#173f2b; }
.dossier__masthead { min-height:54px; display:grid; grid-template-columns:72px 1fr auto; align-items:center; border-top:1px solid rgba(0, 0, 0, 0.33); border-bottom:1px solid rgba(0, 0, 0, 0.18); }
.dossier__number { height:100%; display:grid; place-items:center; color:#fff; background:#000000; font-family:var(--ff-display); font-size:20px; }
.dossier__masthead .eyebrow { margin-left:22px; color:#315c43; }.dossier__masthead .eyebrow::before { background:#315c43; }
.dossier__place { color:#6d7e70; font-size:10px; font-weight:600; letter-spacing:.15em; text-transform:uppercase; }
.dossier__headline { display:grid; grid-template-columns:1fr minmax(300px,.72fr); gap:clamp(35px,8vw,140px); padding:clamp(40px,6vw,86px) 8.5% clamp(35px,5vw,66px) 8.5%; align-items:end; }
.dossier__headline h2 { margin:0; color:#173f2b; font-size:clamp(45px,6vw,91px); font-weight:500; line-height:.9; letter-spacing:-.075em; }.dossier__headline h2 em { display:block; color:#b28d51; font-weight:400; }
.dossier__headline p { margin:0; color:#526b5a; font-size:14px; font-weight:400; line-height:1.9; }
.dossier__canvas { display:grid; grid-template-columns:1.35fr .65fr; align-items:stretch; background:#c8a15c; }
.dossier__hero-image { position:relative; min-height:510px; margin:0; overflow:hidden; clip-path:polygon(0 0,100% 0,92% 100%,0 100%); }.dossier__hero-image img { width:100%; height:100%; object-fit:cover; position:absolute; inset:0; transition:transform .9s ease; }.dossier__hero-image:hover img { transform:scale(1.05); }
.dossier__hero-image::after { content:''; position:absolute; inset:0; background:linear-gradient(0deg,rgba(20,43,30,.48),transparent 42%); }
.dossier__hero-image figcaption { position:absolute; z-index:1; bottom:26px; left:clamp(24px,5vw,65px); display:flex; align-items:center; gap:11px; color:#fff; font-size:10px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; }.dossier__hero-image figcaption i { width:28px; height:1px; background:#d0ad70; }
.dossier__facts { padding:28px clamp(26px,4vw,55px); display:flex; flex-direction:column; justify-content:space-between; color:#fff; }
.dossier__fact { padding:16px 0; border-bottom:1px solid rgba(255,255,255,.23); }.dossier__fact span { display:block; margin-bottom:6px; color:rgb(0, 0, 0); font-size:10px; font-weight:500; text-transform:uppercase; letter-spacing:.14em; }.dossier__fact strong { font-family:var(--ff-display); font-size:clamp(20px,2vw,29px); font-weight:400; }.dossier__fact small { font-family:var(--ff-body); font-size:10px; color:#000000; letter-spacing:.08em; }
.dossier__call { position:relative; width:100%; margin-top:19px; padding:15px 44px 15px 0; text-align:left; border:0; background:transparent; border-bottom:2px solid #d2ad70; color:#fff; cursor:pointer; }.dossier__call span,.dossier__call strong { display:block; }.dossier__call span { margin-bottom:4px; color:#000000; font-size:10px; letter-spacing:.15em; text-transform:uppercase; }.dossier__call strong { font-size:17px; font-weight:500; }.dossier__call b { position:absolute; right:4px; top:50%; transform:translateY(-50%); color:#000000; font-size:28px; transition:transform .25s ease; }.dossier__call:hover b { transform:translate(7px,-50%); }
@media(max-width:800px) { .dossier__headline { grid-template-columns:1fr; }.dossier__canvas { grid-template-columns:1fr; }.dossier__hero-image { min-height:420px; clip-path:none; }.dossier__facts { min-height:400px; }.dossier__place { display:none; } }
@media(max-width:500px) { .dossier__masthead { grid-template-columns:56px 1fr; }.dossier__masthead .eyebrow { margin-left:15px; font-size:9px; letter-spacing:.18em; }.dossier__headline { padding-left:0; padding-right:0; }.dossier__hero-image { min-height:330px; }.dossier__hero-image figcaption { flex-wrap:wrap; max-width:190px; bottom:19px; }.dossier__facts { padding:24px; }}

/* _____________JOURNY_________________________________ */

/* =========================================
   MAIN SCROLL SECTION
========================================= */

.palms-impact-section {
    position: relative;
    height: 300vh;
    width: 100%;
    overflow: clip;
}


/* =========================================
   STICKY SCREEN
========================================= */

.palms-impact-sticky {
    position: sticky;
    top: 0;

    width: 100%;
    height: 100vh;

    display: grid;
    grid-template-columns: 40% 60%;

    overflow: hidden;
}


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

.palms-impact-content {
    position: relative;

    height: 100%;

    display: flex;
    flex-direction: column;
    justify-content: center;

    padding-left: 8vw;
    padding-right: 4vw;

    z-index: 20;
}


.palms-impact-eyebrow {
    margin-bottom: 30px;

    font-size: 11px;
    letter-spacing: 0.25em;
    text-transform: uppercase;

    color: #858078;
}


.palms-impact-title {
    font-family: var(--ff-display);

    font-size: clamp(55px, 6vw, 105px);

    font-weight: 400;

    line-height: 0.88;

    letter-spacing: -0.06em;

    color: #171714;
}


.palms-impact-description {
    max-width: 390px;

    margin-top: 35px;

    font-size: 15px;

    line-height: 1.7;

    color: #69665e;
}


/* =========================================
   STAGE INFO
========================================= */

.palms-impact-stage {
    display: flex;
    align-items: center;

    gap: 18px;

    margin-top: 55px;
}


.palms-impact-number {
    font-size: 12px;

    letter-spacing: 0.2em;

    color: #9b8150;
}


.palms-impact-stage-name {
    font-size: 11px;

    letter-spacing: 0.22em;

    text-transform: uppercase;

    color: #26251f;
}


/* =========================================
   PROGRESS
========================================= */

.palms-impact-progress {
    width: 170px;

    height: 1px;

    margin-top: 18px;

    background: rgba(0,0,0,0.12);

    overflow: hidden;
}


.palms-impact-progress-bar {
    width: 100%;

    height: 100%;

    background: #9b8150;

    transform-origin: left center;
    transform: scaleX(0.12);
}


/* =========================================
   RIGHT VISUAL AREA
========================================= */

.palms-impact-visual {
    position: relative;

    height: 100%;
    width: 100%;

    display: flex;

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

    perspective: 1400px;
}


/* =========================================
   BACKGROUND GRID
========================================= */

.palms-impact-grid {
    position: absolute;

    width: 70%;
    height: 70%;

    opacity: 0.08;

    background-image:
        linear-gradient(
            rgba(40,40,35,0.5) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(40,40,35,0.5) 1px,
            transparent 1px
        );

    background-size: 35px 35px;

    transform:
        perspective(600px)
        rotateX(60deg)
        rotateZ(-8deg);

    z-index: 1;
}


/* =========================================
   GLOW
========================================= */

.palms-impact-glow {
    position: absolute;

    width: 45%;
    height: 45%;

    border-radius: 50%;

    background: rgba(170,145,90,0.17);

    filter: blur(90px);

    z-index: 0;

    transform: scale(0.8);
}


/* =========================================
   FRAME CONTAINER
========================================= */

.palms-impact-frame-container {
    position: relative;

    width: min(54vw, 860px);

    aspect-ratio: 1 / 1;

    display: flex;

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

    transform-style: preserve-3d;

    will-change: transform;
    transform-origin: center center;

    z-index: 5;
}


/* =========================================
   ALL FRAMES
========================================= */

.palms-impact-frame {
    position: absolute;

    width: 100%;
    height: 100%;

    object-fit: contain;

    display: block;

    pointer-events: none;

    user-select: none;
    -webkit-user-select:none;

    will-change: opacity, transform, filter;

    opacity: 0;
}


/* FIRST FRAME */

.palms-impact-frame[data-frame="0"] {
    opacity: 1;
}



/* =========================================
   FIVE-FRAME PREVIEW RAIL
========================================= */

.palms-impact-preview {
    position: absolute;
    right: 4vw;
    bottom: 5.5vh;

    width: min(34vw, 520px);

    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 8px;

    z-index: 25;
}

.palms-impact-preview-item {
    position: relative;

    height: 62px;

    padding: 0;

    border: 1px solid rgba(0,0,0,0.12);
    background: rgba(243,240,233,0.72);

    overflow: hidden;

    cursor: pointer;

    opacity: 0.55;

    transition:
        opacity 0.3s ease,
        border-color 0.3s ease,
        transform 0.3s ease;

    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

.palms-impact-preview-item:hover {
    opacity: 0.9;
    transform: translateY(-3px);
}

.palms-impact-preview-item.is-active {
    opacity: 1;
    border-color: #9b8150;
}

.palms-impact-preview-item img {
    width: 100%;
    height: 100%;

    object-fit: contain;

    display: block;
}

.palms-impact-preview-item span {
    position: absolute;

    left: 7px;
    bottom: 5px;

    font-size: 8px;
    letter-spacing: 0.12em;

    color: #45423b;

    mix-blend-mode: multiply;
}

/* =========================================
   TECHNICAL LABELS
========================================= */

.palms-impact-coordinate {
    position: absolute;

    font-size: 9px;

    letter-spacing: 0.18em;

    color: #87837b;

    z-index: 15;

    pointer-events: none;
}


.palms-impact-coordinate.one {
    top: 17%;
    right: 8%;
}


.palms-impact-coordinate.two {
    bottom: 13%;
    right: 11%;
}


/* =========================================
   SCROLL HINT
========================================= */

.palms-impact-scroll-hint {
    position: absolute;

    bottom: 35px;
    left: 8vw;

    display: flex;

    align-items: center;

    gap: 12px;

    font-size: 9px;

    letter-spacing: 0.2em;

    text-transform: uppercase;

    color: #88847c;

    z-index: 30;
}


.palms-impact-scroll-line {
    width: 45px;

    height: 1px;

    background: #88847c;
}


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

@media (max-width: 900px) {

    .palms-impact-section { height: 300vh; }


    .palms-impact-sticky {

        grid-template-columns: 1fr;

        grid-template-rows: 43% 57%;
    }


    .palms-impact-content {

        justify-content: flex-start;

        padding:

            7vh
            8vw
            0;
    }


    .palms-impact-eyebrow {

        margin-bottom: 20px;
    }


    .palms-impact-title {

        font-size: clamp(
            48px,
            12vw,
            80px
        );
    }


    .palms-impact-description {

        margin-top: 20px;

        max-width: 330px;

        font-size: 13px;
    }


    .palms-impact-stage {

        margin-top: 25px;
    }


    .palms-impact-visual {

        height: 57vh;
    }


    .palms-impact-frame-container {

        width: 92vw;

        max-width: 720px;
    }


    .palms-impact-grid {

        width: 85%;

        height: 75%;
    }



    .palms-impact-preview {
        right: 6vw;
        bottom: 2.2vh;
        width: 88vw;
        gap: 5px;
    }

    .palms-impact-preview-item {
        height: 46px;
    }

    .palms-impact-preview-item span {
        font-size: 7px;
        left: 5px;
        bottom: 3px;
    }

    .palms-impact-scroll-hint {

        display: none;
    }
}

/* =====================================================
   ABOUT — CINEMATIC SCROLL
===================================================== */

.palms-about-scroll{
    position:relative;
    height:1250vh;
   
}

.palms-about-sticky{
    position:sticky;
    top:0;
    height:100vh;
    min-height:650px;
    overflow:hidden;
}

/* subtle background texture */
.palms-about-sticky::before{
    content:"";
    position:absolute;
    inset:0;

/* Warm gold + white ambient light, inspired by the Palms identity */
.palms-about-sticky::after{
    content:"";
    position:absolute;
    inset:-20%;
    pointer-events:none;
    z-index:1;
    background:
        radial-gradient(
            ellipse at 50% 45%,
            rgba(255,255,255,.13) 0%,
            rgba(255,255,255,.045) 18%,
            transparent 42%
        ),
        radial-gradient(
            ellipse at 18% 28%,
            rgba(218,177,84,.13) 0%,
            transparent 32%
        ),
        radial-gradient(
            ellipse at 82% 70%,
            rgba(218,177,84,.10) 0%,
            transparent 34%
        );
    mix-blend-mode:screen;
    animation: palmsAmbientLight 12s ease-in-out infinite alternate;
}

@keyframes palmsAmbientLight{
    from{transform:scale(1) translate3d(-1%,0,0)}
    to{transform:scale(1.08) translate3d(1%,1%,0)}
}

    background:
        radial-gradient(
            circle at center,
            rgba(255,255,255,.045),
            transparent 42%
        );
    pointer-events:none;
}

/* =====================================================
   CENTER CONTENT
===================================================== */

.palms-about-center{
    position:absolute;
    z-index:20;
    left:50%;
    top:50%;

    width:min(650px,72vw);

    transform:translate(-50%,-50%);
    text-align:center;

    pointer-events:none;
    z-index:20;
}

.palms-about-label{
    display:block;

    margin-bottom:28px;

    font-size:10px;
    letter-spacing:.28em;
    text-transform:uppercase;

    color:#000000;
}

.palms-about-title{
    position:relative;
    font-family:Georgia,"Times New Roman",serif;
    font-size:clamp(55px,8vw,125px);
    line-height:.82;
    font-weight:400;
    letter-spacing:-.065em;
    color:var(--brass-dim) ;

    white-space:nowrap;

    text-shadow:
        0 5px 30px rgba(0,0,0,.18);
}

.palms-about-title::before{
    content:"";
    display:block;
    width:48px;
    height:1px;
    margin:0 auto 24px;
    background:#d4af5a;
    opacity:.85;
}

.palms-about-description{
    max-width:430px;

    margin:35px auto 0;

    font-size:13px;
    line-height:1.8;

    color: #000000;;
}

/* =====================================================
   IMAGE LANES
===================================================== */

.palms-about-lane{
    position:absolute;
    z-index:8;
    top:0;
    bottom:0;

    width:50vw;

    pointer-events:none;
}

.palms-about-lane--left{
    left:0;
}

.palms-about-lane--right{
    right:0;
}

/* =====================================================
   IMAGE CARDS
===================================================== */

.palms-about-image{
    position:absolute;
    border:1px solid rgba(216,180,92,.16);
    box-shadow:0 25px 70px rgba(0,0,0,.20);

    width:min(29vw,430px);
    height:min(39vw,570px);

    overflow:hidden;

    opacity:0;

    will-change:
        transform,
        opacity;
}

.palms-about-image img{
    width:100%;
    height:100%;

    display:block;

    object-fit:cover;

    filter:saturate(.82);

    transform:scale(1.08);

    transition:filter .8s ease;
}

/* left images */
.palms-about-lane--left
.palms-about-image{
    right:8vw;
}

/* right images */
.palms-about-lane--right
.palms-about-image{
    left:8vw;
}

/* =====================================================
   IMAGE POSITIONS
===================================================== */

.palms-about-image--1{
    top:10%;
}

.palms-about-image--2{
    top:53%;
}

.palms-about-image--3{
    top:20%;
}

.palms-about-image--4{
    top:62%;
}

.palms-about-image--5{
    top:5%;
}

.palms-about-image--6{top:48%}
.palms-about-image--7{top:12%}
.palms-about-image--8{top:57%}
.palms-about-image--9{top:24%}
.palms-about-image--10{top:66%}
.palms-about-image--11{top:8%}
.palms-about-image--12{top:50%}
.palms-about-image--13{top:18%}
.palms-about-image--14{top:62%}

/* =====================================================
   IMAGE NUMBER
===================================================== */

.palms-about-image::after{
    content:attr(data-number);

    position:absolute;

    left:18px;
    bottom:16px;

    font-size:9px;
    letter-spacing:.2em;

    color:white;

    text-shadow:0 2px 10px rgba(0,0,0,.5);
}

/* =====================================================
   SIDE LABELS
===================================================== */

.palms-about-side-label{
    position:absolute;

    top:50%;

    font-size:9px;
    letter-spacing:.22em;

    color:#8f9a8e;

    writing-mode:vertical-rl;

    text-transform:uppercase;
}

.palms-about-side-label--left{
    left:25px;
    transform:translateY(-50%) rotate(180deg);
}

.palms-about-side-label--right{
    right:25px;
    transform:translateY(-50%);
}

/* =====================================================
   PROGRESS
===================================================== */

.palms-about-progress{
    position:absolute;

    left:50%;
    bottom:35px;

    transform:translateX(-50%);

    width:180px;
    height:1px;

    background:rgba(226,190,104,.25);

    z-index:30;
}

.palms-about-progress span{
    display:block;

    width:0;
    height:100%;

    background:#d4af5a;
}

/* =====================================================
   NEXT SECTION
===================================================== */

.palms-overview{
    position:relative;

    min-height:100vh;

    padding:150px 7vw;

    background:#f5f1e7;
    color:#17231c;
}

.palms-overview-inner{
    width:min(1400px,88vw);
    margin:auto;
}

.palms-overview-label{
    font-size:10px;
    letter-spacing:.25em;
    text-transform:uppercase;
    color:#9a927f;
}

.palms-overview-title{
    margin-top:30px;

    font-family:Georgia,"Times New Roman",serif;
    font-size:clamp(60px,8vw,125px);
    line-height:.84;
    font-weight:400;
    letter-spacing:-.065em;
}

.palms-overview-copy{
    max-width:500px;

    margin-top:35px;

    font-size:14px;
    line-height:1.8;

    color:#68645c;
}

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

@media(max-width:800px){

    .palms-about-scroll{
        height:1050vh;
    }

    .palms-about-title{
        font-size:clamp(47px,13vw,85px);
        white-space:normal;
    }

    .palms-about-center{
        width:78vw;
    }

    .palms-about-description{
        font-size:12px;
        max-width:320px;
    }

    .palms-about-image{
        width:38vw;
        height:52vw;
    }

    .palms-about-lane--left
    .palms-about-image{
        right:3vw;
    }

    .palms-about-lane--right
    .palms-about-image{
        left:3vw;
    }

    .palms-about-side-label{
        display:none;
    }
}

@media(max-width:500px){

    .palms-about-image{
        width:42vw;
        height:57vw;
    }

    .palms-about-center{
        width:74vw;
    }

    .palms-about-label{
        font-size:8px;
    }

    .palms-about-description{
        display:none;
    }

    .palms-about-progress{
        width:120px;
        bottom:22px;
    }
}

.about{height:auto;}.sticky{position:sticky;top:0;height:100vh;overflow:hidden;isolation:isolate}
.sticky:before{content:"";position:absolute;inset:-20%;z-index:0;background:radial-gradient(ellipse at 50% 48%,rgba(255,255,255,.14),transparent 38%),radial-gradient(ellipse at 20% 20%,rgba(212,175,90,.12),transparent 30%),radial-gradient(ellipse at 80% 75%,rgba(212,175,90,.09),transparent 32%)}
.center{position:absolute;z-index:40;left:50%;top:50%;width:min(600px,34vw);transform:translate(-50%,-50%);text-align:center;pointer-events:none}
.kicker{display:block;margin-bottom:24px;color:#d4af5a;font-size:9px;letter-spacing:.3em;text-transform:uppercase}
.title{font:400 clamp(48px,6.4vw,105px)/.84 Georgia,serif;letter-spacing:-.065em;text-shadow:0 8px 35px rgba(0,0,0,.22);color:#173f2b}
.title:before{content:"";display:block;width:46px;height:1px;margin:0 auto 22px;background:#d4af5a}
.copy{max-width:360px;margin:30px auto 0;color: #000;font-size:12px;line-height:1.8}
.lane{position:absolute;top:0;bottom:0;width:42vw;z-index:10;pointer-events:none}.left{left:0}.right{right:0}
.center-lane{
    left:50%;
    width:32vw;
    transform:translateX(-50%);
    z-index:5;
}
.center-lane .center-card{
    left:50%;
    right:auto;
    width:min(25vw,360px);
    height:min(33vw,480px);
}
.center-lane .c1{top:10%}
.center-lane .c2{top:45%}
.center-lane .c3{top:80%}

.card{position:absolute;width:min(27vw,410px);height:min(36vw,540px);overflow:hidden;opacity:0;will-change:transform,opacity;border:1px solid rgba(212,175,90,.2);box-shadow:0 28px 80px rgba(0,0,0,.22)}
.left .card{right:8vw}.right .card{left:8vw}.card img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(.84)}
.card:after{content:attr(data-no);position:absolute;left:16px;bottom:14px;color:#fff;font-size:8px;letter-spacing:.2em;text-shadow:0 2px 12px #000}
.side{position:absolute;z-index:25;top:50%;transform:translateY(-50%);color:#87958a;font-size:8px;letter-spacing:.22em;text-transform:uppercase;writing-mode:vertical-rl}.side.l{left:22px;transform:translateY(-50%) rotate(180deg)}.side.r{right:22px}
.progress{position:absolute;z-index:35;bottom:30px;left:50%;transform:translateX(-50%);width:150px;height:1px;background:rgba(212,175,90,.22)}.progress i{display:block;width:0;height:100%;background:#d4af5a}
.next{min-height:100vh;padding:150px 7vw;background:#f5f1e7;color:#17231c}.next h2{margin-top:28px;font:400 clamp(55px,8vw,120px)/.84 Georgia,serif;letter-spacing:-.065em}.next p{max-width:500px;margin-top:35px;color:#68645c;font-size:13px;line-height:1.8}
@media(max-width:800px){.about{height:auto}.center{width:58vw}.title{font-size:clamp(43px,10vw,75px)}.lane{width:43vw}.card{width:34vw;height:47vw}.left .card{right:4vw}.right .card{left:4vw}}
@media(max-width:500px){.about{height:auto}.center{width:54vw}.title{font-size:clamp(36px,10vw,60px)}.copy{display:none}.card{width:38vw;height:52vw}.side{display:none}}

/* =============================MAP======================== */

.location-section,
.contact{
  --green:#173f2b;
  --green-soft:#315941;
  --gold:var(--brass);
  --cream:var(--palm);
  --muted:var(--sand-dim);
  --paper:#fff;
  --soft:#f4f6f4;
  --ease:cubic-bezier(.22,1,.36,1);
  --ink:#173f2b;
  --line:rgba(23,61,42,.14);
}
.contact{background:var(--cream);color:var(--green);}

.location-section{
  min-height:100vh;
  padding:100px 4vw 80px;
  overflow:hidden;
  background:radial-gradient(circle at 50% 35%,#fff 0%,#f8f6ef 48%,#eeeae0 100%);
}

.intro{
  position:relative;
  z-index:20;
  text-align:center;
  max-width:720px;
  margin:0 auto 42px;
}
.eyebrow-map{
  color:var(--gold);
  font-size:9px;
  letter-spacing:.32em;
  text-transform:uppercase;
  margin-bottom:15px;
}
.intro h2{
  font:400 clamp(52px,7vw,100px)/.84 Georgia,serif;
  letter-spacing:-.065em;
}
.intro p{
  max-width:600px;
  margin:22px auto 0;
  color:#69736b;
  font-size:12px;
  line-height:1.8;
}

/* MAP */

.map-stage{
  position:relative;
  width:min(1450px,94vw);
  height:min(70vh,720px);
  min-height:540px;
  margin:auto;
  overflow:hidden;
  background:#fff;
  border:1px solid rgba(23,61,42,.15);
  box-shadow:0 35px 100px rgba(23,61,42,.10);
  cursor:grab;
}
.map-stage.dragging{cursor:grabbing}

.map-world{
  position:absolute;
  inset:0;
  transform-origin:center center;
  will-change:transform;
  transition:transform .8s cubic-bezier(.22,1,.36,1);
}
.map-stage.dragging .map-world{transition:none}

.map-world>img{
  width:100%;
  height:100%;
  object-fit:contain;
  display:block;
  user-select:none;
  -webkit-user-select:none;
  pointer-events:none;
}

.map-wash{
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(180deg,rgba(255,255,255,.02),rgba(255,255,255,.08));
}

/* subtle route emphasis — does not replace the actual supplied map */
.route{
  position:absolute;
  left:15%;
  top:72%;
  width:76%;
  height:2px;
  z-index:4;
  pointer-events:none;
  transform:rotate(-4deg);
  opacity:.58;
  display:none;
}
.route:before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(
    90deg,
    transparent,
    rgba(180,148,97,.8) 15%,
    rgba(180,148,97,.8) 85%,
    transparent
  );
}

/* POINTERS */

.pin{
  position:absolute;
  z-index:10;
  border:0;
  background:none;
  padding:0;
  min-width:0;
  height:auto;
  overflow:visible;
  line-height:0;
  font:inherit;
  letter-spacing:normal;
  text-transform:none;
  transform:translate(-50%,-50%);
  cursor:pointer;
  color:var(--green);
}
.pin-dot{
  width:12px;
  height:12px;
  display:block;
  border-radius:50%;
  background:var(--gold);
  border:2px solid #fff;
  box-shadow:0 0 0 4px rgba(180,148,97,.18),0 5px 16px rgba(0,0,0,.15);
  transition:.35s ease;
}
.pin-label{
  position:absolute;
  left:50%;
  bottom:20px;
  transform:translate(-50%,5px);
  white-space:nowrap;
  padding:6px 9px;
  background:rgba(246,243,235,.96);
  border:1px solid rgba(23,61,42,.13);
  font-size:8px;
  opacity:0;
  transition:.3s ease;
  pointer-events:none;
}
.pin:hover,.pin.active{z-index:40}
.pin:hover .pin-dot,.pin.active .pin-dot{
  transform:scale(1.5);
  background:#d4af5a;
  box-shadow:0 0 0 8px rgba(212,175,90,.20),0 7px 22px rgba(0,0,0,.20);
}
.pin:hover .pin-label,.pin.active .pin-label{
  opacity:1;
  transform:translate(-50%,-2px);
}

.pin-palms .pin-dot{
  width:18px;
  height:18px;
  background:var(--green);
  border:2px solid #d4af5a;
  box-shadow:0 0 0 8px rgba(23,61,42,.12),0 8px 25px rgba(0,0,0,.20);
}
.pin-palms .pin-label{
  opacity:1;
  transform:translate(-50%,-2px);
  background:var(--green);
  color:#fff;
  border:0;
  padding:8px 12px;
  font-weight:700;
  letter-spacing:.08em;
}

/* INFO PANEL
   IMPORTANT:
   It overlays the map instead of replacing it.
   The map stays visible at all times.
*/

.panel{
  position:absolute;
  z-index:60;
  right:24px;
  bottom:24px;
  width:350px;
  padding:14px;
  background:rgba(248,246,239,.97);
  border:1px solid rgba(23,61,42,.14);
  box-shadow:0 25px 70px rgba(23,61,42,.18);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
  opacity:0;
  transform:translateY(25px);
  pointer-events:none;
  transition:.4s cubic-bezier(.22,1,.36,1);
}
.panel.show{
  opacity:1;
  transform:none;
  pointer-events:auto;
}

.panel-image{
  position:relative;
  height:170px;
  overflow:hidden;
  background:#ddd;
  cursor:zoom-in;
}
.panel-image img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  user-select:none;
  -webkit-user-select:none;
  pointer-events:none;
}
.panel-image:after{
  content:"CLICK TO VIEW";
  position:absolute;
  right:10px;
  bottom:10px;
  padding:6px 8px;
  color:#fff;
  background:rgba(23,61,42,.75);
  font-size:7px;
  letter-spacing:.16em;
  pointer-events:none;
}

.kicker{
  margin-top:14px;
  color:var(--gold);
  font-size:8px;
  letter-spacing:.25em;
  text-transform:uppercase;
}
.panel h3{
  margin-top:6px;
  font:400 30px/1 Georgia,serif;
}
.panel p{
  margin-top:8px;
  color:#6c746d;
  font-size:10px;
  line-height:1.65;
}
.distance{
  display:flex;
  gap:8px;
  margin-top:13px;
  color:var(--green);
  font-size:9px;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.distance:before{
  content:"";
  width:25px;
  height:1px;
  background:var(--gold);
  margin-top:5px;
}

.panel-actions{
  display:flex;
  gap:7px;
  margin-top:14px;
}
.panel-actions a,
.panel-actions button{
  min-height:34px;
  padding:0 12px;
  border:1px solid rgba(23,61,42,.18);
  background:transparent;
  color:var(--green);
  text-decoration:none;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:8px;
  letter-spacing:.11em;
  text-transform:uppercase;
  cursor:pointer;
}
.panel-actions a{
  background:var(--green);
  border-color:var(--green);
  color:#fff;
}
.panel-actions a:hover{background:var(--green-soft)}
.panel-actions button:hover{background:#ebe7dc}

.close{
  position:absolute;
  right:10px;
  top:7px;
  z-index:5;
  border:0;
  background:none;
  color:var(--green);
  font-size:19px;
  cursor:pointer;
}

/* FULLSCREEN IMAGE */

.lightbox{
  position:fixed;
  inset:0;
  z-index:1000;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:30px;
  background:rgba(8,22,15,.94);
  opacity:0;
  visibility:hidden;
  transition:.3s ease;
}
.lightbox.show{
  opacity:1;
  visibility:visible;
}
.lightbox img{
  max-width:92vw;
  max-height:88vh;
  width:auto;
  height:auto;
  object-fit:contain;
  user-select:none;
  -webkit-user-select:none;
  -webkit-user-drag:none;
}
.lightbox-close{
  position:absolute;
  top:20px;
  right:25px;
  width:42px;
  height:42px;
  border:1px solid rgba(255,255,255,.25);
  background:rgba(255,255,255,.08);
  color:#fff;
  font-size:25px;
  cursor:pointer;
}
.lightbox-caption{
  position:absolute;
  left:30px;
  bottom:25px;
  color:#fff;
  font-size:9px;
  letter-spacing:.16em;
  text-transform:uppercase;
}

/* CONTROLS */

.tools{
  position:absolute;
  z-index:55;
  left:18px;
  bottom:18px;
  display:flex;
  gap:6px;
}
.tools button{
  width:36px;
  height:36px;
  border:1px solid rgba(23,61,42,.16);
  background:rgba(248,246,239,.94);
  color:var(--green);
  font-size:16px;
  cursor:pointer;
}
.tools button:hover{
  background:var(--green);
  color:#fff;
}

.note{
  position:absolute;
  z-index:25;
  left:20px;
  top:20px;
  padding:10px 12px;
  background:rgba(248,246,239,.9);
  border-left:2px solid var(--gold);
  color:#657069;
  font-size:8px;
  line-height:1.5;
  letter-spacing:.06em;
}

/* MAP POSITIONS */

.p-palms{left: 23.3%; top: 49.8%;}
.p-abdullah{    left: 26.00%;  top: 48.1%;}
.p-saima{    left: 20.6%; top: 60%;}
.p-greenline{left: 27%; top: 48.3%;}
.p-4k{left: 29.9%; top: 53%;}
.p-power{    left: 35%; top: 57.5%;}
.p-nagan{    left: 47.6%; top: 68%;}
.p-lucky{    left: 56.8%; top: 67.6%;}
.p-naya{    left: 42.7%; top: 77.2%;}
.p-sakhi{left: 47%;  top: 74.4%;}
.p-five{    left: 46.5%;  top: 83.7%;}
.p-haidery{left: 47.2%; top: 91%;}
.p-rashid{    left: 64.6%; top: 69.3%;}
.p-askari{left: 74.7%; top: 74.2%;}
.p-shahra{    left: 81.8%; top: 80%;}

@media(max-width:900px){
  .location-section{padding:75px 3vw}
  .map-stage{width:94vw;height:72vh;min-height:570px}
  .panel{width:330px}
}
@media(max-width:600px){
  .intro h2{font-size:50px}
  .map-stage{min-height:620px}
  .pin-label{display:block}
  .panel{right:12px;bottom:12px;width:calc(100% - 24px)}
  .note{max-width:200px}
  .panel-image{height:145px}
}

/* =============================foam=========================== */

.contact{
  min-height:100vh;display:grid;grid-template-columns:42% 58%;
  padding:clamp(35px,5vw,75px) clamp(25px,6.5vw,105px);
  position:relative;overflow:hidden;
}
.left{
  display:flex;flex-direction:column;justify-content:center;
  padding-right:clamp(35px,7vw,105px);position:relative;
}
.left:after{
  content:"";position:absolute;right:0;top:9%;height:82%;width:1px;
  background:var(--line);
}
.number{
  position:absolute;left:-3px;top:8%;font-size:10px;letter-spacing:.22em;
  color:#a8adab;writing-mode:vertical-rl;
}
.kicker{
  display:flex;align-items:center;gap:12px;color:var(--gold);
  font-size:9px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;
}
.kicker i{display:block;width:32px;height:1px;background:var(--gold)}
.contact .left h2{
  margin:27px 0 22px;font-size:clamp(52px,6vw,88px);font-weight:400;
  line-height:.88;letter-spacing:-.065em;
}
.desc{
  max-width:390px;margin:0 0 38px;color:var(--muted);
  font-size:13px;line-height:1.85;
}
.unit-preview{
  border-top:1px solid var(--line);padding-top:19px;max-width:390px;
  min-height:108px;position:relative;overflow:hidden;
}
.unit-preview .small{
  font-size:8px;letter-spacing:.18em;text-transform:uppercase;color:#a3aaa8;
}
.unit-info{
  display:flex;align-items:flex-end;gap:18px;margin-top:8px;
}
.unit-big{font-size:47px;line-height:.8;letter-spacing:-.06em;font-weight:400}
.unit-copy{font-size:11px;color:#697677;line-height:1.55}
.unit-copy strong{display:block;color:var(--ink);font-weight:500;margin-bottom:2px}
.unit-line{
  position:absolute;right:0;bottom:18px;width:80px;height:1px;background:var(--gold);
  transform-origin:right;transition:.7s var(--ease);
}
.left[data-unit="3"] .unit-line{width:135px}
.left[data-unit="2"] .unit-line{width:80px}

.form-wrap{
  align-self:center;background:var(--paper);position:relative;
  padding:clamp(22px,2.6vw,38px);
  box-shadow:0 25px 70px rgba(26,40,41,.055);
}
.form-wrap:before{
  content:"";position:absolute;left:0;top:0;width:2px;height:100%;
  background:linear-gradient(to bottom,transparent,var(--gold),transparent);
}
.form-head{
  display:flex;justify-content:space-between;align-items:center;
  padding-bottom:17px;border-bottom:1px solid var(--line);margin-bottom:15px;
  color: black;
}
.form-head b{font-size:14px;font-weight:500; color: #000;}
.form-head span{font-size:8px;color:#000000;letter-spacing:.2em;text-transform:uppercase}

 .contact form{display:grid;gap:9px}
.contact .row{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.contact .field{position:relative;background:var(--soft);transition:.45s var(--ease)}
.contact .field:focus-within{background:#fff;box-shadow:0 7px 25px rgba(25,40,41,.06);outline:1px solid #d9ddda}
.contact-enquiry-form input,
.contact-enquiry-form select,
.contact-enquiry-form textarea{
  width:100%;border:0;outline:0;background:transparent;
  font:inherit;font-size:12px;
}
.contact-enquiry-form input,
.contact-enquiry-form select{
  height:58px;padding:22px 17px 6px;
}
.contact-enquiry-form textarea{
  height:145px;resize:none;padding:25px 17px 12px;line-height:1.7;
}
.contact label{
  position:absolute;left:17px;top:19px;pointer-events:none;color:#9ca4a2;
  font-size:12px;transition:.35s var(--ease)
}
.contact .field:focus-within label,.contact .field.has label{
  top:7px;font-size:8px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);
}
.contact .select{overflow:hidden}
.contact .select:after{
  content:"";position:absolute;right:18px;top:25px;width:7px;height:7px;
  border-right:1px solid #777f7d;border-bottom:1px solid #777f7d;
  transform:rotate(45deg);pointer-events:none;transition:.35s var(--ease)
}
.contact .select:focus-within:after{transform:rotate(225deg);top:29px}
.contact-enquiry-select{
  appearance:none;cursor:pointer;padding-right:42px;
}
.contact-enquiry-option{font:inherit;color:var(--green);}


.bottom{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:3px}
.note{font-size:8px;color:#9aa19f;line-height:1.55;max-width:310px}
.contact button{
  height:48px;min-width:145px;border:0;background:var(--gold);color:#fff;
  font:600 9px "Avenir Next","Avenir",sans-serif;letter-spacing:.17em;
  text-transform:uppercase;cursor:pointer;position:relative;overflow:hidden;
  transition:.45s var(--ease)
}
.contact button:before{
  content:"";position:absolute;inset:0;background:var(--green);
  transform:translateX(-100%);transition:.5s var(--ease)
}
.contact button:hover:before{transform:translateX(0)}
.contact button:hover{transform:translateY(-2px);box-shadow:0 12px 25px rgba(49,91,85,.14)}
.contact button span{position:relative;z-index:1}

.success{
  display:none;margin-top:9px;padding:12px 14px;background:#edf2ef;
  color:var(--green);font-size:10px
}
.success.show{display:block;animation:up .55s var(--ease)}
@keyframes up{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

.corner{
  position:absolute;right:5%;bottom:6%;font-size:8px;letter-spacing:.2em;
  color:#adb2b0;text-transform:uppercase
}
.corner:before{
  content:"";display:inline-block;width:22px;height:1px;background:var(--line);
  vertical-align:middle;margin-right:10px
}

@media(max-width:850px){
  .contact{grid-template-columns:1fr;gap:50px}
  .left{padding-right:0}
  .left:after{display:none}
  .number{display:none}
  .form-wrap{align-self:auto}
}
@media(max-width:600px){
  .contact{padding:40px 18px 55px}
  .bottom .note{max-width:none;}
  .contact .left h2{font-size:57px}
  .contact .row{grid-template-columns:1fr}
  .form-wrap{padding:17px}
  .bottom{align-items:stretch;flex-direction:column}
  .contact button{width:100%}
  .unit-preview{margin-bottom:5px}
}

/* Keep the location controls compact despite the global enquiry-button styling. */
.map-stage{touch-action:pan-y;}
.map-world{transform:translate3d(0,0,0) scale(1);}
.pin{width:auto;min-width:0;min-height:0;height:auto;padding:0;overflow:visible;}
.pin::before{content:"";position:absolute;left:50%;top:50%;width:30px;height:30px;transform:translate(-50%,-50%);}
.tools button{flex:0 0 36px;width:36px;height:36px;min-width:36px;min-height:36px;padding:0;overflow:visible;}
.panel-actions button{flex:1;width:auto;min-width:0;min-height:34px;padding:0 12px;overflow:visible;}
.close{width:32px;height:32px;min-width:32px;min-height:32px;padding:0;overflow:visible;}
.lightbox-close{width:42px;height:42px;min-width:42px;min-height:42px;padding:0;overflow:visible;}
.tools button:before,.panel-actions button:before,.close:before,.lightbox-close:before{display:none;}
.tools button:hover,.panel-actions button:hover,.close:hover,.lightbox-close:hover{transform:none;box-shadow:none;}

/* Section rhythm and viewport-safe sticky artwork. Proximity snapping gives
   sections a gentle landing without trapping readers in long scroll scenes. */
html { scroll-snap-type: y proximity; scroll-padding-top: 0; }
/* Only content-heavy decision sections receive a gentle landing. */
body > .pillars,
body > .plans { scroll-snap-align: start; scroll-snap-stop: normal; }

/* Keep navigation in the opening scene so it never floats over later copy. */
header.nav { position: absolute; }

.pillars-sticky { top: 24px; }
.pillars-sticky h2 { margin-bottom: 20px; }
.pillar-visual {
  aspect-ratio: 1.2 / 1;
  max-height: min(58svh, 620px);
  background: linear-gradient(145deg, #1c3c2c, #10271c);
  box-shadow: 0 16px 36px rgba(10, 28, 19, .18);
}
.pillar-bg { object-fit: contain; transform: none; filter: none; }
.pillar-bg.active { transform: none; }
.pillar-visual-overlay { background: linear-gradient(180deg, transparent 48%, rgba(8, 23, 16, .68)); }
.pillars-grid > * { min-width: 0; }
.pillars-sticky h2 { max-width: 14ch; line-height: 1.04; text-wrap: balance; }

.palms-impact-sticky { height: 100svh; }
.palms-impact-preview {
  right: clamp(20px, 4vw, 60px);
  bottom: max(16px, env(safe-area-inset-bottom));
  width: min(34vw, 520px);
  gap: 6px;
  padding: 8px;
  border: 1px solid rgba(42, 54, 46, .1);
  border-radius: 14px;
  background: rgba(255, 255, 255, .82);
  box-shadow: 0 8px 30px rgba(24, 38, 29, .1);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
.palms-impact-preview-item { height: clamp(42px, 6vh, 58px); border-radius: 8px; }
.palms-impact-preview-item:focus-visible { outline: 2px solid #173f2b; outline-offset: 2px; }
.pillar-row { opacity: .62; transition-duration: .35s; }
.pillar-row.active { opacity: 1; }
.pin::before { width: 40px; height: 40px; }

.scroll-top {
  position: fixed;
  right: max(22px, env(safe-area-inset-right));
  bottom: max(22px, env(safe-area-inset-bottom));
  z-index: 95;
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  border: 1px solid rgba(200,161,92,.65);
  border-radius: 50%;
  background: rgba(255,255,255,.96);
  color: #173f2b;
  box-shadow: 0 5px 18px rgba(18,32,24,.14);
  cursor: pointer;
  transition: transform .2s ease, background-color .2s ease, box-shadow .2s ease;
}
.scroll-top[hidden] { display: none; }
.scroll-top span { font-size: 24px; line-height: 1; }
.scroll-top:hover { transform: translateY(-3px); background: #fff; box-shadow: 0 9px 24px rgba(18,32,24,.2); }
.scroll-top:focus-visible { outline: 3px solid #173f2b; outline-offset: 3px; }

@media (max-height: 760px) and (min-width: 901px) {
  .pillars-sticky { top: 16px; }
  .pillars-sticky h2 { margin: 8px 0 12px; }
  .pillar-visual { max-height: calc(100svh - 230px); }
  .pillar-progress { margin-top: 12px; }
  .palms-impact-eyebrow { margin-bottom: 14px; }
  .palms-impact-description { margin-top: 16px; font-size: 14px; }
  .palms-impact-stage { margin-top: 20px; }
}

@media (max-width: 900px) {
  .pillars-sticky { top: 0; }
  .pillar-visual { max-height: min(220px, 28svh); }
  .palms-impact-preview {
    right: 6vw;
    bottom: max(12px, env(safe-area-inset-bottom));
    width: 88vw;
  }
  .palms-impact-preview-item { height: clamp(38px, 6vh, 46px); }
  .palms-impact-glow { filter: blur(48px); }
  .panel { -webkit-backdrop-filter: none; backdrop-filter: none; }
}

.plan-view.active { grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: clamp(28px, 5vw, 70px); }
.plan-view > * { min-width: 0; }
.plan-img {
  display: grid;
  place-items: center;
  min-height: 360px;
  max-height: 72svh;
  padding: clamp(12px, 2vw, 24px);
  background: #fff;
  border: 1px solid rgba(23, 61, 42, .12);
  box-shadow: 0 18px 44px rgba(20, 34, 26, .08);
}
.plan-img img {
  display: block;
  width: 100%;
  max-height: calc(72svh - 48px);
  object-fit: contain;
  transition: none;
  will-change: auto;
}
.plan-img:hover img { transform: none; }
.plan-zoom-badge { top: 18px; right: 18px; background: #173f2b; border-radius: 999px; padding: 10px 14px; }
.plan-info h3 { line-height: 1.08; }
.plan-info .meta { line-height: 1.6; }
.room-list { gap: 10px 20px; }
.zoom-stage { background: #fff; border-radius: 12px; box-shadow: 0 24px 80px rgba(0,0,0,.2); }
.zoom-stage img { inset: 0; width: 100%; height: 100%; object-fit: contain; transform-origin: center center; }
.zoom-controls { position: absolute; right: clamp(20px, 5vw, 64px); bottom: max(20px, env(safe-area-inset-bottom)); z-index: 3; display: flex; align-items: center; gap: 6px; padding: 6px; border: 1px solid rgba(23,61,42,.14); border-radius: 999px; background: #fff; box-shadow: 0 8px 24px rgba(16,38,25,.12); }
.zoom-controls button { min-width: 40px; height: 38px; padding: 0 12px; border: 0; border-radius: 999px; background: transparent; color: #173f2b; font: 500 18px/1 var(--ff-body); cursor: pointer; }
.zoom-controls button:hover { background: #f0f4f1; }
.zoom-controls button:focus-visible { outline: 2px solid #173f2b; outline-offset: 2px; }
.zoom-controls #zoomReset { font-size: 11px; letter-spacing: .05em; }
.zoom-hint { bottom: max(34px, env(safe-area-inset-bottom)); }

@media (max-width: 900px) {
  .plan-view.active { grid-template-columns: minmax(0, 1fr); }
  .plan-img { min-height: 280px; max-height: 58svh; }
  .plan-img img { max-height: calc(58svh - 36px); }
}
@media (max-width: 560px) {
  .plan-img { min-height: 220px; padding: 12px; }
  .plan-img img { max-height: 48svh; }
  .room-list { grid-template-columns: 1fr; }
  .palms-impact-preview { right: 4vw; left: 4vw; width: auto; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-snap-type: none; }
}

/* Hero impact: compact copy plus a deliberate, legible view selector. */
.palms-impact-content {
  min-width: 0;
  padding-left: clamp(24px, 5vw, 80px);
  padding-right: clamp(18px, 2.5vw, 40px);
}
.palms-impact-eyebrow { margin-bottom: 16px; }
.palms-impact-title {
  width: 100%;
  max-width: 100%;
  font-size: clamp(40px, min(5.1vw, 7.5vh), 82px);
  line-height: .94;
  letter-spacing: -.055em;
  text-wrap: balance;
}
.palms-impact-title span { display: block; max-width: 100%; white-space: normal; }
.palms-impact-description {
  max-width: 47ch;
  margin-top: 22px;
  font-size: clamp(13px, 1vw, 15px);
  line-height: 1.62;
  text-wrap: pretty;
}
.palms-impact-stage { margin-top: 26px; }
.palms-impact-progress { margin-top: 12px; }
.palms-impact-scroll-hint { left: clamp(28px, 4vw, 68px); bottom: 26px; }
.palms-impact-preview {
  right: max(96px, 8vw);
  bottom: clamp(22px, 3vh, 36px);
  width: min(40vw, 540px);
  padding: 13px 15px 12px;
  border: 1px solid rgba(155, 129, 80, .28);
  border-radius: 10px;
  background: rgba(250, 249, 245, .94);
  box-shadow: 0 12px 34px rgba(32, 42, 34, .12);
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}
.palms-impact-preview-label {
  display: block;
  margin: 0 0 8px 2px;
  color: #68665e;
  font-size: 9px;
  font-weight: 600;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.palms-impact-preview-options { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 5px; }
.palms-impact-preview-item {
  display: flex;
  min-width: 0;
  height: 48px;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 3px;
  padding: 6px 8px;
  border: 1px solid transparent;
  border-radius: 6px;
  background: transparent;
  color: #5b5a53;
  opacity: 1;
  text-align: left;
  transition: background-color .18s ease, border-color .18s ease, color .18s ease;
}
.palms-impact-preview-item img { display: none; }
.palms-impact-preview-item span { position: static; color: #9b8150; font-size: 9px; font-weight: 600; letter-spacing: .12em; mix-blend-mode: normal; }
.palms-impact-preview-item small { overflow: hidden; max-width: 100%; color: inherit; font: 500 10px/1.1 var(--ff-body); text-overflow: ellipsis; white-space: nowrap; }
.palms-impact-preview-item:hover { opacity: 1; transform: none; background: rgba(23, 63, 43, .06); }
.palms-impact-preview-item.is-active { border-color: rgba(155, 129, 80, .45); background: #173f2b; color: #fff; }
.palms-impact-preview-item.is-active span { color: #e4c98c; }
.palms-impact-preview-item.is-active small { color: #fff; }
.palms-impact-coordinate.two { bottom: clamp(112px, 15vh, 160px); }

@media (max-height: 780px) and (min-width: 901px) {
  .palms-impact-title { font-size: clamp(44px, 4.6vw, 70px); }
  .palms-impact-description { margin-top: 16px; font-size: 12px; line-height: 1.5; }
  .palms-impact-stage { margin-top: 18px; }
  .palms-impact-scroll-hint { bottom: 18px; }
  .palms-impact-preview { bottom: 18px; }
}
@media (max-width: 900px) {
  .palms-impact-content { padding: clamp(22px, 4vh, 36px) clamp(22px, 5vw, 48px) 16px; }
  .palms-impact-title { max-width: 11ch; font-size: clamp(36px, 7vw, 58px); }
  .palms-impact-description { max-width: 58ch; margin-top: 12px; font-size: 12px; line-height: 1.45; }
  .palms-impact-stage { margin-top: 12px; }
  .palms-impact-progress { margin-top: 8px; }
  .palms-impact-scroll-hint { display: none; }
  .palms-impact-preview { right: 6vw; left: 6vw; bottom: max(82px, calc(env(safe-area-inset-bottom) + 76px)); width: auto; padding: 10px 11px; }
  .palms-impact-preview-item { height: 44px; padding: 5px 6px; }
  .palms-impact-preview-item small { font-size: 9px; }
  .palms-impact-coordinate.two { bottom: 19%; }
}
@media (max-width: 560px) {
  .palms-impact-content { padding: 18px 20px 8px; }
  .palms-impact-eyebrow { margin-bottom: 8px; font-size: 9px; }
  .palms-impact-title { max-width: 13ch; font-size: 34px; line-height: .96; }
  .palms-impact-description { margin-top: 8px; font-size: 11px; line-height: 1.38; }
  .palms-impact-stage { margin-top: 8px; gap: 12px; }
  .palms-impact-progress { margin-top: 6px; }
  .palms-impact-preview { right: 16px; left: 16px; }
  .palms-impact-preview-options { gap: 2px; }
  .palms-impact-preview-item { align-items: center; padding-inline: 2px; }
  .palms-impact-preview-item small { font-size: 8px; letter-spacing: -.02em; }
  .palms-impact-coordinate.two { display: none; }
}

/* Keep the direct building-view controls fully visible inside the hero. */
.palms-impact-preview {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  right: clamp(24px, 4vw, 64px);
  bottom: max(96px, calc(env(safe-area-inset-bottom) + 88px));
  width: min(40vw, 560px);
  padding: 12px 14px;
  border: 1px solid rgba(155, 129, 80, .32);
  border-radius: 12px;
  background: rgba(250, 249, 245, .97);
  box-shadow: 0 14px 36px rgba(32, 42, 34, .14);
}
.palms-impact-preview-label { width: 100%; margin-bottom: 9px; }
.palms-impact-preview-item { min-height: 48px; }
@media (max-width: 900px) {
  .palms-impact-preview {
    right: 5vw;
    left: auto;
    bottom: max(96px, calc(env(safe-area-inset-bottom) + 88px));
    width: min(58vw, 540px);
  }
}
@media (max-width: 560px) {
  .palms-impact-preview {
    right: 16px;
    left: 16px;
    bottom: max(86px, calc(env(safe-area-inset-bottom) + 78px));
    width: auto;
    padding: 9px 10px;
  }
  .palms-impact-preview-label { margin-bottom: 5px; }
  .palms-impact-preview-item { min-height: 42px; }
}

/* Overview: align the editorial copy and make the image/facts one composed card. */
.dossier__masthead { grid-template-columns: 64px minmax(0, 1fr) auto; }
.dossier__number { background: #173f2b; }
.dossier__headline {
  grid-template-columns: minmax(0, 1fr) minmax(300px, .82fr);
  gap: clamp(36px, 7vw, 104px);
  align-items: center;
  padding: clamp(52px, 6.5vw, 88px) clamp(24px, 6vw, 80px);
}
.dossier__headline > * { min-width: 0; }
.dossier__headline h2 { max-width: 9ch; font-size: clamp(46px, 5.2vw, 78px); line-height: .98; letter-spacing: -.065em; text-wrap: balance; }
.dossier__headline p { max-width: 49ch; font-size: clamp(13px, 1vw, 15px); line-height: 1.75; }
.dossier__canvas {
  grid-template-columns: minmax(0, 1.3fr) minmax(300px, .7fr);
  gap: 0;
  overflow: hidden;
  border: 1px solid rgba(200, 161, 92, .55);
  border-radius: 5px;
  background: #173f2b;
  box-shadow: 0 24px 58px rgba(23, 63, 43, .12);
}
.dossier__hero-image { min-height: min(52svh, 520px); clip-path: none; }
.dossier__hero-image img { transition: none; }
.dossier__hero-image:hover img { transform: none; }
.dossier__facts { justify-content: center; gap: clamp(12px, 2vh, 24px); padding: clamp(24px, 4vw, 54px); background: #173f2b; }
.dossier__fact { padding: 14px 0; border-color: rgba(255,255,255,.2); }
.dossier__fact span { color: #d6c69f; }
.dossier__fact strong { color: #fff; line-height: 1.25; }
.dossier__fact small { color: rgba(255,255,255,.72); }
.dossier__call { border-color: #c8a15c; }
.dossier__call span, .dossier__call b { color: #e2d1a6; }
.dossier__masthead { min-height: 58px; grid-template-columns: 68px minmax(0, 1fr) auto; }
.dossier__number { background: #111; }
.specs-section > .wrap { width: min(100%, 1500px); max-width: 1500px; padding-inline: clamp(20px, 5vw, 96px); }
.dossier__headline {
  grid-template-columns: minmax(0, 1.15fr) minmax(280px, 1fr);
  gap: clamp(32px, 4vw, 64px);
  align-items: end;
  padding: clamp(44px, 5.2vw, 72px) clamp(0px, 2.5vw, 42px) clamp(40px, 4.5vw, 60px);
}
.dossier__headline h2 {
  max-width: none;
  color: #1a4030;
  font-size: clamp(48px, 7.4vw, 102px);
  line-height: .94;
  letter-spacing: -.045em;
}
.dossier__headline h2 em { color: #b8894a; }
.dossier__headline p {
  max-width: 50ch;
  color: #52665b;
  font-size: clamp(14px, 1.12vw, 17px);
  line-height: 1.78;
}
.dossier__canvas {
  position: relative;
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  align-items: stretch;
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  isolation: isolate;
}
.dossier__hero-image {
  grid-column: 1 / 10;
  grid-row: 1;
  min-height: clamp(430px, 45vw, 610px);
  overflow: hidden;
  background: #d7d9d5;
  box-shadow: 0 20px 48px rgba(25, 46, 35, .12);
}
.dossier__hero-image img {
  object-position: center 58%;
  transition: transform .8s cubic-bezier(.2,.7,.2,1);
}
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  .dossier__hero-image:hover img { transform: scale(1.025); }
}
.dossier__hero-image::after { height: 36%; background: linear-gradient(transparent, rgba(10,25,18,.58)); }
.dossier__hero-image figcaption {
  left: clamp(20px, 3vw, 42px);
  bottom: clamp(20px, 2.5vw, 32px);
  flex-wrap: wrap;
  gap: 10px;
  font-size: 10px;
  line-height: 1.5;
}
.dossier__hero-image figcaption span { display: inline-flex; align-items: center; gap: 8px; }
.dossier__status-dot { width: 7px; height: 7px; border-radius: 50%; background: #c9a25a; box-shadow: 0 0 0 4px rgba(201,162,90,.26); }
.dossier__hero-image figcaption .dossier__caption-rule { width: 26px; height: 1px; background: rgba(255,255,255,.72); }
.dossier__facts {
  position: relative;
  z-index: 2;
  grid-column: 8 / 13;
  grid-row: 1;
  align-self: stretch;
  justify-content: space-between;
  gap: 22px;
  margin: clamp(26px, 3vw, 42px) 0 clamp(-28px, -2vw, -20px);
  padding: 0;
  background: #c9a25a;
  clip-path: none;
}
.dossier__facts-body {
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 22px;
  margin-left: clamp(17px, 1.5vw, 24px);
  padding: clamp(28px, 3vw, 46px) clamp(24px, 3.2vw, 48px) clamp(28px, 3vw, 40px) clamp(30px, 4.5vw, 64px);
  background: #183d2c;
  clip-path: polygon(clamp(44px, 5vw, 76px) 0, 100% 0, 100% 100%, 0 100%);
}
.dossier__fact-list { display: grid; gap: clamp(16px, 2vw, 26px); margin: 0; }
.dossier__fact { padding: 0 0 clamp(14px, 1.5vw, 20px); border-color: rgba(255,255,255,.2); }
.dossier__fact dt { margin-bottom: 7px; color: #d6bd82; font-size: 10px; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; }
.dossier__fact dd { margin: 0; color: #fff; font-family: var(--ff-display); font-size: clamp(22px, 2.2vw, 31px); line-height: 1.2; font-weight: 400; font-variant-numeric: lining-nums; }
.dossier__fact dd small { margin-left: 5px; color: rgba(255,255,255,.7); font-family: var(--ff-body); font-size: 12px; letter-spacing: .04em; }
.dossier__call {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 12px;
  margin-top: auto;
  padding: 10px 0 14px;
  border-bottom: 2px solid #c9a25a;
  text-decoration: none;
  transition: border-color .2s ease;
}
.dossier__call > span { color: #fff; }
.dossier__call > span > span { display: block; margin-bottom: 5px; color: rgba(255,255,255,.72); font-size: 10px; letter-spacing: .17em; text-transform: uppercase; }
.dossier__call strong { display: block; color: #fff; font-size: clamp(15px, 1.25vw, 18px); font-weight: 500; }
.dossier__call b { position: static; flex: none; color: #d6bd82; font-size: 24px; transition: transform .22s ease; }
.dossier__call:hover b { transform: translate(3px, -3px); }
.dossier__call:focus-visible { outline: 2px solid #d6bd82; outline-offset: 5px; }
@media (max-width: 900px) {
  .dossier__masthead { grid-template-columns: 56px minmax(0, 1fr); }
  .specs-section > .wrap { width: 100%; padding-inline: clamp(20px, 5vw, 48px); }
  .dossier__place { display: none; }
  .dossier__headline { grid-template-columns: 1fr; gap: 22px; padding: 44px clamp(18px, 5vw, 48px); }
  .dossier__headline h2 { max-width: 11ch; font-size: clamp(44px, 8vw, 72px); }
  .dossier__headline p { max-width: 62ch; }
  .dossier__hero-image { grid-column: 1 / -1; min-height: clamp(320px, 56vw, 500px); }
  .dossier__facts {
    grid-column: 1 / -1;
    grid-row: 2;
    margin: 0;
    padding: 0;
  }
  .dossier__facts-body { height: auto; margin: 4px 0 0; padding: clamp(26px, 5vw, 42px); clip-path: none; }
  .dossier__fact-list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px 28px; }
  .dossier__fact:last-child { grid-column: 1 / -1; }
}
@media (max-width: 800px) {
  .dossier__masthead { grid-template-columns: 52px minmax(0,1fr); }
  .dossier__masthead .eyebrow { margin-left: 14px; }
  .dossier__headline { grid-template-columns: 1fr; gap: 22px; align-items: start; padding: 46px clamp(20px, 6vw, 48px); }
  .dossier__headline h2 { max-width: 11ch; font-size: clamp(42px, 9vw, 68px); }
  .dossier__canvas { grid-template-columns: 1fr; }
  .dossier__hero-image { min-height: clamp(260px, 58vw, 420px); }
  .dossier__facts { gap: 0; padding: 0; }
  .dossier__facts-body { gap: 18px; }
}
@media (max-width: 560px) {
  .dossier__masthead { min-height: 52px; grid-template-columns: 48px minmax(0, 1fr); }
  .dossier__masthead .eyebrow { margin-left: 12px; font-size: 9px; letter-spacing: .13em; }
  .dossier__headline { padding: 36px 4px 32px; }
  .dossier__headline h2 { font-size: clamp(40px, 11vw, 54px); }
  .dossier__headline p { font-size: 14px; line-height: 1.7; }
  .dossier__hero-image { min-height: 300px; }
  .dossier__hero-image figcaption { left: 18px; right: 18px; bottom: 18px; font-size: 8px; letter-spacing: .1em; }
  .dossier__hero-image figcaption .dossier__caption-rule { width: 18px; }
  .dossier__facts { min-height: 0; padding: 0; }
  .dossier__facts-body { padding: 24px 20px; }
  .dossier__fact-list { grid-template-columns: 1fr; gap: 14px; }
  .dossier__fact:last-child { grid-column: auto; }
}

/* Scroll-linked movement is composited and disabled for reduced-motion users. */
@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    .specs-section { view-timeline-name: --project-section; view-timeline-axis: block; }
    .specs-section .dossier {
      animation: project-section-exit linear both;
      animation-timeline: --project-section;
      animation-duration: auto;
      animation-range: exit 0% exit 70%;
    }
    @keyframes project-section-exit {
      to { opacity: 0; transform: translateY(-24px); }
    }
    .specs-section + .marquee-section {
      view-timeline-name: --project-ticker;
      view-timeline-axis: block;
      animation: project-section-enter linear both;
      animation-timeline: --project-ticker;
      animation-duration: auto;
      animation-range: entry 0% entry 70%;
    }
    @keyframes project-section-enter {
      from { opacity: .72; transform: translateY(12px); }
      to { opacity: 1; transform: translateY(0); }
    }
  }
}

/* Calm, short interaction transitions; avoid animating layout-affecting properties. */
@media (prefers-reduced-motion: no-preference) {
  .dossier__call, .palms-impact-preview-item, .nav-links a { transition-duration: .2s; }
}
@media (prefers-reduced-motion: reduce) {
  .specs-section .dossier { animation: none !important; }
  .specs-section + .marquee-section { animation: none !important; }
  .dossier__hero-image img, .dossier__call b { transition: none !important; }
}

/* The project section intentionally mirrors project-section.html. */
.project {
  --bg: #f7f5f0;
  --green: #1a4030;
  --green-deep: #183d2c;
  --gold: #b8894a;
  --gold-soft: #c9a25a;
  --body: #52665b;
  --project-line: rgba(26,64,48,.2);
  --ghost: #efe8da;
  --ink: #111;
  --serif: var(--ff-display), Georgia, serif;
  --sans: var(--ff-body), system-ui, -apple-system, "Segoe UI", sans-serif;
  --ease: cubic-bezier(.2,.7,.2,1);
  --cut: 6rem;
  position: relative;
  overflow: hidden;
  padding: clamp(3rem, 6vw, 6rem) clamp(1.25rem, 5vw, 6rem);
  background: var(--bg);
  color: var(--ink);
  font-family: var(--sans);
}
.project__in { position: relative; max-width: 1320px; margin: 0 auto; }
.project .ghost {
  position: absolute;
  top: -3.5rem;
  right: -1rem;
  color: var(--ghost);
  font: 500 clamp(9rem, 20vw, 19rem)/1 var(--serif);
  pointer-events: none;
  user-select: none;
}
.project .bar { position: relative; display: flex; align-items: stretch; border-block: 1px solid var(--project-line); }
.project .bar__no { display: grid; place-items: center; padding: 0 2rem; background: var(--ink); color: #fff; font: 500 1.7rem var(--serif); }
.project .bar__label,
.project .bar__loc { display: flex; align-items: center; font-size: .78rem; font-weight: 500; letter-spacing: .24em; text-transform: uppercase; }
.project .bar__label { gap: 1.2rem; padding: 1.6rem 1.5rem; color: var(--green); }
.project .bar__label::before { width: 2.2rem; height: 1px; background: var(--green); content: ""; }
.project .bar__loc { margin-left: auto; color: var(--body); letter-spacing: .16em; }
.project .intro {
  position: relative;
  display: grid;
  align-items: end;
  gap: 2rem 4rem;
  margin: clamp(2.5rem, 6vw, 5.5rem) 0 clamp(2.5rem, 5vw, 4rem);
  text-align: left;
}
.project h2 { color: var(--green); font: 500 clamp(3.2rem, 7.4vw, 6.4rem)/.94 var(--serif); letter-spacing: -.03em; }
.project h2 em { display: block; color: var(--gold); font-style: italic; font-weight: 500; }
.project .intro p { max-width: 50ch; margin: 0; color: var(--body); font-size: 1.0625rem; line-height: 1.85; }
.project .intro p::first-line { color: var(--green); font-weight: 500; }
.project .stage { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); align-items: stretch; }
.project .photo {
  position: relative;
  grid-column: 1 / 10;
  grid-row: 1;
  min-height: clamp(26rem, 52vw, 41rem);
  overflow: hidden;
  margin: 0;
  background: #cdd6e4;
}
.project .photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 70%; transition: transform 1.6s var(--ease); }
.project .stage:hover .photo img { transform: scale(1.04); }
.project .photo::after { position: absolute; inset: auto 0 0; height: 30%; background: linear-gradient(transparent, rgba(10,25,18,.6)); content: ""; }
.project .status {
  position: absolute;
  z-index: 1;
  bottom: clamp(1.25rem, 2.4vw, 2.2rem);
  left: clamp(1.25rem, 3vw, 3rem);
  display: flex;
  align-items: center;
  gap: 1.1rem;
  color: #fff;
  font-size: .74rem;
  font-weight: 500;
  letter-spacing: .2em;
  text-transform: uppercase;
}
.project .status i { width: 2.2rem; height: 1px; background: rgba(255,255,255,.7); }
.project .status b { display: inline-block; width: 7px; height: 7px; margin-right: .7rem; border-radius: 50%; background: var(--gold-soft); box-shadow: 0 0 0 4px rgba(201,162,90,.3); }
.project .panel { position: relative; z-index: 1; grid-column: 8 / 13; grid-row: 1; margin: clamp(2rem, 4vw, 3.5rem) 0 clamp(-3.5rem, -4vw, -2rem); }
.project .panel::before { position: absolute; inset: 0; background: var(--gold-soft); clip-path: polygon(var(--cut) 0, 100% 0, 100% 100%, 0 100%); content: ""; }
.project .panel__body {
  position: relative;
  display: flex;
  height: 100%;
  flex-direction: column;
  justify-content: space-between;
  gap: 1.6rem;
  padding: clamp(2rem, 3.4vw, 3.2rem) clamp(1.75rem, 3.4vw, 3.2rem) clamp(2rem, 3vw, 2.6rem) calc(var(--cut) + clamp(.5rem, 1.6vw, 1.8rem));
  clip-path: polygon(calc(var(--cut) + 1.1rem) 0, 100% 0, 100% 100%, 1.1rem 100%);
  background: var(--green-deep);
  color: #fff;
}
.project .stats-list { display: contents; }
.project .stat { padding-bottom: 1.4rem; border-bottom: 1px solid rgba(255,255,255,.18); }
.project .stat dt { color: var(--gold-soft); font-size: .72rem; font-weight: 500; letter-spacing: .22em; text-transform: uppercase; }
.project .stat dd { margin-top: .55rem; font: 500 clamp(1.6rem, 2.5vw, 2.2rem)/1.15 var(--serif); font-variant-numeric: lining-nums; }
.project .stat dd small { margin-left: .4rem; color: rgba(255,255,255,.65); font: 400 .8rem var(--sans); letter-spacing: .06em; }
.project .call {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1rem;
  padding: .2rem 0 1rem;
  background: linear-gradient(var(--gold-soft),var(--gold-soft)) 0 100% / 100% 2px no-repeat;
  color: inherit;
  text-decoration: none;
}
.project .call span { display: block; color: rgba(255,255,255,.65); font-size: .72rem; letter-spacing: .22em; text-transform: uppercase; }
.project .call strong { display: block; margin-top: .35rem; font: 500 1.35rem var(--sans); letter-spacing: .01em; }
.project .call svg { flex: none; color: var(--gold-soft); transition: transform .4s var(--ease); }
.project .call:hover svg { transform: translate(4px, -4px); }
.project .call:focus-visible { outline: 2px solid var(--gold-soft); outline-offset: 6px; }
@media (min-width: 900px) { .project .intro { grid-template-columns: 1.15fr 1fr; padding-left: clamp(0rem, 4vw, 3rem); } }
@media (max-width: 899px) {
  .project .photo { grid-column: 1 / -1; min-height: 22rem; }
  .project .panel { grid-column: 1 / -1; grid-row: 2; margin: 0; }
  .project .panel::before { inset: 0 0 auto; height: 4px; background: var(--gold-soft); clip-path: none; }
  .project .panel__body { margin-top: 4px; padding: 2rem 1.5rem; clip-path: none; }
}
@media (max-width: 700px) {
  .project .bar { flex-wrap: wrap; }
  .project .bar__loc { width: 100%; margin: 0; padding: 0 0 1rem 1rem; }
  .project .bar__label { padding: 1.2rem 1rem; letter-spacing: .16em; }
  .project .bar__no { padding: 0 1.4rem; }
  .project .status { flex-wrap: wrap; max-width: calc(100% - 2.5rem); gap: .75rem; font-size: .62rem; }
}
@media (prefers-reduced-motion: reduce) { .project * { transition: none !important; } }

/* About section: directly adapt the composition and sizing from template.html. */
.about-template {
  --bg: #f7f5f0;
  --green: #1a4030;
  --green-deep: #123024;
  --gold: #b8894a;
  --gold-soft: #c9a25a;
  --body: #52665b;
  --line: rgba(26,64,48,.14);
  --white: #fff;
  --serif: var(--ff-display), "Playfair Display", Georgia, serif;
  --sans: var(--ff-body), Inter, system-ui, -apple-system, "Segoe UI", sans-serif;
  --ease: cubic-bezier(.2,.7,.2,1);
  padding: clamp(4rem, 8vw, 7rem) clamp(1.25rem, 5vw, 6rem) clamp(5rem, 10vw, 9rem);
  background: var(--bg);
  color: var(--green);
  font-family: var(--sans);
}
.about-template .project__in { max-width: 1240px; margin: 0 auto; }
.about-template .project__intro { text-align: center; }
.about-template .project__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 1rem;
  color: var(--gold);
  font-size: .74rem;
  font-weight: 600;
  letter-spacing: .26em;
  text-transform: uppercase;
}
.about-template .project__eyebrow::before,
.about-template .project__eyebrow::after { width: 2.2rem; height: 1px; background: currentColor; content: ""; }
.about-template h2 {
  max-width: 14ch;
  margin: 1.6rem auto 1.5rem;
  color: var(--green);
  font: 500 clamp(2.5rem, 5.6vw, 4.75rem)/1.04 var(--serif);
  letter-spacing: -.02em;
}
.about-template h2 em { color: var(--gold); font-style: italic; }
.about-template .project__lead { max-width: 54ch; margin: 0 auto; color: var(--body); font-size: 1.0625rem; line-height: 1.85; }
.about-template .project__media { position: relative; margin-top: clamp(2.5rem, 5vw, 4rem); }
.about-template .project__img { height: clamp(18rem, 40vw, 32.5rem); overflow: hidden; background: #d9d6cf; }
.about-template .project__img img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 50% 45%; transition: transform 1.8s var(--ease); }
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  .about-template .project__media:hover .project__img img { transform: scale(1.04); }
}
.about-template .project__stats {
  position: absolute;
  bottom: 0;
  left: 50%;
  display: grid;
  width: min(880px, calc(100% - 4rem));
  grid-template-columns: repeat(3, minmax(0, 1fr));
  transform: translate(-50%, 50%);
  background: var(--white);
  box-shadow: 0 30px 60px -30px rgba(18,48,36,.35);
}
.about-template .project__stat {
  display: flex;
  flex-direction: column-reverse;
  align-items: center;
  padding: clamp(1.5rem, 2.6vw, 2.2rem) 1rem;
  border-right: 1px solid var(--line);
  text-align: center;
}
.about-template .project__stat:last-child { border-right: 0; }
.about-template .project__stat dd { color: var(--gold); font: 500 clamp(2.2rem, 4vw, 3.4rem)/1 var(--serif); font-variant-numeric: lining-nums; }
.about-template .project__stat dt { margin-top: .8rem; color: var(--body); font-size: .7rem; font-weight: 600; letter-spacing: .22em; text-transform: uppercase; }
.about-template .project__stats.reveal { transform: translate(-50%, calc(50% + 24px)); }
.about-template .project__stats.reveal.is-visible { opacity: 1; transform: translate(-50%, 50%); }
@media (max-width: 700px) {
  .about-template { padding-bottom: 4rem; }
  .about-template .project__stats,
  .about-template .project__stats.reveal,
  .about-template .project__stats.reveal.is-visible {
    position: relative;
    bottom: auto;
    left: auto;
    width: calc(100% - 2rem);
    margin: -3rem auto 0;
    grid-template-columns: 1fr;
    transform: none;
  }
  .about-template .project__stats.reveal { transform: translateY(24px); }
  .about-template .project__stats.reveal.is-visible { transform: none; }
  .about-template .project__stat { border-right: 0; border-bottom: 1px solid var(--line); }
  .about-template .project__stat:last-child { border-bottom: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .about-template .project__img img { transition: none !important; }
}

/* Project panel matched to the user's dark-green reference image. */
.project {
  padding: clamp(2rem, 4.5vh, 3.5rem) 24px;
  overflow: visible;
  background: #f7f5f0;
}
.project .project__in { width: min(100%, 990px); max-width: 990px; }
.project-feature {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-height: clamp(500px, 70vh, 565px);
  padding: clamp(28px, 4vw, 48px);
  background: #123024;
  color: #fff;
}
.project-feature__visual {
  position: absolute;
  z-index: -1;
  inset: 0;
  display: flex;
  width: 100%;
  height: 100%;
  align-items: flex-end;
  justify-content: flex-end;
  margin: 0;
  opacity: 1;
  pointer-events: none;
}
.project-feature__visual::before {
  position: absolute;
  z-index: 1;
  inset: 0;
  background: linear-gradient(90deg, rgba(18,48,36,.96) 0%, rgba(18,48,36,.9) 28%, rgba(18,48,36,.52) 48%, rgba(18,48,36,.08) 72%, transparent 100%), linear-gradient(0deg, rgba(18,48,36,.38), transparent 34%);
  content: "";
}
.project-feature__visual img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 50%;
}
.project-feature__meta { display: flex; justify-content: space-between; align-items: center; gap: 20px; }
.project-feature__breadcrumb { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; color: #c9a25a; font-size: 9px; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; }
.project-feature__breadcrumb i { width: 18px; height: 1px; background: #b8894a; }
.project-feature__breadcrumb b { color: #b8894a; font-weight: 500; }
.project-feature__status { display: inline-flex; flex: none; align-items: center; gap: 8px; padding: 8px 12px; border: 1px solid rgba(255,255,255,.48); color: #fff; font-size: 9px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; }
.project-feature__status i { width: 7px; height: 7px; border-radius: 50%; background: #fff; box-shadow: 0 0 0 4px rgba(255,255,255,.12); }
.project-feature__copy { max-width: 510px; margin-top: clamp(28px, 3.4vw, 42px); }
.project .project-feature__copy h2 {
  max-width: 8ch;
  margin: 0;
  color: #fff;
  font: 500 clamp(3.4rem, 6.35vw, 4.75rem)/.94 var(--ff-display);
  letter-spacing: -.035em;
}
.project .project-feature__copy h2 em { display: block; color: #c9a25a; font-style: italic; font-weight: 500; }
.project-feature__copy p { max-width: 52ch; margin-top: 24px; color: rgba(255,255,255,.9); font-size: 13px; line-height: 1.75; }
.project-feature__facts {
  display: grid;
  width: min(100%, 990px);
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: 0;
  background: #fff;
  border: 1px solid rgba(18,48,36,.12);
}
.project-feature__fact { display: flex; min-width: 0; flex-direction: column; justify-content: center; padding: 20px 24px; border-right: 1px solid rgba(26,64,48,.14); }
.project-feature__fact:last-child { border-right: 0; }
.project-feature__fact dt { margin-top: 8px; color: #52665b; font-size: 8px; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; }
.project-feature__fact dd { margin: 0; color: #123024; font: 500 clamp(1.2rem, 2.1vw, 1.65rem)/1.15 var(--ff-display); font-variant-numeric: lining-nums; white-space: nowrap; }
.project-feature__fact dd small { margin-left: 4px; color: #52665b; font: 400 10px var(--ff-body); }
.project-feature__contact { background: #b8894a; }
.project-feature__contact dt { color: rgba(18,48,36,.78); }
.project-feature__contact dd,
.project-feature__contact a { color: #123024; font: 600 clamp(.85rem, 1.35vw, 1.05rem)/1.2 var(--ff-body); text-decoration: none; }
.project-feature__contact a:focus-visible { outline: 2px solid #123024; outline-offset: 3px; }
@media (max-width: 760px) {
  .project { padding: 28px 18px; }
  .project-feature { min-height: 0; padding: 30px 26px 48px; }
  .project-feature__visual { inset: 0; width: 100%; height: 100%; opacity: 1; }
  .project-feature__visual::before { background: linear-gradient(90deg, rgba(18,48,36,.94), rgba(18,48,36,.72) 48%, rgba(18,48,36,.26)), linear-gradient(0deg, rgba(18,48,36,.55), transparent 58%); }
  .project-feature__visual img { height: 100%; object-fit: cover; object-position: 50% 50%; }
  .project-feature__meta { align-items: flex-start; flex-direction: column; gap: 16px; }
  .project-feature__breadcrumb { gap: 8px; font-size: 8px; }
  .project-feature__status { align-self: flex-start; margin-top: 0; }
  .project-feature__copy { margin-top: 30px; }
  .project .project-feature__copy h2 { font-size: clamp(3.2rem, 11vw, 4.25rem); }
  .project-feature__copy p { max-width: 42ch; }
  .project-feature__facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .project-feature__fact { min-height: 90px; padding: 16px; border-bottom: 1px solid rgba(26,64,48,.14); }
  .project-feature__fact:nth-child(2) { border-right: 0; }
  .project-feature__fact:nth-child(3), .project-feature__fact:nth-child(4) { border-bottom: 0; }
}
@media (max-width: 420px) {
  .project-feature { padding-inline: 20px; }
  .project-feature__status { padding: 7px 9px; font-size: 8px; }
  .project-feature__breadcrumb { letter-spacing: .13em; }
  .project-feature__facts { grid-template-columns: 1fr; }
  .project-feature__fact { min-height: 76px; border-right: 0; border-bottom: 1px solid rgba(26,64,48,.14) !important; }
  .project-feature__fact:last-child { border-bottom: 0 !important; }
}

/* Keep the six-reason layout comfortably inset at every width. */
.pillars > .wrap.section-pad {
  width: min(100%, 1540px);
  max-width: 1540px;
  padding-right: clamp(24px, 6vw, 96px);
  padding-left: clamp(24px, 6vw, 96px);
}
.pillars-grid { grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr); gap: clamp(36px, 5vw, 76px); }
.pillars-grid > * { min-width: 0; }
.pillars-sticky h2 { max-width: 15ch; font-size: clamp(32px, 3.6vw, 48px); line-height: 1.08; }
.pillar-visual { aspect-ratio: 1.24 / 1; max-height: min(64svh, 680px); }
.pillar-bg { object-fit: contain; }
@media (max-width: 900px) {
  .pillars > .wrap.section-pad { width: 100%; padding-right: clamp(22px, 5vw, 48px); padding-left: clamp(22px, 5vw, 48px); }
  .pillars-grid { grid-template-columns: 1fr; gap: 24px; }
  .pillars-sticky { position: relative; top: auto; padding: 0 0 20px; background: transparent; border-bottom: 1px solid var(--line-gold); }
  .pillars-sticky h2 { max-width: 18ch; }
  .pillar-visual { aspect-ratio: 16 / 9; max-height: min(48svh, 360px); }
  .pillar-row { min-height: 0; padding: 28px 0; }
}

/* Enquiry form: scoped note styling, clean spacing, and no edge collisions. */
.contact {
  min-height: 100svh;
  grid-template-columns: minmax(0, .84fr) minmax(0, 1.16fr);
  gap: clamp(38px, 5vw, 78px);
  align-items: center;
  padding: clamp(64px, 8vw, 112px) clamp(24px, 6vw, 96px);
  overflow: hidden;
}
.contact .left { min-width: 0; padding: 0 clamp(0px, 2vw, 28px) 0 0; }
.contact .left::after { right: calc(clamp(0px, 2vw, 28px) * -1); top: 2%; height: 96%; background: rgba(23,61,42,.14); }
.contact .number {
  position: static;
  align-self: flex-start;
  margin-bottom: clamp(24px, 5vh, 52px);
  color: #7c8981;
  font-size: 10px;
  letter-spacing: .2em;
  writing-mode: horizontal-tb;
}
.contact .kicker { flex-wrap: wrap; font-size: 10px; line-height: 1.5; }
.contact .left h2 { max-width: 8ch; margin: 22px 0 20px; font-size: clamp(48px, 5.5vw, 78px); line-height: .98; letter-spacing: -.055em; text-wrap: balance; }
.contact .desc { max-width: 43ch; margin-bottom: clamp(26px, 4vh, 42px); font-size: 15px; line-height: 1.75; }
.unit-preview { width: 100%; max-width: 440px; min-height: 116px; padding-top: 17px; overflow: visible; }
.unit-preview .small { font-size: 9px; letter-spacing: .16em; }
.unit-info { align-items: center; gap: 18px; margin-top: 12px; }
.unit-big { min-width: 64px; color: #173f2b; font-family: var(--ff-display); font-size: 48px; line-height: 1; }
.unit-copy { min-width: 0; font-size: 13px; line-height: 1.55; }
.unit-copy strong { margin-bottom: 4px; font-size: 14px; }
.unit-line { bottom: 13px; }
.form-wrap {
  width: 100%;
  min-width: 0;
  align-self: center;
  padding: clamp(24px, 3vw, 42px);
  border: 1px solid rgba(23,63,43,.08);
  border-radius: 5px;
  box-shadow: 0 22px 60px rgba(26,40,41,.08);
}
.form-wrap::before { width: 3px; }
.form-head { gap: 16px; padding-bottom: 18px; margin-bottom: 20px; }
.form-head b { color: #173f2b; font-size: 17px; font-weight: 500; }
.form-head span { color: #78847c; font-size: 9px; letter-spacing: .16em; text-align: right; }
.contact-enquiry-form { display: grid; gap: 12px; }
.contact .row { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.contact .field { min-width: 0; border: 1px solid rgba(23,63,43,.08); border-radius: 3px; background: #f5f7f5; transition: background-color .18s ease, border-color .18s ease; }
.contact .field:focus-within { border-color: rgba(23,63,43,.35); background: #fff; box-shadow: none; outline: none; }
.contact-enquiry-form input, .contact-enquiry-form select, .contact-enquiry-form textarea { color: #243b2d; font: 400 14px/1.5 var(--ff-body); }
.contact-enquiry-form input, .contact-enquiry-form select { height: 60px; padding: 24px 16px 7px; }
.contact-enquiry-form textarea { min-height: 112px; max-height: 220px; height: 136px; padding: 26px 16px 12px; resize: vertical; }
.contact .field label { top: 19px; left: 16px; color: #78847c; font-size: 13px; transition: color .16s ease, top .16s ease, font-size .16s ease; }
.contact .field:focus-within label, .contact .field.has label { top: 7px; color: #9a7945; font-size: 9px; letter-spacing: .12em; }
.contact-enquiry-select { padding-right: 44px !important; }
.contact .select::after { top: 25px; }
.contact .select:focus-within::after { top: 27px; }
.bottom { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 18px; margin-top: 4px; }
.enquiry-note { max-width: 38ch; margin: 0; color: #64736a; font-size: 12px; line-height: 1.55; }
.contact .bottom button { min-height: 50px; height: auto; min-width: 168px; padding: 14px 22px; border-radius: 2px; background: #c8a15c; font: 600 10px/1.3 var(--ff-body); letter-spacing: .13em; }
.contact .bottom button::before { background: #173f2b; }
.contact .bottom button:hover { transform: translateY(-1px); box-shadow: 0 8px 18px rgba(49,91,85,.12); }
.success { margin-top: 12px; padding: 13px 15px; border-left: 2px solid #c8a15c; border-radius: 2px; font-size: 12px; line-height: 1.55; }
.corner { position: static; grid-column: 1 / -1; justify-self: end; margin-top: -24px; color: #78847c; font-size: 9px; letter-spacing: .14em; }
@media (max-width: 900px) {
  .contact { min-height: 0; grid-template-columns: 1fr; gap: 38px; padding: 72px clamp(24px, 6vw, 64px); }
  .contact .left { padding-right: 0; }
  .contact .left::after { display: none; }
  .contact .number { margin-bottom: 24px; }
  .contact .left h2 { max-width: 10ch; }
  .contact .desc { max-width: 56ch; }
  .unit-preview { margin-bottom: 0; }
  .form-wrap { max-width: 760px; justify-self: center; }
  .corner { margin-top: -18px; }
}
@media (max-width: 600px) {
  .contact { gap: 30px; padding: 58px 22px 42px; }
  .contact .left h2 { font-size: clamp(46px, 13vw, 62px); }
  .form-wrap { padding: 22px 18px; }
  .form-head { align-items: flex-start; }
  .form-head span { max-width: 12ch; line-height: 1.5; }
  .contact .row { grid-template-columns: 1fr; gap: 10px; }
  .bottom { grid-template-columns: 1fr; gap: 12px; }
  .enquiry-note { max-width: 48ch; font-size: 12px; }
  .contact .bottom button { width: 100%; }
  .corner { margin-top: 0; }
}

/* Full-screen project panels slide at different speeds during the pinned parallax handoff. */
.project-transition {
  position: relative;
  height: auto;
  background: #f7f5f0;
  isolation: isolate;
}
.project-transition__stage {
  position: relative;
  top: auto;
  width: 100%;
  height: auto;
  overflow: visible;
  background: #f7f5f0;
}
.project-transition__outgoing,
.project-transition__incoming {
  position: relative;
  inset: auto;
  overflow: visible;
  opacity: 1;
  pointer-events: auto;
  transform: none;
}
.project-transition__outgoing {
  z-index: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  background: #f7f5f0;
}
.project-transition__incoming {
  z-index: 2;
  background: #f7f5f0;
}
.project-transition.is-pinned { height: 200svh; }
.project-transition.is-pinned .project-transition__stage {
  position: sticky;
  top: 0;
  height: 100svh;
  overflow: hidden;
  background-color: #123024;
}
.project-transition.is-pinned .project-transition__outgoing,
.project-transition.is-pinned .project-transition__incoming {
  position: absolute;
  inset: 0;
  overflow: hidden;
}
.project-transition.is-pinned .project-transition__outgoing {
  height: 100%;
  isolation: isolate;
  will-change: transform;
}
.project-transition.is-pinned .project-transition__outgoing::before {
  position: absolute;
  z-index: -1;
  inset: 0;
  background-color: #123024;
  background-image:
    linear-gradient(90deg, rgba(18,48,36,.96) 0%, rgba(18,48,36,.9) 28%, rgba(18,48,36,.52) 48%, rgba(18,48,36,.08) 72%, transparent 100%),
    linear-gradient(0deg, rgba(18,48,36,.38), transparent 34%),
    url("img/overveiw/Scene-48.png");
  background-position: center, center, center 46%;
  background-size: cover;
  content: "";
  pointer-events: none;
}
.project-transition.is-pinned .project-transition__incoming {
  opacity: 1;
  pointer-events: none;
  transform: none;
  will-change: transform;
}
.project-transition.is-pinned .project-transition__outgoing { background: transparent; }
.project-transition.is-pinned .project-transition__outgoing #specs {
  display: flex;
  flex: 1 1 auto;
  align-items: center;
  min-height: 0;
  padding: clamp(8px, 1.5vh, 18px) clamp(24px, 5vw, 80px);
  background: transparent;
}
.project-transition.is-pinned .project-transition__outgoing #specs > .project__in {
  width: min(100%, 1800px);
  max-width: 1800px;
}
.project-transition.is-pinned .project-transition__outgoing .project-feature__facts { width: 100%; }
.project-transition.is-pinned .project-transition__outgoing .project-feature {
  min-height: min(760px, 70svh);
  padding: clamp(24px, 4.5vh, 64px) 0 clamp(24px, 4.5vh, 64px);
  background: transparent;
}
.project-transition.is-pinned .project-transition__outgoing .project-feature__visual { display: none; }
.project-transition.is-pinned .project-transition__outgoing .project-feature__copy { max-width: 510px; margin-top: clamp(38px, 5.6vh, 76px); }
.project-transition.is-pinned .project-transition__outgoing .project-feature__copy h2 { font-size: clamp(3rem, 8.7vh, 6.25rem); }
.project-transition.is-pinned .project-transition__outgoing .project-feature__copy p { max-width: 52ch; margin-top: clamp(12px, 1.8vh, 22px); font-size: clamp(13px, 1.5vh, 16px); line-height: 1.65; }
.project-transition.is-pinned .project-transition__outgoing .project-feature__fact { min-height: clamp(100px, 12.5svh, 132px); padding: 12px clamp(16px, 2.4vw, 32px); }
.project-transition.is-pinned .project-transition__incoming #about {
  display: flex;
  align-items: center;
  width: 100%;
  height: 100%;
  padding: clamp(18px, 2.5vh, 30px) clamp(20px, 4vw, 72px) clamp(26px, 4vh, 44px);
  overflow: hidden;
}
.project-transition.is-pinned .project-transition__incoming #about > .project__in { width: min(100%, 1760px); }
.project-transition.is-pinned .project-transition__incoming #about .project__intro { max-width: 960px; margin: 0 auto; }
.project-transition.is-pinned .project-transition__incoming #about h2 { margin: .5rem auto .65rem; font-size: clamp(2.2rem, 5vh, 3.8rem); }
.project-transition.is-pinned .project-transition__incoming #about .project__lead { font-size: clamp(.85rem, 1.65vh, 1rem); }
.project-transition.is-pinned .project-transition__incoming #about .project__media { max-width: 1640px; margin: clamp(14px, 2vh, 24px) auto 0; }
.project-transition.is-pinned .project-transition__incoming #about .project__img { height: clamp(360px, 72svh, 740px); }
.project-transition.is-pinned .project-transition__incoming #about .project__img img { object-position: 50% 50%; }
.project-transition.is-pinned .project-transition__incoming #about .project__stats { width: min(1040px, calc(100% - 4rem)); }
.project-transition.is-pinned .project-transition__incoming #about .project__stat { padding-block: clamp(12px, 1.8vh, 22px); }
.project-transition.is-pinned .project-transition__incoming #about .project__intro.reveal {
  opacity: 1;
  transform: none;
  transition: none;
}
.project-transition.is-pinned .project-transition__incoming #about .project__stats.reveal,
.project-transition.is-pinned .project-transition__incoming #about .project__stats.reveal.is-visible {
  opacity: 1;
  transform: translate(-50%, 50%);
  transition: none;
}

.project-transition + .marquee-section {
  margin-top: clamp(24px, 3.5vh, 42px);
}

@media (min-width: 801px) and (max-height: 700px) {
  .project-transition.is-pinned .project-transition__outgoing #specs { padding-block: 6px; }
  .project-transition.is-pinned .project-transition__outgoing .project-feature { min-height: min(620px, 64svh); }
  .project-transition.is-pinned .project-transition__outgoing .project-feature__copy { margin-top: 14px; }
  .project-transition.is-pinned .project-transition__outgoing .project-feature__copy h2 { font-size: clamp(2.25rem, 6.4vh, 3.8rem); }
  .project-transition.is-pinned .project-transition__outgoing .project-feature__copy p { margin-top: 10px; font-size: 11px; }
  .project-transition.is-pinned .project-transition__outgoing .project-feature__fact { min-height: 68px; }
  .project-transition.is-pinned .project-transition__incoming #about { padding-block: 12px 20px; }
  .project-transition.is-pinned .project-transition__incoming #about h2 { margin-block: .3rem .4rem; font-size: clamp(1.9rem, 4.5vh, 2.8rem); }
  .project-transition.is-pinned .project-transition__incoming #about .project__lead { font-size: .82rem; line-height: 1.5; }
  .project-transition.is-pinned .project-transition__incoming #about .project__media { margin-top: 10px; }
  .project-transition.is-pinned .project-transition__incoming #about .project__img { height: clamp(280px, 60svh, 540px); }
}

@media (max-width: 800px) {
  .project-transition { height: auto; }
  .project-transition__stage { position: relative; top: auto; height: auto; overflow: visible; }
  .project-transition__outgoing,
  .project-transition__incoming { position: relative; inset: auto; overflow: visible; opacity: 1; transform: none; pointer-events: auto; }
  .project-transition__outgoing #specs { display: block; padding: clamp(2rem, 4.5vh, 3.5rem) 24px; }
  .project-transition__outgoing #specs > .project__in { width: min(100%, 990px); max-width: 990px; }
  .project-transition__outgoing .project-feature { min-height: clamp(500px, 70vh, 565px); padding: clamp(28px, 4vw, 48px); }
  .project-transition__outgoing .project-feature__copy { margin-top: clamp(28px, 3.4vw, 42px); }
  .project-transition__outgoing .project-feature__copy p { margin-top: 24px; font-size: 13px; }
  .project-transition__outgoing .project-feature__fact { min-height: 0; padding: 16px; }
  .project-transition__incoming #about { display: block; height: auto; padding: clamp(4rem, 8vw, 7rem) clamp(1.25rem, 5vw, 6rem) clamp(5rem, 10vw, 9rem); overflow: visible; }
  .project-transition__incoming #about h2 { margin: 1.6rem auto 1.5rem; font-size: clamp(2.5rem, 5.6vw, 4.75rem); }
  .project-transition__incoming #about .project__lead { font-size: 1.0625rem; }
  .project-transition__incoming #about .project__media { max-width: none; margin: clamp(2.5rem, 5vw, 4rem) auto 0; }
  .project-transition__incoming #about .project__img { height: clamp(18rem, 40vw, 32.5rem); }
  .project-transition__incoming #about .project__stat { padding-block: clamp(1.5rem, 2.6vw, 2.2rem); }
}

/* Property gallery carousel adapted from template2.html. */
.gallery.overview {
  --gallery-bg: #f7f5f0;
  --gallery-green: #1a4030;
  --gallery-deep: #123024;
  --gallery-gold: #b8894a;
  --gallery-gold-soft: #c9a25a;
  --gallery-body: #52665b;
  --gallery-line: rgba(26,64,48,.16);
  padding: clamp(4rem, 8vw, 7rem) clamp(1.25rem, 5vw, 6rem);
  background: var(--gallery-bg);
  color: var(--gallery-green);
  font-family: var(--ff-body), Inter, system-ui, sans-serif;
}
.gallery__in { width: min(100%, 1240px); margin-inline: auto; }
.gallery__head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 2rem 4rem; margin-bottom: clamp(2rem, 4vw, 3.5rem); }
.gallery__eyebrow { display: flex; align-items: center; gap: 1rem; color: var(--gallery-gold); font-size: .74rem; font-weight: 600; letter-spacing: .26em; text-transform: uppercase; }
.gallery__eyebrow::before { width: 2.2rem; height: 1px; background: currentColor; content: ""; }
.gallery__head h2 { margin-top: 1.2rem; color: var(--gallery-green); font: 500 clamp(2.5rem, 5vw, 4rem)/1.04 var(--ff-display), Georgia, serif; letter-spacing: -.02em; }
.gallery__head h2 em { color: var(--gallery-gold); font-style: italic; }
.gallery__intro { max-width: 38ch; color: var(--gallery-body); font-size: 1rem; line-height: 1.85; }
.gallery__stage { position: relative; height: clamp(24rem, 48vw, 38.75rem); overflow: hidden; background: var(--gallery-deep); touch-action: pan-y; }
.gallery__slide { position: absolute; inset: 0; margin: 0; opacity: 0; visibility: hidden; transition: opacity .9s cubic-bezier(.2,.7,.2,1), visibility 0s .9s; }
.gallery__slide.is-active { opacity: 1; visibility: visible; transition: opacity .9s cubic-bezier(.2,.7,.2,1), visibility 0s; }
.gallery__slide img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.04); transition: transform 6s linear; }
.gallery__slide.is-active img { transform: scale(1); }
.gallery__stage::after { position: absolute; z-index: 1; inset: 0; background: linear-gradient(90deg, rgba(12,30,22,.78) 0%, rgba(12,30,22,.36) 34%, transparent 66%), linear-gradient(0deg, rgba(12,30,22,.84) 0%, rgba(12,30,22,.56) 22%, rgba(12,30,22,.18) 48%, transparent 68%); content: ""; pointer-events: none; }
.gallery__caption { position: absolute; z-index: 2; bottom: clamp(1.5rem, 4.5vw, 3.5rem); left: clamp(1.5rem, 4.5vw, 3.5rem); max-width: 28rem; color: #fff; }
.gallery__tag { color: var(--gallery-gold-soft); font-size: .7rem; font-weight: 600; letter-spacing: .24em; text-transform: uppercase; text-shadow: 0 1px 8px rgba(0,0,0,.55); }
.gallery__title { margin: .9rem 0; color: #fff; font: 500 clamp(1.9rem, 3.6vw, 2.9rem)/1.06 var(--ff-display), Georgia, serif; text-shadow: 0 2px 14px rgba(0,0,0,.38); }
.gallery__desc { color: rgba(255,255,255,.9); font-size: .95rem; line-height: 1.7; text-shadow: 0 1px 9px rgba(0,0,0,.5); }
.gallery__caption > * { transition: opacity .5s cubic-bezier(.2,.7,.2,1), transform .5s cubic-bezier(.2,.7,.2,1); }
.gallery__caption.is-out > * { opacity: 0; transform: translateY(10px); }
.gallery__controls { position: absolute; z-index: 2; right: clamp(1.25rem, 3vw, 2.5rem); bottom: clamp(1.5rem, 4.5vw, 3.5rem); display: flex; align-items: center; gap: 1.1rem; color: #fff; }
.gallery__count { position: absolute; z-index: 5; top: 1.2rem; left: 1.25rem; margin: 0; color: #fff; font: 500 2.6rem/1 var(--ff-display), Georgia, serif; font-variant-numeric: lining-nums; text-shadow: 0 1px 14px rgba(0,0,0,.35); }
.gallery__count small { color: rgba(255,255,255,.7); font: 400 1rem var(--ff-body), sans-serif; }
.gallery__btn { display: grid; width: 3.25rem; height: 3.25rem; place-items: center; border: 1px solid rgba(255,255,255,.6); border-radius: 50%; background: transparent; color: #fff; cursor: pointer; transition: background .3s, border-color .3s, transform .3s; }
.gallery__btn:hover { background: rgba(255,255,255,.12); }
.gallery__btn--next { border-color: var(--gallery-gold); background: var(--gallery-gold); }
.gallery__btn--next:hover { border-color: var(--gallery-gold-soft); background: var(--gallery-gold-soft); }
.gallery__btn:active { transform: scale(.94); }
.gallery__btn:focus-visible, .gallery__thumb:focus-visible { outline: 2px solid var(--gallery-gold-soft); outline-offset: 3px; }
.gallery__progress { position: absolute; z-index: 2; bottom: 0; left: 0; width: 100%; height: 3px; transform: scaleX(0); transform-origin: left; background: var(--gallery-gold); }
.gallery__progress.is-running { animation: gallery-progress var(--autoplay, 6000ms) linear forwards; }
@keyframes gallery-progress { to { transform: scaleX(1); } }
.gallery__thumbs { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: .75rem; margin-top: .9rem; }
.gallery__thumb { position: relative; height: clamp(4.5rem, 8vw, 6.9rem); padding: 0; border: 0; outline: 2px solid transparent; outline-offset: 3px; background: var(--gallery-deep); opacity: .62; cursor: pointer; transition: opacity .3s, outline-color .3s; }
.gallery__thumb img { display: block; width: 100%; height: 100%; object-fit: cover; }
.gallery__thumb span { position: absolute; bottom: .45rem; left: .6rem; color: #fff; font: 500 .9rem var(--ff-display), Georgia, serif; text-shadow: 0 1px 6px rgba(0,0,0,.5); }
.gallery__thumb:hover { opacity: .88; }
.gallery__thumb[aria-current="true"] { outline-color: var(--gallery-gold); opacity: 1; }
.gallery__stage:focus-visible { outline: 2px solid var(--gallery-gold); outline-offset: 4px; }
@media (max-width: 760px) {
  .gallery.overview { padding: 4rem 1.25rem; }
  .gallery__head { align-items: flex-start; gap: 1.25rem; margin-bottom: 1.75rem; }
  .gallery__head h2 { font-size: clamp(2.35rem, 10vw, 3.5rem); }
  .gallery__intro { font-size: .92rem; }
  .gallery__stage { height: 30rem; }
  .gallery__stage::after { background: linear-gradient(0deg, rgba(12,30,22,.92) 0%, rgba(12,30,22,.55) 45%, transparent 75%); }
  .gallery__caption { right: 1.5rem; bottom: 6.5rem; }
  .gallery__controls { right: 1.5rem; bottom: 1.5rem; left: 1.5rem; gap: .75rem; }
  .gallery__count { margin-right: auto; font-size: 2rem; }
  .gallery__btn { width: 2.9rem; height: 2.9rem; }
  .gallery__thumbs { display: flex; overflow-x: auto; padding: 4px 4px 6px; scroll-snap-type: x mandatory; scrollbar-width: none; }
  .gallery__thumbs::-webkit-scrollbar { display: none; }
  .gallery__thumb { flex: 0 0 28%; scroll-snap-align: start; }
}
@media (prefers-reduced-motion: reduce) {
  .gallery__slide, .gallery__slide img, .gallery__caption > *, .gallery__btn, .gallery__thumb { transition: none !important; }
  .gallery__slide.is-active img { transform: none; }
  .gallery__progress.is-running { animation: none; }
}

/* Desktop amenities: hold the viewport while vertical scroll traverses the cards. */
@media (min-width: 801px) and (prefers-reduced-motion: no-preference) {
  .amenities.amenities--pinned {
    height: calc(100svh + var(--amen-scroll-distance, 0px));
    padding-block: 0;
    overflow: clip;
  }
  .amenities--pinned .amenities__stage {
    position: sticky;
    top: 0;
    display: flex;
    height: 100svh;
    flex-direction: column;
    overflow: hidden;
  }
  .amenities--pinned .amen-head {
    flex: 0 0 auto;
    margin-bottom: 0;
    padding-top: clamp(36px, 7vh, 76px);
  }
  .amenities--pinned .amen-progress { margin-top: clamp(18px, 3vh, 30px); }
  .amenities--pinned .amen-pin {
    flex: 1 1 auto;
    height: auto;
    min-height: 0;
    align-items: center;
  }
  .amenities--pinned .amen-track {
    height: 100%;
    overflow: hidden;
    scrollbar-width: none;
    scroll-snap-type: none;
    overscroll-behavior: none;
  }
  .amenities--pinned .amen-track::-webkit-scrollbar { display: none; }
  .amenities--pinned .amen-card { height: min(62vh, 560px); }
}

@media (max-height: 700px) and (min-width: 801px) and (prefers-reduced-motion: no-preference) {
  .amenities--pinned .amen-head { padding-top: 24px; }
  .amenities--pinned .amen-progress { margin-top: 16px; }
  .amenities--pinned .amen-card { height: min(58vh, 420px); }
}

/* Keep the pinned overview content inside the viewport at every desktop height. */
@media (min-width: 801px) {
  .project-transition.is-pinned .project-transition__incoming #about {
    align-items: stretch;
    box-sizing: border-box;
    padding-block: clamp(14px, 2vh, 24px);
  }
  .project-transition.is-pinned .project-transition__incoming #about > .project__in {
    display: flex;
    height: 100%;
    min-height: 0;
    flex-direction: column;
    justify-content: center;
  }
  .project-transition.is-pinned .project-transition__incoming #about .project__intro {
    flex: 0 0 auto;
    width: 100%;
  }
  .project-transition.is-pinned .project-transition__incoming #about h2 {
    margin-block: .25rem .5rem;
    font-size: clamp(1.8rem, min(4.4svh, 3.4rem), 3.4rem);
    line-height: 1.02;
  }
  .project-transition.is-pinned .project-transition__incoming #about .project__lead {
    max-width: 62ch;
    font-size: clamp(.78rem, min(1.5svh, 1rem), 1rem);
    line-height: 1.55;
  }
  .project-transition.is-pinned .project-transition__incoming #about .project__media {
    display: flex;
    width: 100%;
    min-height: 0;
    flex: 1 1 0;
    flex-direction: column;
    justify-content: flex-end;
    margin-top: clamp(10px, 1.5svh, 18px);
  }
  .project-transition.is-pinned .project-transition__incoming #about .project__img {
    width: 100%;
    min-height: 0;
    height: auto;
    flex: 1 1 0;
  }
  .project-transition.is-pinned .project-transition__incoming #about .project__stats,
  .project-transition.is-pinned .project-transition__incoming #about .project__stats.reveal,
  .project-transition.is-pinned .project-transition__incoming #about .project__stats.reveal.is-visible {
    position: relative;
    bottom: auto;
    left: auto;
    flex: 0 0 auto;
    margin: -30px auto 0;
    transform: none;
  }
  .project-transition.is-pinned .project-transition__incoming #about .project__stat {
    min-width: 0;
    padding: clamp(10px, 1.4svh, 16px) clamp(12px, 2vw, 28px);
  }
}

@media (min-width: 801px) and (max-height: 600px) {
  .project-transition.is-pinned .project-transition__incoming #about .project__eyebrow { font-size: .58rem; }
  .project-transition.is-pinned .project-transition__incoming #about h2 { font-size: clamp(1.55rem, 5.6vh, 2.3rem); }
  .project-transition.is-pinned .project-transition__incoming #about .project__lead { font-size: .72rem; line-height: 1.4; }
  .project-transition.is-pinned .project-transition__incoming #about .project__stats { width: min(900px, calc(100% - 1rem)); margin-top: -20px; }
  .project-transition.is-pinned .project-transition__incoming #about .project__stat { padding-block: 8px; }
}

/* Align the amenities title and supporting copy to the same left content edge. */
.amen-head.wrap {
  width: 100%;
  max-width: none;
  margin-inline: 0;
  box-sizing: border-box;
}
.amen-head .head-row {
  width: 100%;
  display: flex;
  align-items: flex-start;
  flex-direction: column;
  justify-content: flex-start;
  gap: 14px;
  text-align: left;
}
.amen-head .head-row h2,
.amen-head .head-row p { align-self: flex-start; margin-inline: 0; text-align: left; }
.amen-head .head-row p { max-width: 58ch; }

/* Scroll-driven building sequence adapted from the supplied index (1).html. */
.palms-impact-section.build {
  height: 388vh;
  height: 388svh;
  overflow: clip;
  background: #f7f5f0;
  color: #1a4030;
}
.build__pin {
  position: sticky;
  top: 0;
  display: grid;
  width: min(100%, 1500px);
  height: 100vh;
  height: 100svh;
  min-height: min(36rem, 100svh);
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  align-items: center;
  gap: 2rem clamp(2rem, 4vw, 4rem);
  margin-inline: auto;
  padding-inline: clamp(1.25rem, 5vw, 6rem);
}
.build__copy { position: relative; z-index: 2; min-width: 0; }
.build__eyebrow {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin-bottom: 1.1rem;
  color: #b8894a;
  font-size: .72rem;
  font-weight: 500;
  letter-spacing: .24em;
  text-transform: uppercase;
}
.build__eyebrow::before { width: 2.6rem; height: 1px; background: currentColor; content: ""; }
.build__copy h2 {
  max-width: 12ch;
  color: #1a4030;
  font: 500 clamp(2.45rem, min(5vw, 7.2svh), 5rem)/1 var(--ff-display), Georgia, serif;
  letter-spacing: -.035em;
}
.build__copy h2 em { display: block; color: #b8894a; font-weight: 500; }
.build__lede { max-width: 46ch; margin-top: 1.35rem; color: #52665b; font-size: clamp(.88rem, 1.15vw, 1.0625rem); line-height: 1.7; }
.build__read { display: flex; align-items: baseline; gap: 1.2rem; margin-top: 1.7rem; color: #1a4030; font-size: .8rem; letter-spacing: .24em; text-transform: uppercase; }
.build__read b { color: #b8894a; font: 500 2.35rem/1 var(--ff-display), Georgia, serif; letter-spacing: 0; }
.build__track { width: min(100%, 22rem); height: 1px; margin-top: .8rem; background: rgba(26,64,48,.2); }
.build__track i {
  display: block;
  width: 100%;
  height: 2px;
  margin-top: -.5px;
  transform: scaleX(0);
  transform-origin: left;
  background: #b8894a;
  transition: transform .16s linear;
}
.build__rail { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: 1.35rem; }
.build__rail button {
  display: flex;
  min-width: 5.2rem;
  min-height: 3.2rem;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: .25rem;
  padding: .55rem .8rem;
  border: 1px solid rgba(26,64,48,.2);
  background: transparent;
  color: #1a4030;
  cursor: pointer;
  font: 500 .82rem/1.15 var(--ff-body), Arial, sans-serif;
  transition: background .3s ease, color .3s ease, border-color .3s ease;
}
.build__rail button b { color: #b8894a; font-size: .66rem; letter-spacing: .2em; }
.build__rail button:hover { border-color: #b8894a; }
.build__rail button.is-active { border-color: #1a4030; background: #1a4030; color: #fff; }
.build__rail button.is-active b { color: #e0bf80; }
.build__stage {
  position: relative;
  width: 100%;
  min-width: 0;
  max-height: 82svh;
  aspect-ratio: 810 / 555;
  isolation: isolate;
  mix-blend-mode: multiply;
  -webkit-mask-image: linear-gradient(#000 82%, transparent);
  mask-image: linear-gradient(#000 82%, transparent);
}
.build__layer {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  clip-path: inset(100% 0 0 0);
  transform: translate3d(0, 5%, 0);
  transition: opacity .45s ease, clip-path .85s cubic-bezier(.2,.7,.2,1), transform .85s cubic-bezier(.2,.7,.2,1);
  pointer-events: none;
  user-select: none;
}
.build__layer.is-past {
  opacity: .12;
  clip-path: inset(0);
  transform: translate3d(0, 0, 0);
}
.build__layer.is-active {
  opacity: 1;
  clip-path: inset(0);
  transform: translate3d(0, 0, 0);
}

@media (max-width: 899px) {
  .palms-impact-section.build { height: 356svh; }
  .build__pin {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: minmax(0, 1fr) auto;
    align-content: center;
    gap: clamp(.65rem, 2vh, 1rem);
    padding: clamp(56px, 8vh, 82px) clamp(20px, 6vw, 48px) clamp(16px, 3vh, 24px);
  }
  .build__stage { order: -1; width: 100%; height: min(43svh, 430px); max-height: none; aspect-ratio: auto; }
  .build__layer { object-fit: contain; }
  .build__lede { display: none; }
  .build__copy h2 { max-width: 14ch; font-size: clamp(2.2rem, 7vw, 3.7rem); }
  .build__read { margin-top: .75rem; }
  .build__read b { font-size: 1.9rem; }
  .build__track { margin-top: .55rem; }
  .build__rail { gap: .35rem; margin-top: .8rem; }
  .build__rail button { min-width: 4.2rem; min-height: 2.7rem; padding: .4rem .6rem; font-size: .75rem; }
}

@media (max-width: 899px) and (max-height: 540px) {
  .build__pin {
    grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr);
    grid-template-rows: 1fr;
    gap: 1rem;
    padding: 54px clamp(18px, 4vw, 32px) 14px;
  }
  .build__stage { order: 0; height: 54svh; }
  .build__copy h2 { font-size: clamp(1.75rem, 6vh, 2.5rem); }
  .build__eyebrow { margin-bottom: .55rem; font-size: .6rem; }
  .build__read { margin-top: .6rem; }
  .build__read b { font-size: 1.5rem; }
  .build__rail { margin-top: .6rem; }
  .build__rail button { min-width: 3.6rem; min-height: 2.4rem; padding: .35rem .45rem; font-size: .68rem; }
}

@media (prefers-reduced-motion: reduce) {
  .build__layer, .build__track i, .build__rail button { transition: none; }
}

/* Amenities carousel: centered editorial heading, dimensional card rail, and project facts. */
.amenities {
  padding: clamp(30px, 4vh, 48px) 0 clamp(30px, 4vh, 48px);
  overflow: hidden;
  background: var(--palm);
  color: #183f30;
}
.amenities__stage { width: 100%; }
.amen-head {
  width: min(100% - 40px, 1320px);
  margin: 0 auto clamp(8px, 1.2vh, 14px);
  padding: 0;
  text-align: center;
}
.amen-head h2 {
  max-width: 14ch;
  margin: 0 auto;
  color: #183f30;
  font-family: var(--ff-display);
  font-size: clamp(26px, 3vw, 40px);
  font-weight: 400;
  line-height: 1.05;
  letter-spacing: -.01em;
  text-wrap: balance;
}
.amen-intro {
  max-width: 52ch;
  margin: .7rem auto 0;
  color: #68776f;
  font-size: 12px;
  line-height: 1.6;
}
.amen-progress {
  width: min(100%, 760px);
  height: 2px;
  margin: clamp(12px, 1.8vh, 20px) auto 0;
  background: rgba(24,63,48,.12);
}
.amen-progress-bar { background: var(--brass); transition: transform .12s linear; }
.amen-pin {
  height: clamp(360px, 53vh, 540px);
  min-height: 0;
  align-items: center;
}
.amen-track {
  gap: clamp(32px, 2.4vw, 46px);
  padding: 24px max(20px, calc((100vw - clamp(160px, 9.5vw, 190px)) / 2));
  overflow-y: visible;
  perspective: 1400px;
  scrollbar-width: none;
}
.amen-track::-webkit-scrollbar { display: none; }
.amen-card {
  flex-basis: clamp(160px, 9.5vw, 190px);
  height: clamp(380px, 60vh, 600px);
  border-radius: 14px;
  box-shadow: 0 22px 48px rgba(19,37,29,.17);
  transform: perspective(1400px) rotateY(var(--amen-tilt, 0deg)) scale(var(--amen-scale-x, .9), var(--amen-scale-y, .54));
  transform-origin: center;
  transition: box-shadow .35s ease;
  scroll-snap-align: center;
  backface-visibility: hidden;
}
.amen-card:hover { z-index: 2; box-shadow: 0 28px 60px rgba(19,37,29,.24); }
.amen-card-img { transform: scale(1.02); }
.amen-card:hover .amen-card-img { transform: scale(1.08); }
.amen-card-overlay {
  background: linear-gradient(180deg, rgba(15, 38, 29, .03) 30%, rgba(15, 38, 29, .22) 54%, rgba(12, 31, 24, .92) 100%);
  padding: clamp(16px, 1.8vw, 24px);
  opacity: 1;
  justify-content: flex-end;
  color: #fff;
  transition: background .3s ease;
}
.amen-card-overlay h4 {
  margin: 0 0 .35rem;
  color: #fff;
  font: 400 clamp(.95rem, 1.1vw, 1.1rem)/1.15 var(--ff-display), Georgia, serif;
  text-wrap: balance;
  transform: scaleY(var(--amen-text-scale-y, 1));
  transform-origin: bottom left;
}
.amen-card-overlay p {
  margin: 0;
  color: rgba(255,255,255,.88);
  font-size: clamp(.7rem, .74vw, .78rem);
  line-height: 1.5;
  max-width: 34ch;
  transform: scaleY(var(--amen-text-scale-y, 1));
  transform-origin: bottom left;
}
.amen-card-num {
  top: 18px;
  left: 18px;
  display: grid;
  width: 36px;
  height: 36px;
  place-items: center;
  opacity: 1;
  border: 1px solid rgba(200,161,92,.68);
  border-radius: 50%;
  background: rgba(20,49,37,.8);
  color: var(--brass);
  backdrop-filter: blur(8px);
}
.amen-card::after { border: 1px solid rgba(200,161,92,.38); border-radius: inherit; }
.amen-facts {
  display: grid;
  width: min(calc(100% - 40px), 1180px);
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: clamp(22px, 3.2vh, 36px) auto 0;
  border-top: 1px solid rgba(24,63,48,.18);
  border-bottom: 1px solid rgba(24,63,48,.18);
}
.amen-facts > div {
  display: flex;
  min-width: 0;
  flex-direction: column-reverse;
  align-items: center;
  justify-content: center;
  gap: .2rem;
  padding: clamp(12px, 2vh, 20px) 10px;
  text-align: center;
}
.amen-facts > div + div { border-left: 1px solid rgba(24,63,48,.14); }
.amen-facts dt { color: #617068; font-size: .64rem; font-weight: 600; letter-spacing: .15em; text-transform: uppercase; }
.amen-facts dd { margin: 0; color: #b8894a; font: 500 clamp(1.5rem, 2.5vw, 2.35rem)/1.05 var(--ff-display), Georgia, serif; white-space: nowrap; }

@media (min-width: 801px) and (prefers-reduced-motion: no-preference) {
  .amenities--pinned .amen-head { padding-top: clamp(18px, 2.5vh, 30px); }
  .amenities--pinned .amen-pin { flex: 0 0 min(58vh, 560px); height: min(58vh, 560px); min-height: 0; }
  .amenities--pinned .amen-track { height: 100%; padding-block: 8px; }
  .amenities--pinned .amen-card { height: min(58vh, 560px); }
  .amenities--pinned .amen-facts { flex: 0 0 auto; margin-top: 8px; }
}
@media (min-width: 801px) and (max-height: 700px) and (prefers-reduced-motion: no-preference) {
  .amenities--pinned .amen-head { padding-top: 12px; }
  .amenities--pinned .amen-intro { margin-top: .35rem; }
  .amenities--pinned .amen-progress { margin-top: 8px; }
  .amenities--pinned .amen-pin { flex-basis: 52vh; height: 52vh; min-height: 0; }
  .amenities--pinned .amen-card { height: min(50vh, 360px); }
  .amenities--pinned .amen-facts { margin-top: 0; }
  .amen-facts > div { padding-block: 8px; }
  .amen-facts dd { font-size: clamp(1.25rem, 2.2vw, 1.8rem); }
}
@media (max-width: 800px) {
  .amenities { padding: 64px 0 52px; }
  .amen-head { width: calc(100% - 40px); margin-bottom: 24px; }
  .amen-intro { max-width: 42ch; }
  .amen-progress { margin-top: 18px; }
  .amen-pin { height: auto; min-height: 0; }
  .amen-track { height: min(72svh, 580px); padding: 18px 22px 28px; gap: 16px; }
  .amen-card { flex-basis: clamp(270px, 82vw, 360px); height: min(66svh, 510px); transform: none; }
  .amen-facts { width: calc(100% - 40px); grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 8px; }
  .amen-facts > div { padding: 15px 8px; }
  .amen-facts > div:nth-child(3) { border-left: 0; }
  .amen-facts > div:nth-child(n+3) { border-top: 1px solid rgba(24,63,48,.14); }
}
@media (prefers-reduced-motion: reduce) {
  .amen-progress-bar, .amen-card, .amen-card-img { transition: none !important; }
}

/* Property overview: reference-style intro followed by a full-screen pinned image sequence. */
@media (min-width: 801px) and (prefers-reduced-motion: no-preference) {
  .gallery.gallery--scroll { padding-block: 0; }
  .gallery.gallery--scroll .gallery__head {
    display: grid;
    grid-template-columns: 1.3fr 1fr;
    align-items: end;
    gap: 1.2rem 4rem;
    margin: 0;
    padding-block: clamp(3.5rem, 8vw, 6.5rem) clamp(2rem, 4vw, 3.5rem);
  }
  .gallery.gallery--scroll .gallery__intro { justify-self: end; }
  .gallery.gallery--scroll .gallery__pin {
    position: relative;
    height: calc(100svh + var(--gallery-scroll-distance, 0px));
    width: 100vw;
    margin-left: calc(50% - 50vw);
  }
  .gallery.gallery--scroll .gallery__showcase {
    position: sticky;
    top: 0;
    height: 100svh;
    min-height: 32rem;
    overflow: hidden;
    background: var(--gallery-bg);
    color: #fff;
  }
  .gallery.gallery--scroll .gallery__stage {
    height: 100%;
  }
  .gallery.gallery--scroll .gallery__stage::after {
    background: linear-gradient(180deg, rgba(9,24,18,.5), rgba(9,24,18,0) 34%, rgba(9,24,18,0) 46%, rgba(9,24,18,.72));
  }
  .gallery.gallery--scroll .gallery__slide {
    z-index: 1;
    transform: scale(1.12);
    transition: opacity 1.1s .3s cubic-bezier(.22,.7,.2,1), transform 1.7s .3s cubic-bezier(.22,.7,.2,1), visibility 0s 1.3s;
  }
  .gallery.gallery--scroll .gallery__slide.is-active {
    z-index: 2;
    transform: none;
    transition: opacity 1.1s .3s cubic-bezier(.22,.7,.2,1), transform 1.7s .3s cubic-bezier(.22,.7,.2,1), visibility 0s;
  }
  .gallery.gallery--scroll .gallery__slide.is-leaving {
    z-index: 3;
    opacity: 0;
    visibility: visible;
    transform: scale(.92);
    transition: opacity .95s .1s cubic-bezier(.22,.7,.2,1), transform 1.1s .1s cubic-bezier(.22,.7,.2,1), visibility 0s 1.3s;
  }
  .gallery.gallery--scroll .gallery__slide img,
  .gallery.gallery--scroll .gallery__slide.is-active img { transform: none; transition: none; }
  .gallery.gallery--scroll .gallery__caption {
    inset: 0;
    max-width: none;
    pointer-events: none;
  }
  .gallery.gallery--scroll .gallery__tag,
  .gallery.gallery--scroll .gallery__title {
    position: absolute;
    left: clamp(1.25rem, 6vw, 6rem);
    right: auto;
    width: min(32vw, 30rem);
    text-shadow: 0 1px 14px rgba(0,0,0,.35);
  }
  .gallery.gallery--scroll .gallery__tag {
    top: clamp(5.5rem, 23vh, 13rem);
    margin: 0;
    color: var(--gallery-gold-soft);
    font-size: .78rem;
    font-weight: 500;
    letter-spacing: .24em;
  }
  .gallery.gallery--scroll .gallery__title {
    top: calc(clamp(5.5rem, 23vh, 13rem) + 1.6rem);
    margin: 0;
    color: #fff;
    font: 500 clamp(2.2rem, 4vw, 3.8rem)/1.04 var(--ff-display), Georgia, serif;
    letter-spacing: -.02em;
  }
  .gallery.gallery--scroll .gallery__desc {
    position: absolute;
    left: max(46vw, clamp(1.25rem, 6vw, 6rem));
    right: auto;
    bottom: clamp(4.5rem, 14vh, 9rem);
    max-width: 28rem;
    color: rgba(255,255,255,.94);
    font-size: 1.02rem;
    font-weight: 500;
    line-height: 1.65;
    text-shadow: 0 1px 14px rgba(0,0,0,.35);
  }
  .gallery.gallery--scroll .gallery__desc::before {
    display: block;
    width: 2.6rem;
    height: 1px;
    margin-bottom: 1.1rem;
    background: var(--gallery-gold-soft);
    content: "";
  }
  .gallery.gallery--scroll .gallery__controls {
    right: clamp(5.5rem, 7vw, 8rem);
    bottom: clamp(1.25rem, 3vh, 2rem);
    gap: .65rem;
  }
  .gallery.gallery--scroll .gallery__count {
    position: absolute;
    z-index: 5;
    top: clamp(1.2rem, 3vh, 2rem);
    left: clamp(1.25rem, 3vw, 2.2rem);
    margin: 0;
    text-shadow: 0 1px 14px rgba(0,0,0,.35);
  }
  .gallery.gallery--scroll .gallery__hint {
    position: absolute;
    z-index: 5;
    bottom: 1.6rem;
    left: 50%;
    color: rgba(255,255,255,.75);
    font-size: .7rem;
    letter-spacing: .26em;
    text-transform: uppercase;
    transform: translateX(-50%);
    transition: opacity .6s;
  }
  .gallery.gallery--scroll .gallery__hint.is-hidden { opacity: 0; }
}
@media (max-width: 800px) {
  .gallery__showcase { display: block; height: auto; }
  .gallery__controls { right: 5.5rem; left: auto; gap: .5rem; }
  .gallery__caption { position: absolute; inset: 0; max-width: none; pointer-events: none; }
  .gallery__tag, .gallery__title { position: absolute; left: 1.5rem; right: 1.5rem; }
  .gallery__tag { top: clamp(4.5rem, 15vh, 8rem); }
  .gallery__title { top: calc(clamp(4.5rem, 15vh, 8rem) + 1.6rem); margin: 0; }
  .gallery__desc { position: absolute; left: 1.5rem; right: 1.5rem; bottom: 6.5rem; }
}
@media (min-width: 801px) and (max-height: 680px) and (prefers-reduced-motion: no-preference) {
  .gallery.gallery--scroll .gallery__tag { top: clamp(4.25rem, 16vh, 7rem); }
  .gallery.gallery--scroll .gallery__title { top: calc(clamp(4.25rem, 16vh, 7rem) + 1.6rem); }
  .gallery.gallery--scroll .gallery__desc { bottom: clamp(3.75rem, 10vh, 5.5rem); }
}

/* Scroll-driven amenity arc, using the site's original typography and palette. */
@media (min-width: 801px) and (prefers-reduced-motion: no-preference) {
  .amenities.amenities--pinned {
    height: calc(100svh + var(--amen-scroll-distance, 0px));
    padding: 0;
    overflow: clip;
  }
  .amenities--pinned .amenities__stage {
    position: sticky;
    top: 0;
    display: flex;
    height: 100svh;
    flex-direction: column;
    overflow: hidden;
  }
  .amenities--pinned .amen-head {
    flex: 0 0 auto;
    margin: 0 auto;
    padding: clamp(18px, 4vh, 42px) 0 0;
  }
  .amenities--pinned .amen-progress { margin-top: clamp(12px, 2vh, 20px); }
  .amenities--pinned .amen-pin {
    position: relative;
    flex: 1 1 auto;
    width: 100%;
    height: auto;
    min-height: 0;
    overflow: hidden;
  }
  .amenities--pinned .amen-track {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
    padding: 0;
    overflow: hidden;
    perspective: 1500px;
    perspective-origin: 50% 42%;
    cursor: grab;
    touch-action: pan-y;
    user-select: none;
    scroll-snap-type: none;
  }
  .amenities--pinned .amen-track:active { cursor: grabbing; }
  .amenities--pinned .amen-card {
    position: absolute;
    top: 42%;
    left: 50%;
    flex: none;
    width: clamp(180px, 15vw, 270px);
    height: min(58vh, 560px);
    margin: 0;
    transform-origin: center;
    transition: box-shadow .35s ease;
    will-change: transform, opacity;
    scroll-snap-align: none;
  }
  .amenities--pinned .amen-card-overlay h4,
  .amenities--pinned .amen-card-overlay p { transform: none; }
  .amenities--pinned .amen-card-num {
    display: block;
    width: auto;
    height: auto;
    padding: .38rem .85rem;
    border-color: rgba(200,161,92,.65);
    background: #214b39;
    color: #fff;
    font-size: .95rem;
  }
  .amenities--pinned .amen-facts {
    flex: 0 0 auto;
    margin: 0 auto clamp(12px, 2.5vh, 24px);
  }
  .amenities--pinned .amen-end-note {
    position: absolute;
    top: 42%;
    left: 50%;
    width: min(24rem, 80vw);
    padding: 0;
    will-change: transform, opacity;
  }
}

@media (min-width: 801px) and (max-height: 700px) and (prefers-reduced-motion: no-preference) {
  .amenities--pinned .amen-head { padding-top: 12px; }
  .amenities--pinned .amen-intro { margin-top: .35rem; }
  .amenities--pinned .amen-progress { margin-top: 8px; }
  .amenities--pinned .amen-card { height: min(48vh, 340px); }
  .amenities--pinned .amen-facts { margin-bottom: 8px; }
  .amenities--pinned .amen-facts > div { padding-block: 8px; }
  .amenities--pinned .amen-facts dd { font-size: clamp(1.25rem, 2.2vw, 1.8rem); }
}


/* =====================================================================
   FLOOR PLANS — stacked sticky cards
   Each layout pins below the previous one; covered cards scale back and
   dim as the next card slides over (driven by --depth from script.js).
   ===================================================================== */
.plans { --stack-top: clamp(16px, 3vh, 32px); --stack-step: 14px; }
.plans .head-row { margin-bottom: clamp(36px, 5vw, 64px); }
.plan-stack { position: relative; display: grid; gap: clamp(20px, 3vw, 32px); }

.plan-card {
  --depth: 0;
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  min-height: min(620px, calc(100svh - var(--stack-top) * 2 - 56px));
  background: #fff;
  border: 1px solid rgba(23, 61, 42, .1);
  border-radius: 6px;
  box-shadow: 0 1px 2px rgba(20, 34, 26, .04), 0 18px 44px rgba(20, 34, 26, .07);
  overflow: hidden;
  transform-origin: 50% 0;
  isolation: isolate;
}
/* Dimming veil for covered cards (palette green, never pure black). */
.plan-card::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 5;
  background: #173f2b;
  opacity: 0;
  pointer-events: none;
}

.plan-card__body {
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-width: 0;
  padding: clamp(24px, 4.2vh, 52px) clamp(24px, 3.6vw, 52px);
  background: #fbfbf8;
  border-right: 1px solid rgba(23, 61, 42, .08);
}
.plan-card__count {
  margin: 0 0 clamp(10px, 1.6vh, 18px);
  font-family: var(--ff-body);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: .2em;
  color: var(--sand-dim);
  font-variant-numeric: tabular-nums;
}
.plan-card__count span { color: var(--brass); }
.plan-card .plan-info h3,
.plan-card h3 { margin: 0 0 10px; }
.plan-card .meta { margin-bottom: clamp(18px, 3vh, 30px); }
.plan-card .room-list {
  gap: 0 clamp(16px, 2vw, 28px);
  margin: 0 0 clamp(18px, 3vh, 32px);
  padding: 0;
}
.plan-card .room-list li {
  padding: clamp(5px, .9vh, 9px) 0;
  line-height: 1.35;
  min-width: 0;
}
.plan-card .room-list li b { flex: 0 0 auto; min-width: 22px; }
.plan-card .plan-cta-row { gap: 12px; flex-wrap: wrap; }
.plan-card .plan-cta-row .btn { justify-content: center; padding: 14px 20px; letter-spacing: .12em; white-space: nowrap; }
.plan-card .meta { line-height: 1.55; }

/* Drawing panel */
.plan-card .plan-img {
  display: block;
  position: relative;
  min-height: 0;
  max-height: none;
  height: auto;
  padding: 0;
  background: #fff;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}
.plan-card .plan-img img {
  position: absolute;
  inset: clamp(20px, 3vw, 44px);
  width: calc(100% - 2 * clamp(20px, 3vw, 44px));
  height: calc(100% - 2 * clamp(20px, 3vw, 44px));
  max-height: none;
  object-fit: contain;
  transform: none;
  transition: transform .6s cubic-bezier(.2, .8, .2, 1);
}
.plan-card .plan-img:hover img { transform: scale(1.03); }
.plan-card .plan-img:focus-visible { outline: 2px solid var(--brass); outline-offset: -4px; }
.plan-card .plan-zoom-badge { top: 18px; right: 18px; }

/* Stacking mode: enabled by script.js only when every card fits the viewport. */
.plan-stack.is-stacked .plan-card {
  position: sticky;
  top: var(--sticky-top, calc(var(--stack-top) + var(--i) * var(--stack-step)));
  height: var(--card-h, auto);
  transform: scale(calc(1 - var(--depth) * .045));
  will-change: transform;
}
.plan-stack.is-stacked .plan-card::after { opacity: min(.38, calc(var(--depth) * .2)); }

@media (prefers-reduced-motion: reduce) {
  .plan-stack.is-stacked .plan-card { transform: none; }
  .plan-card .plan-img img { transition: none; }
}

/* Tablet & phone: drawing on top, details below, simple flowing list. */
@media (max-width: 900px) {
  .plan-card { grid-template-columns: minmax(0, 1fr); min-height: 0; }
  .plan-card .plan-img { order: -1; aspect-ratio: 1.45; border-bottom: 1px solid rgba(23, 61, 42, .08); }
  .plan-card .plan-img img { inset: 16px; width: calc(100% - 32px); height: calc(100% - 32px); }
  .plan-card__body { border-right: 0; padding: 28px 24px 32px; }
  .plan-card .plan-zoom-badge { top: 12px; right: 12px; }
}
@media (max-width: 560px) {
  .plan-card .room-list { grid-template-columns: 1fr 1fr; }
  .plan-card .plan-cta-row { flex-direction: column; }
  .plan-card .plan-cta-row .btn { width: 100%; }
  .plan-card__body { padding: 24px 20px 28px; }
}
@media (max-width: 380px) {
  .plan-card .room-list { grid-template-columns: 1fr; }
}

/* Plans keep a gentle snap off: a long pinned stack should scroll freely. */
body > .plans { scroll-snap-align: none; }

/* =====================================================================
   CONNECTED LIVING — heading, staggered contact cards, full-width map
   ===================================================================== */
.connected {
  --c-green: #1a4030;
  --c-body: #52665b;
  --c-gold: #b8894a;
  --c-line: rgba(26, 64, 48, .12);
  padding: clamp(4rem, 8vw, 7rem) clamp(1.25rem, 5vw, 6rem);
  background: #f7f5f0;
  color: var(--c-green);
}
.connected__in { width: min(100%, 1240px); margin-inline: auto; }
.connected .reveal,
.site-footer .reveal { transition-delay: var(--d, 0s); }

.connected__head {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr);
  gap: clamp(24px, 5vw, 80px);
  align-items: end;
  margin-bottom: clamp(36px, 5vw, 56px);
}
.connected__title h2 {
  margin: 14px 0 0;
  font-family: var(--ff-display);
  font-weight: 400;
  font-size: clamp(28px, 3.4vw, 44px);
  line-height: 1.12;
  letter-spacing: -.01em;
  color: var(--c-green);
  max-width: 24ch;
  text-wrap: balance;
}
.connected__lede p {
  margin: 0 0 24px;
  color: var(--c-body);
  font-size: 15px;
  line-height: 1.75;
  max-width: 46ch;
}

.connected__cards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(14px, 2vw, 24px);
  margin-bottom: clamp(14px, 2vw, 24px);
}
.ccard {
  position: relative;
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: clamp(22px, 2.6vw, 32px);
  background: #fff;
  border: 1px solid var(--line-gold, rgba(200,161,92,.35));
  border-radius: 6px;
  box-shadow: 0 1px 2px rgba(20, 34, 26, .03);
}
.ccard:hover { border-color: var(--c-gold); box-shadow: 0 16px 36px rgba(20, 34, 26, .08); }
.ccard__icon {
  display: inline-grid;
  place-items: center;
  width: 42px;
  height: 42px;
  margin-bottom: 20px;
  border-radius: 50%;
  background: rgba(184, 137, 74, .1);
  color: var(--c-gold);
}
.ccard__icon svg, .ccard__link svg, .sf-ico svg, .sf-pill svg {
  width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round;
}
.ccard h3 {
  margin: 0 0 10px;
  font-family: var(--ff-display);
  font-weight: 400;
  font-size: clamp(20px, 1.8vw, 24px);
  line-height: 1.2;
  color: var(--c-green);
}
.ccard p {
  margin: 0 0 22px;
  color: var(--c-body);
  font-size: 14px;
  line-height: 1.7;
  overflow-wrap: anywhere;
}
.ccard p a { color: inherit; text-decoration: none; transition: color .2s; }
.ccard p a:hover { color: var(--c-gold); }
.ccard__link, .ccard__note {
  margin-top: auto;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  width: fit-content;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--c-gold);
  text-decoration: none;
}
.ccard__link svg { width: 14px; height: 14px; transition: transform .25s; }
.ccard__link:hover svg { transform: translateX(4px); }
.ccard__note { color: var(--c-body); }

.connected__map {
  position: relative;
  height: clamp(300px, 40vw, 500px);
  overflow: hidden;
  border-radius: 6px;
  border: 1px solid var(--c-line);
  background: #e9e6de;
}
.connected__map iframe {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
  filter: grayscale(0.4) invert(0.92) contrast(0.9);
}

@media (max-width: 900px) {
  .connected__head { grid-template-columns: minmax(0, 1fr); align-items: start; }
  .connected__cards { grid-template-columns: minmax(0, 1fr); }
}
@media (min-width: 600px) and (max-width: 900px) {
  .connected__cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .connected__cards .ccard:last-child { grid-column: 1 / -1; }
}

/* =====================================================================
   FOOTER — image CTA band fading into a deep-green footer with a
   full-width gold wordmark
   ===================================================================== */
.site-footer {
  --f-bg: #0f261c;
  --f-text: rgba(255, 255, 255, .92);
  --f-muted: rgba(255, 255, 255, .58);
  --f-line: rgba(255, 255, 255, .1);
  --f-gold: #c9a25a;
  padding: 0;
  border: 0;
  background: var(--f-bg);
  color: var(--f-text);
  overflow: hidden;
}

.sf-cta {
  position: relative;
  display: grid;
  place-items: center;
  min-height: clamp(380px, 52vw, 620px);
  padding: clamp(72px, 9vw, 120px) clamp(20px, 5vw, 72px) clamp(110px, 12vw, 170px);
  text-align: center;
  isolation: isolate;
  overflow: hidden;
}
.sf-cta__bg {
  position: absolute;
  inset: -12% 0;
  z-index: -2;
  width: 100%;
  height: 124%;
  transform: translate3d(0, var(--parallax, 0px), 0) scale(1.04);
  will-change: transform;
  object-fit: cover;
  object-position: center 35%;
}
.sf-cta::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    linear-gradient(180deg, rgba(15, 38, 28, .55) 0%, rgba(15, 38, 28, .62) 45%, var(--f-bg) 100%);
}
.sf-cta__in { width: min(100%, 760px); }
.sf-cta__eyebrow {
  margin: 0 0 18px;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: .26em;
  text-transform: uppercase;
  color: var(--f-gold);
}
.sf-cta h2 {
  margin: 0;
  font-family: var(--ff-display);
  font-weight: 400;
  font-size: clamp(34px, 5vw, 64px);
  line-height: 1.06;
  letter-spacing: -.015em;
  color: #fff;
  text-wrap: balance;
}
.sf-cta h2 em { font-style: italic; color: var(--f-gold); }
.sf-cta__rule {
  display: block;
  width: min(100%, 520px);
  height: 1px;
  margin: clamp(26px, 3.4vw, 40px) auto;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.5), transparent);
}
.sf-pill {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 14px 26px;
  border-radius: 999px;
  background: #fff;
  color: #173f2b;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: .14em;
  text-transform: uppercase;
  text-decoration: none;
  transition: background-color .25s, color .25s;
}
.sf-pill svg { width: 16px; height: 16px; transition: transform .25s; }
.sf-pill:hover { background: var(--f-gold); color: #fff; }
.sf-pill:hover svg { transform: translateX(4px); }
.sf-pill:focus-visible { outline: 2px solid var(--f-gold); outline-offset: 3px; }

.sf-main {
  width: min(100% - 2 * clamp(20px, 5vw, 72px), 1240px);
  margin: calc(-1 * clamp(40px, 5vw, 70px)) auto 0;
  position: relative;
}
.sf-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) repeat(2, minmax(0, .8fr)) minmax(0, 1.25fr);
  gap: clamp(28px, 4vw, 56px);
  padding-bottom: clamp(40px, 6vw, 72px);
}
.sf-brand__img {
  display: block;
  width: min(100%, 240px);
  height: auto;
  aspect-ratio: 6 / 5;
  object-fit: cover;
  border-radius: 4px;
  margin-bottom: 20px;
}
.sf-brand p { margin: 0; max-width: 26ch; color: var(--f-text); font-size: 15px; line-height: 1.6; }
.sf-col h3 {
  margin: 0 0 22px;
  font-family: var(--ff-display);
  font-weight: 400;
  font-size: 20px;
  color: #fff;
}
.sf-col > a {
  display: block;
  width: fit-content;
  margin-bottom: 14px;
  color: var(--f-muted);
  font-size: 14px;
  text-decoration: none;
  transition: color .2s;
}
.sf-col > a:hover { color: var(--f-gold); }
.sf-contact .sf-row {
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  margin: 0 0 14px;
  color: var(--f-muted);
  font-size: 14px;
  line-height: 1.5;
  overflow-wrap: anywhere;
}
.sf-contact a.sf-row:hover { color: var(--f-gold); }
.sf-ico {
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  border-radius: 8px;
  border: 1px solid var(--f-line);
  background: rgba(255, 255, 255, .04);
  color: var(--f-gold);
}
.sf-ico svg { width: 16px; height: 16px; }

.sf-word { line-height: 0; padding-top: clamp(8px, 2vw, 24px); }
.sf-word__svg { display: block; width: 100%; height: auto; overflow: visible; }
.sf-word__svg text {
  font-family: 'Montserrat', var(--ff-body), Arial, sans-serif;
  font-weight: 700;
  font-size: 200px;
  letter-spacing: -.035em;
}

.sf-bottom {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 14px 24px;
  margin-top: clamp(20px, 3vw, 36px);
  padding: 22px 0 max(26px, env(safe-area-inset-bottom));
  border-top: 1px solid var(--f-line);
  color: var(--f-muted);
  font-size: 12px;
  letter-spacing: .02em;
}
.sf-bottom__brand { display: inline-flex; align-items: center; gap: 14px; }
.sf-bottom__brand img { width: auto; height: 30px; opacity: .85; }

@media (max-width: 1024px) {
  .sf-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px) {
  .sf-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px 20px; }
  .sf-brand, .sf-contact { grid-column: 1 / -1; }
  .sf-brand__img { width: 100%; aspect-ratio: 16 / 9; }
  .sf-bottom { flex-direction: column; align-items: flex-start; }
}
@media (prefers-reduced-motion: reduce) {
  .sf-pill svg, .ccard__link svg { transition: none; }
}

/* =====================================================================
   ENQUIRY — centred heading, image card + deep-green form card
   ===================================================================== */
.enquiry {
  --e-green: #173f2b;
  --e-gold: #c8a15c;
  --e-cream: #f7f5f0;
  display: block;
  padding: clamp(4.5rem, 9vw, 8rem) clamp(1.25rem, 5vw, 6rem);
  background: var(--palm, #f5faf8);
  color: var(--e-green);
}
.enq-head {
  width: min(100%, 760px);
  margin: 0 auto clamp(40px, 6vw, 72px);
  text-align: center;
}
.enq-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 30px;
  padding: 0 16px;
  border-radius: 999px;
  background: #fff;
  border: 1px solid var(--line-gold, rgba(200,161,92,.35));
  color: var(--e-gold);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .24em;
  text-transform: uppercase;
}
.enq-head h2 {
  margin: 22px 0 18px;
  font-family: var(--ff-display);
  font-weight: 400;
  font-size: clamp(40px, 6vw, 76px);
  line-height: 1.02;
  letter-spacing: -.03em;
  color: var(--e-green);
}
.enq-head p {
  margin: 0 auto;
  max-width: 54ch;
  color: #52665b;
  font-size: clamp(15px, 1.2vw, 16px);
  line-height: 1.75;
}

.enq-grid {
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
  gap: clamp(18px, 3vw, 36px);
  width: min(100%, 1240px);
  margin: 0 auto;
  align-items: stretch;
}
.enq-media {
  position: relative;
  margin: 0;
  min-height: 420px;
  overflow: hidden;
  border-radius: 8px;
  background: #dfe5df;
}
.enq-media img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: scale(1.06);
  transition: transform 1.6s cubic-bezier(.2,.7,.2,1);
}
.enq-media.is-visible img { transform: scale(1); }
.enq-media::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 45%, rgba(15, 38, 28, .55) 100%);
  pointer-events: none;
}
.enquiry .unit-preview {
  position: absolute;
  left: clamp(14px, 2vw, 22px);
  right: clamp(14px, 2vw, 22px);
  bottom: clamp(14px, 2vw, 22px);
  z-index: 1;
  width: auto;
  max-width: none;
  min-height: 0;
  margin: 0;
  padding: 16px 18px;
  border-radius: 6px;
  background: rgba(255, 255, 255, .9);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  box-shadow: 0 10px 30px rgba(15, 38, 28, .18);
}
.enquiry .unit-preview .small { margin: 0; color: var(--e-gold); font-size: 9px; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; }
.enquiry .unit-info { display: flex; align-items: center; gap: 16px; margin-top: 8px; }
.enquiry .unit-big { min-width: 56px; color: var(--e-green); font-family: var(--ff-display); font-size: 40px; line-height: 1; letter-spacing: -.03em; }
.enquiry .unit-copy { min-width: 0; color: #52665b; font-size: 13px; line-height: 1.5; }
.enquiry .unit-copy strong { display: block; margin-bottom: 2px; color: var(--e-green); font-size: 14px; font-weight: 500; }

.enq-card {
  position: relative;
  min-width: 0;
  padding: clamp(24px, 3.4vw, 44px);
  border-radius: 8px;
  background: var(--e-green);
  color: #fff;
  box-shadow: 0 24px 60px rgba(15, 38, 28, .18);
}
.enquiry .form-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  margin: 0 0 24px;
  padding: 0 0 18px;
  border-bottom: 1px solid rgba(255, 255, 255, .14);
}
.enquiry .form-head b { color: #fff; font-family: var(--ff-display); font-size: clamp(20px, 2vw, 24px); font-weight: 400; }
.enquiry .form-head span { white-space: nowrap; color: var(--e-gold); font-size: 9px; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; text-align: right; }

.enquiry .contact-enquiry-form { display: grid; gap: 16px; }
.enquiry .row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.enquiry .field {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-width: 0;
  padding: 0;
  border: 0;
  background: none;
  box-shadow: none;
  outline: 0;
}
.enquiry .field label {
  position: static;
  order: -1;
  margin: 0;
  color: rgba(255, 255, 255, .78);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: .1em;
  text-transform: uppercase;
  transform: none;
  pointer-events: auto;
}
.enquiry .field.has label,
.enquiry .field:focus-within label { color: var(--e-gold); font-size: 11px; top: auto; }
.enquiry .contact-enquiry-form input,
.enquiry .contact-enquiry-form select,
.enquiry .contact-enquiry-form textarea {
  width: 100%;
  height: 50px;
  margin: 0;
  padding: 0 16px;
  border: 1px solid transparent;
  border-radius: 4px;
  background: var(--e-cream);
  color: #1d3326;
  font: 400 14px/1.4 var(--ff-body);
  outline: 0;
  box-shadow: none;
  transition: border-color .25s, box-shadow .25s, background-color .25s;
  -webkit-appearance: none;
  appearance: none;
}
.enquiry .contact-enquiry-form textarea { height: 128px; min-height: 104px; max-height: 240px; padding: 14px 16px; resize: vertical; }
.enquiry .contact-enquiry-form ::placeholder { color: #8b968f; opacity: 1; }
.enquiry .contact-enquiry-form input:focus,
.enquiry .contact-enquiry-form select:focus,
.enquiry .contact-enquiry-form textarea:focus {
  background: #fff;
  border-color: var(--e-gold);
  box-shadow: 0 0 0 3px rgba(200, 161, 92, .28);
}
.enquiry .select { overflow: visible; }
.enquiry .select::after {
  content: "";
  position: absolute;
  right: 18px;
  top: auto;
  bottom: 21px;
  width: 7px;
  height: 7px;
  border-right: 1.5px solid var(--e-green);
  border-bottom: 1.5px solid var(--e-green);
  transform: rotate(45deg);
  pointer-events: none;
  transition: transform .25s;
}
.enquiry .select:focus-within::after { transform: rotate(225deg) translate(-2px, -2px); }
.enquiry .contact-enquiry-select { padding-right: 44px !important; cursor: pointer; }
.enquiry .contact-enquiry-option { color: #1d3326; background: #fff; }

.enquiry .bottom {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 18px;
  margin-top: 6px;
}
.enquiry .enquiry-note { max-width: 40ch; margin: 0; color: rgba(255, 255, 255, .62); font-size: 12px; line-height: 1.55; }
.enquiry .enq-submit {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-width: 190px;
  min-height: 52px;
  padding: 14px 24px;
  border: 0;
  border-radius: 4px;
  background: var(--e-gold);
  color: #fff;
  font: 600 11px/1.2 var(--ff-body);
  letter-spacing: .16em;
  text-transform: uppercase;
  cursor: pointer;
  overflow: hidden;
  transition: transform .25s, box-shadow .25s;
}
.enquiry .enq-submit::before {
  content: "";
  position: absolute;
  inset: 0;
  background: #fff;
  transform: translateX(-101%);
  transition: transform .45s cubic-bezier(.2,.7,.2,1);
}
.enquiry .enq-submit span, .enquiry .enq-submit svg { position: relative; z-index: 1; transition: color .3s, transform .3s; }
.enquiry .enq-submit svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.enquiry .enq-submit:hover { transform: translateY(-2px); box-shadow: 0 12px 26px rgba(0, 0, 0, .22); }
.enquiry .enq-submit:hover::before { transform: none; }
.enquiry .enq-submit:hover span, .enquiry .enq-submit:hover svg { color: var(--e-green); }
.enquiry .enq-submit:hover svg { transform: translateX(4px); }
.enquiry .enq-submit:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }
.enquiry .success { margin-top: 4px; padding: 13px 15px; border-left: 2px solid var(--e-gold); background: rgba(255,255,255,.08); color: #fff; font-size: 12px; line-height: 1.55; }

@media (max-width: 900px) {
  .enq-grid { grid-template-columns: minmax(0, 1fr); }
  .enq-media { min-height: 0; aspect-ratio: 16 / 10; }
}
@media (max-width: 560px) {
  .enq-media { aspect-ratio: 4 / 3.4; }
  .enquiry .row { grid-template-columns: minmax(0, 1fr); }
  .enquiry .bottom { grid-template-columns: minmax(0, 1fr); }
  .enquiry .enq-submit { width: 100%; }
  .enquiry .form-head { flex-direction: column; gap: 6px; }
  .enquiry .form-head span { text-align: left; }
}

/* =====================================================================
   MOTION LAYER for the redesigned sections (reference-style)
   - .reveal: rise + blur-to-sharp, staggered with --d
   - .split-words: headline words resolve one by one from a blur
   - .enq-pill: badge grows open, then its label fades in
   - footer wordmark rises out of a mask
   ===================================================================== */
.js-reveal-ready :is(.connected, .enquiry, .site-footer) .reveal {
  opacity: 0;
  filter: blur(8px);
  transform: translate3d(0, 34px, 0);
  transition:
    opacity .9s cubic-bezier(.2,.7,.2,1) var(--d, 0s),
    transform 1s cubic-bezier(.2,.7,.2,1) var(--d, 0s),
    filter .9s cubic-bezier(.2,.7,.2,1) var(--d, 0s),
    box-shadow .3s ease, border-color .3s ease, background-color .3s ease;
}
.js-reveal-ready :is(.connected, .enquiry, .site-footer) .reveal.is-visible {
  opacity: 1;
  filter: none;
  transform: none;
}
.js-reveal-ready .connected__map.reveal { transform: translate3d(0, 40px, 0) scale(.97); }
.js-reveal-ready .connected__map.reveal.is-visible { transform: none; }

.split-words .sw {
  display: inline-block;
  white-space: pre;
}
.js-motion .split-words .sw {
  opacity: 0;
  filter: blur(10px);
  transform: translate3d(0, .32em, 0);
  transition:
    opacity .8s cubic-bezier(.2,.7,.2,1),
    filter .8s cubic-bezier(.2,.7,.2,1),
    transform .9s cubic-bezier(.2,.7,.2,1);
  transition-delay: calc(var(--wd, 0s) + var(--w, 0) * 55ms);
}
.js-motion .split-words.is-in .sw { opacity: 1; filter: none; transform: none; }
.enq-head p.split-words { --wd: .35s; }
.js-motion .enq-head p.split-words .sw { transition-delay: calc(var(--wd) + var(--w, 0) * 18ms); }

.js-motion .enq-pill {
  clip-path: inset(0 42% round 999px);
  transition: clip-path .9s cubic-bezier(.65,0,.35,1);
}
.js-motion .enq-pill > span { opacity: 0; transition: opacity .5s ease .55s; }
.js-motion .enq-pill.is-in { clip-path: inset(0 0 round 999px); }
.js-motion .enq-pill.is-in > span { opacity: 1; }

.sf-word { overflow: hidden; }
.js-reveal-ready .site-footer .sf-word.reveal { opacity: 1; filter: none; transform: none; }
.js-reveal-ready .sf-word .sf-word__svg {
  transform: translate3d(0, 105%, 0);
  transition: transform 1.4s cubic-bezier(.16,1,.3,1) .1s;
}
.js-reveal-ready .sf-word.is-visible .sf-word__svg { transform: none; }

/* Underline sweep on footer links */
.sf-col > a { position: relative; }
.sf-col > a::after {
  content: "";
  position: absolute;
  left: 0; bottom: -3px;
  width: 100%; height: 1px;
  background: currentColor;
  transform: scaleX(0);
  transform-origin: right;
  transition: transform .4s cubic-bezier(.2,.7,.2,1);
}
.sf-col > a:hover::after { transform: scaleX(1); transform-origin: left; }

@media (prefers-reduced-motion: reduce) {
  .js-reveal-ready :is(.connected, .enquiry, .site-footer) .reveal,
  .js-motion .split-words .sw,
  .js-reveal-ready .sf-word .sf-word__svg,
  .enq-media img { opacity: 1 !important; filter: none !important; transform: none !important; transition: none !important; }
  .js-motion .enq-pill { clip-path: none; transition: none; }
  .js-motion .enq-pill > span { opacity: 1; transition: none; }
  .sf-cta__bg { transform: none; }
}

/* =====================================================================
   TYPOGRAPHY — Montserrat across the whole page
   ===================================================================== */
:root {
  --ff-display: 'Montserrat', 'Helvetica Neue', Arial, sans-serif;
  --ff-body: 'Montserrat', 'Helvetica Neue', Arial, sans-serif;
}
body { font-family: var(--ff-body); }
/* Selectors that hard-coded a serif face */
.palms-about-title, .palms-overview-title, .panel h3, .title, .next h2 { font-family: var(--ff-display) !important; }
/* Montserrat is a geometric sans: give display headings a touch more weight
   and slightly tighter tracking so they read crisp rather than thin. */
h1, h2, h3 { font-weight: 500; letter-spacing: -.02em; }
h4 { letter-spacing: -.01em; }
/* Section headings were tuned for a serif at weight 400; Montserrat needs 500. */
h1, h2 { font-weight: 500 !important; }
h1 em, h2 em, h3 em { font-weight: 400 !important; }

/* =====================================================================
   HERO — smaller, neater headline with a legibility gradient
   ===================================================================== */
.hero-sticky::after {
  background:
    linear-gradient(90deg, rgba(9, 22, 16, .62) 0%, rgba(9, 22, 16, .32) 38%, rgba(9, 22, 16, 0) 64%),
    linear-gradient(180deg, rgba(0, 0, 0, .28) 0%, rgba(0, 0, 0, .06) 40%, rgba(0, 0, 0, .42) 100%);
}
.hero-content { padding-bottom: clamp(96px, 13vh, 132px); }
.hero-content .eyebrow { font-size: 11px; letter-spacing: .3em; }
.hero-title {
  max-width: 15ch;
  margin-top: 18px;
  font-size: clamp(34px, 4.4vw, 66px);
  font-weight: 500;
  line-height: 1.08;
  letter-spacing: -.025em;
  text-wrap: balance;
}
.hero-title em { display: block; font-weight: 400; }
.hero-sub {
  max-width: 46ch;
  margin-top: 20px;
  color: rgba(255, 255, 255, .88);
  font-size: clamp(14px, 1.05vw, 16px);
  font-weight: 400;
  line-height: 1.7;
}
@media (max-width: 760px) {
  .hero-content { padding-bottom: 92px; }
  .hero-title { font-size: clamp(30px, 8.4vw, 44px); max-width: 14ch; }
  .hero-sub { font-size: 14px; max-width: 34ch; }
  .hero-sticky::after { background: linear-gradient(180deg, rgba(0,0,0,.25) 0%, rgba(0,0,0,.08) 35%, rgba(9,22,16,.7) 100%); }
}
@media (max-height: 640px) and (min-width: 761px) {
  .hero-content { padding-bottom: 84px; }
  .hero-title { font-size: clamp(30px, 7.5vh, 52px); }
  .hero-sub { margin-top: 12px; font-size: 13px; }
}

/* =====================================================================
   PROPERTY OVERVIEW — contained slideshow with a legible caption panel
   ===================================================================== */
.gallery.overview .gallery__head { display: flex; }
.gallery.overview .gallery__pin { position: static; height: auto; width: auto; margin: 0; }
.gallery.overview .gallery__showcase, .gallery.overview .gallery__pin, .gallery.overview .gallery__in { min-width: 0; }
.gallery.overview .gallery__showcase { position: relative; height: auto; min-height: 0; overflow: visible; background: none; }
.gallery.overview .gallery__stage {
  position: relative;
  width: 100%;
  height: clamp(24rem, min(50vw, 78svh), 40rem);
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 30px 70px rgba(15, 38, 28, .18);
  isolation: isolate;
}
.gallery.overview .gallery__stage::after {
  background: linear-gradient(0deg, rgba(9, 24, 18, .55) 0%, rgba(9, 24, 18, .12) 38%, rgba(9, 24, 18, 0) 60%),
              linear-gradient(180deg, rgba(9, 24, 18, .35) 0%, rgba(9, 24, 18, 0) 22%);
}
.gallery.overview .gallery__slide {
  z-index: 1;
  transform: none;
  transition: opacity 1s cubic-bezier(.2,.7,.2,1), visibility 0s 1s;
}
.gallery.overview .gallery__slide.is-active { z-index: 2; transition: opacity 1s cubic-bezier(.2,.7,.2,1), visibility 0s; }
.gallery.overview .gallery__slide img { transform: scale(1.06); transition: transform 7s linear; }
.gallery.overview .gallery__slide.is-active img { transform: scale(1); }

/* Caption: a frosted deep-green panel so text stays readable on any image */
.gallery.overview .gallery__caption {
  position: absolute;
  inset: auto auto clamp(18px, 3vw, 32px) clamp(18px, 3vw, 32px);
  z-index: 4;
  width: min(30rem, calc(100% - 2 * clamp(18px, 3vw, 32px)));
  max-width: none;
  padding: clamp(20px, 2.4vw, 30px);
  border: 1px solid rgba(255, 255, 255, .14);
  border-radius: 14px;
  background: rgba(15, 38, 28, .78);
  -webkit-backdrop-filter: blur(14px) saturate(1.1);
  backdrop-filter: blur(14px) saturate(1.1);
  color: #fff;
  pointer-events: auto;
}
.gallery.overview .gallery__tag,
.gallery.overview .gallery__title,
.gallery.overview .gallery__desc {
  position: static;
  width: auto;
  inset: auto;
  max-width: none;
  text-shadow: none;
}
.gallery.overview .gallery__tag { margin: 0; color: var(--gallery-gold-soft); font-size: .7rem; font-weight: 600; letter-spacing: .22em; }
.gallery.overview .gallery__title { margin: .7rem 0 .6rem; color: #fff; font: 600 clamp(1.4rem, 2.3vw, 2rem)/1.15 var(--ff-display); letter-spacing: -.02em; }
.gallery.overview .gallery__desc { margin: 0; color: rgba(255, 255, 255, .86); font-size: .92rem; font-weight: 400; line-height: 1.65; }
.gallery.overview .gallery__desc::before { display: none; }

.gallery.overview .gallery__count {
  position: absolute;
  top: clamp(16px, 2.4vw, 26px);
  left: clamp(16px, 2.4vw, 26px);
  z-index: 4;
  margin: 0;
  padding: 8px 14px;
  border-radius: 999px;
  background: rgba(15, 38, 28, .6);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  color: #fff;
  font: 600 1rem/1 var(--ff-display);
  text-shadow: none;
}
.gallery.overview .gallery__count small { color: rgba(255,255,255,.7); font: 400 .8rem var(--ff-body); }
.gallery.overview .gallery__controls {
  position: absolute;
  right: clamp(18px, 3vw, 32px);
  bottom: clamp(18px, 3vw, 32px);
  left: auto;
  z-index: 4;
  gap: .6rem;
}
.gallery.overview .gallery__btn {
  width: 3rem;
  height: 3rem;
  border-color: rgba(255, 255, 255, .7);
  background: rgba(15, 38, 28, .45);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
}
.gallery.overview .gallery__btn:hover { background: rgba(255, 255, 255, .2); }
.gallery.overview .gallery__btn--next { border-color: var(--gallery-gold); background: var(--gallery-gold); }
.gallery.overview .gallery__btn--next:hover { border-color: var(--gallery-gold-soft); background: var(--gallery-gold-soft); }
.gallery.overview .gallery__progress { z-index: 5; height: 3px; }
.gallery.overview .gallery__hint { display: none; }

@media (max-width: 760px) {
  .gallery.overview .gallery__stage { width: 100%; height: clamp(28rem, 128vw, 36rem); max-height: 82svh; border-radius: 14px; }
  .gallery.overview .gallery__caption { left: 14px; right: 14px; bottom: 14px; width: auto; padding: 18px; }
  .gallery.overview .gallery__controls { top: 14px; right: 14px; bottom: auto; }
  .gallery.overview .gallery__count { top: 18px; left: 14px; font-size: .9rem; }
  .gallery.overview .gallery__btn { width: 2.6rem; height: 2.6rem; }
}
@media (prefers-reduced-motion: reduce) {
  .gallery.overview .gallery__slide img { transform: none; transition: none; }
}

/* =====================================================================
   FLOOR PLANS — rounder cards
   ===================================================================== */
.plan-card { border-radius: 18px; }
@media (max-width: 900px) { .plan-card { border-radius: 14px; } }

/* Location map heading ("Closer Than You Think.") — was a hard-coded serif */
.location-section .intro h2 {
  font: 500 clamp(40px, 5.6vw, 80px)/1.04 var(--ff-display);
  letter-spacing: -.035em;
}
@media (max-width: 760px) { .location-section .intro h2 { font-size: clamp(34px, 10vw, 46px); } }
.contact-enquiry-form .bottom button, .enquiry .enq-submit { font-family: var(--ff-body); }
@media (max-width: 600px) {
  /* The bottom-right note collides with the scroll cue on narrow screens */
  .hero-note { display: none; }
  .amen-facts dd { font-size: clamp(1.1rem, 5.4vw, 1.5rem); white-space: normal; letter-spacing: -.01em; }
}

/* =====================================================================
   AMENITIES (original scroll-driven arc) — bug fixes only
   - cards sized to the stage, so they never crowd the heading at any
     window height (incl. fullscreen)
   - no backdrop blur on the moving badges (heavy repaint = choppy motion)
   - the stage never swallows wheel / trackpad scrolling
   ===================================================================== */
@media (min-width: 801px) and (prefers-reduced-motion: no-preference) {
  .amenities--pinned .amen-pin { contain: layout paint; }
  .amenities--pinned .amen-track {
    overscroll-behavior: auto;
    perspective-origin: 50% 46%;
  }
  .amenities--pinned .amen-card {
    top: 46%;
    height: min(78%, 560px);
    backface-visibility: hidden;
  }
  .amenities--pinned .amen-card-num { -webkit-backdrop-filter: none; backdrop-filter: none; }
  .amenities--pinned .amen-end-note { top: 46%; }
}
@media (min-width: 801px) and (max-height: 700px) and (prefers-reduced-motion: no-preference) {
  .amenities--pinned .amen-card { height: min(80%, 340px); }
}

/* =====================================================================
   WHY IT HOLDS — smooth switching (design unchanged)
   ===================================================================== */
.pillar-bg { z-index: 0; transition: opacity .7s ease; will-change: opacity; }
.pillar-bg.was-active { opacity: 1; z-index: 1; }
.pillar-bg.active { opacity: 1; z-index: 2; }
.pillar-visual-overlay { z-index: 3; }
.pillar-big-num, .pillar-big-tag {
  z-index: 4;
  transition: opacity .2s ease, transform .2s ease;
}
.pillar-big-num.is-swapping, .pillar-big-tag.is-swapping { opacity: 0; transform: translateY(6px); }
/* Montserrat's taller numerals: keep the label clear of the big number */
.pillar-big-num { line-height: .9; }
.pillar-big-tag { bottom: calc(22px + 64px + 14px); }
@media (max-width: 900px) {
  .pillar-big-tag { bottom: calc(14px + 36px + 10px); }
}
@media (prefers-reduced-motion: reduce) {
  .pillar-big-num, .pillar-big-tag { transition: none; }
}
/* Keep the gold label readable over bright images (e.g. the white atrium) */
.pillar-big-tag { text-shadow: 0 1px 2px rgba(0, 0, 0, .55), 0 0 14px rgba(0, 0, 0, .45); }
.pillar-big-num { text-shadow: 0 2px 16px rgba(0, 0, 0, .35); }

/* Partner logos — trimmed artwork, shown larger and easier to read */
.logo-marquee-section { padding: clamp(28px, 3.5vw, 44px) 0; }
.logo-marquee-img {
  width: auto;
  height: clamp(84px, 7vw, 124px);
  max-width: 78%;
  object-fit: contain;
  border-radius: 0;
  opacity: 1;
}
@media (max-width: 768px) {
  .logo-marquee-img { height: clamp(64px, 17vw, 96px); max-width: 84%; }
}

/* =====================================================================
   QA FIXES — readability, tap targets and small-screen polish
   ===================================================================== */
/* Dark "The Palms at Silk Gardens" panel: keep the paragraph readable where
   it sits over the bright towers (tablet & phone, non-pinned layout). */
@media (max-width: 800px) {
  .project-feature__visual::before {
    background:
      linear-gradient(90deg, rgba(18,48,36,.96) 0%, rgba(18,48,36,.9) 50%, rgba(18,48,36,.55) 100%),
      linear-gradient(0deg, rgba(18,48,36,.6), transparent 60%) !important;
  }
  .project-feature__copy p { text-shadow: 0 1px 10px rgba(10,28,20,.55); }
}

/* Phones & tablets (any orientation): no label smaller than ~10.5px */
@media (max-width: 900px), (pointer: coarse) {
  .build__eyebrow,
  .project__eyebrow,
  .project-feature__fact dt,
  .project-feature__breadcrumb,
  .project-feature__status,
  .location-section .note,
  .eyebrow-map,
  .unit-preview .small,
  .enquiry .unit-preview .small,
  .enquiry .form-head span,
  .pillar-big-tag,
  .hero-note { font-size: 10.5px !important; letter-spacing: .14em; }
  .project-feature__fact dd small { font-size: 11px; }
  .amen-facts dt { font-size: 10.5px; }
  .plan-zoom-badge, .plan-card .plan-zoom-badge { font-size: 10.5px; }
}

/* Comfortable touch targets (≥ 40px) on touch screens */
@media (hover: none), (pointer: coarse) {
  .sf-col > a { padding-block: 9px; margin-bottom: 2px; }
  .sf-contact .sf-row { min-height: 44px; margin-bottom: 6px; }
  .ccard__link { min-height: 44px; }
  .ccard p a { display: inline-block; padding-block: 8px; }
  .project-feature__contact a { display: inline-block; min-height: 40px; padding-block: 10px; }
  .nav-links a { display: inline-flex; align-items: center; min-height: 44px; }
  .motion-toggle { width: 40px !important; height: 40px !important; }
}

/* Footer: palm icon from The Palms logo replaces the text wordmark. */
.sf-word { text-align: center; }
.sf-word .sf-word__icon {
  width: clamp(150px, 22vw, 320px);
  height: auto;
  margin: 0 auto;
}
.js-reveal-ready .sf-word .sf-word__icon {
  opacity: 0;
  transform: translate3d(0, 60%, 0) scale(.86);
  transform-origin: 50% 100%;
  transition: transform 1.4s cubic-bezier(.16,1,.3,1) .1s, opacity 1s ease .1s;
}
.js-reveal-ready .sf-word.is-visible .sf-word__icon { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  .js-reveal-ready .sf-word .sf-word__icon { opacity: 1; transform: none; transition: none; }
}