/* Extracted verbatim from index.html (lines 20-555) for use by sub-pages.
   index.html itself is UNCHANGED and still carries its own inline <style>.
   Do not edit visual values here without mirroring them in index.html. */

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --bg:#09090D;--bg2:#0F0F15;--bg3:#14141C;
  --gold:#C9A84C;--gold2:#E8C97A;--gold-dim:rgba(201,168,76,0.12);
  --w:#F6F4EF;--w8:rgba(246,244,239,.8);--w5:rgba(246,244,239,.5);--w3:rgba(246,244,239,.3);--w1:rgba(246,244,239,.08);
  --border:rgba(255,255,255,0.07);--border-g:rgba(201,168,76,0.22);
  --r:16px;
}
html{scroll-behavior:smooth;font-size:16px;overflow-x:hidden}
body{background:var(--bg);color:var(--w);font-family:'Inter',sans-serif;overflow-x:hidden;-webkit-font-smoothing:antialiased}
a{text-decoration:none;color:inherit}
img{display:block;width:100%}

/* ═══════════════════════════════ NAV ══════════════════════════════ */
#nav{
  position:fixed;top:0;left:0;right:0;z-index:200;
  display:flex;align-items:center;justify-content:space-between;
  padding:1.3rem 5vw;transition:background .4s,border-color .4s,box-shadow .4s;
}
#nav.solid{
  background:rgba(9,9,13,.9);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);
  border-bottom:1px solid var(--border);
}
.logo{font-family:'Cormorant Garamond',serif;font-size:1.3rem;font-weight:500;color:var(--gold);letter-spacing:.05em;line-height:1}
.logo small{display:block;font-family:'Inter',sans-serif;font-size:.48rem;letter-spacing:.35em;text-transform:uppercase;color:var(--w3);margin-top:.15rem}
.nav-links{display:flex;gap:2rem;list-style:none}
.nav-links a{font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--w5);transition:color .2s}
.nav-links a:hover{color:var(--w)}
/* About Us dropdown - parity with the client's live main menu, which has
   About Us over Social Showcase / Road Show / Celestial Activities. Purely
   additive: the bar itself is unchanged until hover. */
.form-status{margin-top:.9rem;font-size:.74rem;line-height:1.7;padding:.75rem .9rem;border-radius:10px;border:1px solid var(--border)}
.form-status.ok{color:var(--gold2);border-color:var(--border-g);background:var(--gold-dim)}
.form-status.err{color:#E8A0A0;border-color:rgba(232,160,160,.28);background:rgba(232,160,160,.07)}
.fi.invalid{border-color:rgba(232,160,160,.55)}
.nav-drop{position:relative}
.nav-caret{display:inline-block;width:4px;height:4px;margin-left:.45em;border-right:1px solid currentColor;border-bottom:1px solid currentColor;transform:rotate(45deg) translateY(-1px);opacity:.55;transition:opacity .2s}
.nav-drop:hover .nav-caret{opacity:1}
.nav-sub{
  position:absolute;top:100%;left:50%;margin-top:.95rem;
  transform:translateX(-50%) translateY(6px);
  min-width:212px;padding:.5rem 0;list-style:none;
  background:rgba(9,9,13,.94);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);
  border:1px solid var(--border);border-radius:var(--r);
  opacity:0;visibility:hidden;pointer-events:none;
  transition:opacity .28s ease,transform .28s ease,visibility .28s;
}
/* invisible bridge so the pointer can cross the gap without closing the menu */
.nav-sub::before{content:"";position:absolute;top:-.95rem;left:0;right:0;height:.95rem}
.nav-drop:hover .nav-sub,.nav-drop:focus-within .nav-sub{opacity:1;visibility:visible;pointer-events:auto;transform:translateX(-50%) translateY(0)}
.nav-sub a{display:block;padding:.62rem 1.25rem;font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;white-space:nowrap;color:var(--w5)}
.nav-sub a:hover{color:var(--gold);background:var(--bg3)}
.nav-r{display:flex;align-items:center;gap:1rem}
.nav-phone{font-size:.8rem;color:var(--w5)}
.cta-nav{
  padding:.55rem 1.4rem;border:1px solid var(--gold);color:var(--gold);
  font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;
  transition:all .25s;background:transparent;cursor:pointer;font-family:'Inter',sans-serif;
}
.cta-nav:hover{background:var(--gold);color:var(--bg)}

