/* ============================================================
   ELITE OASIS — EMAAR INDIA  |  v2 — Attope-inspired
   ============================================================ */

/* ── 1. CSS VARIABLES ──────────────────────────────────────── */
:root {
  /* ── Brand Gold — unchanged from brochure ── */
  --gold:        #B8963E;
  --gold-light:  #D4AF6A;
  --gold-dark:   #8C6E2A;

  /* ── Brochure Crimson — section title accent ── */
  --crimson:     #7A1533;
  --crimson-deep:#5A0F25;

  /* ── LIGHT THEME — brochure creams & charcoals ── */
  --dark:        #F5F0E8;   /* was darkest bg → now warm cream page bg */
  --dark-2:      #EDE8DC;   /* was dark bg → slightly deeper cream */
  --dark-3:      #E4DDD0;   /* was dark card → light warm card bg */
  --dark-4:      #D8D0C4;   /* was darkest card → muted warm */
  --warm-white:  #1C1916;   /* was text color → now dark charcoal text */
  --off-white:   #2E2920;   /* secondary text */
  --mid-gray:    #7A7268;   /* muted text */
  --light-gray:  #B0A898;   /* subtle borders */

  /* ── Pure whites for cards/panels ── */
  --panel:       #FFFFFF;
  --panel-2:     #FAF8F4;

  --font-display: 'optima', 'Times New Roman', serif;
  /* --font-body:    'lato', 'Helvetica Neue', sans-serif; */
  --font-body:    'optima', 'Times New Roman', serif;

  --ease-out:    cubic-bezier(0.22,1,0.36,1);
  --ease-spring: cubic-bezier(0.34,1.56,0.64,1);
  --ease-in-out: cubic-bezier(0.4,0,0.2,1);

  --section-pad: clamp(80px, 10vw, 140px);
  --container:   1440px;
}


/*-------- fonts --------*/
@font-face {
  font-family: 'optima';
  src: url(../fonts/optima/OPTIMA.TTF) format('truetype');
}

/* @font-face {
  font-family: 'lato';
  src: url(../fonts/optima/OPTIMA.TTF) format('truetype');
} */


/* ── 2. RESET & BASE ───────────────────────────────────────── */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box;}
html{font-size:16px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;}
body{background:var(--dark);color:var(--warm-white);font-family:var(--font-body);font-weight:300;overflow-x:hidden;}
img{display:block;max-width:100%;}
a{text-decoration:none;color:inherit;}
button{cursor:pointer;border:none;background:none;}
ul,ol{list-style:none;}
::selection{background:var(--gold);color:var(--dark);}

/* ── 3. CURSOR ─────────────────────────────────────────────── */
#cursor-dot,#cursor-ring{position:fixed;top:0;left:0;border-radius:50%;pointer-events:none;z-index:99999;transform:translate(-50%,-50%);}
#cursor-dot{width:6px;height:6px;background:var(--gold);}
#cursor-ring{width:36px;height:36px;border:1px solid rgba(184,150,62,0.6);transition:width .35s var(--ease-spring),height .35s var(--ease-spring),background .25s ease,border-color .25s ease;}
#cursor-ring.hovered{width:60px;height:60px;border-color:var(--gold);background:rgba(184,150,62,0.07);}
#cursor-ring.clicking{width:28px;height:28px;background:rgba(184,150,62,0.2);}

/* ── 4. SCROLLBAR ──────────────────────────────────────────── */
::-webkit-scrollbar{width:3px;}
::-webkit-scrollbar-track{background:var(--dark-2);}
::-webkit-scrollbar-thumb{background:var(--gold-dark);border-radius:2px;}

