/* =====================================================================
   GANGOTREE HOMES — Shared Stylesheet
   Bricolage Grotesque · Gold + Ivory palette
   ===================================================================== */

*,*::before,*::after{ box-sizing: border-box; }
html{ scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }

:root{
  --ivory:       #FFFFFF;   /* pure clean white — main background */
  --cream:       #FAF9F6;   /* the faintest warm white (barely-there) */
  --pearl:       #FFFFFF;   /* pure white cards */
  --sand:        #F2F0EA;   /* whisper of warmth for alt blocks */
  --warm:        #F6F4EF;   /* soft off-white, very light */
  --gold:        #BE9A4E;   /* refined champagne gold (accent only) */
  --gold-deep:   #8F6E2C;   /* deep gold for text */
  --gold-soft:   #D9BE82;   /* soft gold */
  --gold-pale:   #ECE6D8;   /* very light gold-tinted border */
  --gold-glow:   #EBCE89;   /* luminous gold highlight */
  --ink:         #1F1F1D;   /* crisp near-black text */
  --ink-deep:    #141413;   /* deep charcoal (hero overlay) */
  --ink-soft:    #54534D;   /* clean grey body text */
  --ink-mute:    #8E8D85;   /* muted grey */
  --y: clamp(80px, 10vw, 140px);
  --wrap: min(1320px, 92%);
}