/* ═══════════════════════════════ HERO ══════════════════════════════ */
.hero{
  position:relative;min-height:100svh;display:flex;align-items:flex-end;
  padding:9rem 5vw 7rem;overflow:hidden;background:var(--bg);
}
/* Ken Burns handled by GSAP */
.hero-bg{
  position:absolute;inset:0;
  background:url('dubai-skyline.jpg') center 20% / cover no-repeat;
  transform-origin:center;
  will-change:transform;
}
.hero-bg::after{
  content:'';position:absolute;inset:0;
  background:linear-gradient(160deg,rgba(4,4,10,.78) 0%,rgba(6,6,12,.45) 55%,rgba(4,4,8,.38) 100%);
}
/* bottom gradient fade into next section */
.hero-sky-far{ display:none }
.hero-skyline{
  position:absolute;bottom:0;left:0;right:0;height:35%;
  background:linear-gradient(to top,var(--bg) 0%,transparent 100%);
  pointer-events:none;
}
/* gold particles */
.particles{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:1}
.p{position:absolute;width:2px;height:2px;border-radius:50%;background:var(--gold);box-shadow:0 0 4px rgba(201,168,76,.5);animation:floatUp var(--d,7s) var(--delay,0s) ease-in infinite}
@keyframes floatUp{0%{opacity:0;transform:translateY(0) translateX(0)}12%{opacity:.9}80%{opacity:.4}100%{opacity:0;transform:translateY(-240px) translateX(var(--drift,0px))}}

.w{display:inline-block}
.hero-content{position:relative;z-index:2;max-width:820px}
.hero-badge{
  display:inline-flex;align-items:center;gap:.7rem;
  font-size:.6rem;letter-spacing:.38em;text-transform:uppercase;color:var(--gold);
  margin-bottom:2rem;padding:.5rem 1rem;
  border:1px solid var(--border-g);background:var(--gold-dim);
  border-radius:100px;
}
.hero-badge::before{content:'◆';font-size:.4rem}
h1{
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(3.2rem,6.5vw,7rem);
  font-weight:300;line-height:1.03;letter-spacing:-.015em;
  color:var(--w);margin-bottom:1.6rem;
}
h1 .em{font-style:italic;color:var(--gold)}
.hero-sub{
  font-size:1rem;font-weight:300;color:var(--w5);
  max-width:540px;line-height:1.85;margin-bottom:2.5rem;
}
.hero-btns{display:flex;gap:.9rem;flex-wrap:wrap}
.btn-fill{
  padding:.9rem 2.4rem;background:var(--gold);color:var(--bg);
  font-size:.75rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  border:1px solid var(--gold);transition:all .25s;cursor:pointer;font-family:'Inter',sans-serif;
}
.btn-fill:hover{background:var(--gold2);border-color:var(--gold2)}
.btn-outline{
  padding:.9rem 2.4rem;border:1px solid var(--border);color:var(--w5);
  font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;
  transition:all .25s;cursor:pointer;font-family:'Inter',sans-serif;background:transparent;
}
.btn-outline:hover{border-color:var(--w);color:var(--w)}

/* hero scroll arrow */
.hero-scroll{position:absolute;bottom:2.5rem;left:50%;transform:translateX(-50%);z-index:2;display:flex;flex-direction:column;align-items:center;gap:.4rem;animation:bounce 2.5s ease-in-out infinite}
.hero-scroll span{font-size:.55rem;letter-spacing:.3em;text-transform:uppercase;color:var(--w3)}
.arrow-down{width:20px;height:20px;border-right:1px solid var(--w3);border-bottom:1px solid var(--w3);transform:rotate(45deg);margin-top:-8px}
@keyframes bounce{0%,100%{transform:translateX(-50%) translateY(0)}50%{transform:translateX(-50%) translateY(6px)}}