/* ── 5. NOISE OVERLAY ──────────────────────────────────────── */
body::after{content:'';position:fixed;inset:0;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.03'/%3E%3C/svg%3E");pointer-events:none;z-index:9998;opacity:0.3;will-change:transform;}

/* ── 6. LOADER ─────────────────────────────────────────────── */
#page-loader{position:fixed;inset:0;background:var(--dark-2);z-index:99997;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:32px;transition:opacity .8s ease,visibility .8s ease;}
#page-loader.hidden{opacity:0;visibility:hidden;}
.loader-logo{display:flex;flex-direction:column;align-items:center;gap:8px;}
.loader-logo img{width:120px;filter:none;opacity:0.9;}
.loader-tagline{font-family:var(--font-display);font-size:13px;letter-spacing:4px;text-transform:uppercase;color:var(--gold);}
.loader-bar-wrap{width:180px;height:1px;background:rgba(28,25,22,0.12);overflow:hidden;}
.loader-bar{height:100%;width:100%;background:linear-gradient(90deg,transparent,var(--gold),transparent);animation:loaderBar 1.8s ease-in-out infinite;margin-left:-100%;}
@keyframes loaderBar{0%{margin-left:-100%;}100%{margin-left:100%;}}
.loader-count{font-family:var(--font-display);font-size:11px;letter-spacing:3px;color:var(--mid-gray)}

/* ── 7. NAVBAR ─────────────────────────────────────────────── */
#navbar{position:fixed;top:0;left:0;right:0;z-index:1000;padding:24px 60px;display:flex;align-items:center;justify-content:space-between;transition:background .5s ease,padding .4s ease;}
#navbar.scrolled{background:rgba(245,240,232,0.96);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);padding:16px 60px;border-bottom:1px solid rgba(184,150,62,0.2);box-shadow:0 2px 20px rgba(28,25,22,0.08);}
.nav-logo img{height:30px;filter:none;transition:opacity .25s ease;}
#navbar.scrolled .nav-logo img{filter: invert(1);}
.nav-logo:hover img{opacity:0.75;}
.nav-links{display:flex;align-items:center;gap:40px;}
.nav-links a{font-size:14px;font-weight:400;letter-spacing:2.5px;text-transform:uppercase;color:var(--dark);position:relative;transition:color .25s ease;}
.nav-links a::after{content:'';position:absolute;bottom:-3px;left:0;width:0;height:1px;background:var(--crimson);transition:width .45s ease;}
.nav-links a:hover,.nav-links a.active{color: var(--crimson);}
.nav-links a:hover::after,.nav-links a.active::after{width:100%;}
.nav-cta{padding:12px 28px!important;border:1px solid var(--gold)!important;color:var(--gold)!important;transition:background .25s ease,color .25s ease!important;}
.nav-cta::after{display:none!important;}
.nav-cta:hover{background:var(--gold)!important;color:var(--dark)!important;}
.nav-hamburger{display:none;flex-direction:column;gap:5px;padding:4px;position:relative;z-index:1001;}
.nav-hamburger span{display:block;width:24px;height:1px;background:#FFFFFF;transition:transform .3s ease,opacity .3s ease;}
#navbar.scrolled .nav-links a{color:var(--warm-white);}
/* backdrop behind slide-in nav */
.mnav-backdrop{
  display:none;position:fixed;inset:0;z-index:998;
  background:rgba(13,12,10,.55);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);
  opacity:0;transition:opacity .4s ease;
}
.mnav-backdrop.open{display:block;opacity:1;}
.mobile-nav{
  position:fixed;top:0;right:0;bottom:0;
  width:min(340px,88vw);
  background:var(--warm-white);
  z-index:999;
  transform:translateX(100%);
  transition:transform .7s var(--ease-out);
  box-shadow:-8px 0 48px rgba(13,12,10,.18);
}
.mobile-nav.open{transform:translateX(0);}
.mnav-inner{
  display:flex;flex-direction:column;height:100%;
  padding:0;overflow-y:auto;
}
.mnav-top{
  display:flex;align-items:center;justify-content:space-between;
  padding:20px 24px;
  border-bottom:1px solid rgba(184,150,62,.15);
}
.mnav-logo{height:40px;filter:brightness(0) invert(1);opacity:.85;}
.mnav-close-btn{
  display:flex;align-items:center;justify-content:center;
  width:36px;height:36px;border-radius:50%;
  color:rgba(250,248,244,.7);cursor:pointer;flex-shrink:0;
  transition:color .2s ease,background .2s ease;
}
.mnav-close-btn:hover{color:var(--gold);background:rgba(184,150,62,.12);}
/* Hide navbar behind the open mobile panel */
body.mnav-open #navbar{opacity:0;pointer-events:none;transition:opacity .3s ease;}
.mnav-divider{height:1px;background:rgba(184,150,62,.18);margin:0 28px;}
.mnav-links{
  display:flex;flex-direction:column;
  padding:32px 0;flex:1;
}
.mnav-link{
  display:flex;align-items:center;gap:16px;
  padding:14px 28px;
  font-family:var(--font-display);font-size:clamp(18px,5vw,24px);
  font-weight:300;letter-spacing:1px;
  color:rgba(250,248,244,.85);
  border-bottom:1px solid rgba(184,150,62,.1);
  transition:color .25s ease,background .25s ease,padding-left .3s var(--ease-out);
  position:relative;
}
.mnav-link::after{
  content:'';position:absolute;left:0;top:0;bottom:0;width:2px;
  background:var(--gold);transform:scaleY(0);transform-origin:bottom;
  transition:transform .3s var(--ease-out);
}
.mnav-link:hover,.mnav-link:focus{color:var(--gold);padding-left:36px;}
.mnav-link:hover::after{transform:scaleY(1);}
.mnav-num{
  font-family:var(--font-body);font-size:9px;letter-spacing:2px;
  color:rgba(184,150,62,.5);flex-shrink:0;margin-top:2px;
}
.mnav-bottom{
  padding:20px 28px 36px;
}
.mnav-bottom .mnav-divider{margin:0 0 24px;}
.mnav-cta{
  display:inline-flex;align-items:center;gap:10px;
  width:100%;justify-content:center;
  font-family:var(--font-body);font-size:11px;font-weight:600;
  letter-spacing:3px;text-transform:uppercase;
  padding:15px 24px;
  background:var(--gold);color:var(--dark);
  cursor:pointer;
  position:relative;overflow:hidden;
  transition:background .3s ease;
}
.mnav-cta:hover{background:var(--gold-light);}
.mnav-rera{
  margin-top:16px;font-size:9px;letter-spacing:1.5px;text-transform:uppercase;
  color:rgba(250,248,244,.25);text-align:center;line-height:1.7;
}

/* ── 8. HERO ───────────────────────────────────────────────── */
#hero{position:relative;width:100%;height:100svh;min-height:600px;overflow:hidden;display:flex;align-items:flex-end;}
#hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;}
.hero-overlay{position:absolute;inset:0;background:linear-gradient(to bottom,rgba(13,12,10,.2) 0%,rgba(13,12,10,.05) 30%,rgba(13,12,10,.5) 65%,rgba(13,12,10,.92) 100%);z-index:1;}
.hero-content{position:relative;z-index:2;padding:0 60px 80px;max-width:820px;}
.hero-rera{display:inline-flex;align-items:center;gap:10px;font-size:10px;letter-spacing:3px;text-transform:uppercase;color:var(--panel);margin-bottom:20px;opacity:0;transform:translateY(20px);}
.hero-rera::before{content:'';width:32px;height:1px;background:var(--panel);}
.hero-title{font-family:var(--font-display);font-size:clamp(56px,8.5vw,118px);font-weight:300;line-height:.9;letter-spacing:-1px;color:var(--gold);margin-bottom:22px;opacity:0;transform:translateY(40px);}
.hero-title em{font-style:italic;color:var(--gold);}
.hero-subtitle{font-size:clamp(11px,1.4vw,13px);font-weight:400;letter-spacing:3.5px;text-transform:uppercase;color:var(--panel);margin-bottom:40px;opacity:0;transform:translateY(20px);}
.hero-actions{display:flex;align-items:center;gap:28px;opacity:0;transform:translateY(-9px) !important;}
.hero-scroll-hint{position:absolute;bottom:32px;right:60px;z-index:2;display:flex;flex-direction:column;align-items:center;gap:10px;opacity:0;}
.hero-scroll-hint span{font-size:9px;letter-spacing:3px;text-transform:uppercase;color:var(--panel);writing-mode:vertical-rl;transform:rotate(180deg);}
.scroll-line{width:1px;height:60px;background:linear-gradient(to bottom,rgba(184,150,62,.8),transparent);animation:scrollPulse 2s ease-in-out infinite;}
@keyframes scrollPulse{0%,100%{opacity:.8;}50%{opacity:.2;}}
.hero-stats{position:absolute;bottom:0;left:0;right:0;z-index:2;display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid rgba(184,150,62,.15);opacity:0;transform:translateY(20px);}
.hero-stat{padding:20px 32px;border-right:1px solid var(--gold);background:rgba(245,240,232,0.75);backdrop-filter:blur(12px);text-align:center;}
.hero-stat:last-child{border-right:none;}
.hero-stat-num{font-family:var(--font-display);font-size:clamp(20px,2.5vw,30px);font-weight:500;color:var(--gold);line-height:1;margin-bottom:4px;}
.hero-stat-label{font-size: 12px; letter-spacing: 2px; text-transform: uppercase; color: var(--bs-black); font-weight: 600;}

/* ── 9. BUTTONS ────────────────────────────────────────────── */
.btn-primary{display:inline-flex;align-items:center;gap:12px;font-size:11px;font-weight:500;letter-spacing:3px;text-transform:uppercase;padding:16px 36px;background:var(--gold);color:var(--dark);position:relative;overflow:hidden;transition:transform .3s ease;}
.btn-primary::before{content:'';position:absolute;inset:0;background:var(--gold-light);transform:translateX(-100%);transition:transform .45s ease;}
.btn-primary:hover::before{transform:translateX(0);}
.btn-primary span,.btn-primary svg{position:relative;z-index:1;}
.btn-primary:hover{transform:translateY(-2px);}
.btn-secondary{display:inline-flex;align-items:center;gap:10px;font-size:11px;letter-spacing:3px;text-transform:uppercase;color: var(--panel);border-bottom:1px solid var(--panel);padding-bottom:4px;transition:color .25s ease,border-color .25s ease;}
.btn-secondary:hover{color:var(--gold);border-color:var(--gold);}

/* ── 10. MARQUEE ───────────────────────────────────────────── */
.marquee-strip{background:var(--gold);padding:12px 0;overflow:hidden;position:relative;z-index:3;}
.marquee-inner{display:flex;animation:marqueeScroll 30s linear infinite;white-space:nowrap;}
.marquee-item{display:inline-flex;align-items:center;gap:16px;padding:0 32px;font-size:10px;font-weight:500;letter-spacing:3px;text-transform:uppercase;color:var(--dark);}
.marquee-dot{width:4px;height:4px;background:var(--dark);border-radius:50%;flex-shrink:0;}
@keyframes marqueeScroll{0%{transform:translateX(0);}100%{transform:translateX(-50%);}}

/* ── 11. SECTION COMMONS ───────────────────────────────────── */
.section{padding:var(--section-pad) 60px;}
.section-eyebrow{display:inline-flex;align-items:center;gap:12px;font-size:12px;font-weight:500;letter-spacing:4px;text-transform:uppercase;color:var(--warm-white);margin-bottom:20px;}
.section-eyebrow::before{content:'';width:28px;height:1px;background:var(--warm-white);}
.section-title{font-family:var(--font-display);font-size:clamp(36px,5vw,68px);font-weight:300;line-height:1.05;letter-spacing:-.5px;color:var(--crimson);}
.section-title em{font-style:italic;color:var(--gold-light);}
.section-body{font-size:clamp(14px,1.4vw,18px);font-weight:300;line-height:1.85;max-width:580px;}
.gold-line{width:60px;height:1px;background:linear-gradient(90deg,var(--gold),transparent);margin:28px 0;}
/* Legacy reveal classes — neutralised; AOS handles all scroll animations */
.reveal-up,.reveal-left,.reveal-right{opacity:1;transform:none;}
.reveal-up.in-view,.reveal-left.in-view,.reveal-right.in-view{opacity:1;transform:none;}
/* AOS easing override to match LP feel */
[data-aos]{transition-timing-function:cubic-bezier(0.22,1,0.36,1) !important;}
.delay-4{transition-delay:.4s;}.delay-5{transition-delay:.5s;}.delay-6{transition-delay:.6s;}

/* ── 12. INTRO SECTION ─────────────────────────────────────── */
#intro{background:var(--panel);position:relative;overflow:hidden;}
#intro::before{content:'';position:absolute;top:-200px;right:-200px;width:500px;height:500px;border-radius:50%;background:radial-gradient(circle,rgba(184,150,62,.06) 0%,transparent 70%);pointer-events:none;}
.intro-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center;max-width:var(--container);margin:0 auto;}
/* ── Artistic Impression label — shared ── */
.intro-image-wrap::after,
.sustain-image-stack::after,
.about-image::after,
.gal-card::after{
  content:'Artistic Impression';
  position:absolute;bottom:10px;right:12px;z-index:5;
  font-family:var(--font-body);font-size:8.5px;font-weight:400;
  letter-spacing:1.8px;text-transform:uppercase;
  color:rgba(255,255,255,.75);
  background:rgba(0,0,0,.32);
  padding:3px 8px;
  backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);
  pointer-events:none;
}