body{
  margin: 0; padding: 0;
  font-family: "Bricolage Grotesque", system-ui, -apple-system, sans-serif;
  background: var(--ivory);
  color: var(--ink);
  line-height: 1.55;
  font-weight: 350;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
img{ max-width:100%; height:auto; display:block; }
a{ color: inherit; text-decoration: none; }
button{ font: inherit; cursor: pointer; border: none; background: none; }
::selection{ background: var(--gold); color: var(--pearl); }

.wrap{ width: var(--wrap); margin: 0 auto; }

body::before{
  content:""; position: fixed; inset:0; pointer-events:none; z-index: 1;
  opacity: .015; mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
}

/* ============================================================
   NAVIGATION
   ============================================================ */
.nav{
  position: fixed; top: 20px; left: 50%;
  transform: translateX(-50%);
  z-index: 999;
  width: min(1280px, calc(100% - 32px));
  padding: 12px 16px 12px 24px;
  display: flex; align-items: center; justify-content: space-between; gap: 20px;
  background: rgba(38, 36, 30, 0.28);
  backdrop-filter: blur(20px) saturate(140%);
  -webkit-backdrop-filter: blur(20px) saturate(140%);
  border: 1px solid rgba(255, 255, 255, 0.15);
  border-radius: 999px;
  box-shadow: 0 12px 40px -12px rgba(0, 0, 0, 0.25);
  transition: all .5s cubic-bezier(.7, 0, .2, 1);
}
.nav.is-scrolled{
  background: rgba(251, 248, 242, 0.85);
  border-color: rgba(192, 154, 82, 0.18);
  box-shadow: 0 16px 50px -14px rgba(38, 36, 30, 0.15);
}
.nav__logo{ height: 36px; width: auto; display: block; filter: brightness(0) invert(1); transition: filter .5s ease; }
.nav.is-scrolled .nav__logo{ filter: none; }
.nav__links{ display: flex; align-items: center; gap: clamp(14px, 1.5vw, 26px); list-style: none; padding: 0; margin: 0; }
.nav__links > li > a{
  font-size: 13px; font-weight: 500; letter-spacing: .02em;
  color: rgba(255, 255, 255, 0.88);
  position: relative; padding: 6px 0;
  transition: color .3s ease; white-space: nowrap;
  display:inline-flex; align-items:center;
}
.nav.is-scrolled .nav__links > li > a{ color: var(--ink-soft); }
.nav__links > li > a::after{
  content: ""; position: absolute; left: 0; right: 0; bottom: -2px; height: 1px;
  background: var(--gold-glow); transform: scaleX(0); transform-origin: left;
  transition: transform .4s cubic-bezier(.7, 0, .2, 1);
}
.nav.is-scrolled .nav__links > li > a::after{ background: var(--gold); }
.nav__links > li > a:hover::after{ transform: scaleX(1); }
.nav__links > li > a:hover{ color: #fff; }
.nav.is-scrolled .nav__links > li > a:hover{ color: var(--gold-deep); }
.nav__links a.is-current{ color: var(--gold-glow); }
.nav.is-scrolled .nav__links a.is-current{ color: var(--gold-deep); }

.nav__cta{
  display: inline-flex; align-items: center; gap: 8px;
  padding: 10px 20px; border-radius: 999px;
  background: var(--gold); color: var(--pearl);
  font-size: 12.5px; letter-spacing: .04em; font-weight: 500;
  transition: all .35s ease; white-space: nowrap;
}
.nav__cta:hover{ background: var(--gold-deep); transform: translateY(-1px); box-shadow: 0 12px 24px -10px rgba(192, 154, 82, .5); }
.nav__cta svg{ width: 13px; height: 13px; }

.burger{ display: none; width: 38px; height: 38px; border-radius: 50%; background: var(--gold); color: var(--pearl); align-items: center; justify-content: center; flex-shrink: 0; }
.burger span{ display:block; width:18px; height:1.5px; background: currentColor; position:relative; }
.burger span::before, .burger span::after{ content:""; position:absolute; left:0; right:0; height:1.5px; background: currentColor; transition: transform .35s ease, top .35s ease; }
.burger span::before{ top:-6px; }
.burger span::after{  top: 6px; }
.burger.is-open span{ background: transparent; }
.burger.is-open span::before{ top:0; transform: rotate(45deg); }
.burger.is-open span::after{  top:0; transform: rotate(-45deg); }

.mobile{
  position: fixed; inset: 0; z-index: 998; background: var(--ivory);
  transform: translateY(-100%); transition: transform .6s cubic-bezier(.76,0,.24,1);
  display:flex; flex-direction:column; justify-content:center; align-items:center; padding: 40px;
}
.mobile.is-open{ transform: translateY(0); }
.mobile ul{ list-style:none; padding:0; margin:0; text-align:center; }
.mobile li{ margin: 14px 0; opacity:0; transform: translateY(20px); transition: all .5s ease; }
.mobile.is-open li{ opacity:1; transform: translateY(0); }
.mobile.is-open li:nth-child(1){ transition-delay: .12s; }
.mobile.is-open li:nth-child(2){ transition-delay: .18s; }
.mobile.is-open li:nth-child(3){ transition-delay: .24s; }
.mobile.is-open li:nth-child(4){ transition-delay: .30s; }
.mobile.is-open li:nth-child(5){ transition-delay: .36s; }
.mobile.is-open li:nth-child(6){ transition-delay: .42s; }
.mobile.is-open li:nth-child(7){ transition-delay: .48s; }
.mobile a{ font-style: normal; font-size: clamp(26px, 5.5vw, 40px); font-weight: 400; color: var(--ink); letter-spacing: -.01em; }

.has-drop{ position: relative; }
.has-drop::after{ content:""; position:absolute; top:100%; left:0; width:100%; height:20px; }
.drop{
  position: absolute; top: calc(100% + 14px); left: 50%;
  transform: translateX(-50%) translateY(-8px);
  background: rgba(251,248,242,.96);
  backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
  border: 1px solid var(--gold-pale); border-radius: 12px; padding: 10px 6px; min-width: 210px;
  opacity: 0; visibility: hidden; pointer-events: none;
  transition: all .35s cubic-bezier(.7,0,.2,1);
  box-shadow: 0 24px 60px -16px rgba(38,36,30,.25); z-index: 1000;
}
.drop::before{
  content:""; position: absolute; top: -6px; left: 50%;
  transform: translateX(-50%) rotate(45deg); width: 12px; height: 12px;
  background: rgba(251,248,242,.96);
  border-left: 1px solid var(--gold-pale); border-top: 1px solid var(--gold-pale);
}
.has-drop:hover .drop, .has-drop:focus-within .drop{ opacity: 1; visibility: visible; pointer-events: auto; transform: translateX(-50%) translateY(0); }
.drop a{ display: block; padding: 10px 18px; font-size: 13px; color: var(--ink-soft); border-radius: 8px; transition: all .25s ease; white-space: nowrap; }
.drop a:hover{ background: var(--cream); color: var(--gold-deep); padding-left: 22px; }

/* ============================================================
   SECTIONS + COMMON TYPE
   ============================================================ */
.sec{ width:100%; padding: var(--y) 0; background: var(--ivory); position: relative; }
.sec--cream{ background: var(--cream); }
.sec--warm{  background: var(--warm);  }
.sec--pearl{ background: var(--pearl); }

.eyebrow{ display:inline-flex; align-items:center; gap: 14px; font-size: 11.5px; letter-spacing: .3em; text-transform: uppercase; color: var(--gold-deep); font-weight: 600; margin: 0 0 24px; }
.eyebrow::before{ content:""; width: 36px; height: 1px; background: var(--gold); }
.eyebrow .num{ font-style: normal; font-weight: 400; color: var(--ink); font-size: 14px; }

.title{ font-size: clamp(32px, 4.6vw, 72px); font-weight: 200; line-height: 1.05; letter-spacing: -0.03em; margin: 0 0 28px; max-width: 26ch; color: var(--ink); text-wrap: balance; }
.title em{ font-style: normal; font-weight: 300; background: linear-gradient(135deg, var(--gold), var(--gold-deep)); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.title--center{ margin-left:auto; margin-right:auto; text-align:center; }
.lede{ font-size: clamp(15px, 1.3vw, 17.5px); line-height: 1.7; color: var(--ink-soft); max-width: 56ch; margin: 0 0 48px; }
.lede--center{ margin-left:auto; margin-right:auto; text-align:center; }
.head-center{ text-align:center; margin: 0 auto 56px; max-width: 880px; }
.head-center .eyebrow{ justify-content: center; }
.head-center .eyebrow::before{ display:none; }
.head-center .eyebrow::after{ content:""; width: 36px; height: 1px; background: var(--gold); }

.reveal{ opacity: 0; transform: translateY(50px); transition: opacity 1.1s cubic-bezier(.16,1,.3,1), transform 1.1s cubic-bezier(.16,1,.3,1); animation: forceShow .01s linear 2.4s forwards; }
.reveal.in{ opacity: 1; transform: translateY(0); animation: none; }
@keyframes forceShow{ to{ opacity:1; transform:none; } }
.d1{ transition-delay: .08s; }
.d2{ transition-delay: .16s; }
.d3{ transition-delay: .24s; }
.d4{ transition-delay: .32s; }

/* Buttons */
.btn{ display:inline-flex; align-items:center; gap: 10px; padding: 17px 30px; border-radius: 999px; font-size: 13.5px; letter-spacing: .06em; font-weight: 500; transition: all .4s cubic-bezier(.7,0,.2,1); white-space: nowrap; cursor: pointer; position: relative; overflow: hidden; }
.btn svg{ width:14px; height:14px; transition: transform .4s ease; z-index:2; position:relative; }
.btn:hover svg{ transform: translateX(5px); }
.btn span{ position:relative; z-index:2; }
.btn--gold{ background: var(--gold); color: var(--pearl); box-shadow: 0 8px 24px -8px rgba(192,154,82,.5); }
.btn--gold::before{ content:""; position:absolute; inset:0; background: linear-gradient(135deg, var(--gold-deep), var(--gold)); opacity: 0; transition: opacity .4s ease; }
.btn--gold:hover{ transform: translateY(-2px); box-shadow: 0 14px 32px -10px rgba(192,154,82,.65); }
.btn--gold:hover::before{ opacity: 1; }
.btn--cream{ background: var(--pearl); color: var(--ink); border: 1px solid var(--gold-pale); }
.btn--cream:hover{ background: var(--gold); color: var(--pearl); border-color: var(--gold); transform: translateY(-2px); }
.btn--line{ background: transparent; color: var(--ink); border: 1px solid var(--ink-soft); }
.btn--line:hover{ background: var(--gold); color: var(--pearl); border-color: var(--gold); }
.btn--ghost{ background: transparent; color: var(--pearl); border: 1px solid rgba(251,248,242,.4); }
.btn--ghost:hover{ background: rgba(251,248,242,.1); border-color: var(--pearl); transform: translateY(-2px); }

@keyframes fade{ from{opacity:0;transform:translateY(20px);} to{opacity:1;transform:translateY(0);} }
@keyframes revealUp{ to{opacity:1;transform:translateY(0);} }
@keyframes scrollPulse{ 0%,100%{ transform: scaleY(1); opacity: .8; } 50%{ transform: scaleY(1.5); opacity: 1; } }

/* ============================================================
   HERO (home — video)
   ============================================================ */
.hero{ position: relative; width: 100%; min-height: 100vh; min-height: 100svh; overflow: hidden; background: var(--ink-deep); display: flex; align-items: center; justify-content: center; }
.hero__video{ position: absolute; inset: 0; z-index: 0; overflow: hidden; }
.hero__video iframe{ position: absolute; top: 50%; left: 50%; width: 100vw; height: 56.25vw; min-height: 100%; min-width: 177.77vh; transform: translate(-50%, -50%); pointer-events: none; border: 0; }
.hero__video::after{ content:""; position:absolute; inset:0; background: linear-gradient(180deg, rgba(38,36,30,.55) 0%, rgba(38,36,30,.35) 35%, rgba(38,36,30,.5) 65%, rgba(38,36,30,.85) 100%), linear-gradient(90deg, rgba(38,36,30,.4) 0%, transparent 60%); z-index: 1; }
.hero__inner{ position: relative; z-index: 2; width: var(--wrap); margin: 0 auto; text-align: center; padding: 80px 0 60px; color: var(--pearl); }
.hero__eyebrow{ display:inline-flex; align-items:center; gap:12px; font-size: 11.5px; letter-spacing: .35em; text-transform: uppercase; color: var(--gold-glow); font-weight: 500; margin-bottom: 32px; padding: 12px 22px; border-radius: 999px; border: 1px solid rgba(236,207,140,.35); background: rgba(38,36,30,.4); backdrop-filter: blur(8px); opacity: 0; animation: fade 1s .3s cubic-bezier(.16,1,.3,1) forwards; }
.hero__eyebrow::before, .hero__eyebrow::after{ content:""; width: 24px; height: 1px; background: var(--gold-glow); }
.hero__title{ font-size: clamp(52px, 9.5vw, 140px); font-weight: 300; line-height: .96; letter-spacing: -0.045em; margin: 0 auto 32px; max-width: 15ch; color: #FFFFFF; text-shadow: 0 4px 32px rgba(0,0,0,.25); }
.hero__title em{ font-style: normal; font-weight: 400; color: #F8E8C0; padding-right: 4px; }
.hero__title .w{ display:inline-block; opacity: 0; transform: translateY(60px); animation: revealUp 1.1s cubic-bezier(.76,0,.24,1) forwards; }
.hero__title .w:nth-child(1){ animation-delay: .45s; }
.hero__title .w:nth-child(2){ animation-delay: .58s; }
.hero__title .w:nth-child(3){ animation-delay: .71s; }
.hero__title .w:nth-child(4){ animation-delay: .84s; }
.hero__sub{ font-size: clamp(15px, 1.35vw, 19px); color: rgba(251,248,242,.82); max-width: 56ch; margin: 0 auto 40px; line-height: 1.65; opacity: 0; animation: fade 1s 1.1s cubic-bezier(.16,1,.3,1) forwards; }
.hero__actions{ display:flex; gap: 14px; justify-content:center; flex-wrap: wrap; opacity: 0; animation: fade 1s 1.25s cubic-bezier(.16,1,.3,1) forwards; }
.hero__scroll{ position: absolute; left: 50%; bottom: 30px; transform: translateX(-50%); z-index: 3; font-size: 10.5px; letter-spacing: .35em; text-transform: uppercase; color: rgba(251,248,242,.65); display:flex; flex-direction:column; align-items:center; gap: 12px; opacity: 0; animation: fade 1s 1.5s forwards; }
.hero__scroll::after{ content:""; width:1px; height: 44px; background: linear-gradient(180deg, var(--gold-glow), transparent); animation: scrollPulse 2.4s ease-in-out infinite; }

/* Inner page hero (golden glow) */
.phero{ position: relative; width: 100%; min-height: 84vh; min-height: 84svh; overflow: hidden; background: radial-gradient(ellipse at 78% 22%, rgba(235,206,137,.22), transparent 50%), radial-gradient(ellipse at 18% 82%, rgba(190,154,78,.10), transparent 52%), linear-gradient(180deg, #FFFFFF 0%, var(--warm) 100%); display: flex; align-items: center; justify-content: center; padding: 160px 0 80px; }
/* Header WITH a background image: add class "phero--img" and set --bg to your image */
.phero--img{ background-size:cover; background-position:center; background-repeat:no-repeat; }
.phero--img::after{ content:""; position:absolute; inset:0; z-index:1; pointer-events:none; background:linear-gradient(180deg, rgba(255,255,255,.78) 0%, rgba(255,255,255,.55) 45%, rgba(255,255,255,.80) 100%); }
.phero--img .phero__title{ color: var(--ink); }
/* Dark-image variant: use "phero--img phero--dark" for white text over a darker photo */
.phero--dark{ }
.phero--dark::after{ background:linear-gradient(180deg, rgba(20,20,19,.45) 0%, rgba(20,20,19,.35) 45%, rgba(20,20,19,.7) 100%); }
.phero--dark .phero__title{ color:#fff; }
.phero--dark .phero__sub{ color:rgba(255,255,255,.88); }
.phero--dark .phero__eyebrow{ color:var(--gold-glow); border-color:rgba(235,206,137,.5); background:rgba(20,20,19,.35); }
.phero--dark .phero__title em{ -webkit-text-fill-color:initial; background:none; color:var(--gold-glow); }
.phero::before{ content: ""; position: absolute; inset: 0; pointer-events: none; background-image: linear-gradient(rgba(190,154,78,.05) 1px, transparent 1px), linear-gradient(90deg, rgba(190,154,78,.05) 1px, transparent 1px); background-size: 80px 80px; mask-image: radial-gradient(ellipse at center, black 30%, transparent 80%); }
.phero__inner{ position: relative; z-index: 2; width: var(--wrap); margin: 0 auto; text-align: center; }
.phero__eyebrow{ display: inline-flex; align-items: center; gap: 12px; font-size: 11.5px; letter-spacing: .35em; text-transform: uppercase; color: var(--gold-deep); font-weight: 600; margin-bottom: 32px; padding: 12px 22px; border-radius: 999px; border: 1px solid var(--gold-pale); background: rgba(251,248,242,.8); opacity: 0; animation: fade 1s .3s cubic-bezier(.16,1,.3,1) forwards; }
.phero__eyebrow::before, .phero__eyebrow::after{ content: ""; width: 24px; height: 1px; background: var(--gold); }
.phero__title{ font-size: clamp(42px, 8vw, 118px); font-weight: 300; line-height: 1; letter-spacing: -0.04em; margin: 0 auto 28px; max-width: 18ch; color: var(--ink); }
.phero__title em{ font-style: normal; font-weight: 400; background: linear-gradient(135deg, var(--gold), var(--gold-deep)); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.phero__title .w{ display: inline-block; opacity: 0; transform: translateY(60px); animation: revealUp 1.1s cubic-bezier(.76,0,.24,1) forwards; }
.phero__title .w:nth-child(1){ animation-delay: .5s; }
.phero__title .w:nth-child(2){ animation-delay: .62s; }
.phero__title .w:nth-child(3){ animation-delay: .74s; }
.phero__title .w:nth-child(4){ animation-delay: .86s; }
.phero__title .w:nth-child(5){ animation-delay: .98s; }
.phero__sub{ font-size: clamp(15px, 1.4vw, 19px); color: var(--ink-soft); max-width: 54ch; margin: 0 auto 40px; line-height: 1.6; opacity: 0; animation: fade 1s 1.1s cubic-bezier(.16,1,.3,1) forwards; }
.phero__sub em{ font-style: normal; color: var(--gold-deep); }
.phero__metrics{ display: inline-flex; gap: 0; flex-wrap: wrap; border: 1px solid var(--gold-pale); border-radius: 999px; background: rgba(251,248,242,.7); overflow: hidden; opacity: 0; animation: fade 1s 1.25s cubic-bezier(.16,1,.3,1) forwards; }
.phero__metric{ padding: 16px 28px; border-right: 1px solid var(--gold-pale); display: flex; flex-direction: column; align-items: center; gap: 2px; }
.phero__metric:last-child{ border-right: none; }
.phero__metric b{ font-size: 26px; font-weight: 300; letter-spacing: -.02em; background: linear-gradient(135deg, var(--gold), var(--gold-deep)); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.phero__metric span{ font-size: 10px; letter-spacing: .2em; text-transform: uppercase; color: var(--ink-mute); font-weight: 600; }

/* ============================================================
   MARQUEE
   ============================================================ */
.marquee{ background: linear-gradient(90deg, var(--gold-deep), var(--gold), var(--gold-deep)); padding: 18px 0; overflow: hidden; position: relative; }
.marquee__track{ display:flex; gap: 64px; white-space: nowrap; animation: scroll 38s linear infinite; width: max-content; }
.marquee__item{ font-size: 13.5px; letter-spacing: .3em; text-transform: uppercase; color: #FFF6E1; display:inline-flex; align-items:center; gap: 64px; font-weight: 500; }
.marquee__item .star{ font-size: 16px; color: #F8E8C0; opacity: .95; }
@keyframes scroll{ from{transform:translateX(0);} to{transform:translateX(-50%);} }

/* ============================================================
   IMAGE BOX (named-slot pattern)
   ============================================================ */
.imgbox{ background: var(--cream); position: relative; overflow: hidden; }
.imgbox img{ width:100%; height:100%; object-fit: cover; }

/* ============================================================
   STATS / MILESTONES
   ============================================================ */
.stats{ display:grid; grid-template-columns: repeat(4, 1fr); gap: 0; background: var(--pearl); border-radius: 8px; overflow: hidden; box-shadow: 0 50px 100px -40px rgba(38,36,30,.28); border: 1px solid var(--gold-pale); position: relative; }
.stats::before{ content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 0% 0%, rgba(236,207,140,.18), transparent 35%), radial-gradient(circle at 100% 100%, rgba(192,154,82,.15), transparent 40%); pointer-events: none; }
.stat{ padding: 56px 32px 48px; border-right: 1px solid var(--gold-pale); transition: background .55s ease; position: relative; overflow: hidden; z-index: 1; }
.stat::before{ content:""; position: absolute; left:0; right:0; bottom: 0; height: 3px; background: linear-gradient(90deg, var(--gold-glow), var(--gold), var(--gold-deep)); transform: scaleX(0); transform-origin: left; transition: transform .7s cubic-bezier(.7,0,.2,1); }
.stat:hover::before{ transform: scaleX(1); }
.stat:last-child{ border-right: none; }
.stat:hover{ background: linear-gradient(180deg, var(--cream) 0%, var(--pearl) 100%); }
.stat__num{ font-weight: 200; font-size: clamp(56px, 7vw, 108px); line-height: 1; letter-spacing: -.05em; display: flex; align-items: baseline; gap: 6px; background: linear-gradient(180deg, var(--ink) 0%, var(--ink-soft) 100%); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.stat__num .plus{ background: linear-gradient(135deg, var(--gold-glow), var(--gold-deep)); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; font-size: .55em; font-weight: 300; }
.stat__label{ margin-top: 20px; font-style: normal; font-size: 19px; color: var(--ink); line-height: 1.3; font-weight: 400; }
.stat__sub{ margin-top: 8px; font-size: 11px; letter-spacing: .22em; text-transform: uppercase; color: var(--ink-mute); font-weight: 600; }

/* ============================================================
   PROJECT GRID + CARDS
   ============================================================ */
.projects{ display:grid; grid-template-columns: repeat(3, 1fr); gap: 28px; }
.proj{ background: var(--pearl); border: 1px solid var(--gold-pale); border-radius: 8px; overflow: hidden; transition: all .55s cubic-bezier(.7,0,.2,1); display: flex; flex-direction: column; }
.proj.is-hidden{ display: none; }
.proj:hover{ transform: translateY(-8px); box-shadow: 0 50px 90px -30px rgba(38,36,30,.25); border-color: var(--gold); }
.proj__media{ aspect-ratio: 3/4; overflow: hidden; background: var(--cream); position: relative; }
.proj__media img{ width:100%; height:100%; object-fit: cover; transition: transform 1.1s cubic-bezier(.7,0,.2,1); }
.proj:hover .proj__media img{ transform: scale(1.08); }
.proj__tag{ position: absolute; top: 18px; left: 18px; background: var(--gold); color: var(--pearl); font-size: 10px; letter-spacing: .2em; text-transform: uppercase; padding: 7px 14px; border-radius: 999px; z-index: 2; font-weight: 600; box-shadow: 0 8px 16px -6px rgba(192,154,82,.5); }
.proj__tag--new{ background: var(--ink); }
.proj__tag--commercial{ background: var(--gold-deep); }
.proj__info{ padding: 26px 26px 28px; display: flex; flex-direction: column; flex-grow: 1; }
.proj__count{ font-style: normal; font-size: 12.5px; color: var(--gold-deep); margin-bottom: 8px; display:flex; align-items:center; gap:10px; }
.proj__count::before{ content:""; width: 22px; height: 1px; background: var(--gold); }
.proj__name{ font-weight: 400; font-size: 26px; letter-spacing: -.02em; margin: 0 0 6px; transition: color .3s ease; color: var(--ink); }
.proj:hover .proj__name{ color: var(--gold-deep); }
.proj__loc{ font-size: 13.5px; color: var(--ink-mute); margin-bottom: 18px; }
.proj__foot{ margin-top: auto; padding-top: 18px; border-top: 1px solid var(--gold-pale); display: flex; align-items: center; justify-content: space-between; }
.proj__config{ font-size: 12px; color: var(--ink-soft); font-weight: 500; }
.proj__arrow{ width: 30px; height: 30px; border-radius: 50%; border: 1px solid var(--gold-pale); display: flex; align-items: center; justify-content: center; color: var(--gold-deep); transition: all .4s ease; }
.proj:hover .proj__arrow{ background: var(--gold); color: var(--pearl); border-color: var(--gold); transform: rotate(-45deg); }
.proj__arrow svg{ width: 13px; height: 13px; }

/* Filter bar */
.filterbar{ display: flex; justify-content: center; gap: 8px; flex-wrap: wrap; margin-bottom: 56px; }
.filter{ padding: 11px 22px; border-radius: 999px; font-size: 12.5px; letter-spacing: .04em; font-weight: 500; color: var(--ink-soft); background: var(--pearl); border: 1px solid var(--gold-pale); transition: all .35s ease; cursor: pointer; }
.filter:hover{ border-color: var(--gold); color: var(--gold-deep); }
.filter.is-active{ background: var(--gold); color: var(--pearl); border-color: var(--gold); box-shadow: 0 10px 22px -10px rgba(192,154,82,.5); }
.filter b{ font-weight: 500; opacity: .6; margin-left: 4px; }

/* Featured */
.featured{ display: grid; grid-template-columns: 1fr 1fr; gap: 0; background: var(--pearl); border: 1px solid var(--gold-pale); border-radius: 10px; overflow: hidden; box-shadow: 0 50px 100px -40px rgba(38,36,30,.25); }
.featured__media{ position: relative; aspect-ratio: 4/5; overflow: hidden; background: var(--cream); }
.featured__media img{ width:100%; height:100%; object-fit: cover; transition: transform 1.6s cubic-bezier(.7,0,.2,1); }
.featured:hover .featured__media img{ transform: scale(1.05); }
.featured__badge{ position: absolute; top: 24px; left: 24px; background: var(--gold); color: var(--pearl); font-size: 10px; letter-spacing: .22em; text-transform: uppercase; padding: 8px 16px; border-radius: 999px; z-index: 2; font-weight: 600; box-shadow: 0 10px 22px -8px rgba(192,154,82,.5); }
.featured__body{ padding: clamp(40px, 5vw, 72px); display: flex; flex-direction: column; justify-content: center; }
.featured__eyebrow{ font-size: 11px; letter-spacing: .3em; text-transform: uppercase; color: var(--gold-deep); font-weight: 600; margin-bottom: 20px; display: flex; align-items: center; gap: 12px; }
.featured__eyebrow::before{ content:""; width: 28px; height: 1px; background: var(--gold); }
.featured__name{ font-size: clamp(36px, 4.5vw, 64px); font-weight: 300; letter-spacing: -.03em; line-height: 1; margin: 0 0 12px; color: var(--ink); }
.featured__name em{ font-style: normal; background: linear-gradient(135deg, var(--gold), var(--gold-deep)); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.featured__loc{ font-size: 14px; color: var(--ink-mute); margin-bottom: 28px; display: flex; align-items: center; gap: 10px; }
.featured__loc svg{ width: 15px; height: 15px; color: var(--gold); }
.featured__desc{ font-size: 15.5px; line-height: 1.7; color: var(--ink-soft); margin: 0 0 32px; max-width: 48ch; }
.featured__specs{ display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; margin-bottom: 36px; border-top: 1px solid var(--gold-pale); border-bottom: 1px solid var(--gold-pale); }
.featured__spec{ padding: 20px 16px 20px 0; }
.featured__spec b{ display: block; font-size: 22px; font-weight: 300; letter-spacing: -.02em; color: var(--ink); margin-bottom: 4px; }
.featured__spec span{ font-size: 10.5px; letter-spacing: .18em; text-transform: uppercase; color: var(--ink-mute); font-weight: 600; }

/* ============================================================
   VERTICALS (typography-led)
   ============================================================ */
.verticals{ display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; border-top: 1px solid var(--gold-pale); border-bottom: 1px solid var(--gold-pale); background: var(--pearl); border-radius: 8px; overflow: hidden; box-shadow: 0 50px 100px -40px rgba(38,36,30,.22); position: relative; }
.verticals::before{ content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 50% 0%, rgba(236,207,140,.12), transparent 50%); pointer-events: none; }
.vert{ position: relative; padding: 56px 32px 48px; border-right: 1px solid var(--gold-pale); background: transparent; transition: all .6s cubic-bezier(.7,0,.2,1); overflow: hidden; display: flex; flex-direction: column; min-height: 380px; z-index: 1; cursor: pointer; }
.vert:last-child{ border-right: none; }
.vert::before{ content: ""; position: absolute; top: 0; left: 0; right: 0; height: 100%; background: linear-gradient(180deg, var(--cream) 0%, var(--pearl) 100%); opacity: 0; transition: opacity .6s cubic-bezier(.7,0,.2,1); z-index: -1; }
.vert:hover::before{ opacity: 1; }
.vert__bignum{ font-size: clamp(70px, 8vw, 120px); font-weight: 200; line-height: 1; letter-spacing: -.06em; background: linear-gradient(135deg, var(--gold-glow) 0%, var(--gold-deep) 100%); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; margin: 0 0 24px; display: inline-block; transition: transform .6s cubic-bezier(.7,0,.2,1); }
.vert:hover .vert__bignum{ transform: translateY(-4px) scale(1.04); }
.vert__num{ font-style: normal; font-size: 13px; color: var(--gold-deep); letter-spacing: .04em; margin-bottom: 10px; display: flex; align-items: center; gap: 10px; }
.vert__num::before{ content: ""; width: 24px; height: 1px; background: var(--gold); transition: width .5s ease; }
.vert:hover .vert__num::before{ width: 36px; }
.vert__title{ font-weight: 400; font-size: clamp(24px, 2.6vw, 34px); line-height: 1.1; letter-spacing: -.025em; margin: 0 0 16px; color: var(--ink); transition: color .4s ease; }
.vert:hover .vert__title{ color: var(--gold-deep); }
.vert__desc{ font-size: 14.5px; line-height: 1.65; color: var(--ink-soft); margin: 0 0 28px; flex-grow: 1; }
.vert__link{ display: inline-flex; align-items: center; gap: 10px; font-size: 11px; letter-spacing: .25em; text-transform: uppercase; color: var(--gold-deep); font-weight: 600; align-self: flex-start; padding-bottom: 4px; border-bottom: 1px solid transparent; transition: all .4s ease; }
.vert:hover .vert__link{ border-bottom-color: var(--gold); padding-bottom: 8px; }
.vert__link svg{ width: 13px; height: 13px; transition: transform .4s ease; }
.vert:hover .vert__link svg{ transform: translateX(8px); }

/* ============================================================
   COUNTRYSIDE CARDS
   ============================================================ */
.country{ display:grid; grid-template-columns: repeat(4, 1fr); gap: 22px; }
.country-card{ position: relative; overflow: hidden; border-radius: 6px; cursor: pointer; background: var(--pearl); border: 1px solid var(--gold-pale); box-shadow: 0 30px 60px -30px rgba(38,36,30,.18); transition: all .55s cubic-bezier(.7,0,.2,1); display: flex; flex-direction: column; }
.country-card:hover{ transform: translateY(-8px); box-shadow: 0 50px 90px -30px rgba(38,36,30,.28); border-color: var(--gold); }
.country-card__media{ width: 100%; aspect-ratio: 3/4; overflow: hidden; position: relative; background: var(--cream); }
.country-card__media img{ width:100%; height:100%; object-fit: cover; transition: transform 1.4s cubic-bezier(.7,0,.2,1); }
.country-card:hover .country-card__media img{ transform: scale(1.06); }
.country-card__content{ padding: 24px 26px 28px; background: var(--pearl); border-top: 1px solid var(--gold-pale); }
.country-card__tag{ font-style: normal; font-size: 12.5px; color: var(--gold-deep); margin-bottom: 8px; display: flex; align-items: center; gap: 10px; }
.country-card__tag::before{ content: ""; width: 22px; height: 1px; background: var(--gold); transition: width .4s ease; }
.country-card:hover .country-card__tag::before{ width: 36px; }
.country-card__name{ font-weight: 400; font-size: clamp(22px, 2.2vw, 28px); letter-spacing: -.02em; line-height: 1.15; margin: 0 0 4px; color: var(--ink); transition: color .35s ease; }
.country-card:hover .country-card__name{ color: var(--gold-deep); }
.country-card__sub{ font-size: 13px; color: var(--ink-mute); margin-top: 4px; }

/* ============================================================
   VALUES
   ============================================================ */
.values{ display:grid; grid-template-columns: repeat(3, 1fr); gap: 0; border: 1px solid var(--gold-pale); border-radius: 6px; overflow: hidden; background: var(--pearl); box-shadow: 0 40px 80px -40px rgba(38,36,30,.18); }
.value{ padding: 56px 40px; border-right: 1px solid var(--gold-pale); transition: background .5s ease; position: relative; }
.value:last-child{ border-right: none; }
.value:hover{ background: var(--cream); }
.value__num{ font-style: normal; font-size: 12.5px; color: var(--gold-deep); margin-bottom: 12px; display: flex; align-items: center; gap: 10px; }
.value__num::before{ content: ""; width: 22px; height: 1px; background: var(--gold); }
.value__icon{ width: 64px; height: 64px; display:flex; align-items:center; justify-content:center; border: 1.5px solid var(--gold); border-radius: 50%; margin-bottom: 28px; color: var(--gold-deep); transition: all .55s ease; }
.value:hover .value__icon{ background: linear-gradient(135deg, var(--gold), var(--gold-deep)); color: var(--pearl); border-color: var(--gold); transform: rotate(360deg) scale(1.05); box-shadow: 0 14px 28px -10px rgba(192,154,82,.5); }
.value__icon svg{ width: 26px; height: 26px; }
.value h3{ font-weight: 500; font-size: 28px; letter-spacing: -.02em; margin: 0 0 16px; }
.value p{ color: var(--ink-soft); font-size: 15px; line-height: 1.7; margin: 0; }

/* ============================================================
   QUOTE
   ============================================================ */
.quote{ background: var(--pearl); padding: clamp(80px, 12vw, 140px) 0; text-align: center; border-top: 1px solid var(--gold-pale); border-bottom: 1px solid var(--gold-pale); position: relative; }
.quote::before, .quote::after{ content:""; position:absolute; left: 50%; transform: translateX(-50%); width: 1px; height: 60px; background: linear-gradient(180deg, var(--gold), transparent); }
.quote::before{ top: 0; }
.quote::after{ bottom: 0; background: linear-gradient(0deg, var(--gold), transparent); }
.quote__mark{ font-style: normal; font-size: clamp(80px, 11vw, 150px); line-height: .7; color: var(--gold); opacity: .5; display:block; margin-bottom: 12px; }
.quote__text{ font-size: clamp(24px, 3.4vw, 48px); line-height: 1.25; font-weight: 300; letter-spacing: -.025em; max-width: 22ch; margin: 0 auto 28px; color: var(--ink); }
.quote__text em{ font-style: normal; color: var(--gold-deep); }
.quote__attr{ font-size: 11.5px; letter-spacing: .35em; text-transform: uppercase; color: var(--gold-deep); font-weight: 600; }

/* ============================================================
   PROCESS
   ============================================================ */
.process{ display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; background: var(--pearl); border: 1px solid var(--gold-pale); border-radius: 8px; overflow: hidden; box-shadow: 0 40px 80px -40px rgba(38,36,30,.18); }
.step{ padding: 48px 32px; border-right: 1px solid var(--gold-pale); transition: background .5s ease; position: relative; }
.step:last-child{ border-right: none; }
.step:hover{ background: var(--cream); }
.step__num{ font-size: clamp(40px, 4.5vw, 60px); font-weight: 200; letter-spacing: -.05em; line-height: 1; background: linear-gradient(135deg, var(--gold-glow), var(--gold-deep)); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; margin-bottom: 20px; }
.step__title{ font-size: 19px; font-weight: 500; letter-spacing: -.01em; margin: 0 0 10px; color: var(--ink); }
.step__body{ font-size: 13.5px; line-height: 1.6; color: var(--ink-soft); margin: 0; }

/* ============================================================
   TEASER
   ============================================================ */
.teaser{ position: relative; border-radius: 10px; overflow: hidden; min-height: 360px; display: flex; align-items: center; background: var(--cream); }
.teaser__media{ position: absolute; inset: 0; }
.teaser__media img{ width:100%; height:100%; object-fit: cover; }
.teaser__media::after{ content:""; position:absolute; inset:0; background: linear-gradient(90deg, rgba(38,36,30,.85) 0%, rgba(38,36,30,.4) 60%, transparent 100%); }
.teaser__body{ position: relative; z-index: 2; padding: clamp(40px, 6vw, 80px); max-width: 560px; color: var(--pearl); }
.teaser__eyebrow{ font-size: 11px; letter-spacing: .3em; text-transform: uppercase; color: var(--gold-glow); font-weight: 600; margin-bottom: 18px; }
.teaser__title{ font-size: clamp(28px, 3.5vw, 48px); font-weight: 300; letter-spacing: -.03em; line-height: 1.05; margin: 0 0 20px; }
.teaser__title em{ font-style: normal; color: var(--gold-glow); }
.teaser__text{ font-size: 15px; line-height: 1.65; color: rgba(251,248,242,.85); margin: 0 0 28px; }

/* ============================================================
   CONTACT FORM
   ============================================================ */
.contactgrid{ display: grid; grid-template-columns: 0.9fr 1.1fr; gap: clamp(40px, 6vw, 80px); align-items: start; }
.contactinfo__item{ padding: 26px 0; border-top: 1px solid var(--gold-pale); }
.contactinfo__item:last-child{ border-bottom: 1px solid var(--gold-pale); }
.contactinfo__label{ font-size: 11px; letter-spacing: .25em; text-transform: uppercase; color: var(--gold-deep); font-weight: 600; margin-bottom: 10px; }
.contactinfo__value{ font-size: 17px; color: var(--ink); line-height: 1.5; }
.contactinfo__value a{ color: var(--ink); transition: color .3s ease; }
.contactinfo__value a:hover{ color: var(--gold-deep); }
.form{ background: var(--pearl); border: 1px solid var(--gold-pale); border-radius: 10px; padding: clamp(32px, 4vw, 56px); box-shadow: 0 40px 80px -40px rgba(38,36,30,.2); }
.form__row{ display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.field{ margin-bottom: 22px; }
.field label{ display: block; font-size: 11px; letter-spacing: .15em; text-transform: uppercase; color: var(--ink-soft); font-weight: 600; margin-bottom: 8px; }
.field input, .field select, .field textarea{ width: 100%; padding: 14px 16px; border: 1px solid var(--gold-pale); border-radius: 8px; background: var(--ivory); font-family: inherit; font-size: 15px; color: var(--ink); transition: all .3s ease; }
.field input:focus, .field select:focus, .field textarea:focus{ outline: none; border-color: var(--gold); box-shadow: 0 0 0 3px rgba(192,154,82,.12); background: var(--pearl); }
.field textarea{ min-height: 130px; resize: vertical; }
.form__note{ font-size: 12px; color: var(--ink-mute); margin: 8px 0 22px; line-height: 1.5; }
.form button{ width: 100%; }

/* ============================================================
   CTA + FOOTER
   ============================================================ */
.cta-end{ background: radial-gradient(ellipse at center top, rgba(235,206,137,.22), transparent 58%), radial-gradient(ellipse at 20% 80%, rgba(190,154,78,.10), transparent 52%), linear-gradient(180deg, #FFFFFF 0%, var(--warm) 100%); padding: clamp(100px, 14vw, 180px) 0; text-align: center; position: relative; overflow: hidden; border-top: 1px solid var(--gold-pale); }
.cta-end::before{ content:""; position:absolute; inset:0; pointer-events:none; background-image: linear-gradient(rgba(190,154,78,.05) 1px, transparent 1px), linear-gradient(90deg, rgba(190,154,78,.05) 1px, transparent 1px); background-size: 60px 60px; mask-image: radial-gradient(ellipse at center, black 30%, transparent 75%); }
.cta-end__inner{ position: relative; z-index:2; max-width: 900px; margin: 0 auto; padding: 0 24px; }
.cta-end__eyebrow{ font-size: 11.5px; letter-spacing: .35em; text-transform: uppercase; color: var(--gold-deep); margin-bottom: 28px; font-weight: 600; }
.cta-end__title{ font-weight: 200; font-size: clamp(36px, 6vw, 84px); line-height: 1.05; letter-spacing: -.035em; margin: 0 0 40px; color: var(--ink); }
.cta-end__title em{ font-style: normal; background: linear-gradient(135deg, var(--gold), var(--gold-deep)); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.cta-end__actions{ display:flex; gap: 16px; justify-content:center; flex-wrap: wrap; }

.footer{ background: var(--pearl); border-top: 1px solid var(--gold-pale); padding: 80px 0 32px; }
.footer__inner{ width: var(--wrap); margin: 0 auto; }
.footer__top{ display:grid; grid-template-columns: 1.5fr 1fr 1fr 1.2fr; gap: 48px; padding-bottom: 56px; border-bottom: 1px solid var(--gold-pale); }
.footer__brand img{ height: 52px; width: auto; }
.footer__brand p{ margin-top: 20px; color: var(--ink-soft); font-size: 14.5px; line-height: 1.7; max-width: 36ch; }
.footer__col h4{ font-size: 11px; letter-spacing: .28em; text-transform: uppercase; color: var(--gold-deep); font-weight: 600; margin: 0 0 22px; }
.footer__col ul{ list-style:none; padding:0; margin:0; }
.footer__col li{ margin-bottom: 12px; }
.footer__col a{ font-size: 14.5px; color: var(--ink-soft); transition: color .3s ease, padding-left .3s ease; display:inline-block; }
.footer__col a:hover{ color: var(--gold-deep); padding-left: 6px; }
.footer__col .meta{ font-size: 14px; color: var(--ink-soft); line-height: 1.7; margin-bottom: 8px; }
.footer__col .meta strong{ color: var(--ink); font-weight: 500; }
.footer__bottom{ padding-top: 32px; display:flex; align-items:center; justify-content:space-between; flex-wrap: wrap; gap: 16px; }
.footer__bottom p{ font-size: 13px; color: var(--ink-mute); margin: 0; }
.footer__socials{ display:flex; gap: 12px; }
.footer__socials a{ width: 38px; height: 38px; border-radius: 50%; display:flex; align-items:center; justify-content:center; border: 1px solid var(--gold-pale); color: var(--ink-soft); transition: all .35s ease; }
.footer__socials a:hover{ background: var(--gold); color: var(--pearl); border-color: var(--gold); transform: translateY(-2px); }
.footer__socials svg{ width: 15px; height: 15px; }

/* ============================================================
   SINGLE PROJECT PAGE
   ============================================================ */
.projhero{ position: relative; width: 100%; min-height: 80vh; overflow: hidden; display: flex; align-items: flex-end; background: var(--ink-deep); }
.projhero__media{ position: absolute; inset: 0; }
.projhero__media img{ width: 100%; height: 100%; object-fit: cover; }
.projhero__media::after{ content:""; position:absolute; inset:0; background: linear-gradient(180deg, rgba(38,36,30,.3) 0%, transparent 40%, rgba(38,36,30,.85) 100%); }
.projhero__inner{ position: relative; z-index: 2; width: var(--wrap); margin: 0 auto; padding: 0 0 80px; color: var(--pearl); }
.projhero__tag{ display:inline-block; background: var(--gold); color: var(--pearl); font-size: 10px; letter-spacing: .22em; text-transform: uppercase; padding: 8px 16px; border-radius: 999px; margin-bottom: 20px; font-weight: 600; }
.projhero__name{ font-size: clamp(44px, 8vw, 110px); font-weight: 300; line-height: 1; letter-spacing: -.04em; margin: 0 0 16px; }
.projhero__name em{ font-style: normal; color: var(--gold-glow); }
.projhero__loc{ font-size: 16px; color: rgba(251,248,242,.85); display: flex; align-items: center; gap: 10px; }
.projhero__loc svg{ width: 17px; height: 17px; color: var(--gold-glow); }

.projspecs{ display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; background: var(--pearl); border: 1px solid var(--gold-pale); border-radius: 8px; overflow: hidden; box-shadow: 0 40px 80px -40px rgba(38,36,30,.18); }
.projspec{ padding: 40px 28px; border-right: 1px solid var(--gold-pale); transition: background .4s ease; }
.projspec:last-child{ border-right: none; }
.projspec:hover{ background: var(--cream); }
.projspec b{ display:block; font-size: clamp(28px, 3vw, 40px); font-weight: 300; letter-spacing: -.02em; color: var(--ink); margin-bottom: 6px; }
.projspec span{ font-size: 11px; letter-spacing: .18em; text-transform: uppercase; color: var(--ink-mute); font-weight: 600; }

.projbody{ display: grid; grid-template-columns: 1fr 1fr; gap: clamp(40px, 6vw, 90px); align-items: start; }
.projbody__text h2{ font-size: clamp(28px, 3.5vw, 48px); font-weight: 300; letter-spacing: -.03em; line-height: 1.1; margin: 0 0 24px; color: var(--ink); }
.projbody__text h2 em{ font-style: normal; color: var(--gold-deep); }
.projbody__text p{ font-size: 16px; line-height: 1.75; color: var(--ink-soft); margin: 0 0 20px; }
.projbody__feats{ list-style:none; padding:0; margin: 28px 0 0; }
.projbody__feats li{ padding: 14px 0; border-top: 1px solid var(--gold-pale); display: flex; align-items: center; gap: 14px; font-size: 15px; color: var(--ink); }
.projbody__feats li:last-child{ border-bottom: 1px solid var(--gold-pale); }
.projbody__feats li svg{ width: 18px; height: 18px; color: var(--gold); flex-shrink: 0; }

.gallery{ display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.gallery__item{ aspect-ratio: 3/4; border-radius: 6px; overflow: hidden; background: var(--cream); border: 1px solid var(--gold-pale); }
.gallery__item img{ width:100%; height:100%; object-fit: cover; transition: transform 1.1s cubic-bezier(.7,0,.2,1); }
.gallery__item:hover img{ transform: scale(1.06); }
.gallery__item--wide{ grid-column: span 2; aspect-ratio: 16/10; }

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width: 1100px){
  .nav__links{ display: none; }
  .burger{ display: flex; }
  .nav__cta{ display: none; }
  .nav__logo{ height: 32px; }
  .stats{ grid-template-columns: repeat(2, 1fr); }
  .stat:nth-child(2){ border-right: none; }
  .verticals{ grid-template-columns: repeat(2, 1fr); }
  .projects{ grid-template-columns: repeat(2, 1fr); }
  .country{ grid-template-columns: 1fr; max-width: 520px; margin: 0 auto; }
  .values{ grid-template-columns: 1fr; }
  .value{ border-right: none; border-bottom: 1px solid var(--gold-pale); }
  .value:last-child{ border-bottom: none; }
  .featured{ grid-template-columns: 1fr; }
  .featured__media{ aspect-ratio: 16/10; }
  .process{ grid-template-columns: repeat(2, 1fr); }
  .step:nth-child(2){ border-right: none; }
  .step{ border-bottom: 1px solid var(--gold-pale); }
  .contactgrid{ grid-template-columns: 1fr; }
  .projspecs{ grid-template-columns: repeat(2, 1fr); }
  .projspec:nth-child(2){ border-right: none; }
  .projbody{ grid-template-columns: 1fr; }
  .footer__top{ grid-template-columns: 1fr 1fr; }
}
@media (max-width: 640px){
  :root{ --y: 70px; }
  .nav{ padding: 10px 12px 10px 18px; top: 12px; width: calc(100% - 24px); }
  .nav__logo{ height: 30px; }
  .hero__scroll{ display: none; }
  .stats{ grid-template-columns: 1fr; }
  .stat{ border-right: none; padding: 36px 26px; }
  .verticals{ grid-template-columns: 1fr; }
  .vert{ border-right: none; border-bottom: 1px solid var(--gold-pale); min-height: auto; }
  .projects{ grid-template-columns: 1fr; }
  .process{ grid-template-columns: 1fr; }
  .step{ border-right: none; }
  .form__row{ grid-template-columns: 1fr; }
  .projspecs{ grid-template-columns: 1fr; }
  .projspec{ border-right: none; border-bottom: 1px solid var(--gold-pale); }
  .gallery{ grid-template-columns: 1fr; }
  .gallery__item--wide{ grid-column: span 1; }
  .footer__top{ grid-template-columns: 1fr; }
  .footer__bottom{ justify-content: center; text-align:center; }
}
@media (hover: none){
  .proj:hover, .country-card:hover, .vert:hover, .featured:hover .featured__media img{ transform: none; }
}
@media (prefers-reduced-motion: reduce){
  *, *::before, *::after{ animation-duration: .01ms !important; transition-duration: .01ms !important; }
  .reveal{ opacity:1; transform: none; }
}

/* =====================================================================
   HI5 SUMMARY (homepage) — five sections under one heading
   ===================================================================== */
.hi5sum{
  background:
    radial-gradient(ellipse at 85% 12%, rgba(235,206,137,.16), transparent 52%),
    radial-gradient(ellipse at 12% 88%, rgba(190,154,78,.08), transparent 52%),
    linear-gradient(180deg, #FFFFFF 0%, var(--warm) 100%);
  padding: var(--y) 0; position: relative; overflow: hidden;
}
.hi5sum::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background-image:
    linear-gradient(rgba(190,154,78,.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(190,154,78,.045) 1px, transparent 1px);
  background-size: 84px 84px;
  mask-image: radial-gradient(ellipse at center, black 25%, transparent 78%);
}
.hi5sum__head{ text-align:center; max-width: 740px; margin: 0 auto 18px; position: relative; z-index:2; }
.hi5sum__tag{ display:inline-flex; align-items:center; gap:12px; font-size:11px; letter-spacing:.35em; text-transform:uppercase; color:var(--gold-deep); font-weight:600; margin-bottom:26px; }
.hi5sum__tag::before, .hi5sum__tag::after{ content:""; width:30px; height:1px; background:var(--gold); }
.hi5sum__hash{
  font-size: clamp(34px, 6vw, 84px); font-weight: 300; letter-spacing: -.04em;
  margin: 0 0 22px; line-height: 1.02; color: var(--ink);
  word-break: keep-all;
}
.hi5sum__hash .h{ color: var(--gold); font-weight: 400; }
.hi5sum__hash .e{ background: linear-gradient(135deg, var(--gold), var(--gold-deep)); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; font-weight: 400; }
.hi5sum__lede{ font-size: clamp(15px,1.3vw,18px); line-height: 1.7; color: var(--ink-soft); max-width: 52ch; margin: 0 auto; }
.hi5sum__lede em{ font-style: normal; color: var(--gold-deep); }

/* the five rows */
.hi5rows{ max-width: 1080px; margin: 64px auto 0; position: relative; z-index: 2; }
.hi5row{
  display: grid; grid-template-columns: 56px 1fr 1.5fr; gap: clamp(20px,3vw,52px);
  align-items: center;
  padding: 36px 32px;
  border: 1px solid var(--gold-pale);
  border-radius: 12px;
  background: rgba(251,248,242,.55);
  margin-bottom: 16px;
  transition: all .5s cubic-bezier(.7,0,.2,1);
  position: relative; overflow: hidden;
}
.hi5row::before{
  content:""; position:absolute; left:0; top:0; bottom:0; width:3px;
  background: linear-gradient(180deg, var(--gold-glow), var(--gold-deep));
  transform: scaleY(0); transform-origin: top;
  transition: transform .6s cubic-bezier(.7,0,.2,1);
}
.hi5row:hover{
  background: var(--pearl);
  border-color: var(--gold);
  transform: translateX(6px);
  box-shadow: 0 30px 70px -34px rgba(38,36,30,.28);
}
.hi5row:hover::before{ transform: scaleY(1); }
.hi5row__icon{
  width: 56px; height: 56px; border-radius: 50%;
  border: 1.5px solid var(--gold);
  display:flex; align-items:center; justify-content:center;
  color: var(--gold-deep);
  transition: all .55s cubic-bezier(.7,0,.2,1);
  flex-shrink: 0;
}
.hi5row:hover .hi5row__icon{
  background: linear-gradient(135deg, var(--gold), var(--gold-deep));
  color: var(--pearl); transform: rotate(360deg);
  box-shadow: 0 12px 26px -10px rgba(192,154,82,.55);
}
.hi5row__icon svg{ width: 24px; height: 24px; }
.hi5row__head{}
.hi5row__layer{ font-size: 10.5px; letter-spacing: .24em; text-transform: uppercase; color: var(--gold-deep); font-weight: 600; margin-bottom: 8px; }
.hi5row__name{ font-size: clamp(20px,2.1vw,28px); font-weight: 400; letter-spacing: -.02em; color: var(--ink); margin: 0; line-height: 1.12; }
.hi5row__name em{ font-style: normal; color: var(--gold-deep); }
.hi5row__body{ }
.hi5row__desc{ font-size: 14.5px; line-height: 1.65; color: var(--ink-soft); margin: 0 0 12px; }
.hi5row__items{ display: flex; flex-wrap: wrap; gap: 8px; }
.hi5row__chip{
  font-size: 11px; letter-spacing: .04em; color: var(--ink-soft);
  padding: 5px 12px; border-radius: 999px;
  background: var(--cream); border: 1px solid var(--gold-pale);
  transition: all .3s ease;
}
.hi5row:hover .hi5row__chip{ border-color: var(--gold-soft); }
.hi5sum__foot{ text-align:center; margin-top: 52px; position: relative; z-index: 2; }
.hi5sum__line{ font-size: clamp(17px,1.7vw,22px); font-style: normal; color: var(--ink); line-height: 1.5; margin: 0 0 26px; }
.hi5sum__line em{ color: var(--gold-deep); }

@media (max-width: 860px){
  .hi5row{ grid-template-columns: 48px 1fr; gap: 18px 20px; padding: 28px 24px; }
  .hi5row__icon{ width:48px; height:48px; }
  .hi5row__body{ grid-column: 1 / -1; padding-top: 4px; border-top: 1px solid var(--gold-pale); margin-top: 4px; padding-top: 18px; }
}

/* =====================================================================
   FILMS SECTION (homepage)
   ===================================================================== */
.films{ display:grid; grid-template-columns: repeat(2, 1fr); gap: 24px; }
.film{
  position: relative; aspect-ratio: 16/9;
  overflow: hidden; border-radius: 10px; cursor: pointer;
  background: var(--cream); border: 1px solid var(--gold-pale);
  transition: all .55s cubic-bezier(.7,0,.2,1);
  display: block;
}
.film:hover{ border-color: var(--gold); transform: translateY(-6px); box-shadow: 0 40px 80px -30px rgba(38,36,30,.32); }
.film__img{ position:absolute; inset:0; }
.film__img img{ width:100%; height:100%; object-fit: cover; transition: transform 1.3s cubic-bezier(.7,0,.2,1); }
.film:hover .film__img img{ transform: scale(1.07); }
.film__img::after{ content:""; position:absolute; inset:0; background: linear-gradient(180deg, rgba(38,36,30,.15) 0%, rgba(38,36,30,.7) 100%); }
.film__content{ position:absolute; inset:0; padding: 32px; display:flex; flex-direction:column; justify-content: space-between; color: var(--pearl); z-index: 2; }
.film__num{ font-style: normal; font-size: 13px; color: var(--gold-glow); }
.film__title{ font-weight: 400; font-size: clamp(22px, 2.2vw, 30px); margin: 0; letter-spacing: -.015em; }
.film__sub{ font-size: 13px; color: rgba(251,248,242,.8); margin-top: 6px; }
.film__play{
  position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);
  width: 74px; height: 74px; border-radius: 50%;
  border: 1.5px solid var(--pearl);
  display:flex; align-items:center; justify-content:center;
  background: rgba(248,244,236,.15); backdrop-filter: blur(6px);
  transition: all .45s ease; z-index: 3;
}
.film:hover .film__play{ background: var(--gold); border-color: var(--gold); transform: translate(-50%,-50%) scale(1.12); box-shadow: 0 20px 40px -10px rgba(192,154,82,.6); }
.film__play svg{ width: 24px; height: 24px; color: var(--pearl); margin-left: 4px; }
@media (max-width: 760px){ .films{ grid-template-columns: 1fr; } }

/* =====================================================================
   GLOBAL TYPE SAFETY — prevent any heading letters/words from breaking
   ===================================================================== */
.title, .hi5sum__hash, .hero__title, .phero__title, .cta-end__title,
.quote__text, .practice__title, .hi5row__name, .film__title,
.head-center h2, .projhero__name, .featured__name{
  overflow-wrap: break-word;   /* break only between words, never mid-letter run awkwardly */
  word-break: normal;          /* never split inside a word */
  hyphens: none;               /* no hyphenation */
  text-wrap: balance;          /* even, elegant line lengths */
}
.title{ max-width: 26ch; }
.title--center{ max-width: 24ch; }



/* =====================================================================
   GRADIENT-TEXT WRAP SAFETY — keep accented words intact, no mid-word splits
   ===================================================================== */
.title em, .cta-end__title em, .hero__title em, .phero__title em,
.practice__title em, .quote__text em, .hi5sum__hash .e, .hi5row__name em{
  display: inline-block;       /* gradient span won't fragment across lines mid-word */
  white-space: nowrap;         /* the accent phrase stays on one line */
}
/* but allow the hero multi-word accent to wrap between words if truly needed */
.hero__title em, .phero__title em{ white-space: normal; }

/* The Hi5 hash must never break the word Gangotree */
.hi5sum__hash{ white-space: normal; }
.hi5sum__hash .e{ white-space: nowrap; }

/* Mobile: relax nowrap so long accent phrases don't overflow tiny screens */
@media (max-width: 520px){
  .title em, .cta-end__title em, .practice__title em, .quote__text em{
    white-space: normal;
  }
}



/* =====================================================================
   PRACTICE — interactive expanding showcase (desktop) / stacked (mobile)
   ===================================================================== */
.showcase{
  display: flex;
  gap: 16px;
  height: 560px;
  margin-top: 8px;
}
.sc-panel{
  position: relative;
  flex: 1;
  border-radius: 18px;
  overflow: hidden;
  cursor: pointer;
  background: var(--ink-deep);
  transition: flex .7s cubic-bezier(.7,0,.15,1);
  min-width: 0;
}
.sc-panel.is-active{ flex: 3.4; }
.sc-panel__img{ position:absolute; inset:0; }
.sc-panel__img img{ width:100%; height:100%; object-fit: cover; transition: transform 1.2s cubic-bezier(.7,0,.2,1), filter .7s ease; filter: saturate(.92); }
.sc-panel.is-active .sc-panel__img img{ transform: scale(1.04); filter: saturate(1); }
.sc-panel__veil{
  position:absolute; inset:0;
  background: linear-gradient(180deg, rgba(20,20,19,.15) 0%, rgba(20,20,19,.55) 55%, rgba(20,20,19,.9) 100%);
  transition: background .6s ease;
}
.sc-panel.is-active .sc-panel__veil{
  background: linear-gradient(180deg, rgba(20,20,19,.05) 0%, rgba(20,20,19,.35) 50%, rgba(20,20,19,.88) 100%);
}
/* gold accent line top */
.sc-panel::after{
  content:""; position:absolute; top:0; left:0; right:0; height:3px; z-index:4;
  background: linear-gradient(90deg, var(--gold-glow), var(--gold));
  transform: scaleX(0); transform-origin: left;
  transition: transform .7s cubic-bezier(.7,0,.2,1);
}
.sc-panel.is-active::after{ transform: scaleX(1); }

.sc-panel__inner{
  position: absolute; inset: 0; z-index: 3;
  padding: 38px 34px;
  display: flex; flex-direction: column; justify-content: flex-end;
  color: var(--pearl);
}
.sc-panel__index{
  position: absolute; top: 34px; left: 34px;
  font-size: 13px; font-weight: 600; letter-spacing: .04em;
  color: var(--gold-glow);
  display: flex; align-items: center; gap: 10px;
}
.sc-panel__index::after{ content:""; width: 22px; height: 1px; background: var(--gold-glow); opacity:.6; }
.sc-panel__icon{
  position: absolute; top: 30px; right: 30px;
  width: 46px; height: 46px; border-radius: 50%;
  border: 1px solid rgba(255,255,255,.35);
  display:flex; align-items:center; justify-content:center;
  color: var(--pearl);
  transition: all .6s cubic-bezier(.7,0,.2,1);
  opacity: .85;
}
.sc-panel.is-active .sc-panel__icon{
  background: var(--gold); border-color: var(--gold);
  transform: rotate(360deg); opacity: 1;
  box-shadow: 0 12px 28px -10px rgba(190,154,78,.7);
}
.sc-panel__icon svg{ width: 22px; height: 22px; }

/* Vertical label shown when collapsed */
.sc-panel__label{
  position: absolute; bottom: 34px; left: 50%;
  transform: translateX(-50%) rotate(180deg);
  writing-mode: vertical-rl;
  font-size: clamp(20px, 1.6vw, 26px);
  font-weight: 400; letter-spacing: .02em;
  color: var(--pearl);
  white-space: nowrap;
  transition: opacity .4s ease;
  text-shadow: 0 2px 12px rgba(0,0,0,.4);
}
.sc-panel.is-active .sc-panel__label{ opacity: 0; pointer-events: none; }

/* Expanded content */
.sc-panel__content{
  opacity: 0; transform: translateY(20px);
  transition: opacity .5s ease .2s, transform .6s cubic-bezier(.7,0,.2,1) .2s;
  max-width: 460px;
}
.sc-panel.is-active .sc-panel__content{ opacity: 1; transform: translateY(0); }
.sc-panel__kicker{
  font-size: 11px; letter-spacing: .26em; text-transform: uppercase;
  color: var(--gold-glow); font-weight: 600; margin-bottom: 14px;
}
.sc-panel__name{
  font-size: clamp(36px, 4vw, 56px);
  font-weight: 300; line-height: 1.0; letter-spacing: -.03em;
  margin: 0 0 16px; color: #fff;
  text-wrap: balance;
}
.sc-panel__desc{
  font-size: 15px; line-height: 1.65;
  color: rgba(255,255,255,.85); margin: 0 0 24px;
}
.sc-panel__link{
  display: inline-flex; align-items: center; gap: 10px;
  font-size: 11px; letter-spacing: .22em; text-transform: uppercase;
  color: #fff; font-weight: 600;
  padding: 13px 24px; border-radius: 999px;
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.3);
  backdrop-filter: blur(6px);
  transition: all .4s ease;
}
.sc-panel__link:hover{ background: var(--gold); border-color: var(--gold); transform: translateY(-2px); }
.sc-panel__link svg{ width: 13px; height: 13px; transition: transform .4s ease; }
.sc-panel__link:hover svg{ transform: translateX(5px); }

/* Tablet (expanding still works, a touch shorter) */
@media (max-width: 1100px){
  .showcase{ height: 520px; }
  .sc-panel.is-active{ flex: 3; }
  .sc-panel__name{ font-size: clamp(30px, 4.5vw, 46px); }
  .sc-panel__inner{ padding: 32px 28px; }
}

/* Small tablet — expanding still works but bigger active share */
@media (max-width: 860px){
  .showcase{ height: 480px; gap: 12px; }
  .sc-panel.is-active{ flex: 4; }
  .sc-panel__label{ font-size: 20px; bottom: 28px; }
  .sc-panel__index{ top: 26px; left: 26px; font-size: 12px; }
  .sc-panel__icon{ top: 24px; right: 24px; width: 40px; height: 40px; }
}

/* Mobile — clean stacked image cards, fully readable, all content always visible */
@media (max-width: 680px){
  .showcase{ flex-direction: column; height: auto; gap: 16px; }
  .sc-panel{
    flex: none !important;
    height: auto !important;
    min-height: 360px;
    border-radius: 16px;
    display: flex;
  }
  .sc-panel__label{ display: none; }
  .sc-panel__index{ top: 24px; left: 24px; }
  .sc-panel__icon{
    top: 22px; right: 22px; width: 44px; height: 44px;
    background: var(--gold); border-color: var(--gold); opacity: 1;
  }
  .sc-panel__inner{ position: relative; padding: 28px 26px 30px; justify-content: flex-end; }
  .sc-panel__content{ opacity: 1 !important; transform: none !important; max-width: none; }
  .sc-panel__veil{ background: linear-gradient(180deg, rgba(20,20,19,.12) 0%, rgba(20,20,19,.45) 42%, rgba(20,20,19,.9) 100%) !important; }
  .sc-panel::after{ transform: scaleX(1); }
  .sc-panel__name{ font-size: clamp(28px, 7vw, 38px); margin-bottom: 12px; }
  .sc-panel__desc{ font-size: 14.5px; margin-bottom: 20px; }
  .sc-panel__kicker{ margin-bottom: 10px; }
}

/* =====================================================================
   ABOUT PAGE — premium editorial sections
   ===================================================================== */

/* Intro split — large statement + meta column */
.story-intro{ display:grid; grid-template-columns: 1.4fr 1fr; gap: clamp(40px,6vw,100px); align-items: start; }
.story-intro__lead{ font-size: clamp(24px,2.6vw,38px); font-weight: 300; line-height: 1.35; letter-spacing: -.02em; color: var(--ink); margin: 0; text-wrap: balance; }
.story-intro__lead em{ font-style: normal; background: linear-gradient(135deg, var(--gold), var(--gold-deep)); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.story-intro__side{ padding-top: 6px; }
.story-intro__side p{ font-size: 15px; line-height: 1.75; color: var(--ink-soft); margin: 0 0 18px; }
.story-intro__sign{ margin-top: 26px; padding-top: 22px; border-top: 1px solid var(--gold-pale); }
.story-intro__sign b{ display:block; font-size: 15px; color: var(--ink); font-weight: 500; }
.story-intro__sign span{ font-size: 12.5px; color: var(--ink-mute); letter-spacing:.04em; }

/* Marble stat band (clean white, gold figures) */
.figband{ display:grid; grid-template-columns: repeat(4,1fr); gap:0; border:1px solid var(--gold-pale); border-radius:16px; overflow:hidden; background:#fff; box-shadow:0 40px 90px -50px rgba(31,31,29,.22); }
.figband__cell{ padding: clamp(32px,3.5vw,52px) clamp(20px,2.5vw,36px); border-right:1px solid var(--gold-pale); position:relative; transition: background .5s ease; }
.figband__cell:last-child{ border-right:none; }
.figband__cell:hover{ background: var(--cream); }
.figband__num{ font-size: clamp(40px,4.5vw,66px); font-weight:200; letter-spacing:-.04em; line-height:1; display:flex; align-items:baseline; gap:4px; background: linear-gradient(160deg, var(--ink) 0%, var(--ink-soft) 100%); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.figband__num .plus{ background: linear-gradient(135deg,var(--gold-glow),var(--gold-deep)); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; font-size:.5em; }
.figband__label{ margin-top:14px; font-size:13px; letter-spacing:.04em; color:var(--ink-soft); line-height:1.4; }

/* Hi5 — premium philosophy hero band */
.philo{ position:relative; background: linear-gradient(180deg, #fff 0%, var(--warm) 100%); padding: var(--y) 0; overflow:hidden; }
.philo::before{ content:""; position:absolute; inset:0; pointer-events:none; background: radial-gradient(ellipse at 82% 14%, rgba(235,206,137,.16), transparent 52%), radial-gradient(ellipse at 14% 90%, rgba(190,154,78,.08), transparent 50%); }
.philo__intro{ text-align:center; max-width:760px; margin:0 auto 14px; position:relative; z-index:2; }
.philo__tag{ display:inline-flex; align-items:center; gap:12px; font-size:11px; letter-spacing:.35em; text-transform:uppercase; color:var(--gold-deep); font-weight:600; margin-bottom:26px; }
.philo__tag::before,.philo__tag::after{ content:""; width:30px; height:1px; background:var(--gold); }
.philo__hash{ font-size:clamp(28px,5.2vw,72px); font-weight:300; letter-spacing:-.03em; line-height:1.12; margin:0 0 24px; color:var(--ink); overflow-wrap:break-word; word-break:normal; hyphens:none; text-wrap:balance; padding-bottom:.08em; }
.philo__hash .h{ color:var(--gold); } .philo__hash .e{ display:inline-block; padding-bottom:.06em; background:linear-gradient(135deg,var(--gold),var(--gold-deep)); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.philo__lead{ font-size:clamp(16px,1.4vw,19px); line-height:1.7; color:var(--ink-soft); max-width:54ch; margin:0 auto; }
.philo__lead em{ font-style:normal; color:var(--gold-deep); }

/* The story behind Hi5 — two column with oversized word */
.philo__origin{ display:grid; grid-template-columns: 0.8fr 1.2fr; gap:clamp(36px,5vw,80px); align-items:center; max-width:1060px; margin:64px auto 0; position:relative; z-index:2; }
.philo__bigword{ font-size:clamp(60px,8.5vw,140px); font-weight:200; letter-spacing:-.05em; line-height:.95; background:linear-gradient(150deg,var(--gold-glow),var(--gold-deep)); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; padding-bottom:.04em; display:inline-block; }
.philo__bigword small{ display:block; font-size:.12em; letter-spacing:.3em; text-transform:uppercase; color:var(--gold-deep); -webkit-text-fill-color:var(--gold-deep); margin-top:18px; font-weight:600; }
.philo__story p{ font-size:15.5px; line-height:1.75; color:var(--ink-soft); margin:0 0 18px; }
.philo__story strong{ color:var(--ink); font-weight:500; }
.philo__story em{ font-style:normal; color:var(--gold-deep); }
.philo__pull{ margin-top:28px; padding:22px 26px; border-left:2px solid var(--gold); background:linear-gradient(90deg,var(--cream),transparent); font-style:normal; font-size:clamp(16px,1.5vw,20px); line-height:1.5; color:var(--ink); }
.philo__pull em{ color:var(--gold-deep); }

/* The five layers — interactive accordion-tabs (NO repeated 5 numbers) */
.layers{ max-width:1080px; margin:72px auto 0; position:relative; z-index:2; display:grid; grid-template-columns: 0.9fr 1.1fr; gap:clamp(28px,4vw,56px); align-items:start; }
.layers__nav{ display:flex; flex-direction:column; gap:6px; }
.ltab{ display:flex; align-items:center; gap:18px; padding:22px 24px; border-radius:14px; cursor:pointer; border:1px solid transparent; transition:all .45s cubic-bezier(.7,0,.2,1); position:relative; background:transparent; text-align:left; width:100%; }
.ltab:hover{ background: rgba(255,255,255,.6); }
.ltab.is-active{ background:#fff; border-color:var(--gold-pale); box-shadow:0 24px 50px -28px rgba(31,31,29,.22); }
.ltab__dot{ width:42px; height:42px; border-radius:50%; border:1.5px solid var(--gold-pale); display:flex; align-items:center; justify-content:center; color:var(--gold-deep); flex-shrink:0; transition:all .5s cubic-bezier(.7,0,.2,1); }
.ltab.is-active .ltab__dot{ background:linear-gradient(135deg,var(--gold),var(--gold-deep)); border-color:var(--gold); color:#fff; transform:rotate(360deg); box-shadow:0 12px 26px -10px rgba(190,154,78,.6); }
.ltab__dot svg{ width:20px; height:20px; }
.ltab__txt{ min-width:0; }
.ltab__word{ font-size:10.5px; letter-spacing:.24em; text-transform:uppercase; color:var(--gold-deep); font-weight:600; margin-bottom:4px; }
.ltab__name{ font-size:clamp(17px,1.7vw,21px); font-weight:400; letter-spacing:-.005em; color:var(--ink); line-height:1.2; overflow-wrap:break-word; word-break:normal; }
.ltab__name em{ font-style:normal; color:var(--gold-deep); }
.ltab.is-active .ltab__name{ color:var(--gold-deep); }

/* layer detail panel */
.layers__stage{ position:relative; min-height:420px; background:#fff; border:1px solid var(--gold-pale); border-radius:18px; padding:clamp(32px,4vw,52px); box-shadow:0 40px 90px -50px rgba(31,31,29,.22); overflow:hidden; }
.lpanel{ position:absolute; inset:0; padding:inherit; opacity:0; visibility:hidden; transform:translateY(24px); transition:all .6s cubic-bezier(.7,0,.2,1); display:flex; flex-direction:column; justify-content:center; padding:clamp(32px,4vw,52px); }
.lpanel.is-active{ opacity:1; visibility:visible; transform:translateY(0); position:relative; }
.lpanel__sanskrit{ font-size:clamp(26px,3vw,42px); font-weight:300; letter-spacing:-.015em; color:var(--ink); margin:0 0 6px; line-height:1.15; overflow-wrap:break-word; word-break:normal; text-wrap:balance; padding-bottom:.06em; }
.lpanel__sanskrit em{ font-style:normal; display:inline-block; padding-bottom:.06em; background:linear-gradient(135deg,var(--gold),var(--gold-deep)); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.lpanel__eng{ font-size:12px; letter-spacing:.22em; text-transform:uppercase; color:var(--ink-mute); font-weight:600; margin-bottom:22px; }
.lpanel__desc{ font-size:15.5px; line-height:1.75; color:var(--ink-soft); margin:0 0 26px; max-width:46ch; }
.lpanel__items{ display:flex; flex-wrap:wrap; gap:10px; padding-top:24px; border-top:1px solid var(--gold-pale); }
.lpanel__chip{ font-size:12.5px; letter-spacing:.03em; color:var(--ink); padding:9px 16px; border-radius:999px; background:var(--cream); border:1px solid var(--gold-pale); transition:all .3s ease; }
.lpanel__chip:hover{ border-color:var(--gold-soft); background:#fff; transform:translateY(-2px); }

/* closing line */
.philo__close{ text-align:center; max-width:52ch; margin:80px auto 0; position:relative; z-index:2; }
.philo__close p{ font-size:clamp(18px,1.8vw,24px); font-style:normal; line-height:1.5; color:var(--ink); margin:0 0 28px; }
.philo__close em{ color:var(--gold-deep); }

/* Values — premium horizontal list */
.vlist{ border-top:1px solid var(--gold-pale); }
.vrow{ display:grid; grid-template-columns: 64px 1fr 1.4fr; gap:clamp(20px,3vw,48px); align-items:center; padding:clamp(32px,3.5vw,48px) clamp(8px,2vw,32px); border-bottom:1px solid var(--gold-pale); transition:padding-left .5s cubic-bezier(.7,0,.2,1); position:relative; }
.vrow::before{ content:""; position:absolute; left:0; top:0; bottom:0; width:2px; background:linear-gradient(180deg,var(--gold-glow),var(--gold-deep)); transform:scaleY(0); transform-origin:top; transition:transform .55s cubic-bezier(.7,0,.2,1); }
.vrow:hover{ padding-left:clamp(16px,2.5vw,44px); }
.vrow:hover::before{ transform:scaleY(1); }
.vrow__icon{ width:56px; height:56px; border-radius:50%; border:1.5px solid var(--gold-pale); display:flex; align-items:center; justify-content:center; color:var(--gold-deep); transition:all .55s cubic-bezier(.7,0,.2,1); }
.vrow:hover .vrow__icon{ background:linear-gradient(135deg,var(--gold),var(--gold-deep)); color:#fff; border-color:var(--gold); transform:rotate(360deg); }
.vrow__icon svg{ width:24px; height:24px; }
.vrow__name{ font-size:clamp(24px,2.6vw,36px); font-weight:300; letter-spacing:-.025em; color:var(--ink); margin:0; transition:color .4s ease; }
.vrow:hover .vrow__name{ color:var(--gold-deep); }
.vrow__desc{ font-size:15px; line-height:1.65; color:var(--ink-soft); margin:0; }

/* Founders — refined portrait cards */
.founders2{ display:grid; grid-template-columns:1fr 1fr; gap:28px; }
.fcard{ background:#fff; border:1px solid var(--gold-pale); border-radius:18px; overflow:hidden; transition:all .55s cubic-bezier(.7,0,.2,1); }
.fcard:hover{ transform:translateY(-8px); box-shadow:0 50px 90px -40px rgba(31,31,29,.28); border-color:var(--gold-soft); }
.fcard__media{ aspect-ratio:16/11; overflow:hidden; background:var(--cream); position:relative; }
.fcard__media img{ width:100%; height:100%; object-fit:cover; transition:transform 1.2s cubic-bezier(.7,0,.2,1); }
.fcard:hover .fcard__media img{ transform:scale(1.05); }
.fcard__body{ padding:32px 34px 36px; }
.fcard__role{ font-size:11px; letter-spacing:.24em; text-transform:uppercase; color:var(--gold-deep); font-weight:600; margin-bottom:10px; display:flex; align-items:center; gap:10px; }
.fcard__role::before{ content:""; width:22px; height:1px; background:var(--gold); }
.fcard__name{ font-size:clamp(26px,2.8vw,34px); font-weight:400; letter-spacing:-.02em; color:var(--ink); margin:0 0 12px; }
.fcard__bio{ font-size:14.5px; line-height:1.7; color:var(--ink-soft); margin:0; }

/* Responsive */
@media (max-width: 960px){
  .story-intro{ grid-template-columns:1fr; gap:36px; }
  .figband{ grid-template-columns:repeat(2,1fr); }
  .figband__cell:nth-child(2){ border-right:none; }
  .figband__cell:nth-child(1),.figband__cell:nth-child(2){ border-bottom:1px solid var(--gold-pale); }
  .philo__origin{ grid-template-columns:1fr; gap:28px; text-align:left; }
  .layers{ grid-template-columns:1fr; gap:24px; }
  .layers__stage{ min-height:auto; }
  .lpanel{ position:relative; }
  .founders2{ grid-template-columns:1fr; }
  .vrow{ grid-template-columns:56px 1fr; gap:14px 20px; }
  .vrow__desc{ grid-column:1 / -1; padding-top:8px; border-top:1px solid var(--gold-pale); }
}
@media (max-width: 560px){
  .figband{ grid-template-columns:1fr; }
  .figband__cell{ border-right:none; border-bottom:1px solid var(--gold-pale); }
  .figband__cell:last-child{ border-bottom:none; }
  .vrow{ grid-template-columns:1fr; }
  .ltab{ padding:18px 18px; }
}

/* =====================================================================
   PROJECT DETAIL PAGE v2 — premium, dynamic
   ===================================================================== */
/* Page hero — clean, name + location, NO big image (image comes after as elevation) */
.pdhero{ position:relative; padding: 170px 0 60px; background: radial-gradient(ellipse at 80% 20%, rgba(235,206,137,.18), transparent 50%), linear-gradient(180deg,#fff 0%, var(--warm) 100%); overflow:hidden; }
/* Project header WITH a background image: add class "pdhero--img" + set --bg */
.pdhero--img{
  background:
    linear-gradient(180deg, rgba(255,255,255,.74) 0%, rgba(255,255,255,.50) 45%, rgba(255,255,255,.82) 100%),
    var(--bg) center/cover no-repeat;
}
.pdhero--dark{
  background:
    linear-gradient(180deg, rgba(20,20,19,.4) 0%, rgba(20,20,19,.35) 45%, rgba(20,20,19,.72) 100%),
    var(--bg) center/cover no-repeat;
}
.pdhero--dark .pdhero__name{ color:#fff; }
.pdhero--dark .pdhero__name em{ -webkit-text-fill-color:initial; background:none; color:var(--gold-glow); }
.pdhero--dark .pdhero__loc, .pdhero--dark .pdhero__crumb{ color:rgba(255,255,255,.85); }
.pdhero--dark .pdhero__crumb a{ color:var(--gold-glow); }
.pdhero::before{ content:""; position:absolute; inset:0; pointer-events:none; background-image: linear-gradient(rgba(190,154,78,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(190,154,78,.045) 1px,transparent 1px); background-size:80px 80px; mask-image:radial-gradient(ellipse at center,#000 25%,transparent 78%); }
.pdhero__inner{ position:relative; z-index:2; }
.pdhero__crumb{ font-size:12px; letter-spacing:.06em; color:var(--ink-mute); margin-bottom:24px; }
.pdhero__crumb a{ color:var(--gold-deep); } .pdhero__crumb a:hover{ text-decoration:underline; }
.pdhero__tag{ display:inline-block; background:var(--gold); color:#fff; font-size:10.5px; letter-spacing:.22em; text-transform:uppercase; padding:8px 16px; border-radius:999px; margin-bottom:22px; font-weight:600; }
.pdhero__name{ font-size:clamp(38px,6.5vw,88px); font-weight:300; letter-spacing:-.02em; line-height:1.22; margin:0 0 18px; color:var(--ink); text-wrap:balance; overflow-wrap:break-word; word-break:normal; hyphens:none; padding-bottom:.18em; }
.pdhero__name em{ font-style:normal; display:inline-block; padding-bottom:.18em; line-height:1.25; background:linear-gradient(135deg,var(--gold),var(--gold-deep)); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.pdhero__loc{ font-size:16px; color:var(--ink-soft); display:flex; align-items:center; gap:10px; }
.pdhero__loc svg{ width:17px; height:17px; color:var(--gold); }

/* Elevation image — 3:4 portrait, prominent, after heading */
.elevation{ display:grid; grid-template-columns: 3fr 2fr; gap:clamp(28px,4vw,56px); align-items:stretch; }
.elevation__img{ aspect-ratio:3/4; border-radius:16px; overflow:hidden; background:var(--cream); border:1px solid var(--gold-pale); box-shadow:0 50px 100px -50px rgba(31,31,29,.3); position:relative; }
.elevation__img img{ width:100%; height:100%; object-fit:cover; transition:transform 1.4s cubic-bezier(.7,0,.2,1); }
.elevation__img:hover img{ transform:scale(1.04); }
.elevation__badge{ position:absolute; top:20px; left:20px; background:rgba(255,255,255,.92); backdrop-filter:blur(6px); color:var(--gold-deep); font-size:10px; letter-spacing:.2em; text-transform:uppercase; padding:8px 15px; border-radius:999px; font-weight:600; z-index:2; }
.elevation__side{ display:flex; flex-direction:column; justify-content:center; }
.elevation__intro{ font-size:clamp(17px,1.7vw,22px); font-weight:300; line-height:1.5; color:var(--ink); margin:0 0 24px; text-wrap:balance; }
.elevation__intro em{ font-style:normal; color:var(--gold-deep); }
.elevation__p{ font-size:15px; line-height:1.75; color:var(--ink-soft); margin:0 0 18px; }

/* Spec strip */
.pspecs{ display:grid; grid-template-columns:repeat(4,1fr); gap:0; background:#fff; border:1px solid var(--gold-pale); border-radius:14px; overflow:hidden; box-shadow:0 40px 80px -50px rgba(31,31,29,.2); }
.pspec{ padding:clamp(26px,3vw,40px) clamp(18px,2vw,30px); border-right:1px solid var(--gold-pale); transition:background .4s ease; }
.pspec:last-child{ border-right:none; }
.pspec:hover{ background:var(--cream); }
.pspec b{ display:block; font-size:clamp(24px,2.6vw,34px); font-weight:300; letter-spacing:-.02em; color:var(--ink); margin-bottom:6px; }
.pspec span{ font-size:10.5px; letter-spacing:.18em; text-transform:uppercase; color:var(--ink-mute); font-weight:600; }

/* Highlights / amenities grid */
.amen{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.amen__item{ display:flex; align-items:flex-start; gap:14px; padding:24px 24px; background:#fff; border:1px solid var(--gold-pale); border-radius:12px; transition:all .45s cubic-bezier(.7,0,.2,1); }
.amen__item:hover{ border-color:var(--gold-soft); transform:translateY(-4px); box-shadow:0 24px 50px -30px rgba(31,31,29,.2); }
.amen__ic{ width:40px; height:40px; border-radius:50%; border:1.5px solid var(--gold-pale); display:flex; align-items:center; justify-content:center; color:var(--gold-deep); flex-shrink:0; transition:all .45s ease; }
.amen__item:hover .amen__ic{ background:linear-gradient(135deg,var(--gold),var(--gold-deep)); color:#fff; border-color:var(--gold); }
.amen__ic svg{ width:18px; height:18px; }
.amen__t{ font-size:15px; color:var(--ink); font-weight:500; line-height:1.4; padding-top:8px; }

/* Gallery — masonry-ish, multiple images, dynamic */
.pgallery{ display:grid; grid-template-columns:repeat(4,1fr); grid-auto-rows:200px; gap:16px; }
.pgi{ border-radius:14px; overflow:hidden; background:var(--cream); border:1px solid var(--gold-pale); position:relative; cursor:pointer; }
.pgi img{ width:100%; height:100%; object-fit:cover; transition:transform 1.2s cubic-bezier(.7,0,.2,1); }
.pgi:hover img{ transform:scale(1.06); }
.pgi::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 60%,rgba(31,31,29,.3)); opacity:0; transition:opacity .4s ease; }
.pgi:hover::after{ opacity:1; }
.pgi--tall{ grid-row:span 2; }
.pgi--wide{ grid-column:span 2; }
.pgi--big{ grid-column:span 2; grid-row:span 2; }

/* Brochure download — premium form */
.broch{ display:grid; grid-template-columns:1fr 1fr; gap:0; border-radius:20px; overflow:hidden; border:1px solid var(--gold-pale); box-shadow:0 50px 110px -50px rgba(31,31,29,.32); }
.broch__left{ position:relative; padding:clamp(40px,5vw,72px); background:linear-gradient(160deg,var(--ink) 0%, var(--ink-deep) 100%); color:var(--pearl); overflow:hidden; display:flex; flex-direction:column; justify-content:center; }
.broch__left::before{ content:""; position:absolute; inset:0; background:radial-gradient(ellipse at 80% 10%, rgba(235,206,137,.18), transparent 55%); pointer-events:none; }
.broch__kick{ font-size:11px; letter-spacing:.28em; text-transform:uppercase; color:var(--gold-glow); font-weight:600; margin-bottom:20px; position:relative; }
.broch__h{ font-size:clamp(28px,3vw,42px); font-weight:300; line-height:1.1; letter-spacing:-.025em; margin:0 0 18px; position:relative; text-wrap:balance; }
.broch__h em{ font-style:normal; color:var(--gold-glow); }
.broch__p{ font-size:15px; line-height:1.7; color:rgba(255,255,255,.8); margin:0 0 28px; position:relative; }
.broch__feat{ list-style:none; padding:0; margin:0; position:relative; }
.broch__feat li{ display:flex; align-items:center; gap:12px; font-size:14px; color:rgba(255,255,255,.9); padding:9px 0; }
.broch__feat svg{ width:18px; height:18px; color:var(--gold-glow); flex-shrink:0; }
.broch__right{ padding:clamp(36px,4vw,56px); background:#fff; }
.broch__formtitle{ font-size:20px; font-weight:500; color:var(--ink); margin:0 0 6px; }
.broch__formsub{ font-size:13.5px; color:var(--ink-mute); margin:0 0 26px; }
.bfield{ margin-bottom:18px; }
.bfield label{ display:block; font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-soft); font-weight:600; margin-bottom:7px; }
.bfield input, .bfield select{ width:100%; padding:14px 16px; border:1px solid var(--gold-pale); border-radius:10px; background:var(--cream); font-family:inherit; font-size:15px; color:var(--ink); transition:all .3s ease; }
.bfield input:focus, .bfield select:focus{ outline:none; border-color:var(--gold); box-shadow:0 0 0 3px rgba(190,154,78,.12); background:#fff; }
.bfield--row{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.broch__consent{ display:flex; align-items:flex-start; gap:10px; margin:6px 0 20px; }
.broch__consent input{ margin-top:3px; accent-color:var(--gold); }
.broch__consent label{ font-size:12px; color:var(--ink-mute); line-height:1.5; }
.broch__btn{ width:100%; justify-content:center; }
.broch__note{ font-size:11.5px; color:var(--ink-mute); text-align:center; margin-top:14px; display:flex; align-items:center; justify-content:center; gap:7px; }
.broch__note svg{ width:13px; height:13px; color:var(--gold); }
.broch__success{ display:none; text-align:center; padding:40px 20px; }
.broch__success.show{ display:block; }
.broch__success svg{ width:54px; height:54px; color:var(--gold); margin:0 auto 18px; }
.broch__success h4{ font-size:22px; font-weight:500; color:var(--ink); margin:0 0 10px; }
.broch__success p{ font-size:14px; color:var(--ink-soft); margin:0 0 20px; }

@media (max-width:960px){
  .elevation{ grid-template-columns:1fr; }
  .elevation__img{ max-width:440px; }
  .pspecs{ grid-template-columns:repeat(2,1fr); }
  .pspec:nth-child(2){ border-right:none; }
  .pspec:nth-child(1),.pspec:nth-child(2){ border-bottom:1px solid var(--gold-pale); }
  .amen{ grid-template-columns:repeat(2,1fr); }
  .pgallery{ grid-template-columns:repeat(2,1fr); grid-auto-rows:180px; }
  .pgi--big,.pgi--wide{ grid-column:span 2; }
  .pgi--big{ grid-row:span 2; }
  .broch{ grid-template-columns:1fr; }
}
@media (max-width:560px){
  .pspecs{ grid-template-columns:1fr; }
  .pspec{ border-right:none; border-bottom:1px solid var(--gold-pale); }
  .pspec:last-child{ border-bottom:none; }
  .amen{ grid-template-columns:1fr; }
  .pgallery{ grid-template-columns:1fr; grid-auto-rows:220px; }
  .pgi--big,.pgi--wide,.pgi--tall{ grid-column:span 1; grid-row:span 1; }
  .bfield--row{ grid-template-columns:1fr; }
}

/* =====================================================================
   PROJECT v3 — meta chips, 4-image gallery, nearby list
   ===================================================================== */
.metachip{ font-size:13px; color:var(--ink-soft); padding:10px 18px; border-radius:999px; background:#fff; border:1px solid var(--gold-pale); }
.metachip b{ color:var(--gold-deep); font-weight:600; letter-spacing:.08em; text-transform:uppercase; font-size:10.5px; margin-right:8px; }

/* 4-image gallery: 1 large feature + 3 stacked */
.pgallery4{ display:grid; grid-template-columns:2fr 1fr 1fr; grid-template-rows:1fr 1fr; gap:16px; height:560px; }
.pgallery4 .pgi{ border-radius:14px; overflow:hidden; background:var(--cream); border:1px solid var(--gold-pale); position:relative; }
.pgallery4 .pgi img{ width:100%; height:100%; object-fit:cover; transition:transform 1.2s cubic-bezier(.7,0,.2,1); }
.pgallery4 .pgi:hover img{ transform:scale(1.06); }
.pgallery4 .pgi--feat{ grid-row:1 / span 2; }
.pgallery4 .pgi:nth-child(2){ grid-column:2 / span 2; }
.pgallery4 .pgi:nth-child(3){ grid-column:2; grid-row:2; }
.pgallery4 .pgi:nth-child(4){ grid-column:3; grid-row:2; }

/* Nearby / location list */
.nearby{ max-width:780px; margin:0 auto; border:1px solid var(--gold-pale); border-radius:16px; overflow:hidden; background:#fff; box-shadow:0 40px 80px -50px rgba(31,31,29,.2); }
.nearby__row{ display:flex; align-items:center; justify-content:space-between; padding:20px 28px; border-bottom:1px solid var(--gold-pale); transition:background .35s ease; }
.nearby__row:last-child{ border-bottom:none; }
.nearby__row:hover{ background:var(--cream); padding-left:34px; }
.nearby__place{ font-size:15.5px; color:var(--ink); font-weight:400; }
.nearby__dist{ font-size:13px; color:var(--gold-deep); font-weight:600; letter-spacing:.04em; padding:5px 14px; background:var(--cream); border-radius:999px; }

@media (max-width:960px){
  .pgallery4{ height:auto; grid-template-columns:1fr 1fr; grid-template-rows:auto; }
  .pgallery4 .pgi{ aspect-ratio:4/3; }
  .pgallery4 .pgi--feat{ grid-row:auto; grid-column:1 / span 2; aspect-ratio:16/9; }
  .pgallery4 .pgi:nth-child(2){ grid-column:auto; }
  .pgallery4 .pgi:nth-child(3){ grid-column:auto; grid-row:auto; }
  .pgallery4 .pgi:nth-child(4){ grid-column:auto; grid-row:auto; }
}
@media (max-width:560px){
  .pgallery4{ grid-template-columns:1fr; }
  .pgallery4 .pgi--feat{ grid-column:auto; }
  .nearby__row{ padding:16px 20px; }
}

/* =====================================================================
   PROJECT v4 — specifications table + RERA/QR block
   ===================================================================== */
/* Specifications — two-column detailed table */
.spectable{ display:grid; grid-template-columns:1fr 1fr; gap:0 clamp(28px,4vw,64px); max-width:1000px; margin:0 auto; }
.specrow{ display:flex; justify-content:space-between; align-items:baseline; gap:18px; padding:18px 0; border-bottom:1px solid var(--gold-pale); }
.specrow__k{ font-size:13px; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-mute); font-weight:600; flex-shrink:0; }
.specrow__v{ font-size:15.5px; color:var(--ink); text-align:right; font-weight:400; }
@media (max-width:680px){ .spectable{ grid-template-columns:1fr; gap:0; } }

/* Proximity — categorized cards */
.prox{ display:grid; grid-template-columns:repeat(2,1fr); gap:18px; max-width:1040px; margin:0 auto; }
.proxcard{ background:#fff; border:1px solid var(--gold-pale); border-radius:16px; padding:30px 32px; transition:all .5s cubic-bezier(.7,0,.2,1); }
.proxcard:hover{ border-color:var(--gold-soft); transform:translateY(-4px); box-shadow:0 30px 60px -36px rgba(31,31,29,.22); }
.proxcard__head{ display:flex; align-items:center; gap:13px; margin-bottom:18px; }
.proxcard__ic{ width:42px; height:42px; border-radius:50%; background:var(--cream); border:1px solid var(--gold-pale); display:flex; align-items:center; justify-content:center; color:var(--gold-deep); flex-shrink:0; }
.proxcard__ic svg{ width:20px; height:20px; }
.proxcard__title{ font-size:17px; font-weight:500; color:var(--ink); margin:0; letter-spacing:-.01em; }
.proxcard__list{ list-style:none; padding:0; margin:0; }
.proxcard__list li{ display:flex; justify-content:space-between; align-items:baseline; gap:14px; padding:10px 0; border-top:1px solid var(--gold-pale); font-size:14.5px; color:var(--ink-soft); }
.proxcard__list li:first-child{ border-top:none; }
.proxcard__list b{ color:var(--gold-deep); font-weight:600; font-size:13px; white-space:nowrap; }
@media (max-width:680px){ .prox{ grid-template-columns:1fr; } }

/* RERA + QR elegant block */
.rerabox{ display:grid; grid-template-columns:auto 1fr auto; gap:clamp(24px,4vw,48px); align-items:center; max-width:920px; margin:0 auto; background:linear-gradient(160deg,#fff,var(--cream)); border:1px solid var(--gold-pale); border-radius:18px; padding:clamp(28px,3.5vw,44px); box-shadow:0 30px 70px -45px rgba(31,31,29,.2); }
.rerabox__qr{ width:120px; height:120px; border-radius:12px; overflow:hidden; border:1px solid var(--gold-pale); background:#fff; padding:8px; flex-shrink:0; }
.rerabox__qr img, .rerabox__qr svg{ width:100%; height:100%; display:block; }
.rerabox__mid{ }
.rerabox__label{ font-size:10.5px; letter-spacing:.28em; text-transform:uppercase; color:var(--gold-deep); font-weight:600; margin-bottom:8px; }
.rerabox__num{ font-size:clamp(20px,2.4vw,30px); font-weight:300; letter-spacing:.01em; color:var(--ink); margin:0 0 8px; word-break:break-all; }
.rerabox__note{ font-size:12.5px; color:var(--ink-mute); margin:0; line-height:1.55; }
.rerabox__maha{ text-align:center; flex-shrink:0; }
.rerabox__maha svg{ width:50px; height:50px; color:var(--gold-deep); margin-bottom:6px; }
.rerabox__maha span{ display:block; font-size:10px; letter-spacing:.18em; text-transform:uppercase; color:var(--ink-mute); font-weight:600; }
@media (max-width:760px){
  .rerabox{ grid-template-columns:1fr; text-align:center; justify-items:center; gap:20px; }
  .rerabox__num{ word-break:break-word; }
}

/* =====================================================================
   REDEVELOPMENT PAGE
   ===================================================================== */
.redev-intro{ display:grid; grid-template-columns:1.3fr 1fr; gap:clamp(40px,6vw,90px); align-items:center; }
.redev-intro__lead{ font-size:clamp(22px,2.4vw,34px); font-weight:300; line-height:1.4; letter-spacing:-.02em; color:var(--ink); margin:0; text-wrap:balance; }
.redev-intro__lead em{ font-style:normal; background:linear-gradient(135deg,var(--gold),var(--gold-deep)); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.redev-intro__side p{ font-size:15px; line-height:1.75; color:var(--ink-soft); margin:0 0 16px; }

/* Process timeline — interactive vertical steps */
.rsteps{ max-width:920px; margin:0 auto; position:relative; }
.rsteps::before{ content:""; position:absolute; left:31px; top:20px; bottom:20px; width:2px; background:linear-gradient(180deg,var(--gold-glow),var(--gold-pale)); }
.rstep{ display:grid; grid-template-columns:64px 1fr; gap:28px; padding:22px 0; position:relative; }
.rstep__dot{ width:64px; height:64px; border-radius:50%; background:#fff; border:2px solid var(--gold-pale); display:flex; align-items:center; justify-content:center; font-size:20px; font-weight:300; color:var(--gold-deep); z-index:2; transition:all .5s cubic-bezier(.7,0,.2,1); }
.rstep:hover .rstep__dot{ background:linear-gradient(135deg,var(--gold),var(--gold-deep)); color:#fff; border-color:var(--gold); transform:scale(1.08); box-shadow:0 16px 32px -12px rgba(190,154,78,.5); }
.rstep__body{ padding-top:6px; }
.rstep__t{ font-size:clamp(20px,2.2vw,26px); font-weight:400; letter-spacing:-.02em; color:var(--ink); margin:0 0 8px; }
.rstep__d{ font-size:15px; line-height:1.7; color:var(--ink-soft); margin:0; max-width:54ch; }

/* Benefits grid */
.rbenefits{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.rbenefit{ background:#fff; border:1px solid var(--gold-pale); border-radius:16px; padding:34px 30px; transition:all .5s cubic-bezier(.7,0,.2,1); }
.rbenefit:hover{ transform:translateY(-6px); border-color:var(--gold-soft); box-shadow:0 36px 70px -40px rgba(31,31,29,.24); }
.rbenefit__ic{ width:56px; height:56px; border-radius:50%; border:1.5px solid var(--gold-pale); display:flex; align-items:center; justify-content:center; color:var(--gold-deep); margin-bottom:22px; transition:all .55s ease; }
.rbenefit:hover .rbenefit__ic{ background:linear-gradient(135deg,var(--gold),var(--gold-deep)); color:#fff; border-color:var(--gold); transform:rotate(360deg); }
.rbenefit__ic svg{ width:24px; height:24px; }
.rbenefit h3{ font-size:21px; font-weight:500; color:var(--ink); margin:0 0 10px; letter-spacing:-.01em; }
.rbenefit p{ font-size:14.5px; line-height:1.65; color:var(--ink-soft); margin:0; }

/* Documents checklist */
.rdocs{ display:grid; grid-template-columns:repeat(2,1fr); gap:0 48px; max-width:920px; margin:0 auto; background:#fff; border:1px solid var(--gold-pale); border-radius:18px; padding:clamp(30px,4vw,48px); box-shadow:0 40px 80px -50px rgba(31,31,29,.2); }
.rdoc{ display:flex; align-items:center; gap:14px; padding:15px 0; border-bottom:1px solid var(--gold-pale); font-size:14.5px; color:var(--ink); }
.rdoc svg{ width:20px; height:20px; color:var(--gold); flex-shrink:0; }
@media (max-width:680px){ .rbenefits{ grid-template-columns:1fr; } .rdocs{ grid-template-columns:1fr; gap:0; } .redev-intro{ grid-template-columns:1fr; gap:32px; } }

/* =====================================================================
   SUSTAINABILITY PAGE
   ===================================================================== */
.susthero{ position:relative; min-height:78vh; display:flex; align-items:center; padding:160px 0 70px; overflow:hidden;
  background:radial-gradient(ellipse at 75% 25%,rgba(190,200,150,.3),transparent 55%),radial-gradient(ellipse at 18% 85%,rgba(140,170,110,.18),transparent 50%),linear-gradient(180deg,#fff,#F4F7EF); }
.susthero__inner{ position:relative; z-index:2; text-align:center; max-width:900px; margin:0 auto; }
.sustleaf{ width:60px; height:60px; margin:0 auto 26px; color:var(--gold-deep); }
.spillars{ display:grid; grid-template-columns:repeat(5,1fr); gap:16px; }
.spillar{ background:#fff; border:1px solid var(--gold-pale); border-radius:16px; padding:34px 22px 30px; text-align:center; transition:all .5s cubic-bezier(.7,0,.2,1); }
.spillar:hover{ transform:translateY(-8px); border-color:#A9C088; box-shadow:0 36px 70px -40px rgba(80,110,50,.3); }
.spillar__ic{ width:58px; height:58px; border-radius:50%; border:1.5px solid var(--gold-pale); display:flex; align-items:center; justify-content:center; color:var(--gold-deep); margin:0 auto 20px; transition:all .55s ease; }
.spillar:hover .spillar__ic{ background:linear-gradient(135deg,#9DBE6E,#5E7E3A); color:#fff; border-color:#7e9e50; transform:rotate(360deg); }
.spillar__ic svg{ width:24px; height:24px; }
.spillar h3{ font-size:16px; font-weight:500; color:var(--ink); margin:0 0 8px; line-height:1.25; }
.spillar p{ font-size:13px; line-height:1.6; color:var(--ink-soft); margin:0; }
.sustband{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(40px,6vw,90px); align-items:center; }
.sustband__txt h2{ font-size:clamp(28px,3.4vw,46px); font-weight:300; letter-spacing:-.03em; line-height:1.1; color:var(--ink); margin:0 0 22px; text-wrap:balance; }
.sustband__txt h2 em{ font-style:normal; color:var(--gold-deep); }
.sustband__txt p{ font-size:15.5px; line-height:1.75; color:var(--ink-soft); margin:0 0 18px; }
.sustband__img{ aspect-ratio:4/5; border-radius:18px; overflow:hidden; background:var(--cream); border:1px solid var(--gold-pale); box-shadow:0 50px 100px -50px rgba(31,31,29,.3); }
.sustband__img img{ width:100%; height:100%; object-fit:cover; }
@media (max-width:860px){ .spillars{ grid-template-columns:repeat(2,1fr); } .sustband{ grid-template-columns:1fr; gap:32px; } }
@media (max-width:520px){ .spillars{ grid-template-columns:1fr; } }

/* =====================================================================
   COUNTRYSIDE / CASUARINA PAGE
   ===================================================================== */
.cshero{ position:relative; min-height:88vh; display:flex; align-items:flex-end; overflow:hidden; background:var(--ink-deep); }
.cshero__img{ position:absolute; inset:0; }
.cshero__img img{ width:100%; height:100%; object-fit:cover; }
.cshero__img::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(20,20,19,.2) 0%,transparent 35%,rgba(20,20,19,.8) 100%); }
.cshero__inner{ position:relative; z-index:2; padding:0 0 70px; color:var(--pearl); }
.cshero__tag{ display:inline-block; background:rgba(255,255,255,.16); backdrop-filter:blur(8px); border:1px solid rgba(255,255,255,.3); color:#fff; font-size:11px; letter-spacing:.26em; text-transform:uppercase; padding:9px 18px; border-radius:999px; margin-bottom:22px; font-weight:500; }
.cshero__title{ font-size:clamp(46px,8vw,116px); font-weight:300; line-height:.98; letter-spacing:-.04em; margin:0 0 18px; color:#fff; text-wrap:balance; padding-bottom:.04em; }
.cshero__title em{ font-style:normal; color:var(--gold-glow); }
.cshero__sub{ font-size:clamp(15px,1.5vw,19px); color:rgba(255,255,255,.85); max-width:56ch; line-height:1.6; margin:0; }
.csfeat{ display:grid; grid-template-columns:repeat(4,1fr); gap:0; background:#fff; border:1px solid var(--gold-pale); border-radius:16px; overflow:hidden; box-shadow:0 40px 90px -50px rgba(31,31,29,.22); }
.csfeat__cell{ padding:clamp(28px,3vw,42px) clamp(18px,2vw,30px); border-right:1px solid var(--gold-pale); text-align:center; transition:background .4s ease; }
.csfeat__cell:last-child{ border-right:none; }
.csfeat__cell:hover{ background:var(--cream); }
.csfeat__n{ font-size:clamp(32px,3.5vw,48px); font-weight:200; letter-spacing:-.03em; background:linear-gradient(135deg,var(--gold-glow),var(--gold-deep)); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.csfeat__l{ font-size:12px; letter-spacing:.04em; color:var(--ink-soft); margin-top:8px; line-height:1.4; }
/* Casuarina home types — alternating rows */
.cstype{ display:grid; grid-template-columns:1fr 1fr; gap:0; border:1px solid var(--gold-pale); border-radius:20px; overflow:hidden; margin-bottom:28px; background:#fff; transition:box-shadow .5s ease; }
.cstype:hover{ box-shadow:0 40px 90px -50px rgba(31,31,29,.26); }
.cstype__img{ aspect-ratio:4/3; overflow:hidden; background:var(--cream); }
.cstype__img img{ width:100%; height:100%; object-fit:cover; transition:transform 1.3s cubic-bezier(.7,0,.2,1); }
.cstype:hover .cstype__img img{ transform:scale(1.05); }
.cstype__body{ padding:clamp(34px,4vw,60px); display:flex; flex-direction:column; justify-content:center; }
.cstype--flip .cstype__img{ order:2; }
.cstype__k{ font-size:11px; letter-spacing:.26em; text-transform:uppercase; color:var(--gold-deep); font-weight:600; margin-bottom:14px; }
.cstype__n{ font-size:clamp(28px,3.2vw,42px); font-weight:300; letter-spacing:-.025em; color:var(--ink); margin:0 0 16px; }
.cstype__n em{ font-style:normal; color:var(--gold-deep); }
.cstype__p{ font-size:15px; line-height:1.75; color:var(--ink-soft); margin:0; }
@media (max-width:860px){
  .csfeat{ grid-template-columns:repeat(2,1fr); }
  .csfeat__cell:nth-child(2){ border-right:none; }
  .csfeat__cell:nth-child(1),.csfeat__cell:nth-child(2){ border-bottom:1px solid var(--gold-pale); }
  .cstype{ grid-template-columns:1fr; }
  .cstype--flip .cstype__img{ order:0; }
}
@media (max-width:520px){ .csfeat{ grid-template-columns:1fr; } .csfeat__cell{ border-right:none; border-bottom:1px solid var(--gold-pale); } }


/* =====================================================================
   UNIVERSAL HEADING CLIP FIX — descenders & gradient italics never cut
   ===================================================================== */
.title, .title em, .hero__title, .hero__title em, .phero__title, .phero__title em,
.cta-end__title, .cta-end__title em, .pdhero__name, .pdhero__name em,
.cshero__title, .cshero__title em, .sustband__txt h2, .sustband__txt h2 em,
.philo__hash, .philo__hash .e, .lpanel__sanskrit, .lpanel__sanskrit em,
.featured__name, .featured__name em, .rstep__t, .cstype__n, .cstype__n em,
.broch__h, .broch__h em, .prac__name, .sc-panel__name, .hi5sum__hash, .hi5sum__hash .e{
  line-height: 1.15 !important;
  padding-bottom: 0.08em;
  overflow-wrap: break-word;
  word-break: normal;
  hyphens: none;
}
/* gradient (clipped-text) spans need inline-block + a touch more bottom room */
.title em, .cta-end__title em, .cshero__title em,
.philo__hash .e, .lpanel__sanskrit em, .featured__name em, .cstype__n em,
.broch__h em, .hi5sum__hash .e, .sustband__txt h2 em{
  display: inline-block;
  padding-bottom: 0.12em;
  line-height: 1.18 !important;
}

/* Project name: upright gold, never clipped */
.pdhero__name, .pdhero__name em{ font-style:normal !important; line-height:1.25 !important; padding-bottom:.18em; overflow:visible; }


/* =====================================================================
   GLOBAL: no italics anywhere — keep all type upright (layout unchanged)
   ===================================================================== */
em, i, cite, blockquote, address,
.title em, .hero__title em, .phero__title em, .cta-end__title em,
.quote__text em, .quote__text, .lede em, .stat__label,
.proj__count, .country-card__tag, .vert__num, .featured__name em,
.hi5sum__line em, .hi5row__name em, .pdhero__name em, .cshero__title em,
.cstype__n em, .broch__h em, .sustband__txt h2 em, .philo__hash .e,
.lpanel__sanskrit em, .lpanel__sanskrit, .mobile a, .story-intro__lead em,
.prac__index, .sc-panel__name, .hi5sum__hash .e, .ltab__name em,
.eyebrow .num, .vert__num, .proj__count, .country-card__tag, .featured__eyebrow,
.philo__pull, .philo__close p, .quote__attr{
  font-style: normal !important;
}


/* Sustainability header WITH background image (keeps menu/text visible) */
.susthero--img{ background-size:cover !important; background-position:center !important; background-repeat:no-repeat !important; }
.susthero--img::after{ content:""; position:absolute; inset:0; z-index:1; pointer-events:none; background:linear-gradient(180deg, rgba(9,16,7,.40) 0%, rgba(9,16,7,.18) 44%, rgba(7,12,5,.70) 100%); }
.susthero--img .phero__title, .susthero--img .phero__sub{ color:#fff; }
.susthero--img .phero__title em{ -webkit-text-fill-color:initial; background:none; color:var(--gold-glow); }
.susthero--img .phero__eyebrow{ color:var(--gold-glow); }
.susthero--img .sustleaf{ color:var(--gold-glow); }

/* =====================================================================
   CASUARINA COUNTRYSIDE PAGE v2 — dynamic, image-rich (original ratios)
   ===================================================================== */
/* Full-bleed waterfront hero */
.cas-hero{ position:relative; min-height:100vh; min-height:100svh; display:flex; align-items:flex-end; overflow:hidden; background:var(--ink-deep); }
.cas-hero__bg{ position:absolute; inset:0; }
.cas-hero__bg img{ width:100%; height:100%; object-fit:cover; }
.cas-hero__bg::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(20,20,19,.25) 0%, transparent 30%, rgba(20,20,19,.35) 60%, rgba(20,20,19,.85) 100%); }
.cas-hero__inner{ position:relative; z-index:2; width:var(--wrap); margin:0 auto; padding:0 0 80px; color:#fff; }
.cas-hero__tag{ display:inline-flex; align-items:center; gap:12px; font-size:11px; letter-spacing:.32em; text-transform:uppercase; color:var(--gold-glow); font-weight:600; margin-bottom:24px; padding:11px 20px; border:1px solid rgba(235,206,137,.4); border-radius:999px; background:rgba(20,20,19,.3); backdrop-filter:blur(8px); opacity:0; animation:fade 1s .3s forwards; }
.cas-hero__title{ font-size:clamp(48px,9vw,128px); font-weight:300; line-height:.98; letter-spacing:-.04em; margin:0 0 20px; padding-bottom:.05em; }
.cas-hero__title .w{ display:inline-block; opacity:0; transform:translateY(60px); animation:revealUp 1.1s cubic-bezier(.76,0,.24,1) forwards; }
.cas-hero__title .w:nth-child(1){ animation-delay:.4s; } .cas-hero__title .w:nth-child(2){ animation-delay:.54s; } .cas-hero__title .w:nth-child(3){ animation-delay:.68s; }
.cas-hero__sub{ font-size:clamp(16px,1.6vw,21px); color:rgba(255,255,255,.9); max-width:54ch; line-height:1.6; margin:0; opacity:0; animation:fade 1s 1s forwards; }
.cas-hero__scroll{ position:absolute; left:50%; bottom:28px; transform:translateX(-50%); z-index:3; font-size:10px; letter-spacing:.32em; text-transform:uppercase; color:rgba(255,255,255,.65); display:flex; flex-direction:column; align-items:center; gap:10px; opacity:0; animation:fade 1s 1.4s forwards; }
.cas-hero__scroll::after{ content:""; width:1px; height:42px; background:linear-gradient(180deg,var(--gold-glow),transparent); animation:scrollPulse 2.4s ease-in-out infinite; }

/* Intro manifesto */
.cas-intro{ text-align:center; max-width:880px; margin:0 auto; }
.cas-intro__big{ font-size:clamp(26px,3.4vw,46px); font-weight:300; line-height:1.35; letter-spacing:-.02em; color:var(--ink); margin:0 0 28px; text-wrap:balance; }
.cas-intro__big em{ font-style:normal; color:var(--gold-deep); }
.cas-intro__p{ font-size:clamp(15px,1.3vw,17px); line-height:1.8; color:var(--ink-soft); margin:0 auto 18px; max-width:62ch; }

/* Stat strip */
.cas-stats{ display:grid; grid-template-columns:repeat(4,1fr); gap:0; border:1px solid var(--gold-pale); border-radius:16px; overflow:hidden; background:#fff; box-shadow:0 40px 90px -50px rgba(31,31,29,.2); }
.cas-stat{ padding:clamp(28px,3vw,44px) 22px; text-align:center; border-right:1px solid var(--gold-pale); transition:background .4s; }
.cas-stat:last-child{ border-right:none; }
.cas-stat:hover{ background:var(--cream); }
.cas-stat b{ display:block; font-size:clamp(28px,3.2vw,44px); font-weight:200; letter-spacing:-.03em; background:linear-gradient(135deg,var(--gold-glow),var(--gold-deep)); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.cas-stat span{ font-size:11px; letter-spacing:.08em; color:var(--ink-soft); margin-top:8px; display:block; line-height:1.4; }

/* Alternating feature rows — image keeps NATURAL ratio (no crop) */
.cas-row{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(36px,5vw,80px); align-items:center; margin-bottom:clamp(70px,9vw,130px); }
.cas-row:last-child{ margin-bottom:0; }
.cas-row__media{ border-radius:18px; overflow:hidden; background:var(--cream); border:1px solid var(--gold-pale); box-shadow:0 40px 90px -50px rgba(31,31,29,.3); }
.cas-row__media img{ width:100%; height:auto; display:block; transition:transform 1.3s cubic-bezier(.7,0,.2,1); }
.cas-row__media:hover img{ transform:scale(1.04); }
.cas-row--flip .cas-row__media{ order:2; }
.cas-row__k{ font-size:11px; letter-spacing:.26em; text-transform:uppercase; color:var(--gold-deep); font-weight:600; margin-bottom:16px; display:flex; align-items:center; gap:12px; }
.cas-row__k::before{ content:""; width:26px; height:1px; background:var(--gold); }
.cas-row__n{ font-size:clamp(30px,4vw,52px); font-weight:300; letter-spacing:-.03em; line-height:1.05; color:var(--ink); margin:0 0 8px; padding-bottom:.04em; }
.cas-row__cfg{ font-size:13px; letter-spacing:.1em; text-transform:uppercase; color:var(--gold-deep); font-weight:600; margin-bottom:20px; }
.cas-row__p{ font-size:15.5px; line-height:1.8; color:var(--ink-soft); margin:0 0 18px; }
.cas-row__feat{ list-style:none; padding:0; margin:22px 0 0; display:grid; grid-template-columns:1fr 1fr; gap:10px 20px; }
.cas-row__feat li{ font-size:14px; color:var(--ink); display:flex; align-items:flex-start; gap:10px; line-height:1.45; }
.cas-row__feat svg{ width:17px; height:17px; color:var(--gold); flex-shrink:0; margin-top:2px; }

/* Gallery strip — varied natural-ratio images in a masonry */
.cas-gallery{ columns:3; column-gap:18px; }
.cas-gallery img{ width:100%; height:auto; display:block; border-radius:14px; margin-bottom:18px; border:1px solid var(--gold-pale); transition:transform .6s cubic-bezier(.7,0,.2,1), box-shadow .6s; break-inside:avoid; }
.cas-gallery img:hover{ transform:translateY(-5px); box-shadow:0 30px 60px -32px rgba(31,31,29,.3); }

/* Amenities band */
.cas-amen{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.cas-amen__item{ display:flex; align-items:flex-start; gap:14px; padding:24px; background:#fff; border:1px solid var(--gold-pale); border-radius:14px; transition:all .45s cubic-bezier(.7,0,.2,1); }
.cas-amen__item:hover{ transform:translateY(-4px); border-color:var(--gold-soft); box-shadow:0 26px 50px -32px rgba(31,31,29,.2); }
.cas-amen__ic{ width:42px; height:42px; border-radius:50%; border:1.5px solid var(--gold-pale); display:flex; align-items:center; justify-content:center; color:var(--gold-deep); flex-shrink:0; transition:all .45s; }
.cas-amen__item:hover .cas-amen__ic{ background:linear-gradient(135deg,var(--gold),var(--gold-deep)); color:#fff; border-color:var(--gold); }
.cas-amen__ic svg{ width:19px; height:19px; }
.cas-amen__t{ font-size:14.5px; color:var(--ink); font-weight:500; padding-top:9px; line-height:1.35; }

/* Location / distances table */
.cas-dist{ max-width:760px; margin:0 auto; border:1px solid var(--gold-pale); border-radius:16px; overflow:hidden; background:#fff; box-shadow:0 40px 80px -50px rgba(31,31,29,.2); }
.cas-dist__row{ display:flex; justify-content:space-between; align-items:center; padding:17px 28px; border-bottom:1px solid var(--gold-pale); transition:all .35s; }
.cas-dist__row:last-child{ border-bottom:none; }
.cas-dist__row:hover{ background:var(--cream); padding-left:34px; }
.cas-dist__row.is-nearest{ background:linear-gradient(90deg, var(--cream), transparent); }
.cas-dist__place{ font-size:15px; color:var(--ink); }
.cas-dist__km{ font-size:13px; color:var(--gold-deep); font-weight:600; padding:5px 14px; background:var(--cream); border-radius:999px; }

@media (max-width:960px){
  .cas-stats{ grid-template-columns:repeat(2,1fr); }
  .cas-stat:nth-child(2){ border-right:none; }
  .cas-stat:nth-child(1),.cas-stat:nth-child(2){ border-bottom:1px solid var(--gold-pale); }
  .cas-row{ grid-template-columns:1fr; gap:28px; }
  .cas-row--flip .cas-row__media{ order:0; }
  .cas-gallery{ columns:2; }
  .cas-amen{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:560px){
  .cas-stats{ grid-template-columns:1fr; }
  .cas-stat{ border-right:none; border-bottom:1px solid var(--gold-pale); }
  .cas-row__feat{ grid-template-columns:1fr; }
  .cas-gallery{ columns:1; }
  .cas-amen{ grid-template-columns:1fr; }
}

/* =====================================================================
   CASUARINA PROJECT SUBPAGES — specs, inventory, floor plan, enquiry
   ===================================================================== */
/* Project hero (image, dark) */
.cp-hero{ position:relative; min-height:92vh; min-height:92svh; display:flex; align-items:flex-end; overflow:hidden; background:var(--ink-deep); }
.cp-hero__bg{ position:absolute; inset:0; }
.cp-hero__bg img{ width:100%; height:100%; object-fit:cover; }
.cp-hero__bg::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(20,20,19,.3) 0%,transparent 32%,rgba(20,20,19,.4) 62%,rgba(20,20,19,.88) 100%); }
.cp-hero__inner{ position:relative; z-index:2; width:var(--wrap); margin:0 auto; padding:0 0 76px; color:#fff; }
.cp-hero__crumb{ font-size:12px; letter-spacing:.06em; color:rgba(255,255,255,.7); margin-bottom:22px; }
.cp-hero__crumb a{ color:var(--gold-glow); text-decoration:none; }
.cp-hero__tag{ display:inline-flex; align-items:center; gap:10px; font-size:11px; letter-spacing:.3em; text-transform:uppercase; color:var(--gold-glow); font-weight:600; margin-bottom:20px; padding:10px 18px; border:1px solid rgba(235,206,137,.4); border-radius:999px; background:rgba(20,20,19,.3); backdrop-filter:blur(8px); }
.cp-hero__title{ font-size:clamp(44px,8vw,108px); font-weight:300; line-height:1; letter-spacing:-.04em; margin:0 0 18px; padding-bottom:.05em; }
.cp-hero__title .w{ display:inline-block; opacity:0; transform:translateY(50px); animation:revealUp 1s cubic-bezier(.76,0,.24,1) forwards; }
.cp-hero__title .w:nth-child(1){animation-delay:.3s} .cp-hero__title .w:nth-child(2){animation-delay:.44s} .cp-hero__title .w:nth-child(3){animation-delay:.58s}
.cp-hero__sub{ font-size:clamp(15px,1.5vw,19px); color:rgba(255,255,255,.88); max-width:52ch; line-height:1.6; margin:0; opacity:0; animation:fade 1s .9s forwards; }

/* Quick facts bar */
.cp-facts{ display:grid; grid-template-columns:repeat(4,1fr); gap:0; border:1px solid var(--gold-pale); border-radius:16px; overflow:hidden; background:#fff; box-shadow:0 40px 90px -50px rgba(31,31,29,.2); }
.cp-fact{ padding:clamp(24px,2.6vw,38px) 20px; text-align:center; border-right:1px solid var(--gold-pale); }
.cp-fact:last-child{ border-right:none; }
.cp-fact b{ display:block; font-size:clamp(20px,2.2vw,30px); font-weight:300; color:var(--ink); letter-spacing:-.02em; }
.cp-fact span{ font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-mute); margin-top:7px; display:block; }

/* Intro split */
.cp-intro{ display:grid; grid-template-columns:1.15fr 1fr; gap:clamp(36px,5vw,80px); align-items:center; }
.cp-intro__lead{ font-size:clamp(24px,2.8vw,38px); font-weight:300; line-height:1.3; letter-spacing:-.02em; color:var(--ink); margin:0; text-wrap:balance; }
.cp-intro__lead em{ font-style:normal; color:var(--gold-deep); }
.cp-intro__body p{ font-size:15.5px; line-height:1.8; color:var(--ink-soft); margin:0 0 16px; }

/* Big feature image — natural ratio */
.cp-feature{ border-radius:20px; overflow:hidden; border:1px solid var(--gold-pale); background:var(--cream); box-shadow:0 50px 100px -55px rgba(31,31,29,.32); }
.cp-feature img{ width:100%; height:auto; display:block; }

/* Two-up image grid (natural ratios, equalized via row) */
.cp-duo{ display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.cp-duo__cell{ border-radius:16px; overflow:hidden; border:1px solid var(--gold-pale); background:var(--cream); }
.cp-duo__cell img{ width:100%; height:auto; display:block; transition:transform 1.2s cubic-bezier(.7,0,.2,1); }
.cp-duo__cell:hover img{ transform:scale(1.05); }
@media (max-width:760px){ .cp-duo{ grid-template-columns:1fr; } .cp-intro{ grid-template-columns:1fr; gap:28px; } .cp-facts{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:520px){ .cp-facts{ grid-template-columns:1fr; } .cp-fact{ border-right:none; border-bottom:1px solid var(--gold-pale); } }

/* Floor plan showcase */
.cp-plan{ display:grid; grid-template-columns:1.4fr 1fr; gap:clamp(32px,4vw,64px); align-items:center; }
.cp-plan__img{ border-radius:18px; overflow:hidden; border:1px solid var(--gold-pale); background:#fff; padding:18px; box-shadow:0 40px 90px -50px rgba(31,31,29,.22); }
.cp-plan__img img{ width:100%; height:auto; display:block; }
.cp-plan__dims{ list-style:none; padding:0; margin:0; }
.cp-plan__dims li{ display:flex; justify-content:space-between; align-items:baseline; gap:16px; padding:14px 0; border-bottom:1px solid var(--gold-pale); }
.cp-plan__dims li:last-child{ border-bottom:none; }
.cp-plan__dims .rm{ font-size:15px; color:var(--ink); font-weight:500; }
.cp-plan__dims .dm{ font-size:13px; color:var(--gold-deep); font-weight:600; }
@media (max-width:760px){ .cp-plan{ grid-template-columns:1fr; gap:26px; } }

/* Specifications accordion-grid */
.cp-specs{ display:grid; grid-template-columns:repeat(2,1fr); gap:18px; }
.cp-spec{ background:#fff; border:1px solid var(--gold-pale); border-radius:16px; padding:30px 32px; transition:all .5s cubic-bezier(.7,0,.2,1); }
.cp-spec:hover{ border-color:var(--gold-soft); transform:translateY(-4px); box-shadow:0 30px 60px -38px rgba(31,31,29,.2); }
.cp-spec__h{ display:flex; align-items:center; gap:13px; margin-bottom:16px; }
.cp-spec__ic{ width:40px; height:40px; border-radius:50%; background:var(--cream); border:1px solid var(--gold-pale); display:flex; align-items:center; justify-content:center; color:var(--gold-deep); flex-shrink:0; }
.cp-spec__ic svg{ width:19px; height:19px; }
.cp-spec__t{ font-size:16px; font-weight:600; color:var(--ink); margin:0; letter-spacing:.01em; }
.cp-spec__list{ list-style:none; padding:0; margin:0; }
.cp-spec__list li{ font-size:14px; line-height:1.5; color:var(--ink-soft); padding:7px 0 7px 20px; position:relative; }
.cp-spec__list li::before{ content:""; position:absolute; left:0; top:14px; width:6px; height:6px; border-radius:50%; background:var(--gold-soft); }
@media (max-width:680px){ .cp-specs{ grid-template-columns:1fr; } }

/* Inventory (furniture/white goods) grid */
.cp-inv{ display:grid; grid-template-columns:repeat(2,1fr); gap:0 48px; max-width:920px; margin:0 auto; background:#fff; border:1px solid var(--gold-pale); border-radius:18px; padding:clamp(28px,3.5vw,44px); box-shadow:0 40px 80px -50px rgba(31,31,29,.2); }
.cp-inv__row{ display:flex; justify-content:space-between; align-items:center; gap:14px; padding:13px 0; border-bottom:1px solid var(--gold-pale); }
.cp-inv__item{ font-size:14.5px; color:var(--ink); }
.cp-inv__qty{ font-size:12px; font-weight:600; color:var(--gold-deep); background:var(--cream); border-radius:999px; padding:4px 12px; white-space:nowrap; }
@media (max-width:680px){ .cp-inv{ grid-template-columns:1fr; gap:0; } }

/* Enquiry form */
.cp-enq{ background:linear-gradient(160deg,var(--ink-deep),#22211d); border-radius:24px; padding:clamp(36px,5vw,72px); position:relative; overflow:hidden; }
.cp-enq::before{ content:""; position:absolute; top:-40%; right:-10%; width:60%; height:140%; background:radial-gradient(ellipse,rgba(190,154,78,.18),transparent 65%); }
.cp-enq__grid{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(32px,5vw,72px); align-items:center; position:relative; z-index:2; }
.cp-enq__eyebrow{ font-size:11px; letter-spacing:.3em; text-transform:uppercase; color:var(--gold-glow); font-weight:600; margin-bottom:18px; }
.cp-enq__title{ font-size:clamp(28px,3.4vw,46px); font-weight:300; line-height:1.1; letter-spacing:-.03em; color:#fff; margin:0 0 18px; }
.cp-enq__title em{ font-style:normal; color:var(--gold-glow); }
.cp-enq__sub{ font-size:15px; line-height:1.7; color:rgba(255,255,255,.7); margin:0 0 24px; }
.cp-enq__addr{ font-size:13px; line-height:1.7; color:rgba(255,255,255,.55); border-top:1px solid rgba(255,255,255,.12); padding-top:20px; }
.cp-enq__addr b{ color:rgba(255,255,255,.8); font-weight:600; }
.cp-form{ display:grid; gap:14px; }
.cp-form__row{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.cp-field{ position:relative; }
.cp-field input, .cp-field select, .cp-field textarea{ width:100%; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.18); border-radius:11px; padding:15px 17px; font-family:inherit; font-size:14.5px; color:#fff; transition:all .3s; }
.cp-field input::placeholder, .cp-field textarea::placeholder{ color:rgba(255,255,255,.42); }
.cp-field select{ color:rgba(255,255,255,.7); cursor:pointer; appearance:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23EBCE89' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 16px center; }
.cp-field select option{ background:#22211d; color:#fff; }
.cp-field input:focus, .cp-field select:focus, .cp-field textarea:focus{ outline:none; border-color:var(--gold); background:rgba(255,255,255,.1); }
.cp-field textarea{ resize:vertical; min-height:84px; }
.cp-form__consent{ display:flex; align-items:flex-start; gap:10px; font-size:12px; color:rgba(255,255,255,.55); line-height:1.5; }
.cp-form__consent input{ margin-top:2px; accent-color:var(--gold); }
.cp-form button{ background:linear-gradient(135deg,var(--gold-glow),var(--gold-deep)); color:var(--ink-deep); border:none; border-radius:11px; padding:16px 28px; font-family:inherit; font-size:14px; font-weight:600; letter-spacing:.04em; cursor:pointer; display:inline-flex; align-items:center; justify-content:center; gap:9px; transition:all .4s cubic-bezier(.7,0,.2,1); }
.cp-form button:hover{ transform:translateY(-2px); box-shadow:0 18px 36px -14px rgba(235,206,137,.5); }
.cp-form button svg{ width:17px; height:17px; }
@media (max-width:860px){ .cp-enq__grid{ grid-template-columns:1fr; gap:36px; } }
@media (max-width:480px){ .cp-form__row{ grid-template-columns:1fr; } }

/* =====================================================================
   CASUARINA v3 — MAXED-OUT PREMIUM / EDITORIAL / DYNAMIC
   ===================================================================== */
/* ---- Cinematic hero with Ken-Burns + layered text ---- */
.csx-hero{ position:relative; min-height:100vh; min-height:100svh; display:flex; align-items:flex-end; overflow:hidden; background:#0d0d0c; }
.csx-hero__bg{ position:absolute; inset:0; overflow:hidden; }
.csx-hero__bg img{ width:100%; height:100%; object-fit:cover; transform:scale(1.08); animation:kenburns 20s ease-out infinite alternate; }
@keyframes kenburns{ 0%{transform:scale(1.08) translate(0,0)} 100%{transform:scale(1.18) translate(-2%,-1%)} }
.csx-hero__bg::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(13,13,12,.32) 0%,transparent 28%,rgba(13,13,12,.3) 58%,rgba(13,13,12,.9) 100%); }
.csx-hero__bg::before{ content:""; position:absolute; inset:0; z-index:1; background:radial-gradient(ellipse at 50% 120%,rgba(190,154,78,.25),transparent 60%); }
.csx-hero__inner{ position:relative; z-index:2; width:var(--wrap); margin:0 auto; padding:0 0 8vh; color:#fff; }
.csx-hero__kicker{ display:inline-flex; align-items:center; gap:14px; font-size:11px; letter-spacing:.36em; text-transform:uppercase; color:var(--gold-glow); font-weight:600; margin-bottom:28px; opacity:0; animation:fade 1.2s .3s forwards; }
.csx-hero__kicker::before{ content:""; width:40px; height:1px; background:var(--gold-glow); }
.csx-hero__title{ font-size:clamp(52px,10vw,150px); font-weight:200; line-height:.92; letter-spacing:-.045em; margin:0 0 28px; padding-bottom:.05em; }
.csx-hero__title .ln{ display:block; overflow:hidden; }
.csx-hero__title .ln span{ display:inline-block; transform:translateY(110%); animation:lineUp 1.3s cubic-bezier(.76,0,.24,1) forwards; }
.csx-hero__title .ln:nth-child(1) span{ animation-delay:.45s; }
.csx-hero__title .ln:nth-child(2) span{ animation-delay:.62s; }
.csx-hero__title em{ font-style:normal; background:linear-gradient(120deg,var(--gold-glow),#fff 60%); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
@keyframes lineUp{ to{transform:translateY(0)} }
.csx-hero__row{ display:flex; align-items:flex-end; justify-content:space-between; gap:40px; flex-wrap:wrap; opacity:0; animation:fade 1.2s 1.1s forwards; }
.csx-hero__sub{ font-size:clamp(16px,1.6vw,21px); color:rgba(255,255,255,.9); max-width:46ch; line-height:1.6; margin:0; }
.csx-hero__meta{ display:flex; gap:36px; }
.csx-hero__meta div b{ display:block; font-size:clamp(22px,2.4vw,32px); font-weight:300; color:#fff; letter-spacing:-.02em; }
.csx-hero__meta div span{ font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--gold-glow); }
.csx-scroll{ position:absolute; left:50%; bottom:26px; transform:translateX(-50%); z-index:3; font-size:10px; letter-spacing:.34em; text-transform:uppercase; color:rgba(255,255,255,.6); display:flex; flex-direction:column; align-items:center; gap:10px; opacity:0; animation:fade 1.2s 1.5s forwards; }
.csx-scroll::after{ content:""; width:1px; height:46px; background:linear-gradient(180deg,var(--gold-glow),transparent); animation:scrollPulse 2.4s ease-in-out infinite; }

/* ---- Marquee strip ---- */
.csx-marquee{ overflow:hidden; border-top:1px solid var(--gold-pale); border-bottom:1px solid var(--gold-pale); padding:22px 0; background:var(--cream); }
.csx-marquee__track{ display:flex; gap:60px; white-space:nowrap; animation:marqueeMove 32s linear infinite; width:max-content; }
.csx-marquee__track span{ font-size:clamp(18px,2vw,26px); font-weight:300; letter-spacing:-.01em; color:var(--ink); display:inline-flex; align-items:center; gap:60px; }
.csx-marquee__track span::after{ content:"✦"; color:var(--gold); font-size:14px; }
@keyframes marqueeMove{ to{ transform:translateX(-50%); } }

/* ---- Editorial intro: oversized pull ---- */
.csx-manifesto{ max-width:1000px; margin:0 auto; text-align:center; }
.csx-manifesto__big{ font-size:clamp(30px,4.4vw,62px); font-weight:200; line-height:1.22; letter-spacing:-.025em; color:var(--ink); margin:0 0 36px; text-wrap:balance; }
.csx-manifesto__big em{ font-style:normal; background:linear-gradient(120deg,var(--gold),var(--gold-deep)); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.csx-manifesto__cols{ display:grid; grid-template-columns:repeat(3,1fr); gap:36px; margin-top:48px; text-align:left; }
.csx-manifesto__cols p{ font-size:15px; line-height:1.8; color:var(--ink-soft); margin:0; padding-top:22px; border-top:1px solid var(--gold-pale); }
.csx-manifesto__cols p::first-line{ color:var(--gold-deep); }
@media (max-width:760px){ .csx-manifesto__cols{ grid-template-columns:1fr; gap:24px; } }

/* ---- Animated counters strip ---- */
.csx-counters{ display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(20px,3vw,50px); }
.csx-counter{ text-align:center; position:relative; }
.csx-counter:not(:last-child)::after{ content:""; position:absolute; right:calc(-1 * clamp(10px,1.5vw,25px)); top:20%; height:60%; width:1px; background:var(--gold-pale); }
.csx-counter b{ display:block; font-size:clamp(40px,6vw,82px); font-weight:200; letter-spacing:-.04em; line-height:1; background:linear-gradient(135deg,var(--gold-glow),var(--gold-deep)); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.csx-counter span{ font-size:12px; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-soft); margin-top:14px; display:block; }
@media (max-width:680px){ .csx-counters{ grid-template-columns:repeat(2,1fr); gap:36px 20px; } .csx-counter:nth-child(2)::after{ display:none; } }

/* ---- Residence showcase cards (big, hover-reveal) ---- */
.csx-res{ display:grid; gap:clamp(28px,4vw,56px); }
.csx-res__card{ position:relative; display:grid; grid-template-columns:1.05fr .95fr; align-items:stretch; gap:0; border-radius:24px; overflow:hidden; background:#fff; border:1px solid var(--gold-pale); box-shadow:0 30px 80px -55px rgba(31,31,29,.3); transition:transform .7s cubic-bezier(.7,0,.2,1), box-shadow .7s; }
.csx-res__card:hover{ transform:translateY(-8px); box-shadow:0 60px 120px -55px rgba(31,31,29,.4); }
.csx-res__media{ position:relative; overflow:hidden; min-height:440px; }
.csx-res__media img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform 1.4s cubic-bezier(.7,0,.2,1); }
.csx-res__card:hover .csx-res__media img{ transform:scale(1.07); }
.csx-res__num{ position:absolute; top:24px; left:26px; z-index:3; font-size:13px; letter-spacing:.2em; color:#fff; font-weight:600; mix-blend-mode:difference; }
.csx-res__body{ padding:clamp(34px,4vw,64px); display:flex; flex-direction:column; justify-content:center; }
.csx-res__card--flip{ grid-template-columns:.95fr 1.05fr; }
.csx-res__card--flip .csx-res__media{ order:2; }
.csx-res__k{ font-size:11px; letter-spacing:.26em; text-transform:uppercase; color:var(--gold-deep); font-weight:600; margin-bottom:16px; }
.csx-res__n{ font-size:clamp(30px,4vw,54px); font-weight:300; letter-spacing:-.03em; line-height:1.02; color:var(--ink); margin:0 0 6px; padding-bottom:.04em; }
.csx-res__cfg{ font-size:12.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-mute); font-weight:600; margin-bottom:20px; }
.csx-res__p{ font-size:15px; line-height:1.78; color:var(--ink-soft); margin:0 0 22px; }
.csx-res__feat{ list-style:none; padding:0; margin:0 0 28px; display:grid; grid-template-columns:1fr 1fr; gap:9px 18px; }
.csx-res__feat li{ font-size:13.5px; color:var(--ink); display:flex; gap:9px; align-items:flex-start; line-height:1.4; }
.csx-res__feat svg{ width:16px; height:16px; color:var(--gold); flex-shrink:0; margin-top:2px; }
@media (max-width:860px){
  .csx-res__card, .csx-res__card--flip{ grid-template-columns:1fr; }
  .csx-res__card--flip .csx-res__media{ order:0; }
  .csx-res__media{ min-height:300px; }
  .csx-res__feat{ grid-template-columns:1fr; }
}

/* ---- Sticky section label nav ---- */
.csx-jump{ position:sticky; top:78px; z-index:40; display:flex; justify-content:center; gap:6px; padding:14px 0; background:rgba(255,255,255,.82); backdrop-filter:blur(14px); border-bottom:1px solid var(--gold-pale); margin-bottom:0; }
.csx-jump a{ font-size:12px; letter-spacing:.04em; color:var(--ink-soft); text-decoration:none; padding:8px 18px; border-radius:999px; transition:all .35s; white-space:nowrap; }
.csx-jump a:hover{ background:var(--cream); color:var(--gold-deep); }
.csx-jump a.is-active{ background:var(--ink); color:#fff; }
@media (max-width:680px){ .csx-jump{ overflow-x:auto; justify-content:flex-start; padding:12px 16px; } .csx-jump::-webkit-scrollbar{display:none;} }

/* ---- Image sections: ratio-aware ---- */
/* Full-bleed cinematic band */
.csx-band{ position:relative; height:min(78vh,720px); overflow:hidden; }
.csx-band img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.csx-band__cap{ position:absolute; left:0; bottom:0; z-index:2; padding:clamp(30px,5vw,70px); color:#fff; }
.csx-band::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 40%,rgba(13,13,12,.78)); }
.csx-band__cap .k{ font-size:11px; letter-spacing:.3em; text-transform:uppercase; color:var(--gold-glow); font-weight:600; margin-bottom:10px; }
.csx-band__cap .t{ font-size:clamp(26px,4vw,52px); font-weight:300; letter-spacing:-.03em; margin:0; max-width:20ch; }

/* Portrait + text (for tall images that don't pair) */
.csx-portrait{ display:grid; grid-template-columns:.85fr 1.15fr; gap:clamp(36px,5vw,80px); align-items:center; }
.csx-portrait--flip{ grid-template-columns:1.15fr .85fr; }
.csx-portrait--flip .csx-portrait__img{ order:2; }
.csx-portrait__img{ border-radius:20px; overflow:hidden; border:1px solid var(--gold-pale); background:var(--cream); box-shadow:0 50px 100px -55px rgba(31,31,29,.32); }
.csx-portrait__img img{ width:100%; height:auto; display:block; }
@media (max-width:760px){ .csx-portrait,.csx-portrait--flip{ grid-template-columns:1fr; gap:28px; } .csx-portrait--flip .csx-portrait__img{ order:0; } }

/* Equal-ratio pair (only pair images of SAME orientation) */
.csx-pair{ display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.csx-pair__cell{ border-radius:18px; overflow:hidden; border:1px solid var(--gold-pale); background:var(--cream); }
.csx-pair__cell img{ width:100%; height:auto; display:block; transition:transform 1.2s cubic-bezier(.7,0,.2,1); }
.csx-pair__cell:hover img{ transform:scale(1.05); }
@media (max-width:680px){ .csx-pair{ grid-template-columns:1fr; } }

/* Masonry gallery (mixed ratios sit naturally) */
.csx-mason{ columns:3; column-gap:18px; }
.csx-mason img{ width:100%; height:auto; display:block; border-radius:14px; margin-bottom:18px; border:1px solid var(--gold-pale); break-inside:avoid; transition:transform .6s cubic-bezier(.7,0,.2,1), box-shadow .6s; cursor:zoom-in; }
.csx-mason img:hover{ transform:translateY(-6px) scale(1.01); box-shadow:0 36px 70px -38px rgba(31,31,29,.34); }
@media (max-width:860px){ .csx-mason{ columns:2; } }
@media (max-width:520px){ .csx-mason{ columns:1; } }

/* Lightbox */
.csx-lb{ position:fixed; inset:0; z-index:1000; background:rgba(13,13,12,.94); display:none; align-items:center; justify-content:center; padding:5vw; cursor:zoom-out; opacity:0; transition:opacity .4s; }
.csx-lb.open{ display:flex; opacity:1; }
.csx-lb img{ max-width:100%; max-height:90vh; border-radius:8px; box-shadow:0 40px 120px rgba(0,0,0,.6); }

/* Specs (reuse cp-spec but tighten heading) */
.csx-amen2{ display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
.csx-amen2__item{ background:#fff; border:1px solid var(--gold-pale); border-radius:14px; padding:26px 22px; transition:all .5s cubic-bezier(.7,0,.2,1); text-align:center; }
.csx-amen2__item:hover{ transform:translateY(-6px); border-color:var(--gold-soft); box-shadow:0 30px 56px -36px rgba(31,31,29,.24); }
.csx-amen2__ic{ width:50px; height:50px; border-radius:50%; border:1.5px solid var(--gold-pale); display:flex; align-items:center; justify-content:center; color:var(--gold-deep); margin:0 auto 16px; transition:all .5s; }
.csx-amen2__item:hover .csx-amen2__ic{ background:linear-gradient(135deg,var(--gold),var(--gold-deep)); color:#fff; border-color:var(--gold); transform:rotate(360deg); }
.csx-amen2__ic svg{ width:22px; height:22px; }
.csx-amen2__t{ font-size:14px; color:var(--ink); font-weight:500; line-height:1.3; }
@media (max-width:860px){ .csx-amen2{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:420px){ .csx-amen2{ grid-template-columns:1fr; } }
.cp-plan__imgs{ display:grid; gap:0; }

/* =====================================================================
   ONGOING PROJECTS PAGE — dynamic, filterable, interactive
   ===================================================================== */
/* Hero */
.op-hero{ position:relative; padding:170px 0 70px; overflow:hidden; background:linear-gradient(180deg,#fff,var(--cream)); }
.op-hero__inner{ max-width:940px; }
.op-hero__eyebrow{ font-size:11px; letter-spacing:.32em; text-transform:uppercase; color:var(--gold-deep); font-weight:600; margin-bottom:22px; }
.op-hero__title{ font-size:clamp(40px,6vw,86px); font-weight:300; line-height:1.04; letter-spacing:-.035em; color:var(--ink); margin:0 0 26px; padding-bottom:.04em; text-wrap:balance; }
.op-hero__title em{ font-style:normal; background:linear-gradient(120deg,var(--gold),var(--gold-deep)); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.op-hero__sub{ font-size:clamp(16px,1.5vw,20px); line-height:1.7; color:var(--ink-soft); max-width:60ch; margin:0; }

/* Stat row */
.op-stats{ display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(16px,3vw,44px); margin-top:54px; }
.op-stat b{ display:block; font-size:clamp(36px,5vw,64px); font-weight:200; letter-spacing:-.04em; line-height:1; background:linear-gradient(135deg,var(--gold-glow),var(--gold-deep)); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.op-stat span{ font-size:12px; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-soft); margin-top:12px; display:block; }
@media (max-width:680px){ .op-stats{ grid-template-columns:repeat(2,1fr); gap:32px 20px; } }

/* Marquee */
.op-marquee{ overflow:hidden; border-top:1px solid var(--gold-pale); border-bottom:1px solid var(--gold-pale); padding:20px 0; background:#fff; }
.op-marquee__track{ display:flex; gap:48px; white-space:nowrap; width:max-content; animation:marqueeMove 40s linear infinite; }
.op-marquee__track span{ font-size:clamp(15px,1.6vw,20px); font-weight:400; color:var(--ink); display:inline-flex; align-items:center; gap:48px; }
.op-marquee__track span::after{ content:"✦"; color:var(--gold); font-size:11px; }
.op-marquee:hover .op-marquee__track{ animation-play-state:paused; }

/* Featured spotlight */
.op-feat{ display:grid; grid-template-columns:1.1fr .9fr; gap:0; border-radius:24px; overflow:hidden; border:1px solid var(--gold-pale); background:#fff; box-shadow:0 40px 90px -55px rgba(31,31,29,.3); }
.op-feat__media{ position:relative; min-height:480px; overflow:hidden; }
.op-feat__media img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform 1.4s cubic-bezier(.7,0,.2,1); }
.op-feat:hover .op-feat__media img{ transform:scale(1.06); }
.op-feat__badge{ position:absolute; top:24px; left:24px; z-index:2; background:rgba(20,20,19,.55); backdrop-filter:blur(8px); color:var(--gold-glow); font-size:10.5px; letter-spacing:.2em; text-transform:uppercase; font-weight:600; padding:9px 16px; border-radius:999px; border:1px solid rgba(235,206,137,.3); }
.op-feat__body{ padding:clamp(36px,4vw,68px); display:flex; flex-direction:column; justify-content:center; }
.op-feat__k{ font-size:11px; letter-spacing:.26em; text-transform:uppercase; color:var(--gold-deep); font-weight:600; margin-bottom:16px; }
.op-feat__n{ font-size:clamp(30px,4vw,52px); font-weight:300; letter-spacing:-.03em; line-height:1.04; color:var(--ink); margin:0 0 18px; padding-bottom:.04em; }
.op-feat__n em{ font-style:normal; color:var(--gold-deep); }
.op-feat__p{ font-size:15.5px; line-height:1.75; color:var(--ink-soft); margin:0 0 26px; }
.op-feat__specs{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-bottom:30px; }
.op-feat__spec b{ display:block; font-size:clamp(18px,2vw,24px); font-weight:300; color:var(--ink); letter-spacing:-.02em; }
.op-feat__spec span{ font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-mute); margin-top:6px; display:block; }
@media (max-width:860px){ .op-feat{ grid-template-columns:1fr; } .op-feat__media{ min-height:320px; } }

/* Filter bar */
.op-filters{ display:flex; flex-wrap:wrap; gap:10px; justify-content:center; margin-bottom:44px; }
.op-filter{ font-size:13.5px; letter-spacing:.02em; color:var(--ink-soft); background:#fff; border:1px solid var(--gold-pale); border-radius:999px; padding:11px 24px; cursor:pointer; transition:all .4s cubic-bezier(.7,0,.2,1); font-family:inherit; }
.op-filter:hover{ border-color:var(--gold-soft); color:var(--gold-deep); }
.op-filter.is-active{ background:var(--ink); color:#fff; border-color:var(--ink); }
.op-filter b{ font-weight:600; opacity:.6; margin-left:6px; }

/* Project grid */
.op-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.op-card{ position:relative; display:block; border-radius:20px; overflow:hidden; background:#fff; border:1px solid var(--gold-pale); text-decoration:none; transition:transform .6s cubic-bezier(.7,0,.2,1),box-shadow .6s,opacity .5s,scale .5s; }
.op-card:hover{ transform:translateY(-8px); box-shadow:0 44px 90px -50px rgba(31,31,29,.36); }
.op-card.is-hidden{ display:none; }
.op-card__media{ position:relative; aspect-ratio:4/3; overflow:hidden; background:var(--cream); }
.op-card__media img{ width:100%; height:100%; object-fit:cover; transition:transform 1.3s cubic-bezier(.7,0,.2,1); }
.op-card:hover .op-card__media img{ transform:scale(1.08); }
.op-card__idx{ position:absolute; top:16px; left:18px; z-index:2; font-size:11px; letter-spacing:.16em; color:#fff; font-weight:600; mix-blend-mode:difference; }
.op-card__tag{ position:absolute; top:14px; right:14px; z-index:2; background:rgba(255,255,255,.92); backdrop-filter:blur(6px); color:var(--gold-deep); font-size:10px; letter-spacing:.12em; text-transform:uppercase; font-weight:600; padding:6px 12px; border-radius:999px; }
.op-card__body{ padding:24px 26px 28px; }
.op-card__cfg{ font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-mute); font-weight:600; margin-bottom:9px; }
.op-card__n{ font-size:24px; font-weight:400; letter-spacing:-.02em; color:var(--ink); margin:0 0 4px; }
.op-card__loc{ font-size:14px; color:var(--ink-soft); margin:0 0 16px; }
.op-card__foot{ display:flex; justify-content:space-between; align-items:center; padding-top:15px; border-top:1px solid var(--gold-pale); }
.op-card__verify{ font-size:11.5px; letter-spacing:.06em; color:var(--gold-deep); font-weight:600; display:flex; align-items:center; gap:6px; }
.op-card__verify svg{ width:14px; height:14px; }
.op-card__poss{ font-size:12px; color:var(--ink-mute); }
.op-card__arrow{ width:34px; height:34px; border-radius:50%; border:1px solid var(--gold-pale); display:flex; align-items:center; justify-content:center; color:var(--gold-deep); transition:all .4s; }
.op-card:hover .op-card__arrow{ background:var(--gold); color:#fff; border-color:var(--gold); }
.op-card__arrow svg{ width:15px; height:15px; }
@media (max-width:980px){ .op-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:600px){ .op-grid{ grid-template-columns:1fr; } }

/* Neighbourhood section */
.op-hoods{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.op-hood{ background:#fff; border:1px solid var(--gold-pale); border-radius:18px; padding:34px 32px; transition:all .5s cubic-bezier(.7,0,.2,1); }
.op-hood:hover{ transform:translateY(-6px); border-color:var(--gold-soft); box-shadow:0 36px 70px -42px rgba(31,31,29,.24); }
.op-hood__count{ font-size:clamp(34px,4vw,52px); font-weight:200; line-height:1; letter-spacing:-.03em; background:linear-gradient(135deg,var(--gold-glow),var(--gold-deep)); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; margin-bottom:14px; }
.op-hood__n{ font-size:22px; font-weight:500; color:var(--ink); margin:0 0 6px; letter-spacing:-.01em; }
.op-hood__d{ font-size:13px; line-height:1.55; color:var(--ink-mute); margin:0 0 20px; }
.op-hood__list{ list-style:none; padding:0; margin:0; }
.op-hood__list li{ display:flex; justify-content:space-between; gap:12px; padding:10px 0; border-top:1px solid var(--gold-pale); font-size:13.5px; color:var(--ink); }
.op-hood__list li span{ color:var(--ink-mute); font-size:12.5px; }
@media (max-width:860px){ .op-hoods{ grid-template-columns:1fr; } }

/* FAQ accordion */
.op-faq{ max-width:860px; margin:0 auto; }
.op-faq__item{ border-bottom:1px solid var(--gold-pale); }
.op-faq__q{ width:100%; text-align:left; background:none; border:none; font-family:inherit; font-size:clamp(16px,1.8vw,20px); font-weight:500; color:var(--ink); padding:26px 44px 26px 0; cursor:pointer; position:relative; transition:color .3s; }
.op-faq__q:hover{ color:var(--gold-deep); }
.op-faq__q::after{ content:"+"; position:absolute; right:8px; top:50%; transform:translateY(-50%); font-size:24px; font-weight:300; color:var(--gold-deep); transition:transform .4s; }
.op-faq__item.is-open .op-faq__q::after{ transform:translateY(-50%) rotate(45deg); }
.op-faq__a{ max-height:0; overflow:hidden; transition:max-height .5s cubic-bezier(.7,0,.2,1); }
.op-faq__a p{ font-size:15px; line-height:1.8; color:var(--ink-soft); margin:0 0 26px; max-width:72ch; }
.op-faq__item.is-open .op-faq__a{ max-height:340px; }

/* =====================================================================
   PROJECT PAGES v2 — richer, more colour, amenity + connectivity + RERA
   ===================================================================== */
/* Tinted section backgrounds to break the all-white feel */
.sec--ink{ background:linear-gradient(165deg,#1b1b19,#26241f); color:#fff; }
.sec--ink .title{ color:#fff; } .sec--ink .lede{ color:rgba(255,255,255,.7); }
.sec--ink .eyebrow{ color:var(--gold-glow); }
.sec--gold{ background:linear-gradient(160deg,var(--gold-pale),#F3EAD6); }
.sec--sage{ background:linear-gradient(160deg,#F0F2EC,#E7EBDF); }

/* Amenity cards WITH descriptions (rich) */
.pa-amen{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.pa-amen__item{ background:#fff; border:1px solid var(--gold-pale); border-radius:16px; padding:30px 28px; transition:all .5s cubic-bezier(.7,0,.2,1); position:relative; overflow:hidden; }
.pa-amen__item::before{ content:""; position:absolute; left:0; top:0; height:100%; width:3px; background:linear-gradient(180deg,var(--gold-glow),var(--gold-deep)); transform:scaleY(0); transform-origin:top; transition:transform .5s; }
.pa-amen__item:hover{ transform:translateY(-5px); box-shadow:0 32px 60px -40px rgba(31,31,29,.26); border-color:var(--gold-soft); }
.pa-amen__item:hover::before{ transform:scaleY(1); }
.pa-amen__ic{ width:46px; height:46px; border-radius:13px; background:var(--cream); display:flex; align-items:center; justify-content:center; color:var(--gold-deep); margin-bottom:18px; transition:all .5s; }
.pa-amen__item:hover .pa-amen__ic{ background:linear-gradient(135deg,var(--gold),var(--gold-deep)); color:#fff; }
.pa-amen__ic svg{ width:22px; height:22px; }
.pa-amen__t{ font-size:16px; font-weight:600; color:var(--ink); margin:0 0 9px; letter-spacing:-.01em; }
.pa-amen__d{ font-size:13.5px; line-height:1.6; color:var(--ink-soft); margin:0; }
@media (max-width:860px){ .pa-amen{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px){ .pa-amen{ grid-template-columns:1fr; } }

/* Configurations cards */
.pa-config{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.pa-config.pa-config--2{ grid-template-columns:repeat(2,1fr); max-width:840px; margin:0 auto; }
.pa-config.pa-config--1{ grid-template-columns:1fr; max-width:460px; margin:0 auto; }
.pa-cfg{ background:#fff; border:1px solid var(--gold-pale); border-radius:20px; padding:36px 32px; transition:all .5s cubic-bezier(.7,0,.2,1); position:relative; }
.pa-cfg:hover{ transform:translateY(-6px); box-shadow:0 40px 80px -46px rgba(31,31,29,.3); border-color:var(--gold-soft); }
.pa-cfg__badge{ position:absolute; top:-11px; left:32px; background:linear-gradient(135deg,var(--gold),var(--gold-deep)); color:#fff; font-size:10px; letter-spacing:.14em; text-transform:uppercase; font-weight:600; padding:6px 14px; border-radius:999px; }
.pa-cfg__k{ font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:var(--ink-mute); font-weight:600; margin-bottom:8px; }
.pa-cfg__n{ font-size:clamp(34px,4vw,46px); font-weight:300; letter-spacing:-.03em; color:var(--ink); margin:0 0 18px; line-height:1; }
.pa-cfg__n span{ font-size:.4em; color:var(--gold-deep); letter-spacing:.05em; }
.pa-cfg__desc{ font-size:13.5px; line-height:1.6; color:var(--ink-soft); margin:0 0 22px; padding-bottom:22px; border-bottom:1px solid var(--gold-pale); }
.pa-cfg__rows{ display:grid; gap:12px; }
.pa-cfg__row{ display:flex; justify-content:space-between; align-items:baseline; gap:14px; }
.pa-cfg__row .l{ font-size:12px; letter-spacing:.04em; text-transform:uppercase; color:var(--ink-mute); }
.pa-cfg__row .v{ font-size:14.5px; color:var(--ink); font-weight:500; text-align:right; }
.pa-cfg__row .v b{ background:linear-gradient(135deg,var(--gold-glow),var(--gold-deep)); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; font-weight:600; }
@media (max-width:820px){ .pa-config, .pa-config.pa-config--2, .pa-config.pa-config--1{ grid-template-columns:1fr; max-width:480px; margin:0 auto; } }

/* Connectivity — 4 categories */
.pa-conn{ display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.pa-conn__col{ background:#fff; border:1px solid var(--gold-pale); border-radius:16px; padding:28px 26px; }
.pa-conn__h{ display:flex; align-items:center; gap:11px; margin-bottom:18px; padding-bottom:16px; border-bottom:1px solid var(--gold-pale); }
.pa-conn__h svg{ width:20px; height:20px; color:var(--gold-deep); }
.pa-conn__h b{ font-size:13px; letter-spacing:.08em; text-transform:uppercase; color:var(--ink); font-weight:600; }
.pa-conn__col ul{ list-style:none; padding:0; margin:0; }
.pa-conn__col li{ display:flex; justify-content:space-between; gap:12px; padding:9px 0; font-size:13.5px; color:var(--ink-soft); }
.pa-conn__col li span{ color:var(--gold-deep); font-weight:600; white-space:nowrap; font-size:12.5px; }
@media (max-width:860px){ .pa-conn{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:480px){ .pa-conn{ grid-template-columns:1fr; } }

/* RERA verify block */
.pa-rera{ display:grid; grid-template-columns:.85fr 1.15fr; gap:clamp(32px,4vw,64px); align-items:center; }
.pa-rera__qr{ background:#fff; border:1px solid var(--gold-pale); border-radius:20px; padding:38px; text-align:center; box-shadow:0 40px 80px -50px rgba(31,31,29,.24); }
.pa-rera__qr img{ width:190px; height:190px; border-radius:12px; }
.pa-rera__qr .num{ font-size:14px; letter-spacing:.06em; color:var(--ink); font-weight:600; margin-top:18px; }
.pa-rera__qr .scan{ font-size:12px; color:var(--ink-mute); margin-top:6px; }
.pa-rera__table{ display:grid; grid-template-columns:1fr 1fr; gap:0; }
.pa-rera__row{ padding:16px 4px; border-bottom:1px solid var(--gold-pale); }
.pa-rera__row .l{ font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-mute); display:block; margin-bottom:5px; }
.pa-rera__row .v{ font-size:14.5px; color:var(--ink); font-weight:500; }
@media (max-width:760px){ .pa-rera{ grid-template-columns:1fr; gap:30px; } .pa-rera__qr{ max-width:300px; margin:0 auto; } }
@media (max-width:440px){ .pa-rera__table{ grid-template-columns:1fr; } }

/* Site-visit steps */
.pa-steps{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.pa-step{ position:relative; padding:34px 30px; background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.12); border-radius:18px; }
.pa-step__n{ font-size:13px; letter-spacing:.2em; color:var(--gold-glow); font-weight:600; margin-bottom:16px; }
.pa-step__t{ font-size:19px; font-weight:500; color:#fff; margin:0 0 10px; }
.pa-step__d{ font-size:14px; line-height:1.6; color:rgba(255,255,255,.65); margin:0; }
@media (max-width:760px){ .pa-steps{ grid-template-columns:1fr; } }

/* =====================================================================
   PROJECT PAGES v3 — PASTEL + WHITE (no dark patches)
   Order: header → RERA patch → 3:4 image + overview → rest
   ===================================================================== */
/* Light pastel hero (header). Ready to receive a bg image later. */
.pj-hero{ position:relative; padding:160px 0 64px; overflow:hidden; background:linear-gradient(165deg,#FFFFFF 0%,#FAF9F6 45%,#F3EAD6 100%); }
.pj-hero::before{ content:""; position:absolute; top:-30%; right:-8%; width:55%; height:150%; background:radial-gradient(ellipse,rgba(235,206,137,.28),transparent 62%); pointer-events:none; }
.pj-hero::after{ content:""; position:absolute; left:-6%; bottom:-40%; width:42%; height:120%; background:radial-gradient(ellipse,rgba(224,231,221,.5),transparent 65%); pointer-events:none; }
.pj-hero__inner{ position:relative; z-index:2; max-width:1000px; }
.pj-hero__crumb{ font-size:12.5px; letter-spacing:.04em; color:var(--ink-soft); margin-bottom:20px; }
.pj-hero__crumb a{ color:var(--gold-deep); text-decoration:none; }
.pj-hero__tag{ display:inline-flex; align-items:center; gap:10px; font-size:11px; letter-spacing:.28em; text-transform:uppercase; color:var(--gold-deep); font-weight:600; margin-bottom:22px; padding:10px 18px; border:1px solid var(--gold-soft); border-radius:999px; background:rgba(255,255,255,.6); }
.pj-hero__title{ font-size:clamp(44px,7vw,96px); font-weight:300; line-height:1.0; letter-spacing:-.04em; color:var(--ink); margin:0 0 20px; padding-bottom:.05em; }
.pj-hero__title em{ font-style:normal; background:linear-gradient(120deg,var(--gold),var(--gold-deep)); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.pj-hero__addr{ font-size:15px; letter-spacing:.02em; color:var(--gold-deep); font-weight:600; margin:0 0 18px; }
.pj-hero__sub{ font-size:clamp(15px,1.5vw,18px); line-height:1.7; color:var(--ink-soft); max-width:62ch; margin:0; }
.pj-hero__facts{ display:flex; flex-wrap:wrap; gap:14px; margin-top:34px; }
.pj-hero__fact{ background:rgba(255,255,255,.7); border:1px solid var(--gold-pale); border-radius:14px; padding:16px 24px; }
.pj-hero__fact b{ display:block; font-size:clamp(18px,2vw,24px); font-weight:400; color:var(--ink); letter-spacing:-.02em; }
.pj-hero__fact span{ font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-mute); margin-top:5px; display:block; }

/* PROMINENT RERA PATCH — right below header */
.pj-rera{ margin-top:-34px; position:relative; z-index:5; }
.pj-rera__card{ display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:clamp(24px,4vw,52px); background:#fff; border:1px solid var(--gold-soft); border-radius:20px; padding:clamp(24px,3vw,38px) clamp(28px,4vw,48px); box-shadow:0 40px 90px -55px rgba(31,31,29,.3); }
.pj-rera__qr{ width:122px; height:122px; border-radius:14px; border:1px solid var(--gold-pale); padding:8px; background:#fff; flex-shrink:0; }
.pj-rera__qr img{ width:100%; height:100%; display:block; }
.pj-rera__mid .lbl{ font-size:11px; letter-spacing:.24em; text-transform:uppercase; color:var(--gold-deep); font-weight:600; margin-bottom:10px; }
.pj-rera__num{ font-size:clamp(26px,3.6vw,44px); font-weight:300; letter-spacing:.01em; color:var(--ink); line-height:1; }
.pj-rera__mid p{ font-size:13.5px; color:var(--ink-soft); margin:12px 0 0; }
.pj-rera__verify{ text-align:center; }
.pj-rera__verify a{ display:inline-flex; align-items:center; gap:9px; background:linear-gradient(135deg,var(--gold-glow),var(--gold-deep)); color:#fff; text-decoration:none; font-size:13px; font-weight:600; letter-spacing:.03em; padding:14px 26px; border-radius:11px; transition:all .4s cubic-bezier(.7,0,.2,1); white-space:nowrap; }
.pj-rera__verify a:hover{ transform:translateY(-2px); box-shadow:0 16px 30px -12px rgba(143,110,44,.5); }
.pj-rera__verify a svg{ width:16px; height:16px; }
.pj-rera__verify small{ display:block; margin-top:10px; font-size:11px; color:var(--ink-mute); letter-spacing:.06em; }
@media (max-width:820px){ .pj-rera__card{ grid-template-columns:1fr; text-align:center; gap:22px; } .pj-rera__qr{ margin:0 auto; } }

/* 3:4 IMAGE + PROJECT OVERVIEW */
.pj-over{ display:grid; grid-template-columns:.82fr 1.18fr; gap:clamp(36px,5vw,72px); align-items:center; }
.pj-over__img{ position:relative; border-radius:22px; overflow:hidden; border:1px solid var(--gold-pale); box-shadow:0 50px 100px -55px rgba(31,31,29,.3); aspect-ratio:3/4; background:var(--cream); }
.pj-over__img img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform 1.4s cubic-bezier(.7,0,.2,1); }
.pj-over__img:hover img{ transform:scale(1.05); }
.pj-over__lead{ font-size:clamp(26px,3vw,40px); font-weight:300; line-height:1.25; letter-spacing:-.025em; color:var(--ink); margin:0 0 22px; text-wrap:balance; }
.pj-over__lead em{ font-style:normal; color:var(--gold-deep); }
.pj-over__body p{ font-size:15px; line-height:1.8; color:var(--ink-soft); margin:0 0 15px; }
.pj-over__dev{ font-size:12.5px; letter-spacing:.03em; color:var(--ink-mute); margin-top:20px; padding-top:18px; border-top:1px solid var(--gold-pale); }
@media (max-width:820px){ .pj-over{ grid-template-columns:1fr; gap:30px; } .pj-over__img{ max-width:420px; } }

/* Pastel site-visit (replaces dark) */
.pj-visit{ background:linear-gradient(160deg,#F0F2EC,#E7EBDF); }
.pj-steps2{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.pj-step2{ background:rgba(255,255,255,.7); border:1px solid rgba(190,154,78,.2); border-radius:18px; padding:34px 30px; transition:all .5s cubic-bezier(.7,0,.2,1); }
.pj-step2:hover{ transform:translateY(-5px); background:#fff; box-shadow:0 30px 56px -38px rgba(31,31,29,.2); }
.pj-step2__n{ font-size:13px; letter-spacing:.2em; color:var(--gold-deep); font-weight:600; margin-bottom:14px; }
.pj-step2__t{ font-size:19px; font-weight:500; color:var(--ink); margin:0 0 10px; }
.pj-step2__d{ font-size:14px; line-height:1.6; color:var(--ink-soft); margin:0; }
@media (max-width:760px){ .pj-steps2{ grid-template-columns:1fr; } }

/* Pastel enquiry (replaces dark cp-enq) */
.pj-enq{ background:linear-gradient(160deg,#FFFFFF,#F3EAD6); border:1px solid var(--gold-soft); border-radius:24px; padding:clamp(36px,5vw,68px); position:relative; overflow:hidden; }
.pj-enq::before{ content:""; position:absolute; top:-30%; right:-8%; width:50%; height:140%; background:radial-gradient(ellipse,rgba(235,206,137,.3),transparent 64%); }
.pj-enq__grid{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(32px,5vw,68px); align-items:center; position:relative; z-index:2; }
.pj-enq__eyebrow{ font-size:11px; letter-spacing:.3em; text-transform:uppercase; color:var(--gold-deep); font-weight:600; margin-bottom:16px; }
.pj-enq__title{ font-size:clamp(28px,3.4vw,46px); font-weight:300; line-height:1.1; letter-spacing:-.03em; color:var(--ink); margin:0 0 16px; }
.pj-enq__title em{ font-style:normal; color:var(--gold-deep); }
.pj-enq__sub{ font-size:15px; line-height:1.7; color:var(--ink-soft); margin:0 0 22px; }
.pj-enq__addr{ font-size:13px; line-height:1.7; color:var(--ink-mute); border-top:1px solid var(--gold-pale); padding-top:18px; }
.pj-enq__addr b{ color:var(--ink); font-weight:600; }
.pj-form{ display:grid; gap:13px; }
.pj-form__row{ display:grid; grid-template-columns:1fr 1fr; gap:13px; }
.pj-field input,.pj-field select,.pj-field textarea{ width:100%; background:rgba(255,255,255,.85); border:1px solid var(--gold-pale); border-radius:11px; padding:15px 17px; font-family:inherit; font-size:14.5px; color:var(--ink); transition:all .3s; }
.pj-field input::placeholder,.pj-field textarea::placeholder{ color:var(--ink-mute); }
.pj-field select{ color:var(--ink-soft); cursor:pointer; appearance:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%238F6E2C' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 16px center; }
.pj-field input:focus,.pj-field select:focus,.pj-field textarea:focus{ outline:none; border-color:var(--gold); background:#fff; }
.pj-field textarea{ resize:vertical; min-height:84px; }
.pj-form__consent{ display:flex; align-items:flex-start; gap:10px; font-size:12px; color:var(--ink-soft); line-height:1.5; }
.pj-form__consent input{ margin-top:2px; accent-color:var(--gold-deep); }
.pj-form button{ background:linear-gradient(135deg,var(--gold-glow),var(--gold-deep)); color:#fff; border:none; border-radius:11px; padding:16px 28px; font-family:inherit; font-size:14px; font-weight:600; letter-spacing:.04em; cursor:pointer; display:inline-flex; align-items:center; justify-content:center; gap:9px; transition:all .4s cubic-bezier(.7,0,.2,1); }
.pj-form button:hover{ transform:translateY(-2px); box-shadow:0 18px 34px -14px rgba(143,110,44,.5); }
.pj-form button svg{ width:17px; height:17px; }
@media (max-width:860px){ .pj-enq__grid{ grid-template-columns:1fr; gap:34px; } }
@media (max-width:480px){ .pj-form__row{ grid-template-columns:1fr; } }

/* RERA detail table (light) */
.pj-detail{ display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
.pj-detail__cell{ background:#fff; border:1px solid var(--gold-pale); border-radius:14px; padding:22px 24px; transition:all .4s; }
.pj-detail__cell:hover{ border-color:var(--gold-soft); transform:translateY(-3px); box-shadow:0 22px 44px -32px rgba(31,31,29,.18); }
.pj-detail__cell .l{ font-size:10.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-mute); display:block; margin-bottom:7px; }
.pj-detail__cell .v{ font-size:14.5px; color:var(--ink); font-weight:500; line-height:1.35; }
@media (max-width:860px){ .pj-detail{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:440px){ .pj-detail{ grid-template-columns:1fr; } }

/* Nested flyout submenu in Projects dropdown */
.drop{ display:flex; flex-direction:column; gap:2px; }
.drop__parent{ display:flex !important; align-items:center; justify-content:space-between; gap:10px; }
.has-sub{ position:relative; }
.has-sub > .sub{
  position:absolute; top:-11px; left:calc(100% + 10px);
  background:rgba(251,248,242,.98); backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px);
  border:1px solid var(--gold-pale); border-radius:12px; padding:10px 6px; min-width:230px;
  display:flex; flex-direction:column; gap:2px;
  opacity:0; visibility:hidden; pointer-events:none; transform:translateX(-6px);
  transition:all .3s cubic-bezier(.7,0,.2,1); box-shadow:0 24px 60px -16px rgba(38,36,30,.28); z-index:1100;
}
.has-sub::after{ content:""; position:absolute; top:0; left:100%; width:14px; height:100%; }
.has-sub:hover > .sub, .has-sub:focus-within > .sub{ opacity:1; visibility:visible; pointer-events:auto; transform:translateX(0); }
.sub a{ display:block; padding:10px 18px; font-size:13px; color:var(--ink-soft); border-radius:8px; transition:all .25s ease; white-space:nowrap; }
.sub a:hover{ background:var(--cream); color:var(--gold-deep); padding-left:22px; }
@media (max-width:980px){ .has-sub > .sub{ position:static; opacity:1; visibility:visible; pointer-events:auto; transform:none; box-shadow:none; border:none; padding:0 0 0 14px; min-width:0; background:none; } }

/* =====================================================================
   GLOBAL — faint geometric line pattern so sections aren't flat
   ===================================================================== */
:root{
  --geo: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='80' viewBox='0 0 80 80'%3E%3Cg fill='none' stroke='%23BE9A4E' stroke-width='0.5' stroke-opacity='0.07'%3E%3Cpath d='M0 0h80v80H0z'/%3E%3Cpath d='M0 40h80M40 0v80'/%3E%3Cpath d='M0 80L80 0' stroke-opacity='0.04'/%3E%3C/g%3E%3C/svg%3E");
  --geo-fine: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='44' height='44' viewBox='0 0 44 44'%3E%3Cg fill='none' stroke='%238F6E2C' stroke-width='0.4' stroke-opacity='0.05'%3E%3Cpath d='M22 0v44M0 22h44'/%3E%3Ccircle cx='22' cy='22' r='10'/%3E%3C/g%3E%3C/svg%3E");
}
body{ background-color:#fff; background-image:var(--geo); background-attachment:fixed; }
/* layer the pattern over tinted sections' gradients */
.sec--cream{ background-image:var(--geo), linear-gradient(165deg,#FFFFFF,#FAF9F6); }
.sec--gold{ background-image:var(--geo-fine), linear-gradient(160deg,var(--gold-pale),#F3EAD6); }
.sec--sage{ background-image:var(--geo-fine), linear-gradient(160deg,#F0F2EC,#E7EBDF); }
.pj-hero{ background-image:var(--geo-fine), linear-gradient(165deg,#FFFFFF 0%,#FAF9F6 45%,#F3EAD6 100%); }
.pj-visit{ background-image:var(--geo-fine), linear-gradient(160deg,#F0F2EC,#E7EBDF); }
.op-hero{ background-image:var(--geo), linear-gradient(180deg,#fff,var(--cream)); }
/* decorative corner line motif for key sections */
.geo-accent{ position:relative; }
.geo-accent::before{ content:""; position:absolute; top:0; right:0; width:min(40vw,460px); height:100%;
  background-image:radial-gradient(circle at 80% 20%, rgba(190,154,78,.05), transparent 60%); pointer-events:none; }

/* =====================================================================
   HOME — project banner slider
   ===================================================================== */
.hsl{ position:relative; overflow:hidden; }
.hsl__track{ display:flex; transition:transform .9s cubic-bezier(.7,0,.2,1); }
.hsl__slide{ position:relative; min-width:100%; height:clamp(440px,72vh,760px); overflow:hidden; }
.hsl__slide img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.hsl__slide::after{ content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(20,19,17,.72),rgba(20,19,17,.28) 55%,transparent); }
.hsl__cap{ position:absolute; z-index:3; left:clamp(24px,7vw,120px); bottom:clamp(48px,9vh,110px); right:24px; color:#fff; max-width:760px; }
.hsl__idx{ font-size:12px; letter-spacing:.3em; text-transform:uppercase; color:var(--gold-glow); font-weight:600; margin-bottom:18px; opacity:0; transform:translateY(16px); transition:all .8s .2s; }
.hsl__name{ font-size:clamp(40px,6.5vw,92px); font-weight:300; line-height:1; letter-spacing:-.03em; margin:0 0 14px; padding-bottom:.04em; opacity:0; transform:translateY(22px); transition:all .9s .32s cubic-bezier(.16,1,.3,1); }
.hsl__name em{ font-style:normal; background:linear-gradient(120deg,var(--gold-glow),var(--gold-soft)); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.hsl__area{ font-size:clamp(15px,1.7vw,20px); color:rgba(255,255,255,.86); letter-spacing:.02em; margin:0 0 26px; opacity:0; transform:translateY(18px); transition:all .9s .44s; }
.hsl__area b{ color:var(--gold-glow); font-weight:600; }
.hsl__cta{ display:inline-flex; align-items:center; gap:10px; background:rgba(255,255,255,.12); backdrop-filter:blur(8px); border:1px solid rgba(255,255,255,.3); color:#fff; text-decoration:none; font-size:13px; font-weight:600; letter-spacing:.04em; padding:14px 26px; border-radius:11px; opacity:0; transform:translateY(18px); transition:all .9s .56s, background .3s, border-color .3s; }
.hsl__cta:hover{ background:rgba(190,154,78,.9); border-color:transparent; }
.hsl__cta svg{ width:16px; height:16px; }
.hsl__slide.is-active .hsl__idx,.hsl__slide.is-active .hsl__name,.hsl__slide.is-active .hsl__area,.hsl__slide.is-active .hsl__cta{ opacity:1; transform:translateY(0); }
.hsl__nav{ position:absolute; z-index:5; bottom:clamp(40px,8vh,90px); right:clamp(24px,7vw,120px); display:flex; gap:12px; }
.hsl__btn{ width:52px; height:52px; border-radius:50%; border:1px solid rgba(255,255,255,.4); background:rgba(255,255,255,.1); backdrop-filter:blur(8px); color:#fff; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:all .35s; }
.hsl__btn:hover{ background:var(--gold); border-color:var(--gold); }
.hsl__btn svg{ width:20px; height:20px; }
.hsl__dots{ position:absolute; z-index:5; bottom:clamp(40px,8vh,90px); left:clamp(24px,7vw,120px); display:flex; gap:9px; align-items:center; }
.hsl__dot{ width:9px; height:9px; border-radius:50%; border:none; background:rgba(255,255,255,.4); cursor:pointer; padding:0; transition:all .35s; }
.hsl__dot.is-active{ width:30px; border-radius:6px; background:var(--gold-glow); }
.hsl__count{ position:absolute; z-index:5; top:clamp(28px,5vh,54px); right:clamp(24px,7vw,120px); color:rgba(255,255,255,.85); font-size:13px; letter-spacing:.16em; }
.hsl__count b{ color:#fff; font-size:18px; font-weight:500; }
@media (max-width:640px){ .hsl__nav{ bottom:auto; top:50%; transform:translateY(-50%); right:14px; flex-direction:column; } .hsl__dots{ left:50%; transform:translateX(-50%); } }

/* =====================================================================
   HOME — Hi5 philosophy (detailed) + home FAQ + home enquiry
   ===================================================================== */
.hi5{ display:grid; grid-template-columns:repeat(5,1fr); gap:16px; }
.hi5__card{ position:relative; background:#fff; border:1px solid var(--gold-pale); border-radius:18px; padding:34px 26px; overflow:hidden; transition:all .5s cubic-bezier(.7,0,.2,1); }
.hi5__card::before{ content:""; position:absolute; inset:0; background-image:var(--geo-fine); opacity:0; transition:opacity .5s; }
.hi5__card:hover{ transform:translateY(-8px); box-shadow:0 40px 80px -46px rgba(31,31,29,.3); border-color:var(--gold-soft); }
.hi5__card:hover::before{ opacity:1; }
.hi5__num{ font-size:13px; letter-spacing:.2em; color:var(--gold-deep); font-weight:700; margin-bottom:18px; position:relative; }
.hi5__ic{ width:50px; height:50px; border-radius:14px; background:linear-gradient(135deg,var(--gold-pale),#F3EAD6); display:flex; align-items:center; justify-content:center; color:var(--gold-deep); margin-bottom:18px; position:relative; transition:all .5s; }
.hi5__card:hover .hi5__ic{ background:linear-gradient(135deg,var(--gold),var(--gold-deep)); color:#fff; }
.hi5__ic svg{ width:24px; height:24px; }
.hi5__t{ font-size:19px; font-weight:600; color:var(--ink); margin:0 0 10px; letter-spacing:-.01em; position:relative; }
.hi5__d{ font-size:13.5px; line-height:1.65; color:var(--ink-soft); margin:0; position:relative; }
@media (max-width:980px){ .hi5{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:520px){ .hi5{ grid-template-columns:1fr; } }

.home-faq{ max-width:880px; margin:0 auto; }
.home-enq{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(32px,5vw,68px); align-items:center; }
@media (max-width:860px){ .home-enq{ grid-template-columns:1fr; gap:34px; } }

/* =====================================================================
   HOME — full-screen HERO project slider
   ===================================================================== */
.hero-slider{ position:relative; width:100%; }
.hsl--hero{ width:100%; }
.hsl--hero .hsl__slide{ height:100vh; height:100svh; min-height:600px; }
.hsl--hero .hsl__slide::after{ background:linear-gradient(90deg,rgba(18,17,15,.78),rgba(18,17,15,.4) 55%,rgba(18,17,15,.2)); }
.hsl--hero .hsl__cap{ bottom:clamp(110px,16vh,180px); max-width:880px; }
.hsl--hero .hsl__name{ font-size:clamp(48px,8vw,118px); }
.hsl__brand{ position:absolute; z-index:6; top:clamp(96px,14vh,130px); left:clamp(24px,7vw,120px); font-size:11.5px; letter-spacing:.35em; text-transform:uppercase; color:var(--gold-glow); font-weight:600; display:flex; align-items:center; gap:12px; }
.hsl__brand::before{ content:""; width:34px; height:1px; background:var(--gold-glow); display:inline-block; }
.hsl__scroll{ position:absolute; z-index:6; bottom:34px; left:50%; transform:translateX(-50%); color:rgba(255,255,255,.7); font-size:11px; letter-spacing:.3em; text-transform:uppercase; display:flex; flex-direction:column; align-items:center; gap:10px; }
.hsl__scroll::after{ content:""; width:1px; height:34px; background:linear-gradient(rgba(255,255,255,.6),transparent); animation:scrollcue 2s ease-in-out infinite; }
@keyframes scrollcue{ 0%,100%{ opacity:.3; transform:scaleY(.6); } 50%{ opacity:1; transform:scaleY(1); } }
@media (max-width:640px){ .hsl--hero .hsl__nav{ top:auto; bottom:clamp(96px,16vh,150px); transform:none; flex-direction:row; right:auto; left:clamp(24px,7vw,120px); } .hsl__scroll{ display:none; } }

/* ============================================================
   PROJECT GRID — IMMERSIVE OVERLAY TILES (homepage #projects)
   Even, justified 3:4 grid. Copy sits ON the image (no white
   info panel). Scoped to .projects--rich; projects.html untouched.
   ============================================================ */
.projects--rich{ grid-template-columns: repeat(3, 1fr); gap: 24px; align-items: start; }

.projects--rich .proj{
  position: relative; display: block; aspect-ratio: 3/4;
  border-radius: 14px; overflow: hidden; isolation: isolate; background: var(--cream);
  box-shadow: 0 20px 46px -28px rgba(31,31,29,.5);
  transition: transform .6s cubic-bezier(.2,.8,.2,1), box-shadow .6s cubic-bezier(.2,.8,.2,1);
}
.projects--rich .proj:hover{ transform: translateY(-8px); box-shadow: 0 48px 94px -34px rgba(31,31,29,.6); }

/* image fills the whole tile */
.projects--rich .proj__img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0;
  transform: scale(1.02); transition: transform 1.6s cubic-bezier(.2,.8,.2,1);
}
.projects--rich .proj:hover .proj__img{ transform: scale(1.1); }

/* bottom scrim for legible white copy + faint top vignette for the tag/number */
.projects--rich .proj::before{
  content:""; position:absolute; inset:0; z-index:1; pointer-events:none;
  background: linear-gradient(to top, rgba(14,14,13,.88) 0%, rgba(14,14,13,.52) 26%, rgba(14,14,13,.08) 50%, transparent 70%);
  transition: opacity .5s ease;
}
.projects--rich .proj::after{
  content:""; position:absolute; top:0; left:0; right:0; height:40%; z-index:1; pointer-events:none;
  background: linear-gradient(to bottom, rgba(14,14,13,.42), transparent); opacity:.55;
}

/* tag pill — glass for ongoing, solid for new / commercial */
.projects--rich .proj__tag{
  position:absolute; top:16px; left:16px; z-index:3;
  font-size:10px; letter-spacing:.2em; text-transform:uppercase; font-weight:600;
  padding:7px 13px; border-radius:999px;
  background: rgba(255,255,255,.9); color: var(--gold-deep); border:1px solid rgba(255,255,255,.6);
  -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
}
.projects--rich .proj__tag--new{ background: var(--ink); color:#fff; border-color:transparent; }
.projects--rich .proj__tag--commercial{ background: var(--gold-deep); color:#fff; border-color:transparent; }


/* overlay copy, anchored to the bottom */
.projects--rich .proj__overlay{
  position:absolute; left:0; right:0; bottom:0; z-index:2; padding:26px 22px 24px; color:#fff;
  transition: transform .55s cubic-bezier(.2,.8,.2,1);
}
.projects--rich .proj:hover .proj__overlay{ transform: translateY(-2px); }
.projects--rich .proj__overlay::before{
  content:""; display:block; width:26px; height:2px; background:var(--gold); margin-bottom:14px;
  transition: width .55s cubic-bezier(.2,.8,.2,1);
}
.projects--rich .proj:hover .proj__overlay::before{ width:54px; }

.projects--rich .proj__name{
  font-weight:500; font-size:clamp(20px,1.9vw,25px); letter-spacing:-.01em; line-height:1.14;
  margin:0 0 6px; color:#fff; text-shadow:0 2px 20px rgba(0,0,0,.4);
}
.projects--rich .proj__loc{
  display:flex; align-items:center; gap:7px; font-size:12.5px; color:rgba(255,255,255,.82); margin:0;
}
.projects--rich .proj__loc svg{ width:13px; height:13px; color:var(--gold-glow); flex-shrink:0; }

/* config + arrow reveal on hover (always shown on touch / small screens) */
.projects--rich .proj__foot{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  border-top:1px solid rgba(255,255,255,.22);
  max-height:0; opacity:0; margin-top:0; padding-top:0; overflow:hidden;
  transition: max-height .55s cubic-bezier(.2,.8,.2,1), opacity .45s ease, margin-top .45s ease, padding-top .45s ease;
}
.projects--rich .proj:hover .proj__foot{ max-height:64px; opacity:1; margin-top:16px; padding-top:14px; }
.projects--rich .proj__config{ font-size:12px; color:rgba(255,255,255,.92); font-weight:500; }
.projects--rich .proj__arrow{
  width:34px; height:34px; border-radius:50%; border:1px solid rgba(255,255,255,.42);
  display:flex; align-items:center; justify-content:center; color:#fff; flex-shrink:0;
  transition: all .45s cubic-bezier(.2,.8,.2,1);
}
.projects--rich .proj__arrow svg{ width:14px; height:14px; }
.projects--rich .proj:hover .proj__arrow{ background:var(--gold); border-color:var(--gold); color:var(--pearl); transform: rotate(-45deg); }

/* touch devices: no hover, so show the config row + tick by default */
@media (hover: none){
  .projects--rich .proj__foot{ max-height:64px; opacity:1; margin-top:16px; padding-top:14px; }
  .projects--rich .proj__overlay::before{ width:54px; }
}

/* responsive — stays an even, justified grid */
@media (max-width: 980px){ .projects--rich{ grid-template-columns: repeat(2, 1fr); gap:18px; } }
@media (max-width: 600px){ .projects--rich{ grid-template-columns: 1fr; gap:18px; } }


/* ============================================================
   HOME — LIFESTYLE HERO BANNER (#SayHi5ToGangotree)
   Crossfading lifestyle images, centered hashtag, rotating
   tagline per image, fully responsive.
   ============================================================ */
.hbanner{ position:relative; width:100%; height:100vh; height:100svh; min-height:600px; overflow:hidden; isolation:isolate; }
.hbanner__bg{ position:absolute; inset:0; z-index:0; }
.hbanner__img{
  position:absolute; inset:0; background-size:cover; background-position:center;
  opacity:0; transform:scale(1.05);
  transition: opacity 1.3s ease, transform 7s ease;
  will-change:opacity, transform;
}
.hbanner__img.is-active{ opacity:1; transform:scale(1.12); }

/* darkening for nav legibility + centered copy contrast */
.hbanner__veil{
  position:absolute; inset:0; z-index:1; pointer-events:none;
  background:
    radial-gradient(ellipse at 50% 44%, rgba(8,8,7,.10), rgba(8,8,7,.30) 82%),
    linear-gradient(180deg, rgba(8,8,7,.40) 0%, rgba(8,8,7,.06) 18%, rgba(8,8,7,.04) 56%, rgba(8,8,7,.44) 100%);
}

.hbanner__inner{
  position:absolute; inset:0; z-index:2;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  text-align:center; padding:96px 22px 120px; color:#fff;
}
.hbanner__kicker{
  font-size:clamp(10px,1.1vw,12px); letter-spacing:.34em; text-transform:uppercase;
  color:rgba(255,255,255,.92); font-weight:600; margin:0 0 22px;
  display:inline-flex; align-items:center; gap:14px;
  opacity:0; transform:translateY(14px); animation: hbUp .9s .15s cubic-bezier(.16,1,.3,1) forwards;
}
.hbanner__kicker::before, .hbanner__kicker::after{ content:""; width:30px; height:1px; background:var(--gold-glow); opacity:.7; }

.hbanner__hash{
  font-size:clamp(38px,7vw,92px); font-weight:300; line-height:1.02; letter-spacing:-.03em;
  margin:0 0 22px; color:#fff; text-shadow:0 2px 30px rgba(0,0,0,.55), 0 1px 2px rgba(0,0,0,.45);
  opacity:0; transform:translateY(22px); animation: hbUp 1s .3s cubic-bezier(.16,1,.3,1) forwards;
}
.hbanner__hash .hsh{ color:#fff; }
.hbanner__hash em{ font-style:normal; color:#fff; }

/* rotating taglines, stacked so the box sizes to the tallest line */
.hbanner__lines{ display:grid; margin:0 auto 36px; max-width:min(92vw,640px); min-height:1.4em; }
.hbanner__line{
  grid-area:1 / 1; margin:0; color:rgba(255,255,255,.94);
  font-size:clamp(17px,2.4vw,30px); font-weight:300; letter-spacing:.005em; line-height:1.3;
  text-shadow:0 2px 22px rgba(0,0,0,.6), 0 1px 2px rgba(0,0,0,.4);
  opacity:0; transform:translateY(10px); transition: opacity .8s ease, transform .8s cubic-bezier(.16,1,.3,1);
}
.hbanner__line.is-active{ opacity:1; transform:none; }

.hbanner__cta{
  display:inline-flex; align-items:center; gap:10px;
  background:rgba(255,255,255,.12); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px);
  border:1px solid rgba(255,255,255,.34); color:#fff; text-decoration:none;
  font-size:13px; font-weight:600; letter-spacing:.04em; padding:14px 28px; border-radius:999px;
  transition: background .35s ease, border-color .35s ease, transform .35s ease;
  opacity:0; transform:translateY(16px); animation: hbUp 1s .5s cubic-bezier(.16,1,.3,1) forwards;
}
.hbanner__cta:hover{ background:rgba(190,154,78,.92); border-color:transparent; transform:translateY(-2px); }
.hbanner__cta svg{ width:16px; height:16px; }

.hbanner__dots{
  position:absolute; left:50%; bottom:clamp(30px,6vh,52px); transform:translateX(-50%);
  z-index:3; display:flex; gap:10px; align-items:center;
}
.hbanner__dot{ width:9px; height:9px; border-radius:50%; border:none; background:rgba(255,255,255,.45); cursor:pointer; padding:0; transition:all .4s ease; }
.hbanner__dot.is-active{ width:32px; border-radius:6px; background:var(--gold-glow); }

.hbanner__scroll{
  position:absolute; z-index:3; bottom:30px; right:clamp(20px,6vw,60px);
  color:rgba(255,255,255,.7); font-size:10.5px; letter-spacing:.3em; text-transform:uppercase;
  display:flex; flex-direction:column; align-items:center; gap:10px;
}
.hbanner__scroll::after{ content:""; width:1px; height:32px; background:linear-gradient(rgba(255,255,255,.6),transparent); animation:scrollcue 2s ease-in-out infinite; }

@keyframes hbUp{ to{ opacity:1; transform:none; } }

@media (max-width:760px){
  .hbanner{ min-height:560px; }
  .hbanner__hash{ font-size:clamp(30px,6.6vw,60px); }
  .hbanner__inner{ padding:104px 20px 110px; }
  .hbanner__scroll{ display:none; }
  .hbanner__dots{ bottom:34px; }
}
@media (max-width:430px){
  .hbanner__hash{ font-size:clamp(25px,8.3vw,42px); margin-bottom:16px; }
  .hbanner__lines{ max-width:92vw; }
}


/* ===== Homepage: Ongoing Projects on its own soft-cream band (separated from Ethos) ===== */
.projects-band{
  background:
    radial-gradient(120% 80% at 50% -8%, rgba(190,154,78,.07), transparent 60%),
    linear-gradient(180deg, #FBF7EF 0%, #F5EFE2 100%);
  border-top:1px solid var(--gold-pale);
  border-bottom:1px solid var(--gold-pale);
  position:relative;
}
.projects-band .projects--rich .proj{ box-shadow:0 26px 56px -32px rgba(31,31,29,.28); }
.projects-band .projects--rich .proj:hover{ box-shadow:0 50px 96px -38px rgba(31,31,29,.4); border-color:var(--gold-soft); }

/* CTA sub-line (used on Connect pages) */
.cta-end__sub{ font-size:clamp(14px,1.6vw,17px); line-height:1.75; color:var(--ink-soft); max-width:56ch; margin:0 auto 34px; text-align:center; }


/* ============================================================
   CONNECT pages — stats row + experience timeline
   ============================================================ */
.cn-stats{ display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid var(--gold-pale); border-bottom:1px solid var(--gold-pale); }
.cn-stat{ padding:32px 20px; text-align:center; border-right:1px solid var(--gold-pale); }
.cn-stat:last-child{ border-right:none; }
.cn-stat b{ display:block; font-size:clamp(30px,3.4vw,46px); font-weight:300; letter-spacing:-.02em; line-height:1; margin-bottom:8px; background:linear-gradient(135deg,var(--gold),var(--gold-deep)); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.cn-stat span{ font-size:11px; letter-spacing:.18em; text-transform:uppercase; color:var(--ink-mute); font-weight:600; }
@media(max-width:680px){ .cn-stats{ grid-template-columns:repeat(2,1fr); } .cn-stat:nth-child(2n){ border-right:none; } .cn-stat:nth-child(1),.cn-stat:nth-child(2){ border-bottom:1px solid var(--gold-pale); } }

.cn-time{ position:relative; max-width:920px; margin:0 auto; padding:6px 0; }
.cn-time::before{ content:""; position:absolute; left:50%; top:0; bottom:0; width:2px; transform:translateX(-50%); background:linear-gradient(var(--gold-soft),var(--gold-pale)); }
.cn-time__item{ position:relative; width:50%; padding:18px 46px; box-sizing:border-box; }
.cn-time__item:nth-child(odd){ left:0; text-align:right; }
.cn-time__item:nth-child(even){ left:50%; text-align:left; }
.cn-time__dot{ position:absolute; top:34px; width:15px; height:15px; border-radius:50%; background:var(--gold); border:3px solid #fff; box-shadow:0 0 0 3px var(--gold-pale); z-index:2; }
.cn-time__item:nth-child(odd) .cn-time__dot{ right:-7px; }
.cn-time__item:nth-child(even) .cn-time__dot{ left:-7px; }
.cn-time__card{ display:inline-block; text-align:left; background:#fff; border:1px solid var(--gold-pale); border-radius:14px; padding:24px 26px; box-shadow:0 24px 50px -34px rgba(31,31,29,.3); transition:transform .5s cubic-bezier(.2,.8,.2,1), box-shadow .5s ease, border-color .5s ease; }
.cn-time__card:hover{ transform:translateY(-5px); box-shadow:0 42px 84px -40px rgba(31,31,29,.42); border-color:var(--gold-soft); }
.cn-time__year{ display:inline-block; font-size:10.5px; letter-spacing:.18em; text-transform:uppercase; color:var(--gold-deep); font-weight:700; margin-bottom:10px; }
.cn-time__card h3{ font-size:19px; font-weight:600; color:var(--ink); margin:0 0 8px; letter-spacing:-.01em; }
.cn-time__card p{ font-size:14px; line-height:1.66; color:var(--ink-soft); margin:0; }
@media(max-width:760px){
  .cn-time::before{ left:18px; }
  .cn-time__item, .cn-time__item:nth-child(odd), .cn-time__item:nth-child(even){ width:100%; left:0; text-align:left; padding:14px 0 14px 46px; }
  .cn-time__item:nth-child(odd) .cn-time__dot, .cn-time__item:nth-child(even) .cn-time__dot{ left:11px; right:auto; }
}


/* ============================================================
   CONNECT pages — rich content blocks (feature, quote, affiliations, split)
   ============================================================ */
.cn-lead{ max-width:780px; margin:0 auto; text-align:center; }
.cn-lead p{ font-size:clamp(15px,1.5vw,17.5px); line-height:1.85; color:var(--ink-soft); margin:0 0 16px; }

.cn-feature{ position:relative; background:linear-gradient(180deg,#FBF7EF,#F5EFE2); border:1px solid var(--gold-pale); border-radius:20px; padding:clamp(28px,4vw,54px); overflow:hidden; }
.cn-feature::before{ content:""; position:absolute; left:0; top:0; bottom:0; width:4px; background:linear-gradient(var(--gold),var(--gold-deep)); }
.cn-feature__eyebrow{ font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:var(--gold-deep); font-weight:700; margin-bottom:14px; }
.cn-feature__title{ font-size:clamp(24px,3vw,38px); font-weight:300; letter-spacing:-.02em; color:var(--ink); margin:0 0 22px; line-height:1.12; }
.cn-feature__title em{ font-style:normal; background:linear-gradient(120deg,var(--gold-deep),var(--gold)); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.cn-feature__grid{ display:grid; grid-template-columns:1fr 1fr; gap:34px; }
.cn-feature__grid p{ font-size:14.5px; line-height:1.82; color:var(--ink-soft); margin:0 0 14px; }
.cn-feature__grid p:last-child{ margin-bottom:0; }
.cn-feature__facts{ display:flex; flex-wrap:wrap; gap:10px; margin-top:26px; }
.cn-feature__chip{ display:inline-flex; align-items:center; gap:7px; padding:9px 16px; background:#fff; border:1px solid var(--gold-pale); border-radius:100px; font-size:12.5px; color:var(--ink); font-weight:600; }
.cn-feature__chip b{ color:var(--gold-deep); font-weight:700; }
@media(max-width:760px){ .cn-feature__grid{ grid-template-columns:1fr; gap:0; } }

.cn-quote{ max-width:840px; margin:0 auto; text-align:center; padding:6px 20px; }
.cn-quote::before{ content:"\201C"; display:block; font-size:64px; line-height:.5; color:var(--gold-soft); margin-bottom:6px; }
.cn-quote p{ font-size:clamp(20px,2.6vw,30px); font-weight:300; line-height:1.42; color:var(--ink); letter-spacing:-.01em; margin:0; }
.cn-quote p em{ font-style:normal; background:linear-gradient(120deg,var(--gold-deep),var(--gold)); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.cn-quote__by{ display:block; margin-top:20px; font-size:12px; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-mute); font-weight:600; }

.cn-affil{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.cn-affil__item{ text-align:center; padding:28px 18px; border:1px solid var(--gold-pale); border-radius:14px; background:#fff; transition:transform .4s ease, box-shadow .4s ease; }
.cn-affil__item:hover{ transform:translateY(-4px); box-shadow:0 26px 50px -34px rgba(31,31,29,.34); }
.cn-affil__item b{ display:block; font-size:17px; color:var(--ink); font-weight:700; letter-spacing:-.01em; margin-bottom:7px; }
.cn-affil__item span{ font-size:12.5px; color:var(--ink-mute); line-height:1.55; }
@media(max-width:760px){ .cn-affil{ grid-template-columns:repeat(2,1fr); } }

.cn-split{ display:grid; grid-template-columns:1.05fr .95fr; gap:50px; align-items:start; }
.cn-split__lead p{ font-size:15px; line-height:1.85; color:var(--ink-soft); margin:0 0 16px; }
.cn-split__lead p:last-child{ margin-bottom:0; }
.cn-split__points{ list-style:none; margin:0; padding:0; }
.cn-split__points li{ position:relative; padding:15px 0 15px 34px; border-bottom:1px solid var(--gold-pale); font-size:14.5px; color:var(--ink-soft); line-height:1.6; }
.cn-split__points li:first-child{ padding-top:0; }
.cn-split__points li::before{ content:""; position:absolute; left:2px; top:19px; width:13px; height:13px; border-radius:50%; border:2px solid var(--gold); }
.cn-split__points li:first-child::before{ top:4px; }
.cn-split__points li b{ display:block; color:var(--ink); font-weight:700; margin-bottom:3px; }
@media(max-width:820px){ .cn-split{ grid-template-columns:1fr; gap:28px; } }


/* Connect pages — visible warm-cream band for alternating sections */
.sec--soft{ background:linear-gradient(180deg,#FBF7EF 0%, #F4EDDE 100%); border-top:1px solid var(--gold-pale); border-bottom:1px solid var(--gold-pale); }

/* ============================================================
   Project pages — image header background (dark scrim + white text)
   ============================================================ */
.pj-hero--img{ background:#15140f; padding:172px 0 76px; }
.pj-hero--img::before, .pj-hero--img::after{ display:none !important; }
.pj-hero__bg{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center; z-index:0; }
.pj-hero__veil{ position:absolute; inset:0; z-index:1; pointer-events:none;
  background:
    linear-gradient(92deg, rgba(8,8,10,.92) 0%, rgba(8,8,10,.78) 36%, rgba(8,8,10,.46) 62%, rgba(8,8,10,.14) 100%),
    linear-gradient(0deg, rgba(8,8,10,.74) 0%, rgba(8,8,10,.12) 46%, transparent 74%),
    linear-gradient(0deg, rgba(8,8,10,.16), rgba(8,8,10,.16)); }
.pj-hero--img .pj-hero__inner{ z-index:2; }
.pj-hero--img .pj-hero__crumb{ color:rgba(255,255,255,.82); }
.pj-hero--img .pj-hero__crumb a{ color:var(--gold-glow); }
.pj-hero--img .pj-hero__tag{ color:#fff; border-color:rgba(255,255,255,.42); background:rgba(255,255,255,.10); }
.pj-hero--img .pj-hero__title{ color:#fff; text-shadow:0 2px 26px rgba(0,0,0,.45); }
.pj-hero--img .pj-hero__addr{ color:rgba(255,255,255,.96); text-shadow:0 1px 12px rgba(0,0,0,.55); }
.pj-hero--img .pj-hero__sub{ color:rgba(255,255,255,.9); text-shadow:0 1px 16px rgba(0,0,0,.55); }
.pj-hero--img .pj-hero__fact b{ color:#fff; }
.pj-hero--img .pj-hero__fact span{ color:rgba(255,255,255,.74); }

/* ============================================================
   Project hero — prominent project NAME + poetic tagline
   ============================================================ */
.pj-hero__name{ font-size:clamp(42px,6.8vw,92px); font-weight:300; line-height:1.0; letter-spacing:-.04em; color:var(--ink); margin:0 0 6px; padding-bottom:.04em; }
.pj-hero__name em{ font-style:normal; background:linear-gradient(120deg,var(--gold),var(--gold-deep)); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.pj-hero__tagline{ font-size:clamp(17px,2.3vw,28px); font-weight:300; letter-spacing:-.01em; line-height:1.18; color:var(--ink-soft); margin:0 0 20px; }
.pj-hero__tagline em{ font-style:normal; background:linear-gradient(120deg,var(--gold),var(--gold-deep)); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.pj-hero--img .pj-hero__name{ color:#fff; text-shadow:0 2px 30px rgba(0,0,0,.6), 0 2px 4px rgba(0,0,0,.55); }
.pj-hero--img .pj-hero__tagline{ color:rgba(255,255,255,.95); text-shadow:0 2px 16px rgba(0,0,0,.55); }

/* ============================================================
   Project pages — Location / Google Map section
   ============================================================ */
.pj-map__grid{ display:grid; grid-template-columns:.82fr 1.18fr; gap:28px; align-items:stretch; }
.pj-map__panel{ background:linear-gradient(180deg,#FBF7EF 0%, #F4EDDE 100%); border:1px solid var(--gold-pale); border-radius:18px; padding:clamp(26px,3vw,38px); display:flex; flex-direction:column; }
.pj-map__addr-h{ font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:var(--gold-deep); font-weight:700; margin-bottom:14px; }
.pj-map__addr{ display:flex; gap:11px; align-items:flex-start; font-size:18.5px; line-height:1.5; color:var(--ink); font-weight:500; margin:0 0 24px; }
.pj-map__addr svg{ width:22px; height:22px; color:var(--gold-deep); flex:0 0 auto; margin-top:2px; }
.pj-map__points{ list-style:none; margin:0 0 28px; padding:0; }
.pj-map__points li{ position:relative; padding:12px 0 12px 30px; border-bottom:1px solid var(--gold-pale); font-size:14px; color:var(--ink-soft); line-height:1.5; }
.pj-map__points li:last-child{ border-bottom:none; }
.pj-map__points li svg{ position:absolute; left:0; top:13px; width:17px; height:17px; color:var(--gold-deep); }
.pj-map__btn{ margin-top:auto; display:inline-flex; align-items:center; justify-content:center; gap:10px; background:linear-gradient(135deg,var(--gold),var(--gold-deep)); color:#fff; font-weight:600; font-size:14px; letter-spacing:.01em; padding:15px 26px; border-radius:100px; text-decoration:none; transition:transform .3s ease, box-shadow .3s ease; box-shadow:0 16px 34px -16px rgba(143,110,44,.6); }
.pj-map__btn:hover{ transform:translateY(-2px); box-shadow:0 24px 46px -16px rgba(143,110,44,.72); }
.pj-map__btn svg{ width:18px; height:18px; }
.pj-map__frame{ position:relative; border-radius:18px; overflow:hidden; border:1px solid var(--gold-pale); min-height:440px; box-shadow:0 30px 64px -38px rgba(31,31,29,.45); background:#eee; }
.pj-map__frame iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; filter:grayscale(.12) contrast(1.02); }
@media(max-width:860px){ .pj-map__grid{ grid-template-columns:1fr; } .pj-map__frame{ min-height:340px; } }

/* ============================================================
   Section depth — geometric line texture + cream-highlight cards
   ============================================================ */
/* faint architectural line grid on every content section (kills the flat look) */
.sec::after{ content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160' viewBox='0 0 160 160'%3E%3Cg fill='none' stroke='%23BE9A4E' stroke-opacity='0.08'%3E%3Cpath d='M0 0.5h160M0 80.5h160M0.5 0v160M80.5 0v160' stroke-width='0.6'/%3E%3Cpath d='M160 0L0 160M0 0l160 160' stroke-width='0.5' stroke-opacity='0.045'/%3E%3C/g%3E%3C/svg%3E");
  background-size:160px 160px; }
.sec > .wrap{ position:relative; z-index:1; }

/* content cards: soft cream pastel highlight so they lift off the section */
.pa-amen__item, .cp-spec, .pa-cfg, .pj-detail__cell, .pa-conn__col, .cn-affil__item, .cn-time__card{
  background:linear-gradient(180deg,#FCF9F3 0%, #F6EFE1 100%);
  box-shadow:0 16px 38px -32px rgba(31,31,29,.24);
}
/* on warm/cream sections, cards flip to crisp white so they still pop */
.sec--cream .pa-amen__item, .sec--soft .pa-amen__item, .sec--gold .pa-amen__item,
.sec--cream .cp-spec, .sec--soft .cp-spec, .sec--gold .cp-spec,
.sec--cream .pa-cfg, .sec--soft .pa-cfg, .sec--gold .pa-cfg,
.sec--cream .pj-detail__cell, .sec--soft .pj-detail__cell, .sec--gold .pj-detail__cell,
.sec--cream .pa-conn__col, .sec--soft .pa-conn__col, .sec--gold .pa-conn__col,
.sec--cream .cn-affil__item, .sec--soft .cn-affil__item, .sec--gold .cn-affil__item,
.sec--cream .cn-time__card, .sec--soft .cn-time__card{
  background:#ffffff;
}


/* ============================================================
   Footer — soft dark band (stops it merging into the page)
   ============================================================ */
.footer{ background:linear-gradient(180deg,#211F19 0%, #15130E 100%); border-top:1px solid rgba(190,154,78,.30); }
.footer__brand img{ filter:brightness(0) invert(1); opacity:.95; }
.footer__brand p{ color:rgba(255,255,255,.58); }
.footer__top{ border-bottom-color:rgba(255,255,255,.10); }
.footer__col h4{ color:var(--gold-glow); }
.footer__col a{ color:rgba(255,255,255,.66); }
.footer__col a:hover{ color:var(--gold-glow); }
.footer__col .meta{ color:rgba(255,255,255,.58); }
.footer__col .meta strong{ color:#fff; }
.footer__bottom p{ color:rgba(255,255,255,.42); }
.footer__socials a{ border-color:rgba(255,255,255,.20); color:rgba(255,255,255,.7); }
.footer__socials a:hover{ background:var(--gold); color:#fff; border-color:var(--gold); }

/* ============================================================
   Cards — more dimensional, premium feel (kept light)
   ============================================================ */
.pa-amen__item, .cp-spec, .pa-cfg, .pj-detail__cell, .pa-conn__col, .cn-affil__item, .cn-time__card{
  border-color:#E7DEC8;
  box-shadow:0 1px 0 rgba(255,255,255,.8) inset, 0 22px 48px -34px rgba(31,31,29,.24);
}
.pa-amen__item:hover, .cp-spec:hover, .pa-cfg:hover, .cn-affil__item:hover, .cn-time__card:hover{
  box-shadow:0 1px 0 rgba(255,255,255,.9) inset, 0 40px 80px -40px rgba(31,31,29,.34);
}


/* Countryside homepage grid — responsive 4 -> 2 -> 1 */
@media(max-width:1024px){ .country{ grid-template-columns:repeat(2,1fr); max-width:760px; margin:0 auto; gap:24px; } }
@media(max-width:560px){ .country{ grid-template-columns:1fr; max-width:420px; } }

/* ============================================================
   Forest Villas page only — enhanced (fv- scoped, no other page affected)
   ============================================================ */
.fv-hero{ position:relative; min-height:90vh; display:flex; align-items:flex-end; overflow:hidden; background:#13140f; padding:170px 0 70px; }
.fv-hero__bg{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0; }
.fv-hero__veil{ position:absolute; inset:0; z-index:1; pointer-events:none;
  background:linear-gradient(180deg, rgba(10,12,8,.42) 0%, rgba(10,12,8,.10) 30%, rgba(8,10,6,.50) 68%, rgba(6,8,5,.88) 100%),
             linear-gradient(95deg, rgba(6,8,5,.62) 0%, rgba(6,8,5,.18) 50%, transparent 78%); }
.fv-hero__inner{ position:relative; z-index:2; color:#fff; }
.fv-hero__crumb{ font-size:13px; letter-spacing:.03em; color:rgba(255,255,255,.82); margin-bottom:22px; text-shadow:0 1px 10px rgba(0,0,0,.4); }
.fv-hero__crumb a{ color:var(--gold-glow); }
.fv-hero__tag{ display:inline-block; font-size:11px; letter-spacing:.22em; text-transform:uppercase; color:#fff; border:1px solid rgba(255,255,255,.42); background:rgba(255,255,255,.10); padding:9px 18px; border-radius:100px; margin-bottom:24px; }
.fv-hero__name{ font-size:clamp(48px,8.4vw,108px); font-weight:300; line-height:.96; letter-spacing:-.04em; margin:0 0 8px; text-shadow:0 2px 34px rgba(0,0,0,.55); }
.fv-hero__tagline{ font-size:clamp(20px,3vw,36px); font-weight:300; letter-spacing:-.01em; margin:0 0 22px; background:linear-gradient(120deg,var(--gold-glow),var(--gold)); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.fv-hero__sub{ font-size:clamp(15px,1.6vw,18px); line-height:1.75; color:rgba(255,255,255,.9); max-width:62ch; margin:0 0 36px; text-shadow:0 1px 14px rgba(0,0,0,.45); }
.fv-hero__stats{ display:flex; flex-wrap:wrap; gap:14px; }
.fv-hero__stats > div{ background:rgba(255,255,255,.09); border:1px solid rgba(255,255,255,.20); border-radius:14px; padding:15px 26px; min-width:130px; }
.fv-hero__stats b{ display:block; font-size:23px; font-weight:400; color:#fff; letter-spacing:-.01em; }
.fv-hero__stats span{ font-size:11.5px; letter-spacing:.10em; text-transform:uppercase; color:rgba(255,255,255,.72); }

.fv-split{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(28px,5vw,72px); align-items:center; }
.fv-split--flip .fv-split__media{ order:2; }
.fv-split__media{ border-radius:20px; overflow:hidden; aspect-ratio:3/4; box-shadow:0 44px 90px -52px rgba(31,31,29,.55); border:1px solid var(--gold-pale); }
.fv-split__media img{ width:100%; height:100%; object-fit:cover; transition:transform 1.5s cubic-bezier(.7,0,.2,1); }
.fv-split:hover .fv-split__media img{ transform:scale(1.05); }
.fv-split__title{ font-size:clamp(30px,4vw,52px); font-weight:300; line-height:1.05; letter-spacing:-.02em; margin:14px 0 22px; color:var(--ink); }
.fv-split__title em{ font-style:normal; background:linear-gradient(120deg,var(--gold),var(--gold-deep)); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.fv-split__body p{ font-size:15.5px; line-height:1.85; color:var(--ink-soft); margin:0 0 16px; }
.fv-split__points{ list-style:none; margin:24px 0 0; padding:0; display:grid; grid-template-columns:1fr 1fr; gap:12px 24px; }
.fv-split__points li{ position:relative; padding-left:28px; font-size:14px; color:var(--ink); }
.fv-split__points li svg{ position:absolute; left:0; top:1px; width:17px; height:17px; color:var(--gold-deep); }
@media(max-width:820px){ .fv-split{ grid-template-columns:1fr; } .fv-split--flip .fv-split__media{ order:0; } .fv-split__media{ max-width:520px; margin:0 auto; } .fv-split__points{ grid-template-columns:1fr 1fr; } }

.fv-set{ display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:14px; }
.fv-set__cell{ background:#fff; border:1px solid var(--gold-pale); border-radius:14px; padding:22px 18px; text-align:center; box-shadow:0 18px 40px -34px rgba(31,31,29,.22); }
.fv-set__cell b{ display:block; font-size:25px; font-weight:400; color:var(--gold-deep); letter-spacing:-.01em; }
.fv-set__cell span{ font-size:13px; color:var(--ink-soft); }

/* ============================================================
   Running-numbers band (home + about) — highlighted cream/gold,
   no longer flat white. Classy, on-theme, not dark.
   ============================================================ */
.figband{
  background-color:#FBF6EA;
  background-image:var(--geo), linear-gradient(135deg,#FCF8EE 0%, #F3E9D4 100%);
  background-repeat:repeat, no-repeat;
  background-size:150px 150px, cover;
  border:1px solid #E6D6AC;
  box-shadow:0 36px 84px -48px rgba(143,110,44,.42), inset 0 1px 0 rgba(255,255,255,.85);
}
.figband__cell{ border-right-color:rgba(190,154,78,.22); }
.figband__cell::before{ content:""; position:absolute; left:50%; top:0; transform:translateX(-50%); width:46px; height:3px; border-radius:0 0 4px 4px; background:linear-gradient(90deg,var(--gold),var(--gold-deep)); opacity:0; transition:opacity .5s ease, width .5s ease; }
.figband__cell:hover{ background:rgba(255,255,255,.55); }
.figband__cell:hover::before{ opacity:1; width:64px; }
.figband__num{ background:linear-gradient(135deg, var(--gold-deep) 0%, var(--gold) 55%, #A87F33 100%); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.figband__num .plus{ background:linear-gradient(135deg,var(--gold-glow),var(--gold-deep)); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.figband__label{ color:var(--ink-soft); font-weight:500; letter-spacing:.05em; }

/* Floor Plans & Brochure section — checklist (all countryside pages) */
.cp-bro__pts{ list-style:none; margin:0; padding:0; }
.cp-bro__pts li{ position:relative; padding:11px 0 11px 30px; font-size:14.5px; color:var(--ink-soft); border-top:1px solid var(--gold-pale); }
.cp-bro__pts li:first-child{ border-top:none; }
.cp-bro__pts li svg{ position:absolute; left:0; top:11px; width:18px; height:18px; color:var(--gold-deep); }


/* Photographic header legibility */
.susthero--img .phero__title, .susthero--img .phero__sub{ text-shadow:0 2px 22px rgba(0,0,0,.5); }
.phero--dark .phero__title, .phero--dark .phero__sub{ text-shadow:0 2px 22px rgba(0,0,0,.45); }

/* Sustainability hero eyebrow — black text on solid pill for legibility over leaves */
.susthero--img .phero__eyebrow{ color:#1F1F1D; background:rgba(255,255,255,.94); border-color:rgba(0,0,0,.14); box-shadow:0 12px 32px -18px rgba(0,0,0,.55); }
.susthero--img .phero__eyebrow::before, .susthero--img .phero__eyebrow::after{ background:#1F1F1D; }


/* Safari/legacy fallback for the Ongoing Projects tiles (aspect-ratio + all-absolute children) */
@supports not (aspect-ratio: 1 / 1){
  .projects--rich .proj{ height: 0; padding-bottom: 133.333%; }
}

/* ===== Lead form success state (replaces the form after submit) ===== */
.form-thanks{ text-align:center; padding:clamp(36px,5vw,56px) clamp(24px,4vw,40px); background:linear-gradient(180deg,#FCF9F3,#F4EDDE); border:1px solid var(--gold-pale); border-radius:20px; box-shadow:0 30px 70px -44px rgba(143,110,44,.32), inset 0 1px 0 rgba(255,255,255,.8); }
.form-thanks__ic{ width:64px; height:64px; margin:0 auto 22px; border-radius:50%; display:flex; align-items:center; justify-content:center; background:linear-gradient(135deg,var(--gold),var(--gold-deep)); color:#fff; box-shadow:0 16px 34px -16px rgba(143,110,44,.6); }
.form-thanks__ic svg{ width:30px; height:30px; }
.form-thanks__t{ font-size:clamp(24px,3.2vw,34px); font-weight:300; color:var(--ink); margin:0 0 12px; letter-spacing:-.02em; }
.form-thanks__p{ font-size:15px; line-height:1.75; color:var(--ink-soft); max-width:46ch; margin:0 auto 16px; }
.form-thanks__p b{ color:var(--gold-deep); font-weight:600; }
.form-thanks__sub{ font-size:13.5px; line-height:1.6; color:var(--ink-mute); margin:0; }
.form-thanks__sub a{ color:var(--gold-deep); border-bottom:1px solid var(--gold-pale); }