/* ═══════════════════════════════ STATS ══════════════════════════════ */
.stats-bar{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.stat-item{padding:1.8rem 2rem;border-right:1px solid var(--border);text-align:center}
.stat-item:last-child{border-right:none}
.stat-n{font-family:'Cormorant Garamond',serif;font-size:2.2rem;font-weight:400;color:var(--gold);display:block;line-height:1}
.stat-l{font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;color:var(--w3);display:block;margin-top:.3rem}

/* ═══════════════════════════════ SECTIONS ══════════════════════════════ */
.sec{padding:7rem 5vw}
.sec-alt{background:var(--bg2)}
.sec-label{
  font-size:.6rem;letter-spacing:.4em;text-transform:uppercase;color:var(--gold);
  display:flex;align-items:center;gap:.8rem;margin-bottom:1rem;
}
.sec-label::before{content:'';width:26px;height:1px;background:var(--gold)}
h2{
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(2rem,3.8vw,3.4rem);
  font-weight:300;line-height:1.12;letter-spacing:-.01em;color:var(--w);
}
h2 em{font-style:italic;color:var(--gold)}
.sec-sub{font-size:.88rem;color:var(--w5);line-height:1.85;font-weight:300;max-width:460px}
.sec-hd{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:3rem;gap:2rem}

/* ═══════════════════════════════ PROPERTY CARDS ══════════════════════════════ */
.prop-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem;margin-top:3rem}
.pc{
  border-radius:var(--r);overflow:hidden;background:var(--bg3);
  cursor:pointer;transition:transform .4s ease,box-shadow .4s ease;
  display:flex;flex-direction:column;
  border:1px solid var(--border);
}
.pc:hover{transform:translateY(-8px);box-shadow:0 32px 64px rgba(0,0,0,.5);border-color:var(--border-g)}
.pc-img{position:relative;aspect-ratio:4/3;overflow:hidden;flex-shrink:0}
.pc-img img{width:100%;height:100%;object-fit:cover;object-position:center 35%;transition:transform .6s ease}
.pc:hover .pc-img img{transform:scale(1.06)}
.pc-tag{
  position:absolute;top:1rem;right:1rem;z-index:2;
  padding:.3rem .7rem;background:rgba(9,9,13,.75);border:1px solid var(--border-g);
  font-size:.55rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);
  border-radius:100px;backdrop-filter:blur(8px);
}
.pc-body{
  padding:1.3rem 1.4rem 1.5rem;
  background:var(--bg3);
  border-top:1px solid var(--border-g);
  flex:1;display:flex;flex-direction:column;justify-content:space-between;
}
.pc-name{font-family:'Cormorant Garamond',serif;font-size:1.22rem;font-weight:400;color:var(--w);margin-bottom:.3rem}
.pc-loc{font-size:.66rem;color:var(--w3);display:flex;align-items:center;gap:.4rem;margin-bottom:1rem}
.pc-loc::before{content:'◆';font-size:.3rem;color:var(--gold)}
.pc-link{
  display:inline-flex;align-items:center;gap:.5rem;
  font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);
  transition:gap .25s;
}
.pc-link::after{content:'→'}
.pc:hover .pc-link{gap:1rem}

/* ═══════════════════════════════ WHY DUBAI ══════════════════════════════ */
.why-grid{display:grid;grid-template-columns:1fr 1fr;gap:6rem;align-items:center}
.why-stats{display:flex;flex-direction:column}
.ws{padding:1.8rem 0;border-bottom:1px solid var(--border);display:grid;grid-template-columns:120px 1fr;gap:1.2rem;align-items:center}
.ws:first-child{border-top:1px solid var(--border)}
.ws-n{font-family:'Cormorant Garamond',serif;font-size:2.8rem;font-weight:300;color:var(--gold);line-height:1}
.ws-t strong{font-size:.85rem;font-weight:500;color:var(--w);display:block;margin-bottom:.2rem}
.ws-t span{font-size:.76rem;color:var(--w5);line-height:1.6}