.intro-image-wrap{position:relative;aspect-ratio:3/4;overflow:hidden;}
.intro-image-wrap img{width:100%;height:100%;object-fit:cover;transition:transform 8s ease;}
.intro-image-wrap:hover img{transform:scale(1.04);}
.intro-image-badge{position:absolute;bottom:32px;right:-10px;background:var(--gold);color:var(--dark);padding:20px 28px;font-family:var(--font-display);text-align:center;}
.intro-image-badge strong{display:block;font-size:36px;font-weight:600;line-height:1;}
.intro-image-badge span{font-size:10px;letter-spacing:2px;text-transform:uppercase;font-family:var(--font-body);font-weight:400;}
.intro-frame{position:absolute;top:-16px;left:-16px;width:80px;height:80px;border-top:2px solid var(--gold);border-left:2px solid var(--gold);pointer-events:none;}
.intro-frame-br{position:absolute;bottom:-16px;right:-16px;width:80px;height:80px;border-bottom:2px solid var(--gold);border-right:2px solid var(--gold);pointer-events:none;}
.intro-features{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:36px;}
.intro-feature{display:flex;align-items:flex-start;gap:14px;}
.intro-feature-icon{width:40px;height:40px;border:1px solid rgba(184,150,62,.3);display:flex;align-items:center;justify-content:center;flex-shrink:0;color:var(--gold);}
.intro-feature h4{font-size:14px;font-weight:500;letter-spacing:1.5px;text-transform:uppercase;color:var(--off-white);margin-bottom:0px;}
.intro-feature p{font-size:14px;line-height:1.6;color:rgba(28,25,22,.55);}

/* ── 13. LOCATION SECTION ──────────────────────────────────── */
#location{background:var(--dark-2);}
.location-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center;max-width:var(--container);margin:0 auto;}
.location-image{position:relative;overflow:hidden;}
.location-image img{width:100%;height:100%;object-fit:cover;transition:transform 10s ease;}
.location-image:hover img{transform:scale(1.05);}
.location-distances{margin-top:36px;display:flex;flex-direction:column;}
.location-item{display:flex;align-items:center;justify-content:space-between;padding:14px 0;border-bottom:1px solid rgba(184,150,62,.1);position:relative;overflow:hidden;}
.location-item::before{content:'';position:absolute;left:0;bottom:0;width:0;height:1px;background:var(--gold);transition:width .45s ease;}
.location-item:hover::before{width:100%;}
.location-item-left{display:flex;align-items:center;gap:14px;}
.location-icon{width:32px;height:32px;display:flex;align-items:center;justify-content:center;color:var(--gold);font-size:14px;}
.location-name{font-size:16px;font-weight:400;color:rgba(28,25,22,.85);}
.location-cat{font-size:14px;letter-spacing:1.5px;text-transform:uppercase;color:var(--mid-gray);}
.location-dist{font-family:var(--font-display);font-size:20px;font-weight:500;color:var(--crimson);}

/* ── 14. AMENITIES ─────────────────────────────────────────── */
#amenities{background:var(--panel-2);padding-bottom:0;}
.amenities-header{max-width:var(--container);margin:0 auto 60px;display:flex;justify-content:space-between;align-items:flex-end;}
.amenities-scroll-container{position:relative;overflow:hidden;padding-bottom:var(--section-pad);}
.amenities-track{display:flex;gap:20px;padding:0 60px;transition:transform .6s var(--ease-out);will-change:transform;}
.amenity-card{flex:0 0 340px;position:relative;aspect-ratio:3/4;overflow:hidden;cursor:pointer;}
.amenity-card img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease-out);}
.amenity-card:hover img{transform:scale(1.08);}
.amenity-card-overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(28,25,22,.88) 0%,rgba(28,25,22,.04) 55%);transition:background .4s ease;}
.amenity-card:hover .amenity-card-overlay{background:linear-gradient(to top,rgba(28,25,22,.94) 0%,rgba(28,25,22,.22) 55%);}
.amenity-card-content{position:absolute;bottom:0;left:0;right:0;padding:28px;}
.amenity-num{font-family:var(--font-display);font-size:16px;letter-spacing:3px;color:var(--gold);margin-bottom:8px;}
.amenity-title{font-family:var(--font-display);font-size:24px;font-weight:400;color:var(--panel);line-height:1.2;margin-bottom:10px;}
.amenity-desc{font-size:14px;line-height:1.5;color:var(--panel);max-height:0;overflow:hidden;transition:max-height .4s ease;}
.amenity-card:hover .amenity-desc{max-height:60px;}
.amenities-nav{display:flex;gap:12px;}
.amenity-nav-btn{width:48px;height:48px;border:1px solid rgba(184,150,62,.4);display:flex;align-items:center;justify-content:center;color:var(--gold);transition:background .25s ease,border-color .25s ease;cursor:pointer;}
.amenity-nav-btn:hover{background:var(--gold);border-color:var(--gold);color:var(--dark);}

/* ── 15. UNITS ─────────────────────────────────────────────── */
#units{background:var(--panel);}
.units-header{max-width:var(--container);margin:0 auto 60px;display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:end;}
.units-grid{max-width:var(--container);margin:0 auto;display:grid;grid-template-columns:repeat(1,1fr);gap:8px;}
.unit-card{background:var(--dark-3);padding:40px;position:relative;overflow:hidden;transition:background .45s ease;cursor:default;border:1px solid rgba(28,25,22,.08);}
.unit-card::before{content:'';position:absolute;bottom:0;left:0;width:100%;height:2px;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .45s ease;}
.unit-card:hover::before{transform:scaleX(1);}
.unit-card:hover{background:var(--dark-4);}
.unit-type-label{font-size:9px;font-weight:500;letter-spacing:3.5px;text-transform:uppercase;color:var(--gold);margin-bottom:16px;}
.unit-type-name{font-family:var(--font-display);font-size:38px;font-weight:300;color:var(--off-white);line-height:1;margin-bottom:8px;}
.unit-subname{font-size:11px;letter-spacing:1.5px;color:var(--mid-gray);margin-bottom:28px;}
.unit-specs{display:flex;flex-direction:column;gap:12px;margin-bottom:28px;}
.unit-spec{display:flex;justify-content:space-between;align-items:center;padding-bottom:12px;border-bottom:1px solid rgba(184,150,62,.1);}
.unit-spec-label{color:var(--mid-gray);letter-spacing:1px;text-transform:uppercase;font-size:12px;}
.unit-spec-value{font-family:var(--font-display);font-size:18px;font-weight:500;color:var(--off-white);}
/* unit-cta — matches btn-primary style */
.unit-cta{
display: inline-flex; align-items: center; gap: 12px; font-size: 11px; font-weight: 500; letter-spacing: 3px; text-transform: uppercase; padding: 14px 28px; background: var(--gold); color: var(--dark); position: relative; overflow: hidden; transition: transform .3s ease; cursor: pointer; margin: 8px auto 0px; display: block;
}
.unit-cta::before{
  content:'';position:absolute;inset:0;
  background:var(--gold-light);transform:translateX(-100%);
  transition:transform .45s var(--ease-out);
}
.unit-cta span,.unit-cta svg{position:relative;z-index:1;}
.unit-cta:hover::before{transform:translateX(0);}
.unit-cta:hover{transform:translateY(-2px);}

/* ══════════════════════════════════════════════════════════════
   16. GALLERY — EXACT ATTOPE SOURCE MATCH
       Top bar: icon + heading + counter
       Image row: 4 columns of cards, fda-big-image expands
   ══════════════════════════════════════════════════════════════ */

#gallery-scroll-container {
  position: relative;
  height: 150vh;
  contain: layout;
}

#gallery {
  position: sticky;
  top: 0;
  width: 100%;
  height: 100vh;
  overflow: hidden;
  background: var(--dark-3);
  display: flex;
  flex-direction: column;
  contain: layout;
}

/* ── TOP BAR ── */
.gal-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 36px 60px 24px;
  flex-shrink: 0;
  gap: 28px;
  will-change: opacity, transform;
}

.gal-top-icon {
  width: 42px; height: 42px;
  border: 1px solid rgba(184,150,62,.3);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  color: var(--gold);
}

.gal-top-heading {
  font-family: var(--font-display);
  font-size: clamp(16px, 2vw, 30px);
  font-weight: 300;
  line-height: 1.15;
  color: var(--warm-white);
  text-align: center;
  flex: 1;
}
.gal-top-heading em { font-style: italic; color: var(--gold-light); }

.gal-top-right {
  display: flex;
  align-items: flex-end;
  gap: 10px;
  flex-shrink: 0;
}

.gal-counter-num {
  font-family: var(--font-display);
  font-size: 56px;
  font-weight: 300;
  line-height: 1;
  color: var(--warm-white);
}

.gal-counter-badge { margin-bottom: 6px; }

.gal-counter-plus {
  width: 28px; height: 28px;
  border: 1.5px solid rgba(184,150,62,.45);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--gold);
  font-size: 15px;
  margin-bottom: 5px;
}

.gal-counter-label {
  font-size: 9px;
  font-weight: 500;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: rgba(28,25,22,0.4);
  line-height: 1.5;
  max-width: 72px;
}

/* ── IMAGE ROW — 4 columns of cards ── */
.gal-row {
  flex: 1;
  min-height: 0;
  position: relative;
  display: flex;
  align-items: stretch;
  gap: 10px;
  padding: 0 60px 36px;
  will-change: opacity;
}

.gal-col {
  display: flex;
  flex-direction: column;
  gap: 10px;
  flex: 1;
  min-width: 0;
}

/* fda-image-main equivalent */
.gal-card {
  position: relative;
  overflow: hidden;
  border-radius: 14px;
  flex: 1;
  min-height: 0;
}
.gal-card img {
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .7s var(--ease-out);
}
.gal-card:hover img { transform: scale(1.04); }

/* "Luxury" label */
.gal-label {
  position: absolute;
  bottom: 14px; left: 14px;
  font-family: var(--font-display);
  font-size: clamp(22px, 2.8vw, 42px);
  font-weight: 700;
  color: var(--warm-white);
  text-transform: uppercase;
  letter-spacing: .5px;
  line-height: 1;
  pointer-events: none;
  text-shadow: 0 2px 14px rgba(0,0,0,.55);
}

/* ════════════════════════════════════════════════════════
   THE BIG IMAGE CARD (fda-big-image-wrapper equivalent)
   Starts at 25% width / 55% height, grows to 100%/100%
   JS writes width + height + left + top each frame
   ════════════════════════════════════════════════════════ */
#gallery-video-card {
  position: absolute;
  z-index: 10;
  overflow: hidden;
  border-radius: 14px;
  will-change: transform, width, height, border-radius;
}

/* Video sits behind everything inside the card */
#gallery-video-el {
  position: absolute;
  inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
}

/* Poster on top of video, fades out */
.gal-poster {
  position: absolute;
  inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  z-index: 2;
}

/* Three gradient overlays like fda-banner-gradient */
.gal-gradients {
  position: absolute;
  inset: 0;
  z-index: 3;
  pointer-events: none;
  background:
    linear-gradient(to top,  rgba(0,0,0,.6) 0%,  transparent 50%),
    linear-gradient(to right, rgba(0,0,0,.3) 0%,  transparent 40%),
    linear-gradient(to left,  rgba(0,0,0,.3) 0%,  transparent 40%);
}

/* fda-text-wrapper — the text layer inside fda-big-image */
.gal-text-wrapper {
  position: absolute;
  inset: 0;
  z-index: 4;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  padding: 36px 40px;
  pointer-events: none;
}

/* fda-about-hero-big-font — "LUXURY" */
.gal-typo {
  font-family: var(--font-display);
  font-size: clamp(56px, 9vw, 130px);
  font-weight: 700;
  line-height: .85;
  letter-spacing: -2px;
  color: #efefef;
  text-transform: uppercase;
  align-self: flex-end;
  will-change: opacity, transform;
}

/* fda-inner-right — property valuation card + arrow button */
.gal-inner-right {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 12px;
  align-self: flex-start;
  will-change: opacity, transform;
  top: 30px; /* JS will toggle to 50% when the card moves to center */
  position: relative;
}

/* fda-property-valuation card */
.gal-prop {
  background: var(--gold);
  border-radius: 14px;
  padding: 18px 20px;
  width: 220px;
  pointer-events: none;
}

.gal-prop-icon { margin-bottom: 28px; }
.gal-prop-icon svg { width: 26px; height: 26px; }

.gal-prop-sub {
  font-size: 9px;
  font-weight: 600;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  color: rgba(13,12,10,.55);
  margin-bottom: 5px;
}

.gal-prop-title {
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  line-height: 1.45;
  color: var(--dark);
}

/* Circular arrow button — fda-button-round */
.gal-arrow-btn {
  width: 52px; height: 52px;
  border-radius: 50%;
  border: 1.5px solid var(--dark);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--dark);
  background: transparent;
  pointer-events: all;
  cursor: none;
  transition: background .2s ease, border-color .2s ease;
}
.gal-arrow-btn:hover { background: rgba(245,240,232,.12); border-color: var(--warm-white); }