/* ═══════════════════════════════ ABOUT ══════════════════════════════ */
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:5rem;align-items:start}
.about-img-wrap{position:relative}
/* team grid replaces single photo */
.team-grid{display:grid;grid-template-columns:1fr 1fr;gap:.8rem;position:relative}
.team-cell{border-radius:12px;overflow:hidden;position:relative}
.team-cell img{width:100%;height:100%;object-fit:cover;object-position:top center;display:block}
.team-cell.tall{grid-row:1/3;aspect-ratio:2/3}
.team-cell.short{aspect-ratio:1/1}
.team-lbl{position:absolute;bottom:0;left:0;right:0;padding:1.4rem .9rem .8rem;background:linear-gradient(to top,rgba(9,9,13,.92) 0%,rgba(9,9,13,.4) 60%,transparent 100%)}
.team-lbl strong{display:block;font-size:.82rem;font-weight:600;color:#fff}
.team-lbl span{font-size:.58rem;letter-spacing:.14em;text-transform:uppercase;color:rgba(246,244,239,.55)}
.about-img{border-radius:var(--r);overflow:hidden;aspect-ratio:4/5}
.about-img img{width:100%;height:100%;object-fit:cover}
.about-badge{
  position:relative;margin-top:1.5rem;
  background:var(--bg3);border:1px solid var(--border-g);border-radius:12px;
  padding:1.2rem 1.6rem;display:inline-flex;flex-direction:column;min-width:160px;
}
.about-badge .n{font-family:'Cormorant Garamond',serif;font-size:2.6rem;font-weight:300;color:var(--gold);display:block;line-height:1}
.about-badge .l{font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;color:var(--w3);display:block;margin-top:.3rem}
.about-feats{margin-top:2.2rem;display:flex;flex-direction:column;gap:0}
.af{padding:1.3rem 0;border-bottom:1px solid var(--border);display:flex;gap:1rem;align-items:flex-start}
.af:first-child{border-top:1px solid var(--border)}
.af-num{font-family:'Cormorant Garamond',serif;font-size:1.1rem;color:var(--gold);min-width:22px;margin-top:.05rem}
.af-title{font-size:.84rem;font-weight:500;color:var(--w);margin-bottom:.2rem}
.af-desc{font-size:.76rem;color:var(--w5);line-height:1.7}

/* ═══════════════════════════════ LOCATIONS ══════════════════════════════ */
.loc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem;margin-top:3rem}
.lc{
  border-radius:var(--r);overflow:hidden;cursor:pointer;
  position:relative;aspect-ratio:4/3;transition:transform .35s ease;
}
.lc:hover{transform:translateY(-6px)}
.lc img{width:100%;height:100%;object-fit:cover;transition:transform .55s ease}
.lc:hover img{transform:scale(1.07)}
.lc-ov{position:absolute;inset:0;background:linear-gradient(to top,rgba(9,9,13,.85) 0%,rgba(9,9,13,.1) 55%,transparent 100%)}
.lc-body{position:absolute;bottom:0;left:0;right:0;padding:1.3rem 1.4rem;display:flex;justify-content:space-between;align-items:flex-end}
.lc-name{font-family:'Cormorant Garamond',serif;font-size:1.15rem;font-weight:400;color:var(--w)}
.lc-btn{
  font-size:.58rem;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);
  padding:.35rem .8rem;border:1px solid var(--border-g);border-radius:100px;
  opacity:0;transform:translateY(5px);transition:all .3s ease;
  white-space:nowrap;background:rgba(9,9,13,.5);backdrop-filter:blur(8px);
}
.lc:hover .lc-btn{opacity:1;transform:translateY(0)}

/* ═══════════════════════════════ HOW IT WORKS ══════════════════════════════ */
.how-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border:1px solid var(--border);border-radius:var(--r);overflow:hidden;margin-top:3.5rem}
.step{padding:2.5rem;border-right:1px solid var(--border);position:relative;transition:background .3s}
.step:last-child{border-right:none}
.step:hover{background:var(--bg3)}
.step-n{font-family:'Cormorant Garamond',serif;font-size:3.5rem;font-weight:300;color:var(--border-g);line-height:1;margin-bottom:1.3rem}
.step-t{font-size:.92rem;font-weight:500;color:var(--w);margin-bottom:.6rem}
.step-d{font-size:.78rem;color:var(--w5);line-height:1.8}