/* Pause button — fda-video-button-main */
.gal-pause {
  position: absolute;
  bottom: 28px; right: 28px;
  z-index: 6;
  width: 48px; height: 48px;
  border-radius: 50%;
  background: rgba(245,240,232,.88);
  color: var(--dark);
  display: flex;
  align-items: center;
  justify-content: center;
  border: none;
  cursor: none;
  pointer-events: all;
  will-change: opacity, transform;
  transition: background .2s ease;
}
.gal-pause:hover { background: #fff; }

/* ── Responsive ── */
@media (max-width: 992px) {
  #gallery-scroll-container { height: 180vh; }
  .gal-top { padding: 24px 32px 18px; }
  .gal-top-heading { font-size: clamp(13px, 2.2vw, 22px); }
  .gal-counter-num { font-size: 44px; }
  .gal-row { padding: 0 32px 24px; gap: 8px; }
  .gal-typo { font-size: clamp(40px, 7vw, 80px); }
  .gal-prop { width: 188px; }
}
@media (max-width: 768px) {
  /* Keep sticky scroll height so the JS-driven animation still fires */
  #gallery-scroll-container { height: 200vh; }

  /* Top bar */
  .gal-top { padding: 14px 16px 10px; flex-wrap: wrap; gap: 10px; }
  .gal-top-icon { display: none; }
  .gal-top-heading { font-size: clamp(13px, 3.8vw, 17px); text-align: left; flex: 1 1 55%; }
  .gal-top-right { flex-shrink: 0; }
  .gal-counter-num { font-size: 34px; }
  .gal-counter-label { font-size: 8px; max-width: 70px; }

  /* 2×2 grid instead of 4 thin columns */
  .gal-row {
    flex-wrap: wrap;
    padding: 0 12px 16px;
    gap: 8px;
    align-items: stretch;
  }
  .gal-col {
    flex: 0 0 calc(50% - 4px);
    width: calc(50% - 4px);
    display: flex;
    flex-direction: column;
    gap: 8px;
  }
  .gal-card {
    flex: 1;
    min-height: 160px;
    border-radius: 10px;
  }
  .gal-card img { object-position: center; }

  /* Video card / typo / prop */
  .gal-typo { font-size: clamp(28px, 9vw, 48px); }
  .gal-prop { width: 150px; padding: 12px; }
  .gal-prop-title { font-size: 13px; }
  .gal-arrow-btn { width: 44px; height: 44px; }
  .gal-pause { bottom: 12px; right: 12px; width: 36px; height: 36px; font-size: 11px; }
  .amenity-card-content{padding: 28px 10px;}
  .nav-logo img {height: 20px;}

}

/* ── 17. STATS SECTION — Attope style ─────────────────────── */
#stats{position:relative;overflow:hidden;padding:var(--section-pad) 60px;}
.stats-bg{position:absolute;inset:0;background-size:cover;background-position:center;z-index:0;}
.stats-bg::after{content:'';position:absolute;inset:0;background:rgb(245 240 232 / 49%);}
.stats-inner{position:relative;z-index:1;max-width:var(--container);margin:0 auto;}
.stats-header{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:end;margin-bottom:72px;}
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:rgba(184,150,62,.2);}
.stat-block{background:rgba(255,255,255,.75);padding:40px 32px;position:relative;overflow:hidden;transition:background .4s ease;}
.stat-block::before{content:'';position:absolute;top:0;left:0;width:100%;height:2px;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .5s ease;}
.stat-block:hover::before{transform:scaleX(1);}
.stat-block:hover{background:rgba(255,255,255,.92);}
.stat-num{font-family:var(--font-display);font-size:clamp(44px,5vw,72px);font-weight:300;line-height:1;color:var(--warm-white);margin-bottom:8px;}
.stat-num span{color:var(--gold);}
.stat-label{font-size:11px;font-weight:400;letter-spacing:2px;text-transform:uppercase;}
.stat-desc{font-size:12px;line-height:1.6;margin-top:8px;}

/* ── 18. SUSTAINABILITY ────────────────────────────────────── */
#sustainability{background:var(--dark-2);}
.sustain-grid{max-width:var(--container);margin:0 auto;display:grid;grid-template-columns:1fr 1.4fr;gap:80px;align-items:center;}
.sustain-image-stack{position:relative;aspect-ratio:4/5;overflow:hidden;}
.sustain-img-main{width:100%;height:100%;object-fit:cover;}
.sustain-img-accent{position:absolute;bottom:-32px;right:-32px;width:55%;aspect-ratio:4/3;object-fit:cover;border:4px solid var(--dark-3);}
.sustain-pills{display:flex;flex-wrap:wrap;gap:10px;margin-top:32px;}
.sustain-pill{display:flex;align-items:center;gap:8px;padding:10px 18px;border:1px solid rgba(184,150,62,.3);font-size:11px;letter-spacing:1.5px;text-transform:uppercase;color:rgba(28,25,22,.75);transition:border-color .25s ease,color .25s ease,background .25s ease;}
.sustain-pill svg{color:var(--gold);flex-shrink:0;}
.sustain-pill:hover{border-color:var(--gold);color:var(--warm-white);background:rgba(184,150,62,.1);}

/* ── 19. ABOUT ─────────────────────────────────────────────── */
#about{background:var(--panel-2);position:relative;overflow:hidden;}
.about-grid{max-width:var(--container);margin:0 auto;display:grid;grid-template-columns:1.2fr 1fr;gap:80px;align-items:center;}
.about-image{position:relative;aspect-ratio:3/4;overflow:hidden;}
.about-image img{width:100%;height:100%;object-fit:cover;transition:transform 10s ease;}
.about-image:hover img{transform:scale(1.04);}
.about-stats-overlay{position:absolute;bottom:0;left:0;right:0;padding:32px;background:linear-gradient(to top,rgba(28,25,22,.75),transparent);display:grid;grid-template-columns:1fr 1fr;gap:20px;}
.about-stat-item .num{font-family:var(--font-display);font-size:34px;font-weight:500;color:var(--gold);line-height:1;margin-bottom:4px;}
.about-stat-item .lbl{font-size:10px;letter-spacing:2px;text-transform:uppercase;color:var(--panel);}
.about-emaar-logo{margin-top:36px;padding-top:36px;border-top:1px solid rgba(184,150,62,.15);}
.about-emaar-logo img{height:28px;filter:none;opacity:.8;transition:opacity .25s ease;}
.about-emaar-logo img:hover{opacity:1;}

/* ── 20. CONTACT ───────────────────────────────────────────── */
#contact{background:var(--panel);position:relative;overflow:hidden;}
#contact::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 60% 60% at 80% 50%,rgba(122,21,51,.08),transparent),radial-gradient(ellipse 40% 40% at 20% 50%,rgba(184,150,62,.06),transparent);pointer-events:none;}
.contact-grid{max-width:var(--container);margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:start;}
.contact-highlights{margin-top:40px;display:flex;flex-direction:column;gap:20px;}
.contact-highlight{display:flex;align-items:center;gap:16px;}
.ch-icon{width:44px;height:44px;border:1px solid rgba(184,150,62,.3);display:flex;align-items:center;justify-content:center;color:var(--gold);flex-shrink:0;}
.ch-label{font-size:10px;letter-spacing:2px;text-transform:uppercase;color:var(--mid-gray);margin-bottom:3px;}
.ch-value{font-size:14px;font-weight:400;color:var(--warm-white);}
.lead-form-wrap{background:var(--panel-2);padding:48px;position:relative;z-index:1;border:1px solid rgba(184,150,62,.15);}
.lead-form-wrap::before{content:'';position:absolute;top:0;left:0;width:80px;height:2px;background:var(--gold);}
.form-title{font-family:var(--font-display);font-size:28px;font-weight:400;color:var(--crimson);margin-bottom:6px;}
.form-subtitle{font-size:12px;letter-spacing:1px;color:var(--mid-gray);margin-bottom:32px;}
.form-row{margin-bottom:18px; position:relative;}
.form-row label{display:block;font-size:10px;font-weight:500;letter-spacing:2px;text-transform:uppercase;color:rgba(28,25,22,0.5);margin-bottom:8px;}
.form-row input,.form-row select,.form-row textarea{width:100%;background:rgba(255,255,255,.8);border:1px solid rgba(184,150,62,.2);padding:14px 18px;font-family:var(--font-body);font-size:14px;font-weight:300;color:var(--off-white);outline:none;transition:border-color .25s ease,background .25s ease;-webkit-appearance:none;appearance:none;border-radius:0;}
.form-row input:focus,.form-row select:focus,.form-row textarea:focus{border-color:var(--gold);background:rgba(255,255,255,1);}
.form-row select option{background:var(--panel-2);color:var(--warm-white);}
.form-row textarea{height:100px;resize:none;}
.form-row-split{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.form-submit{width:100%;margin-top:24px;padding:16px;background:var(--gold);color:var(--dark);font-family:var(--font-body);font-size:11px;font-weight:600;letter-spacing:3px;text-transform:uppercase;transition:background .25s ease;cursor:pointer;}
.form-submit:hover{background:var(--gold-light);}
.form-disclaimer{font-size:10px;color:rgba(28,25,22,0.3);margin-top:14px;line-height:1.6;}

/* ── 21. FOOTER ────────────────────────────────────────────── */
#footer{background:var(--dark-2);border-top:1px solid rgba(184,150,62,.2);padding:64px 60px 32px;}
.footer-top{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:60px;margin-bottom:48px;max-width:var(--container);margin-left:auto;margin-right:auto;}
.footer-brand img{height:32px;filter:none;opacity:.85;margin-bottom:20px;}
.footer-brand p{font-size:13px;line-height:1.8;color:rgba(28,25,22,.55);max-width:280px;margin-bottom:24px;}
.footer-socials{display:flex;gap:12px;}
.footer-social-btn{width:36px;height:36px;border:1px solid rgba(184,150,62,.2);display:flex;align-items:center;justify-content:center;color:rgba(28,25,22,0.45);font-size:14px;transition:border-color .25s ease,color .25s ease,background .25s ease;}
.footer-social-btn:hover{border-color:var(--gold);color:var(--gold);background:rgba(184,150,62,.08);}
.footer-col h5{font-size:10px;font-weight:500;letter-spacing:3px;text-transform:uppercase;color:var(--gold);margin-bottom:20px;}
.footer-col ul li{margin-bottom:10px;}
.footer-col ul li a{font-size:13px;color:rgba(28,25,22,.55);transition:color .25s ease,padding-left .25s ease;display:inline-block;}
.footer-col ul li a:hover{color:var(--warm-white);padding-left:6px;}
.footer-col address{font-style:normal;font-size:13px;line-height:1.9;color:rgba(28,25,22,.55);}
.footer-divider{border:none;border-top:1px solid rgba(184,150,62,.15);margin-bottom:24px;max-width:var(--container);margin-left:auto;margin-right:auto;}
.footer-bottom{max-width:var(--container);margin:0 auto;text-align:center;}
.footer-rera{font-size:10px;line-height:1.8;color:rgba(28,25,22,.45);}
.footer-copy{font-size:11px;color: var(--crimson);text-align:center;white-space:nowrap;}
.footer-logo{width:150px; margin: 30px auto; filter: invert(1);}

/* ── 22. BACK TO TOP ───────────────────────────────────────── */
#back-top{position:fixed;bottom:90px;right:36px;width:44px;height:44px;background:var(--gold);color:var(--panel);display:flex;align-items:center;justify-content:center;z-index:500;opacity:0;pointer-events:none;transform:translateY(20px);transition:opacity .25s ease,transform .25s ease;cursor:pointer;}
#back-top.visible{opacity:1;pointer-events:all;transform:translateY(0);}
#back-top:hover{background:var(--gold-light);}

/* ── 23. RESPONSIVE ────────────────────────────────────────── */
@media(max-width:1200px){
  #navbar,#navbar.scrolled{padding:20px 40px;}
  .section{padding:var(--section-pad) 40px;}
  .gallery-bento{grid-template-rows:280px 240px 220px;}
  .stats-grid{grid-template-columns:repeat(2,1fr);}
  .footer-top{grid-template-columns:1fr 1fr;gap:40px;}
  .units-grid{grid-template-columns:repeat(2,1fr);}
}
@media(max-width:992px){
  .nav-links{display:none;}
  .nav-hamburger{display:flex;}
  .hero-content{padding:0 40px 160px;}
  .hero-stats{grid-template-columns:repeat(2,1fr);}
  .intro-grid,.location-grid,.sustain-grid,.about-grid,.contact-grid{grid-template-columns:1fr;gap:48px;}
  .intro-image-badge{right:0;}
  .gallery-bento{grid-template-columns:1fr 1fr;grid-template-rows:auto;gap:8px;}
  .g-item-1{grid-column:1/2;grid-row:auto;}
  .g-item-2{grid-column:2/3;grid-row:auto;}
  .g-item-3{grid-column:1/3;grid-row:auto;}
  .g-item-4{grid-column:1/2;grid-row:auto;}
  .g-item-text{grid-column:2/3;grid-row:auto;}
  .g-item-5{grid-column:1/2;grid-row:auto;}
  .g-item-6{grid-column:2/3;grid-row:auto;}
  .g-item-7{grid-column:1/3;grid-row:auto;}
  .g-item-8{grid-column:1/2;grid-row:auto;}
  .g-item-9{grid-column:2/3;grid-row:auto;}
  .g-item{min-height:220px;}
  .stats-header{grid-template-columns:1fr;gap:24px;}
  .units-header{grid-template-columns:1fr;gap:24px;}
  .gallery-header{flex-direction:column;align-items:flex-start;gap:24px;}
  .sustain-img-accent{right:0;bottom:-20px;width:45%;}
  .section{padding:80px 32px;}
}
@media(max-width:768px){
  #navbar,#navbar.scrolled{padding:18px 24px;}
  #navbar.scrolled .nav-hamburger span{background:var(--warm-white);}
  body{cursor:auto; overflow-x: clip !important;}
  section{overflow-x: clip !important;}
  #cursor-dot,#cursor-ring{display:none;}
  .hero-content{padding:0 24px 160px;}
  .hero-stats{grid-template-columns:repeat(2,1fr);}
  .hero-stat{padding:14px 16px;border-bottom: 1px solid var(--gold);}
  .section{padding: 50px 15px;}
  .units-grid{grid-template-columns:1fr;}
  .unit-card{padding: 25px 15px;}
  /* Native scroll-snap on mobile — no JS transform */
  .amenities-scroll-container{overflow:visible;padding-bottom:40px;}
  .amenities-track{
    overflow-x:auto;
    overflow-y:visible;
    scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
    transform:none !important;
    padding:0 24px 4px;
    gap:16px;
  }
  .amenities-track::-webkit-scrollbar{display:none;}
  .amenity-card{
    flex:0 0 78vw;
    max-width:300px;
    scroll-snap-align:start;
  }
  .footer-top{grid-template-columns:1fr;gap:32px;}
  .footer-bottom{flex-direction:column;gap:16px;}
  .footer-copy{text-align:center;}
  #footer{padding:48px 24px 24px;}
  .lead-form-wrap{padding:32px 24px;}
  .form-row-split{grid-template-columns:1fr;}
  .stats-grid{grid-template-columns:1fr 1fr;}
  #stats{padding:50px 15px;}
  #gallery{padding:50px 15px;}
  .gallery-bento{grid-template-columns:1fr;gap:6px;}
  .g-item-1,.g-item-2,.g-item-3,.g-item-4,.g-item-5,.g-item-6,.g-item-7,.g-item-8,.g-item-9{grid-column:1/-1;}
  .g-item-text{grid-column:1/-1;}
  .g-item{min-height:200px;}
  .g-item-text{min-height:180px;}
  .hero-scroll-hint{display:none;}
  .intro-features{grid-template-columns:1fr;}
  .sustain-img-accent{display:none;}
  .section-body{font-size: clamp(16px,1.4vw,18px)}
  .stat-label{font-size:12px;}
  .stat-desc{font-size:14px;}
  #back-top {position: fixed;bottom: 60px; right: 10px;}
  .details-box{min-height: 177px;}
}
@media(max-width:480px){
  .hero-title{font-size:clamp(40px,13vw,66px);}
  .hero-actions{flex-direction:column;align-items:flex-start;gap:16px;}
  .stats-grid{grid-template-columns:1fr;}
}

/* ══════════════════════════════════════════════════════════════
   ENQUIRE NOW MODAL — REDESIGNED
══════════════════════════════════════════════════════════════ */

/* ── Overlay backdrop ── */
.eq-overlay{
  position:fixed;inset:0;z-index:99990;
  display:flex;align-items:center;justify-content:center;padding:20px;
  background:rgba(13,12,10,.78);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  opacity:0;visibility:hidden;
  transition:opacity .5s var(--ease-out),visibility .5s var(--ease-out);
}
.eq-overlay.open{opacity:1;visibility:visible;}

/* ── Floating gold particles ── */
.eq-particle{position:absolute;border-radius:50%;background:var(--gold);opacity:0;pointer-events:none;animation:eqFloat 7s ease-in-out infinite;}
.eq-overlay.open .eq-particle{opacity:1;}
.eq-p1{width:5px;height:5px;top:15%;left:10%;animation-delay:0s;}
.eq-p2{width:3px;height:3px;top:70%;left:90%;animation-delay:1.8s;animation-duration:5s;}
.eq-p3{width:7px;height:7px;top:85%;left:18%;animation-delay:3.2s;animation-duration:9s;}
@keyframes eqFloat{0%,100%{transform:translateY(0);opacity:.35;}50%{transform:translateY(-20px);opacity:.75;}}

/* ── Main panel ── */
.eq-panel{
  position:relative;
  display:grid;
  grid-template-columns:360px 1fr;
  width:min(960px,96vw);
  max-height:90vh;
  overflow:hidden;
  box-shadow:0 32px 80px rgba(13,12,10,.4),0 0 0 1px rgba(184,150,62,.15);
  transform:translateY(40px) scale(0.97);
  transition:transform .6s var(--ease-out);
}
.eq-overlay.open .eq-panel{transform:translateY(0) scale(1);}

/* ══ LEFT IMAGE SIDEBAR ══ */
.eq-side{
  position:relative;overflow:hidden;
  padding:0;
}
/* Full-cover image */
.eq-side-img{
  position:absolute;inset:0;
  width:100%;height:100%;
  object-fit:cover;object-position:center;
  transform:scale(1.05);
  transition:transform 8s ease;
}
.eq-overlay.open .eq-side-img{transform:scale(1);}
/* Dark gradient overlay on image */
.eq-side::before{
  content:'';position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(
    160deg,
    rgba(13,12,10,.55) 0%,
    rgba(13,12,10,.25) 50%,
    rgba(13,12,10,.72) 100%
  );
}
/* Gold corner accent */
.eq-side::after{
  content:'';position:absolute;bottom:24px;right:24px;z-index:3;pointer-events:none;
  width:40px;height:40px;
  border-bottom:1.5px solid rgba(184,150,62,.7);
  border-right:1.5px solid rgba(184,150,62,.7);
}
/* Overlay content sits above image */
.eq-side-overlay{
  position:absolute;inset:0;z-index:2;
  padding:40px 32px;
  display:flex;flex-direction:column;align-items:flex-start;
}
/* Logo */
.eq-side-logo{
  height:24px;filter:brightness(0) invert(1);
  margin-bottom:32px;
  opacity:0;transform:translateY(-8px);
  transition:opacity .65s .3s ease,transform .65s .3s var(--ease-out);
}
.eq-overlay.open .eq-side-logo{opacity:.92;transform:translateY(0);}
/* Gold divider */
.eq-side-divider{
  width:40px;height:1px;background:var(--gold);
  margin-bottom:20px;
  transform:scaleX(0);transform-origin:left;
  transition:transform .65s .48s var(--ease-out);
}
.eq-overlay.open .eq-side-divider{transform:scaleX(1);}
/* Tagline */
.eq-side-tagline{
  font-family:var(--font-display);
  font-size:clamp(20px,2vw,28px);
  font-weight:300;line-height:1.2;
  color:#FAF8F4;
  margin-bottom:auto;
  opacity:0;transform:translateY(12px);
  transition:opacity .65s .6s ease,transform .65s .6s var(--ease-out);
}
.eq-overlay.open .eq-side-tagline{opacity:1;transform:translateY(0);}
/* RERA */
.eq-side-rera{
  font-size:8px;letter-spacing:2px;text-transform:uppercase;
  color:rgba(250,248,244,.35);line-height:1.8;
  opacity:0;transition:opacity .65s .8s ease;
}
.eq-overlay.open .eq-side-rera{opacity:1;}

/* ══ RIGHT FORM BODY ══ */
.eq-body{
  position:relative;overflow-y:auto;
  background:#FFFFFF;
  display:flex;flex-direction:column;
}
/* Scrollbar */
.eq-body::-webkit-scrollbar{width:3px;}
.eq-body::-webkit-scrollbar-thumb{background:var(--gold-dark);}

/* Gold sweep bar */
.eq-top-bar{
  height:3px;flex-shrink:0;
  background:linear-gradient(90deg,var(--gold-dark),var(--gold),var(--gold-light),var(--gold));
  transform:scaleX(0);transform-origin:left;
  transition:transform .75s .15s var(--ease-out);
}
.eq-overlay.open .eq-top-bar{transform:scaleX(1);}

/* Close × */
.eq-close{
  position:absolute;top:18px;right:20px;z-index:20;
  width:32px;height:32px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  color:var(--light-gray);
  border:1px solid rgba(176,168,152,.3);
  transition:color .2s ease,border-color .2s ease,background .2s ease;
  cursor:pointer;
}
.eq-close:hover{color:var(--crimson);border-color:rgba(122,21,51,.3);background:rgba(122,21,51,.05);}

/* Header block */
.eq-header{
  padding:36px 48px 28px;
  border-bottom:1px solid rgba(184,150,62,.13);
  opacity:0;transform:translateY(16px);
  transition:opacity .55s .3s ease,transform .55s .3s var(--ease-out);
}
.eq-overlay.open .eq-header{opacity:1;transform:translateY(0);}
/* eyebrow (reuses .section-eyebrow) */
.eq-header .section-eyebrow{margin-bottom:10px;}
.eq-title{
  font-family:var(--font-display);
  font-size:clamp(24px,2.8vw,34px);
  font-weight:400;color:var(--crimson);
  letter-spacing:.3px;margin-bottom:8px;line-height:1.1;
}
.eq-subtitle{
  font-size:12px;letter-spacing:.8px;color:var(--mid-gray);margin-bottom:16px;
}
/* Gold rule under subtitle */
.eq-header .gold-line{
  width:48px;height:1px;background:var(--gold);margin-bottom:0;
}

/* Form wrapper */
.eq-form{padding:28px 48px 36px;flex:1;}

/* Stagger animation */
.eq-anim{
  opacity:0;transform:translateY(14px);
  transition:opacity .5s calc(.38s + var(--d)) ease,transform .5s calc(.38s + var(--d)) var(--ease-out);
}
.eq-overlay.open .eq-anim{opacity:1;transform:translateY(0);}

/* Field */
.eq-field{margin-bottom:20px;}
.eq-field label{
  display:block;font-size:9.5px;font-weight:600;letter-spacing:2.5px;
  text-transform:uppercase;color:rgba(28,25,22,.42);margin-bottom:9px;
}
.eq-req{color:var(--gold);}
.eq-field input,.eq-field textarea{
  width:100%;
  height:48px;
  background:#FDFCF9;
  border:1px solid rgba(184,150,62,.25);
  border-bottom-width:2px;
  padding:0 14px;
  font-family:var(--font-body);font-size:13.5px;font-weight:300;color:var(--warm-white);
  outline:none;border-radius:0;-webkit-appearance:none;appearance:none;
  transition:border-color .25s ease,background .25s ease,box-shadow .25s ease;
  box-sizing:border-box;
}
.eq-field input::placeholder,.eq-field textarea::placeholder{color:var(--light-gray);font-size:13px;}
.eq-field input:focus,.eq-field textarea:focus{
  border-color:var(--gold);
  background:#fff;
  box-shadow:0 0 0 3px rgba(184,150,62,.08);
}
.eq-field textarea{
  height:48px;
  resize:none;
  padding:13px 14px;
  line-height:1.5;
}

/* Telephone — wraps the +91 prefix + input as one 48px unit */
.eq-tel-wrap{
  display:flex;align-items:stretch;
  height:48px;
  border:1px solid rgba(184,150,62,.25);
  border-bottom-width:2px;
  background:#FDFCF9;
  transition:border-color .25s ease,box-shadow .25s ease;
  overflow:hidden;
}
.eq-tel-wrap:focus-within{
  border-color:var(--gold);
  background:#fff;
  box-shadow:0 0 0 3px rgba(184,150,62,.08);
}
.eq-tel-code{
  display:flex;align-items:center;
  font-size:13px;color:var(--mid-gray);
  padding:0 12px;
  white-space:nowrap;letter-spacing:1px;flex-shrink:0;
  border-right:1px solid rgba(184,150,62,.2);
  background:rgba(184,150,62,.05);
}
.eq-tel-wrap input{
  border:none !important;box-shadow:none !important;background:transparent !important;
  flex:1;padding-left:12px;height:100%;
}

/* Error */
.eq-err{display:none;font-size:10px;color:var(--crimson);margin-top:5px;letter-spacing:.3px;}
.eq-err.visible{display:block;}

/* 2-col grid */
.eq-row-split{display:grid;grid-template-columns:1fr 1fr;gap:0 32px;}

/* Consent */
.eq-consent{
  display:flex;align-items:flex-start;gap:10px;
  margin:8px 0 28px;padding-top:8px;
  border-top:1px solid rgba(184,150,62,.1);
}
.eq-consent input[type="checkbox"]{
  margin-top:3px;accent-color:var(--gold);flex-shrink:0;cursor:pointer;
}
.eq-consent label{font-size:11px;color:rgba(28,25,22,.4);line-height:1.7;cursor:pointer;}

/* Submit */
.eq-actions{display:flex;gap:12px;align-items:center;}
.eq-btn-submit{
  display:inline-flex;align-items:center;justify-content:center;gap:12px;
  width:100%;
  font-family:var(--font-body);font-size:11px;font-weight:700;
  letter-spacing:3.5px;text-transform:uppercase;
  padding:17px 32px;
  background:var(--gold);color:#111009;
  position:relative;overflow:hidden;
  transition:transform .3s ease,box-shadow .3s ease;cursor:pointer;
}
.eq-btn-submit::before{
  content:'';position:absolute;inset:0;
  background:var(--gold-light);
  transform:translateX(-101%);
  transition:transform .5s var(--ease-out);
}
.eq-btn-submit:hover:not(:disabled)::before{transform:translateX(0);z-index: -1;}
.eq-btn-submit span,
.eq-btn-submit svg,
.eq-btn-submit .eq-dots{position:relative;z-index:1;}
.eq-btn-submit:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 10px 28px rgba(184,150,62,.35);}
.eq-btn-submit:disabled{opacity:.35;cursor:not-allowed;}
.eq-btn-sending{background:var(--dark-3);color:var(--mid-gray);}