/* ═══════════════════════════════ TRUST ══════════════════════════════ */
.trust-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem;margin-top:3.5rem}
.tc{padding:2.2rem;background:var(--bg3);border-radius:var(--r);transition:transform .3s,border-color .3s;border:1px solid transparent}
.tc:hover{transform:translateY(-5px);border-color:var(--border-g)}
.tc-bar{width:24px;height:2px;background:var(--gold);margin-bottom:1.2rem}
.tc h3{font-family:'Cormorant Garamond',serif;font-size:1.2rem;font-weight:400;color:var(--w);margin-bottom:.6rem}
.tc p{font-size:.76rem;color:var(--w5);line-height:1.8}

/* ═══════════════════════════════ TESTIMONIALS ══════════════════════════════ */
.testi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem;margin-top:3.5rem}
.testi-card{
  background:var(--bg3);border-radius:var(--r);overflow:hidden;
  border:1px solid var(--border);transition:border-color .3s,transform .3s;
}
.testi-card:hover{border-color:var(--border-g);transform:translateY(-4px)}
.testi-img{aspect-ratio:3/4;overflow:hidden;position:relative}
.testi-img img{width:100%;height:100%;object-fit:cover;transition:transform .5s;filter:brightness(.45) saturate(.2)}
.testi-card:hover .testi-img img{transform:scale(1.04);filter:brightness(.55) saturate(.3)}
.testi-img::after{
  content:'';position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(to bottom,rgba(9,9,13,.4) 0%,transparent 30%,transparent 70%,rgba(9,9,13,.8) 100%);
}
.testi-body{padding:1.4rem}
.testi-stars{color:var(--gold);font-size:.65rem;display:block;margin-bottom:.6rem}
.testi-q{font-family:'Cormorant Garamond',serif;font-size:2.2rem;color:var(--gold);display:block;line-height:.6;margin-bottom:.7rem}
.testi-txt{font-size:.78rem;color:var(--w5);line-height:1.8;font-style:italic;margin-bottom:1rem}
.testi-name{font-size:.78rem;font-weight:500;color:var(--w)}
.testi-city{font-size:.65rem;color:var(--w3)}

/* ═══════════════════════════════ FAQ ══════════════════════════════ */
.faq-wrap{max-width:800px;margin-top:3.5rem}
.fi-wrap{border-bottom:1px solid var(--border)}
.fq{
  width:100%;background:none;border:none;padding:1.4rem 0;
  display:flex;justify-content:space-between;align-items:center;
  gap:2rem;cursor:pointer;color:var(--w);font-size:.88rem;
  font-family:'Inter',sans-serif;text-align:left;transition:color .2s;
}
.fq:hover{color:var(--gold)}
.fq-icon{
  width:22px;height:22px;border:1px solid var(--border);border-radius:50%;
  color:var(--gold);display:flex;align-items:center;justify-content:center;
  font-size:.9rem;flex-shrink:0;transition:transform .3s,border-color .3s;
}
.fi-wrap.open .fq-icon{transform:rotate(45deg);border-color:var(--gold)}
.fa{overflow:hidden;max-height:0;transition:max-height .38s ease}
.fi-wrap.open .fa{max-height:200px}
.fa p{padding:0 0 1.4rem;font-size:.8rem;color:var(--w5);line-height:1.85}

/* ═══════════════════════════════ CTA ══════════════════════════════ */
.cta-sec{
  padding:7rem 5vw;
  background:radial-gradient(ellipse 70% 80% at 20% 50%, rgba(201,168,76,.06) 0%, transparent 60%),
             var(--bg2);
  border-top:1px solid var(--border);
}
.cta-grid{display:grid;grid-template-columns:1fr 1fr;gap:6rem;align-items:start}
.cta-badges{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1.6rem}
.badge{
  padding:.3rem .8rem;background:var(--gold-dim);border:1px solid var(--border-g);
  font-size:.58rem;letter-spacing:.15em;text-transform:uppercase;color:var(--gold);
  border-radius:100px;
}
.cta-info{margin-top:2rem;padding:1.4rem;border:1px solid var(--border);border-radius:12px}
.cta-info-label{font-size:.58rem;letter-spacing:.25em;text-transform:uppercase;color:var(--gold);display:block;margin-bottom:.6rem}
.cta-info p{font-size:.76rem;color:var(--w5);line-height:2}
.cta-info a{color:var(--w8)}
.form{display:flex;flex-direction:column;gap:.8rem}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:.8rem}
.fi{
  padding:.85rem 1.1rem;background:var(--bg3);border:1px solid var(--border);
  border-radius:8px;color:var(--w);font-size:.8rem;font-family:'Inter',sans-serif;
  outline:none;width:100%;transition:border-color .25s;
}
.fi::placeholder{color:var(--w3)}
.fi:focus{border-color:var(--gold)}
.fi option{background:#14141C}
.form-note{font-size:.68rem;color:var(--w3);padding-top:.2rem}

/* ═══════════════════════════════ FOOTER ══════════════════════════════ */
footer{padding:4rem 5vw 2rem;background:#05050A;border-top:1px solid var(--border)}
.ft{display:grid;grid-template-columns:2fr 1fr 1fr 1.5fr;gap:3.5rem;padding-bottom:2.5rem;border-bottom:1px solid var(--border)}
.f-logo{font-family:'Cormorant Garamond',serif;font-size:1.5rem;font-weight:500;color:var(--gold);display:block;margin-bottom:.25rem}
.f-sub{font-size:.55rem;letter-spacing:.28em;text-transform:uppercase;color:var(--w3);display:block;margin-bottom:1.1rem}
.f-desc{font-size:.74rem;color:var(--w3);line-height:1.85}
.fc h4{font-size:.55rem;letter-spacing:.3em;text-transform:uppercase;color:var(--gold);margin-bottom:.9rem}
.fc ul{list-style:none;display:flex;flex-direction:column;gap:.5rem}
.fc ul a{font-size:.74rem;color:var(--w3);transition:color .2s}
.fc ul a:hover{color:var(--w)}
.fc-contact p{font-size:.74rem;color:var(--w3);line-height:2}
.fc-contact a{color:var(--w5)}
.fb{padding-top:1.6rem;display:flex;justify-content:space-between;align-items:center}
.fb p{font-size:.66rem;color:var(--w3)}
.socials{display:flex;gap:.6rem}
.soc{
  width:28px;height:28px;border:1px solid var(--border);border-radius:6px;
  display:flex;align-items:center;justify-content:center;
  color:var(--w3);font-size:.6rem;transition:all .25s;
}
.soc:hover{border-color:var(--gold);color:var(--gold)}

/* ═══════════════════════════════ GSAP INITIAL STATES ══════════════════════════════ */
.gsap-fade{opacity:0;transform:translateY(36px)}
.gsap-fade-l{opacity:0;transform:translateX(-36px)}
.gsap-fade-r{opacity:0;transform:translateX(36px)}

/* ══════════════ CURSOR GLOW ══════════════ */
.cursor-glow{
  position:fixed;width:190px;height:190px;border-radius:50%;
  background:radial-gradient(circle,rgba(201,168,76,.06) 0%,transparent 70%);
  pointer-events:none;z-index:1;transform:translate(-50%,-50%);
  top:0;left:0;opacity:0;transition:opacity .4s;
}
@media(hover:hover){body:hover .cursor-glow{opacity:1}}

/* ══════════════ SKEUOMORPHIC DEPTH LAYER ══════════════ */
/* film grain — one shared SVG noise, whole-page tactile finish */
body::after{
  content:'';position:fixed;inset:0;z-index:2000;pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.5'/%3E%3C/svg%3E");
  opacity:.026;mix-blend-mode:overlay;
}
/* metallic gold CTAs — brushed-metal gradient, bevel, tactile press */
.btn-fill{
  background:linear-gradient(178deg,#F0D68C 0%,#E8C97A 12%,#D4B460 30%,#C9A84C 48%,#B8933A 62%,#C9A84C 78%,#DCBE6A 92%,#E8C97A 100%);
  border:1px solid #A07828;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.45),
    inset 0 -2px 3px rgba(90,66,20,.45),
    0 2px 4px rgba(0,0,0,.5),
    0 8px 20px rgba(201,168,76,.16);
  text-shadow:0 1px 0 rgba(255,255,255,.28);
}
.btn-fill:hover{
  background:linear-gradient(178deg,#F6E0A0 0%,#EED288 14%,#DCBE6A 32%,#D4B460 50%,#C29D42 64%,#D4B460 80%,#E8C97A 100%);
  border-color:#B8933A;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.55),
    inset 0 -2px 3px rgba(90,66,20,.4),
    0 3px 6px rgba(0,0,0,.5),
    0 12px 28px rgba(201,168,76,.24);
}
.btn-fill:active{transform:translateY(1px) scale(.985);box-shadow:inset 0 2px 4px rgba(90,66,20,.5),0 1px 2px rgba(0,0,0,.4)}
.cta-nav:hover{
  background:linear-gradient(178deg,#EED288 0%,#D4B460 40%,#C9A84C 60%,#DCBE6A 100%);
  border-color:#A07828;color:var(--bg);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.4),inset 0 -1px 2px rgba(90,66,20,.4),0 4px 12px rgba(201,168,76,.25);
}
.cta-nav:active,.btn-outline:active{transform:scale(.985)}
/* cards — layered lift, machined top edge highlight, surfaced gradient */
.pc,.testi-card{
  background:linear-gradient(180deg,#17171F 0%,#12121A 55%,#0F0F16 100%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.055),
    0 1px 2px rgba(0,0,0,.4),
    0 6px 14px rgba(0,0,0,.32),
    0 16px 32px rgba(0,0,0,.22);
}
.pc:hover{
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.09),
    0 2px 4px rgba(0,0,0,.45),
    0 14px 28px rgba(0,0,0,.4),
    0 34px 64px rgba(0,0,0,.5),
    0 0 0 1px rgba(201,168,76,.12);
}
.pc-body{background:linear-gradient(180deg,rgba(255,255,255,.028) 0%,rgba(255,255,255,0) 30%),var(--bg3)}
/* engraved stat numerals */
.stat-n{text-shadow:0 1px 0 rgba(255,255,255,.1),0 -1px 1px rgba(0,0,0,.85)}
/* embossed hero badge */
.hero-badge{
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),inset 0 -1px 2px rgba(0,0,0,.5),0 2px 6px rgba(0,0,0,.35);
  background:linear-gradient(180deg,rgba(201,168,76,.16),rgba(201,168,76,.07));
}
/* metallic hairlines */
.sec-label::before{background:linear-gradient(90deg,#A07828,#E8C97A 55%,#C9A84C)}
/* respect reduced motion */
@media (prefers-reduced-motion:reduce){
  .hero-scroll{animation:none}
  .p{animation:none;opacity:0}
  .pc-img::after{animation:none!important}
  *{transition-duration:.01ms!important}
}

/* ══════════════ PRELOADER SAND ══════════════ */
.pre-logo-wrap{position:relative;display:flex;align-items:center;justify-content:center;width:520px;max-width:90vw;height:90px}
#sand-canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}

/* ══════════════ CARD SHIMMER ══════════════ */
.pc-img::after{
  content:'';position:absolute;top:0;left:-80%;width:60%;height:100%;
  background:linear-gradient(105deg,transparent 20%,rgba(255,255,255,.07) 50%,transparent 80%);
  pointer-events:none;z-index:3;
}
.pc:hover .pc-img::after{animation:cardShimmer .7s ease-out forwards}
@keyframes cardShimmer{from{left:-80%}to{left:140%}}

/* ══════════════ WHATSAPP FLOAT ══════════════ */
.wa-float{
  position:fixed;bottom:2rem;right:2rem;z-index:999;
  width:56px;height:56px;border-radius:50%;
  background:#25D366;display:flex;align-items:center;justify-content:center;
  box-shadow:0 8px 32px rgba(37,211,102,.4);cursor:pointer;
  transition:transform .25s,box-shadow .25s;text-decoration:none;
}
.wa-float:hover{transform:scale(1.08);box-shadow:0 12px 40px rgba(37,211,102,.6)}
.wa-float svg{width:30px;height:30px;fill:#fff}
.wa-pulse{
  position:absolute;inset:-4px;border-radius:50%;border:2px solid rgba(37,211,102,.5);
  animation:waPulse 2s ease-out infinite;
}
@keyframes waPulse{0%{transform:scale(1);opacity:.8}100%{transform:scale(1.5);opacity:0}}
.wa-label{
  position:absolute;right:64px;
  background:#1ebe5d;color:#fff;
  font-size:.68rem;font-weight:600;letter-spacing:.04em;
  padding:.35rem .85rem;border-radius:100px;white-space:nowrap;
  font-family:'Inter',sans-serif;
  opacity:0;transform:translateX(6px);transition:all .25s ease;
  box-shadow:0 4px 16px rgba(37,211,102,.3);
}
.wa-float:hover .wa-label{opacity:1;transform:translateX(0)}

/* ══════════════ PRELOADER ══════════════ */
#preloader{
  position:fixed;inset:0;z-index:9999;background:var(--bg);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.4rem;
  transition:opacity .6s ease, visibility .6s ease;
}
#preloader.done{opacity:0;visibility:hidden}
.pre-logo{font-family:'Cormorant Garamond',serif;font-size:2rem;font-weight:300;color:var(--gold);letter-spacing:.12em;opacity:0;transform:translateY(22px);position:relative;z-index:2}
.pre-bar-wrap{width:160px;height:1px;background:var(--border)}
.pre-bar{height:1px;background:var(--gold);width:0;animation:preLoad 1.6s ease forwards}
@keyframes preFade{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes preLoad{to{width:100%}}

/* ══════════════ MOBILE ══════════════ */
@media(max-width:900px){
  .nav-links{display:none}
  .nav-phone{display:none}
  h1{font-size:clamp(2.4rem,8vw,4rem)}
}

@media(max-width:640px){
  /* Nav */
  #nav{padding:1rem 5vw}
  .cta-nav{padding:.45rem 1rem;font-size:.6rem}

  /* Hero — switch to flex-start so badge never collides with fixed nav */
  .hero{padding:8rem 5vw 4.5rem;min-height:100svh;align-items:flex-start}
  .hero-sub{font-size:.88rem}
  .hero-btns{flex-direction:column;gap:.7rem}
  .btn-fill,.btn-outline{padding:.8rem 1.6rem;width:100%;text-align:center}

  /* Stats */
  .stats-bar{grid-template-columns:1fr 1fr}
  .stat-item{border-right:none!important;border-bottom:1px solid var(--border)}
  .stat-item:nth-child(odd){border-right:1px solid var(--border)!important}
  .stat-n{font-size:1.7rem}

  /* Sections */
  .sec{padding:4rem 5vw}
  .sec-hd{flex-direction:column;align-items:flex-start;gap:1rem}
  h2{font-size:clamp(1.8rem,6vw,2.6rem)}

  /* Property grid */
  .prop-grid{grid-template-columns:1fr}

  /* Why Dubai */
  .why-grid{grid-template-columns:1fr;gap:3rem}
  .ws{grid-template-columns:100px 1fr}

  /* About */
  .about-grid{grid-template-columns:1fr;gap:3rem}
  .about-img-wrap{display:flex;flex-direction:column;align-items:flex-start}
  .team-grid{grid-template-columns:1fr 1fr;gap:.6rem}
  .team-cell.tall{grid-row:auto;aspect-ratio:3/4}


  /* Locations */
  .loc-grid{grid-template-columns:1fr 1fr}
  .lc-name{font-size:.9rem}

  /* How it works */
  .how-grid{grid-template-columns:1fr;border-radius:0;border-left:none;border-right:none}
  .step{border-right:none;border-bottom:1px solid var(--border)}
  .step:last-child{border-bottom:none}

  /* Trust & Testimonials */
  .trust-grid{grid-template-columns:1fr}
  .testi-grid{grid-template-columns:1fr}

  /* CTA */
  .cta-sec{padding:4rem 5vw}
  .cta-grid{grid-template-columns:1fr;gap:2.5rem}
  .form-row{grid-template-columns:1fr}

  /* Footer */
  .ft{grid-template-columns:1fr 1fr;gap:2rem}
  .fb{flex-direction:column;gap:1rem;align-items:flex-start}

  /* WhatsApp */
  .wa-float{bottom:1.4rem;right:1.4rem;width:50px;height:50px}
  .wa-float svg{width:26px;height:26px}
}