/* Animated sending dots */
.eq-dots{display:inline-flex;gap:4px;align-items:center;}
.eq-dots span{width:4px;height:4px;border-radius:50%;background:currentColor;animation:eqDot .9s ease-in-out infinite;}
.eq-dots span:nth-child(2){animation-delay:.18s;}
.eq-dots span:nth-child(3){animation-delay:.36s;}
button:disabled{cursor:not-allowed;opacity:.5;}
@keyframes eqDot{0%,80%,100%{transform:scale(.6);opacity:.4;}40%{transform:scale(1);opacity:1;}}

/* Success state */
.eq-success{
  display:none;flex-direction:column;align-items:center;justify-content:center;
  padding:56px 40px;text-align:center;
  opacity:0;transition:opacity .4s ease;
}
.eq-success.show{display:flex;opacity:1;}
.eq-success-icon{
  width:60px;height:60px;border-radius:50%;
  background:rgba(184,150,62,.08);border:1px solid var(--gold);
  display:flex;align-items:center;justify-content:center;
  margin-bottom:22px;
  animation:eqSuccessPop .5s var(--ease-spring) both;
}
@keyframes eqSuccessPop{from{transform:scale(0);}to{transform:scale(1);}}
.eq-success-title{font-family:var(--font-display);font-size:24px;color:var(--crimson);margin-bottom:10px;}
.eq-success-msg{font-size:13px;color:var(--mid-gray);line-height:1.8;}

/* ── Responsive ── */
@media(max-width:700px){
  .eq-panel{grid-template-columns:1fr;}
  .eq-side{display:none;}
  .eq-row-split{grid-template-columns:1fr;gap:0;}
  .eq-header{padding:24px 20px 16px;}
  .eq-form{padding:16px 20px 24px;}
}
@media(max-width:400px){
  .eq-btn-submit{letter-spacing:2px;}
}

/* ══════════════════════════════════════════════════════════════
   STICKY ENQUIRE NOW BUTTON
══════════════════════════════════════════════════════════════ */
.sticky-enquire{
  position:fixed;
  bottom:20px;right:36px;
  z-index:99;
  display:flex;align-items:center;
  cursor:pointer !important;
  background:none;border:none;padding:0;
}
/* Pulse rings */
.sticky-enquire-ring{
  position:absolute;inset:-8px;border-radius:999px;
  border:1.5px solid rgba(184,150,62,.5);
  animation:seRingPulse 2.2s ease-out infinite;
  pointer-events:none;
}
.sticky-enquire-ring-2{
  animation-delay:.75s;
}
@keyframes seRingPulse{
  0%{transform:scale(.85);opacity:.8;}
  70%{transform:scale(1.28);opacity:0;}
  100%{transform:scale(1.28);opacity:0;}
}
/* Inner pill */
.sticky-enquire-inner{
  position:relative;z-index:1;
  display:inline-flex;align-items:center;gap:10px;
  padding:14px 28px;
  background:var(--gold);
  color:#111009;
  font-family:var(--font-body);
  font-size:11px;font-weight:700;
  letter-spacing:2.5px;text-transform:uppercase;
  border-radius:0;
  box-shadow:0 8px 32px rgba(184,150,62,.45);
  overflow:hidden;
  border-radius: 25px;
  transition:transform .3s ease,box-shadow .3s ease;
}
/* Shimmer sweep */
.sticky-enquire-inner::before{
  content:'';position:absolute;inset:0;
  background:var(--gold-light);
  transform:translateX(-101%);
  transition:transform .45s var(--ease-out);
}
.sticky-enquire:hover .sticky-enquire-inner::before{transform:translateX(0);}
.sticky-enquire:hover .sticky-enquire-inner{
  transform:translateY(-3px);
  box-shadow:0 14px 40px rgba(184,150,62,.5);
}
.sticky-enquire-inner svg,
.sticky-enquire-label{position:relative;z-index:1;}

/* Entrance animation */
.sticky-enquire{
  opacity:1;
  transition:opacity .5s ease,transform .5s ease;
}
.sticky-enquire.visible{opacity:1;transform:translateY(0);}

/* Mobile — full bottom bar */
@media(max-width:768px){
  .sticky-enquire{
    bottom:0;right:0;left:0;
  }
  .sticky-enquire-ring{display:none;}
  .sticky-enquire-inner{
    width:100%;justify-content:center;
    padding:17px 24px;
    border-radius:0;
    font-size:12px;letter-spacing:3px;
    box-shadow:0 -6px 28px rgba(184,150,62,.3);
  }
  /* Push footer content above the sticky bar */
  #footer{ padding-bottom: 72px; }
}
.error-side,
.error-banner,
.error-modal {
    display: none;
    color: red;
    font-size: 13px;
    position: absolute;
    right: 20px;
    top: 40px;
}

.check-box,
.sidecheck-box {
    left: 0;
    top: 25px;
    background: rgb(37 36 36 / 90%);
    color: #fff;
    padding: 15px;
    border-radius: 10px;
    font-size: 12px;
    z-index: 5;
}
#side_checkbox, #modal_checkbox {
  width: 20px;
  height: 20px;
  margin-right: 10px;
  accent-color: var(--gold);
  cursor: pointer;
}