/* Abou Dhabi Immobilier — editorial design (skill realestate-lp, templates/editorial, from regaliadubai.com).
   Re-skinned for Abu Dhabi: sand, deep Gulf blue, dune gold. Tokens in :root only; page-specific
   blocks (payment plan, phases, district rows) at the end of the file.

   Editorial rules this file encodes (skill 13-editorial-design):
   - 1400 px canvas, 24/40 px gutters, 112/160 px section rhythm: space is the luxury.
   - EB Garamond for display (italic for the one emotional word), Jost 300 for text.
   - Hairlines instead of cards; big serif numbers instead of chips; gold used sparingly.
   - Full-bleed imagery with slow motion (Ken Burns, parallax, masked reveals). */

@font-face{font-family:"EB Garamond";font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/eb-garamond-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"EB Garamond";font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/eb-garamond-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"EB Garamond";font-style:italic;font-weight:400;font-display:swap;src:url(/fonts/eb-garamond-latin-400-italic.woff2) format("woff2")}
@font-face{font-family:"EB Garamond";font-style:italic;font-weight:500;font-display:swap;src:url(/fonts/eb-garamond-latin-500-italic.woff2) format("woff2")}
@font-face{font-family:Jost;font-style:normal;font-weight:300;font-display:swap;src:url(/fonts/jost-latin-300-normal.woff2) format("woff2")}
@font-face{font-family:Jost;font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/jost-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:Jost;font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/jost-latin-500-normal.woff2) format("woff2")}

:root{
  --cream:#f7f3ec;--marine:#11303f;--marine-deep:#0b2230;--gold:#bf9657;--ink:#3b4852;--off:#ece4d6;--white:#fff;
  --ink-90:rgba(58,74,87,.9);--ink-85:rgba(58,74,87,.85);--ink-80:rgba(58,74,87,.8);--ink-70:rgba(58,74,87,.7);
  --ink-60:rgba(58,74,87,.6);--ink-55:rgba(58,74,87,.55);--ink-50:rgba(58,74,87,.5);
  --line:rgba(17,48,63,.14);--line-light:rgba(247,243,236,.16);
  --serif:"EB Garamond",Georgia,"Times New Roman",serif;
  --sans:Jost,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  --ease-expo:cubic-bezier(.19,1,.22,1);--ease-clip:cubic-bezier(.785,.135,.15,.86);
  --max:1400px;--gut:24px;--sec:112px;--hdr:72px;
}
@media(min-width:768px){:root{--gut:40px;--sec:160px}}

*,*:before,*:after{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent;scroll-behavior:smooth;overscroll-behavior:none}
body{margin:0;background:var(--cream);color:var(--ink);font:300 1rem/1.5 var(--sans);letter-spacing:.01em;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer;letter-spacing:inherit}
h1,h2,h3,p,dl,dd,figure,ul,ol{margin:0}
ul,ol{padding:0;list-style:none}
h1,h2,h3{font-family:var(--serif);font-weight:400;color:var(--marine);font-feature-settings:"liga" 1}
em{font-style:italic;font-weight:400}
strong{font-weight:400;color:var(--marine)}
::selection{background:rgba(191,150,87,.35);color:var(--marine)}
:focus-visible{outline:1px solid var(--gold);outline-offset:3px}
section[id],[id=form]{scroll-margin-top:var(--hdr)}
.sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* ---------- Layout ---------- */
.wrap{max-width:var(--max);margin:0 auto;padding:0 var(--gut)}
.sec{padding:var(--sec) 0}
.bg-cream{background:var(--cream)}.bg-white{background:var(--white)}.bg-off{background:var(--off)}
.g12{display:grid;grid-template-columns:minmax(0,1fr);gap:56px}
.g12.gap40{gap:40px}
.g12.end{align-items:end}
@media(min-width:1024px){
  .g12{grid-template-columns:repeat(12,minmax(0,1fr))}
  .l4{grid-column:span 4/span 4}.l5{grid-column:span 5/span 5}.l6{grid-column:span 6/span 6}.l7{grid-column:span 7/span 7}
  .s1{grid-column-start:1}.s6{grid-column-start:6}.s7{grid-column-start:7}.s8{grid-column-start:8}.s9{grid-column-start:9}
}

/* ---------- Type ---------- */
.mini{display:inline-flex;align-items:center;gap:20px;text-transform:uppercase;font:400 .78rem/1.4 var(--sans);letter-spacing:.22em;color:var(--gold)}
.mini:before{content:"";display:block;width:60px;height:1px;background:var(--gold)}
.mini.bare:before{display:none}
.h2{margin-top:32px;font-size:clamp(2rem,3.6vw,3.2rem);line-height:1.12}
.h2-xl{margin-top:32px;font-size:clamp(2.2rem,4.4vw,3.9rem);line-height:1.12}
.lead{font-size:1.125rem;line-height:1.9;color:var(--ink-90)}
.lead+.lead{margin-top:24px}
.body{font-size:1rem;line-height:1.9;color:var(--ink-85)}
.fine{font-size:.75rem;line-height:1.65;color:var(--ink-50)}
.cap{font-size:.65rem;text-transform:uppercase;letter-spacing:.2em;color:var(--ink-50)}
.label{font-size:.68rem;text-transform:uppercase;letter-spacing:.2em;color:var(--ink-55)}
.ast{font-size:.62em;vertical-align:super;line-height:0;opacity:.75;margin-left:1px}

/* Gold square bullets */
.gold-list li{position:relative;padding-left:1.4rem;font-size:.875rem;color:var(--ink-85)}
.gold-list li:before{content:"";position:absolute;left:0;top:.62em;width:7px;height:7px;background:var(--gold)}

/* ---------- Buttons: pill with clip-path fill ---------- */
.btn{position:relative;overflow:hidden;isolation:isolate;display:inline-flex;align-items:center;gap:.6em;border-radius:.3em;padding:16px 32px;font:400 .74rem/1.2 var(--sans);text-transform:uppercase;letter-spacing:.22em;cursor:pointer;transition:color .6s var(--ease-clip)}
.btn.sm{padding:12px 24px;font-size:.72rem}
.btn>.fill{position:absolute;inset:0;clip-path:inset(100% 0 0 0);transition:clip-path 1s var(--ease-clip);z-index:0}
.btn:hover>.fill,.btn:focus-visible>.fill{clip-path:inset(0 0 0 0)}
.btn>*:not(.fill){position:relative;z-index:1}
.btn .arr{transition:transform 1s var(--ease-clip)}
.btn:hover .arr{transform:translateX(.35em)}
.btn[disabled]{opacity:.7;cursor:wait}
.btn-gold{background:var(--gold);color:var(--marine)}
.btn-gold>.fill{background:var(--marine)}
.btn-gold:hover{color:var(--cream)}
.btn-light{border:1px solid rgba(247,243,236,.4);color:var(--cream)}
.btn-light>.fill{background:var(--cream)}
.btn-light:hover{color:var(--marine)}
.btn-dark{border:1px solid rgba(17,48,63,.3);color:var(--marine)}
.btn-dark>.fill{background:var(--marine)}
.btn-dark:hover{color:var(--cream)}
.btn svg{width:16px;height:16px;fill:currentColor;flex:none}

/* Nav link: duplicate text rolls up */
.nl{position:relative;overflow:hidden;display:inline-block;line-height:1.3}
.nl>span{display:inline-block;transition:transform .35s var(--ease-expo)}
.nl>span+span{position:absolute;left:0;top:0;transform:translateY(105%)}
.nl:hover>span:first-child{transform:translateY(-105%)}
.nl:hover>span+span{transform:translateY(0)}

/* ---------- Header ---------- */
.hdr{position:fixed;top:0;left:0;right:0;z-index:50;padding:28px 0;background:transparent;transition:all .7s var(--ease-expo)}
.hdr.is-scrolled{background:rgba(247,243,236,.95);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid rgba(17,48,63,.1);padding:16px 0}
.hdr .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px}
.brand{display:block;text-align:left;line-height:1}
.brand b{font:400 1.55rem/1 var(--serif);letter-spacing:.28em;text-transform:uppercase;color:var(--cream);transition:color .7s}
.brand small{display:block;margin-top:4px;font-size:.58rem;text-transform:uppercase;letter-spacing:.34em;color:var(--gold)}
.hdr nav.main{display:none;align-items:center;gap:36px}
.hdr nav.main a{font-size:.72rem;text-transform:uppercase;letter-spacing:.2em;color:rgba(247,243,236,.85);transition:color .5s}
.hdr nav.main a:hover{color:var(--cream)}
.hdr .right{display:flex;align-items:center;gap:16px}
.hdr .lang{font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:rgba(247,243,236,.85);transition:color .5s;padding:6px 2px}
.hdr .cta{display:none}
.burger{display:flex;flex-direction:column;justify-content:center;align-items:flex-end;width:40px;height:40px}
.burger i{display:block;width:28px;height:1px;background:var(--cream);transition:all .5s}
.burger i:first-child{transform:translateY(-6px)}
.burger i:last-child{transform:translateY(6px)}
.hdr.is-open .burger i:first-child{transform:rotate(22.5deg)}
.hdr.is-open .burger i:last-child{transform:rotate(-22.5deg)}
.hdr.is-dark .brand b{color:var(--marine)}
.hdr.is-dark nav.main a,.hdr.is-dark .lang{color:rgba(17,48,63,.8)}
.hdr.is-dark nav.main a:hover,.hdr.is-dark .lang:hover{color:var(--marine)}
.hdr.is-dark .burger i{background:var(--marine)}
.hdr.is-dark .cta{border-color:rgba(17,48,63,.3);color:var(--marine)}
.hdr.is-dark .cta>.fill{background:var(--marine)}
.hdr.is-dark .cta:hover{color:var(--cream)}
.mmenu{overflow:hidden;max-height:0;background:var(--cream);transition:max-height .7s var(--ease-expo)}
.hdr.is-open .mmenu{max-height:480px;border-bottom:1px solid rgba(17,48,63,.1)}
.mmenu nav{display:flex;flex-direction:column;gap:24px;padding:40px 32px}
.mmenu a{font:400 1.5rem/1.2 var(--serif);color:var(--marine)}
.mmenu a.go{font:400 .75rem/1 var(--sans);text-transform:uppercase;letter-spacing:.22em;color:var(--gold);margin-top:8px}
@media(min-width:640px){.hdr .cta{display:inline-flex}}
@media(min-width:1024px){.hdr nav.main{display:flex}.burger,.mmenu{display:none}}

/* ---------- Hero: Ken Burns slideshow (24 s cycle) ---------- */
.hero{position:relative;height:100vh;height:100svh;min-height:620px;overflow:hidden;background:var(--marine-deep)}
.kb{position:absolute;inset:0}
.kb-slide{position:absolute;inset:0;opacity:0;animation:kb 24s infinite;will-change:transform,opacity}
.kb-slide img{width:100%;height:100%;object-fit:cover}
.kb-slide:nth-child(1){animation-delay:0s}.kb-slide:nth-child(2){animation-delay:8s}.kb-slide:nth-child(3){animation-delay:16s}
.kb-cap{position:absolute;right:24px;top:112px;z-index:2;font-size:.6rem;text-transform:uppercase;letter-spacing:.2em;color:rgba(247,243,236,.6)}
@keyframes kb{0%{opacity:0;transform:scale(1.08)}4%{opacity:1}33%{opacity:1;transform:scale(1)}38%{opacity:0;transform:scale(1)}100%{opacity:0;transform:scale(1.08)}}
/* Design gradients + a soft pool of shade behind the copy, so bright photo slides stay legible */
.hero-shade{position:absolute;inset:0;background:radial-gradient(ellipse 70% 45% at 50% 68%,rgba(6,17,28,.42),transparent 70%),linear-gradient(180deg,rgba(0,0,0,.5),transparent 50%),linear-gradient(180deg,transparent 55%,rgba(6,17,28,.85))}
.hero-in{position:relative;z-index:10;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;padding:0 24px 112px;text-align:center}
.hero h1{margin-top:24px;color:var(--cream);font-size:clamp(3rem,9vw,6.5rem);line-height:1.02}
.hero .sub{margin-top:24px;max-width:36rem;color:rgba(247,243,236,.85);font-size:1rem;line-height:1.625}
.hero .ctas{margin-top:40px;display:flex;flex-direction:column;align-items:center;gap:16px}
.hero .facts{margin-top:40px;display:flex;flex-wrap:wrap;justify-content:center;gap:8px 32px;color:rgba(247,243,236,.7);font-size:.72rem;text-transform:uppercase;letter-spacing:.18em}
.hero .facts .dot{display:none;color:var(--gold)}
.cue{position:absolute;bottom:32px;left:50%;margin-left:-9px;z-index:10;color:rgba(247,243,236,.7);animation:cue 2.4s ease-in-out infinite}
@keyframes cue{0%,100%{transform:translateY(0);opacity:.9}50%{transform:translateY(10px);opacity:.4}}
@keyframes introFade{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}
.intro{opacity:0;animation:introFade 1.1s var(--ease-expo) forwards}
@media(min-width:640px){.hero .ctas{flex-direction:row}.hero .facts .dot{display:inline}}
@media(min-width:768px){.hero-in{padding-bottom:128px}.hero .sub{font-size:1.125rem}.kb-cap{right:40px}}

/* ---------- Intro + stats ---------- */
.intro-r{display:flex;flex-direction:column;justify-content:flex-end}
.stats{margin-top:96px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-top:1px solid var(--line)}
.stat{padding:40px 8px 16px}
.stat:first-child{padding-left:0}
.stat .v{font:400 clamp(2.6rem,4.5vw,4.2rem)/1 var(--serif);color:var(--marine)}
.stat .l{margin-top:12px;font-size:.7rem;text-transform:uppercase;letter-spacing:.2em;color:var(--ink-60)}
@media(min-width:768px){.stat{padding-left:24px;padding-right:24px}.stat:first-child{padding-left:0}}
@media(min-width:1024px){.stats{grid-template-columns:repeat(4,minmax(0,1fr))}}

/* ---------- Full-bleed parallax band ---------- */
.band{position:relative;height:58vh;overflow:hidden;background:var(--marine-deep)}
.band.loc{height:52vh}
.band>img{position:absolute;left:0;top:-15%;width:100%;height:130%;object-fit:cover;object-position:center;will-change:transform}
.band .shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(6,17,28,.15),transparent 40%,rgba(6,17,28,.35))}
.band.loc .shade{background:linear-gradient(180deg,rgba(6,17,28,.1),transparent 40%,rgba(6,17,28,.5))}
.band .cap{position:absolute;bottom:20px;right:24px;color:rgba(247,243,236,.7)}
.band .over{position:absolute;bottom:32px;left:var(--gut);right:var(--gut)}
.band .over h2{margin-top:16px;color:var(--cream);font-size:clamp(2.2rem,5vw,4rem);line-height:1.05}
@media(min-width:768px){.band{height:72vh}.band.loc{height:64vh}}

/* ---------- Tower ---------- */
.tower-grid{margin-top:80px}
.quote{position:relative;z-index:10;background:var(--marine);color:var(--cream);padding:40px;border-left:2px solid var(--gold)}
.quote p{font:400 clamp(1.6rem,2.6vw,2.3rem)/1.3 var(--serif)}
.quote em{color:var(--gold)}
.tower-img{margin-top:48px;display:none}
.tower-img img{width:100%;aspect-ratio:4/3;object-fit:cover}
.tower-img .cap{margin-top:12px}
.facts-dl{margin-top:48px}
.facts-dl>div{display:grid;grid-template-columns:140px minmax(0,1fr);gap:16px;padding:20px 0;border-top:1px solid var(--line)}
.facts-dl>div:last-child{border-bottom:1px solid var(--line)}
.facts-dl dt{padding-top:4px;font-size:.7rem;text-transform:uppercase;letter-spacing:.2em;color:var(--ink-55)}
.facts-dl dd{font:400 1.25rem/1.375 var(--serif);color:var(--marine)}
@media(min-width:768px){.tower-grid{margin-top:112px}.quote{padding:56px}.facts-dl>div{grid-template-columns:200px minmax(0,1fr)}.facts-dl dd{font-size:1.5rem}}
@media(min-width:1024px){.quote{margin-top:-160px}.tower-img{display:block}}

/* ---------- Residences ---------- */
.pics{margin-top:64px;display:grid;grid-template-columns:minmax(0,1fr);gap:24px}
.pics figure img{width:100%;aspect-ratio:3/2;object-fit:cover}
.pics .cap{margin-top:12px}
@media(min-width:768px){.pics{grid-template-columns:repeat(12,minmax(0,1fr))}.pics .p7{grid-column:span 7}.pics .p5{grid-column:span 5;margin-top:64px}}
.units{margin-top:80px}
.units .head{display:none;padding-bottom:16px}
.urow{width:100%;text-align:left;display:grid;grid-template-columns:minmax(0,1fr);gap:4px;padding:24px 0;border-top:1px solid var(--line);align-items:baseline;transition:background-color .5s}
.urow:last-of-type{border-bottom:1px solid var(--line)}
.urow:hover{background:rgba(247,243,236,.7)}
.urow .t{font:400 1.5rem/1.2 var(--serif);color:var(--marine);display:flex;align-items:baseline;gap:12px}
.urow .t .go{opacity:0;transform:translateX(-8px);transition:all .5s;color:var(--gold);font-size:1.125rem}
.urow:hover .t .go{opacity:1;transform:none}
.urow .s{font-size:.875rem;color:var(--ink-70)}
.urow .p{font-size:.875rem;color:var(--ink-90)}
.urow .p i{font-style:normal;color:var(--ink-55);font-size:.68rem;text-transform:uppercase;letter-spacing:.16em;margin-right:8px}
.units .fine{margin-top:24px;max-width:48rem}
@media(min-width:768px){
  .units .head,.urow{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
  .urow .p i{display:none}
}

/* ---------- Leisure deck ---------- */
.deck-lead{position:relative;margin-top:64px}
.deck-lead img{width:100%;aspect-ratio:16/9;object-fit:cover}
.deck-lead .tag{position:absolute;bottom:0;left:0;background:var(--cream);padding:16px 24px}
.deck-lead .tag p:first-child{font:400 1.25rem/1.3 var(--serif);color:var(--marine)}
.deck-lead .tag .label{margin-top:4px}
.deck-lead .cap{position:absolute;right:16px;top:14px;color:rgba(247,243,236,.8)}
.trio{margin-top:24px;display:grid;grid-template-columns:minmax(0,1fr);gap:24px}
.trio img{width:100%;aspect-ratio:4/3;object-fit:cover}
.trio figcaption{margin-top:16px}
.trio figcaption p:first-child{font:400 1.25rem/1.3 var(--serif);color:var(--marine)}
.trio figcaption .label{margin-top:4px}
.trio figcaption .label b{font-weight:400;color:var(--gold)}
.am-list{margin-top:64px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 32px}
@media(min-width:768px){.deck-lead img{aspect-ratio:21/9}.deck-lead .tag{padding:20px 32px}.deck-lead .tag p:first-child{font-size:1.5rem}.trio{grid-template-columns:repeat(3,minmax(0,1fr))}.trio figure:nth-child(2){margin-top:48px}.am-list{grid-template-columns:repeat(5,minmax(0,1fr))}}

/* ---------- Developer ---------- */
.dev-img img{width:100%;aspect-ratio:3/4;object-fit:cover}
.dev-img .cap{margin-top:12px}
.dev-img{order:2}
.rows{border-top:1px solid var(--line)}
.rows>div{display:flex;align-items:baseline;justify-content:space-between;gap:24px;padding:20px 0;border-bottom:1px solid var(--line)}
.rows .n{font:400 1.25rem/1.3 var(--serif);color:var(--marine)}
.rows .w{font-size:.7rem;text-transform:uppercase;letter-spacing:.18em;color:var(--ink-55);text-align:right}
.rows .w.gold{color:var(--gold);white-space:nowrap;font-size:.72rem}
@media(min-width:768px){.rows .n{font-size:1.5rem}.rows.loc .n{font-size:1.25rem}}
.rows.loc .n{font-size:1.125rem}
@media(min-width:1024px){.dev-img{order:1;margin-top:96px}.dev-txt{order:2}}

/* ---------- Location ---------- */
.loc-grid{padding-top:96px;padding-bottom:96px}
@media(min-width:768px){.loc-grid{padding-top:128px;padding-bottom:128px}}

/* ---------- Market (dark) ---------- */
.market{background:var(--marine);color:var(--cream)}
.market h2{color:var(--cream);max-width:48rem}
.market h2 em{color:var(--gold)}
.mstats{margin-top:80px;display:grid;grid-template-columns:minmax(0,1fr);border-top:1px solid var(--line-light)}
.mstats>div{padding:40px 40px 16px 0}
.mstats .v{font:400 clamp(2rem,3.4vw,3.1rem)/1 var(--serif);color:var(--cream)}
.mstats .l{margin-top:16px;font-size:.7rem;line-height:1.625;text-transform:uppercase;letter-spacing:.18em;color:rgba(247,243,236,.55)}
.market .mtxt{margin-top:64px}
.market .mtxt .lead{color:rgba(247,243,236,.8)}
.market .mtxt .fine{color:rgba(247,243,236,.45)}
@media(min-width:768px){.mstats{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* ---------- Partner ---------- */
.creds{margin-top:64px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--line)}
.creds>div{padding-top:32px}
.creds .v{font:400 clamp(1.8rem,3vw,2.6rem)/1 var(--serif);color:var(--marine)}
.creds .l{margin-top:8px;font-size:.68rem;text-transform:uppercase;letter-spacing:.18em;color:var(--ink-55)}
.svcs{margin-top:64px;display:grid;grid-template-columns:minmax(0,1fr);column-gap:56px}
.svc{display:block;text-align:left;padding:36px 0;border-top:1px solid var(--line)}
.svc:last-child{border-bottom:1px solid var(--line)}
.svc .hd{display:flex;align-items:baseline;gap:24px}
.svc .num{font-size:.7rem;letter-spacing:.2em;color:var(--gold)}
.svc h3{font-size:1.5rem;line-height:1.25;display:flex;align-items:baseline;gap:12px}
.svc h3 .go{opacity:0;transform:translateX(-8px);transition:all .5s;color:var(--gold);font-size:1.125rem}
.svc:hover h3 .go{opacity:1;transform:none}
.svc p{margin-top:16px;padding-left:48px;font-size:.95rem;line-height:1.85;color:var(--ink-80);max-width:36rem}
@media(min-width:768px){.svcs{grid-template-columns:repeat(2,minmax(0,1fr))}.svc:nth-last-child(2){border-bottom:1px solid var(--line)}.svc h3{font-size:1.7rem}}

/* ---------- FAQ ---------- */
.faq-item{border-top:1px solid var(--line)}
.faq-item:last-child{border-bottom:1px solid var(--line)}
.faq-q{width:100%;display:flex;align-items:center;justify-content:space-between;gap:32px;padding:24px 0;text-align:left}
.faq-q h3{font-size:1.25rem;line-height:1.3}
.faq-q .ic{flex:none;color:var(--gold);font-size:1.5rem;line-height:1;font-weight:300;transition:transform .6s var(--ease-expo)}
.faq-a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .6s var(--ease-expo)}
.faq-a>div{overflow:hidden}
.faq-a p{padding:0 40px 28px 0;font-size:.95rem;line-height:1.85;color:var(--ink-80)}
.faq-a a{color:var(--marine);border-bottom:1px solid var(--gold)}
.faq-item[data-open=true] .faq-a{grid-template-rows:1fr}
.faq-item[data-open=true] .ic{transform:rotate(45deg)}
@media(min-width:768px){.faq-q h3{font-size:1.5rem}}

/* ---------- Enquire (split card overlapping the footer) ---------- */
.enq{position:relative;background:var(--white)}
.enq-card{position:relative;z-index:10;translate:0 96px;background:var(--marine);color:var(--cream);display:grid;grid-template-columns:minmax(0,1fr)}
.enq-form,.enq-desk{padding:40px 24px}
.enq-form{border-bottom:1px solid rgba(247,243,236,.1)}
.enq h2{margin-top:24px;color:var(--cream);font-size:clamp(1.9rem,3vw,2.8rem);line-height:1.15}
.enq .intro-t{margin-top:16px;color:rgba(247,243,236,.7);line-height:1.85;font-size:.95rem}
.enq-desk{display:flex;flex-direction:column;justify-content:space-between;gap:48px}
.enq-desk .k{font-size:.7rem;text-transform:uppercase;letter-spacing:.22em;color:var(--gold)}
.enq-desk .who{margin-top:24px;font:400 1.5rem/1.375 var(--serif)}
.enq-desk .who span{display:block;margin-top:4px;font:300 1rem/1.5 var(--sans);color:rgba(247,243,236,.6)}
.enq-desk dl{margin-top:40px;display:grid;gap:20px;font-size:.95rem}
.enq-desk dt{font-size:.65rem;text-transform:uppercase;letter-spacing:.2em;color:rgba(247,243,236,.45)}
.enq-desk dd{margin-top:4px;color:rgba(247,243,236,.85)}
.enq-desk dd a:hover{color:var(--gold)}
.enq-desk .btn{align-self:flex-start}
@media(min-width:768px){.enq-form,.enq-desk{padding:64px}}
@media(min-width:1024px){.enq-card{grid-template-columns:repeat(2,minmax(0,1fr))}.enq-form{border-bottom:0;border-right:1px solid rgba(247,243,236,.1)}}

/* Underline form fields (dark card) */
.lf{margin-top:40px;display:grid;gap:28px}
.lf .row{display:grid;grid-template-columns:minmax(0,1fr);gap:28px}
@media(min-width:560px){.lf .row{grid-template-columns:repeat(2,minmax(0,1fr))}}
.lf .field{position:relative;min-width:0}
.lf input[type=text],.lf input[type=email],.lf input[type=tel],.lf select,.lf textarea{width:100%;background:transparent;border:0;border-bottom:1px solid rgba(247,243,236,.25);border-radius:0;outline:none;padding:12px 0;color:var(--cream);font:300 .95rem/1.4 var(--sans);letter-spacing:.01em;transition:border-color .5s}
.lf input::placeholder,.lf textarea::placeholder{color:rgba(247,243,236,.4)}
.lf input:focus,.lf select:focus,.lf textarea:focus{border-bottom-color:var(--gold)}
.lf textarea{resize:none;min-height:84px}
.lf select{-webkit-appearance:none;appearance:none;cursor:pointer;padding-right:24px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%23cea84e'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 4px center}
.lf select:invalid,.lf select.empty{color:rgba(247,243,236,.4)}
.lf select option{color:var(--marine);background:#fff}
.lf .field.invalid input{border-bottom-color:#e8a598}
.lf .fielderr{margin-top:6px;font-size:.75rem;color:#f0b4a8;min-height:0}
.lf .fielderr:empty{display:none}
.chips{display:flex;flex-wrap:wrap;gap:8px;border:0;margin:0;padding:4px 0 0;min-width:0}
.chips label{position:relative;cursor:pointer}
.chips input{position:absolute;opacity:0;width:1px;height:1px}
.chips span{display:inline-block;padding:8px 16px;font-size:.68rem;text-transform:uppercase;letter-spacing:.16em;border:1px solid rgba(247,243,236,.2);color:rgba(247,243,236,.6);transition:border-color .5s,color .5s}
.chips label:hover span{border-color:rgba(247,243,236,.4)}
.chips input:checked+span{border-color:var(--gold);color:var(--gold)}
.chips input:focus-visible+span{outline:1px solid var(--gold);outline-offset:2px}
.consent{display:flex;gap:12px;align-items:flex-start;font-size:.78rem;line-height:1.6;color:rgba(247,243,236,.6);cursor:pointer}
.consent input{margin:3px 0 0;accent-color:var(--gold);width:15px;height:15px;flex:none}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.lf .note{font-size:.72rem;color:rgba(247,243,236,.45)}
.errmsg{display:none;font-size:.85rem;color:#f0b4a8}
.okmsg{display:none;margin-top:40px;border:1px solid rgba(191,150,87,.4);padding:32px}
.okmsg .t{font:400 1.5rem/1.3 var(--serif);color:var(--gold)}
.okmsg p{margin-top:12px;color:rgba(247,243,236,.75);font-size:.875rem;line-height:1.7}
.okmsg .btn{margin-top:24px}

/* intl-tel-input on the dark underline field */
.lf .iti{display:block;width:100%}
.lf .iti__selected-country{color:var(--cream)}
.lf .iti__selected-dial-code{color:var(--cream);font-size:.95rem}
.lf .iti__arrow{border-top-color:rgba(247,243,236,.6)}
.lf .iti__arrow--up{border-bottom-color:rgba(247,243,236,.6)}
.lf .iti__selected-country-primary{padding-left:0}
.lf .iti__selected-country:hover .iti__selected-country-primary,.lf .iti__selected-country[aria-expanded=true] .iti__selected-country-primary{background:rgba(247,243,236,.06)}
.iti--container,.iti__dropdown-content{z-index:1200}
.iti__dropdown-content{font:300 .9rem/1.4 var(--sans);color:var(--marine)}

/* ---------- Footer ---------- */
.foot{background:var(--marine-deep);color:rgba(247,243,236,.7);padding:192px 0 48px}
.foot .top{display:flex;flex-direction:column;justify-content:space-between;gap:40px;border-bottom:1px solid rgba(247,243,236,.1);padding-bottom:48px}
.foot .wm{font:400 1.875rem/1 var(--serif);letter-spacing:.28em;text-transform:uppercase;color:var(--cream)}
.foot .wm+p{margin-top:8px;font-size:.62rem;text-transform:uppercase;letter-spacing:.34em;color:var(--gold)}
.foot nav{display:flex;flex-wrap:wrap;gap:12px 32px}
.foot nav a{font-size:.7rem;text-transform:uppercase;letter-spacing:.2em;color:rgba(247,243,236,.6);transition:color .5s}
.foot nav a:hover{color:var(--cream)}
.foot .disclaimer{margin-top:40px;max-width:56rem;font-size:.75rem;line-height:1.65;color:rgba(247,243,236,.4)}
.foot .contact{margin-top:24px;font-size:.75rem;line-height:1.8;color:rgba(247,243,236,.5)}
.foot .contact a{color:rgba(247,243,236,.75)}
.foot .contact a:hover{color:var(--gold)}
.foot .bottom{margin-top:32px;display:flex;flex-direction:column;justify-content:space-between;gap:12px;font-size:.68rem;text-transform:uppercase;letter-spacing:.2em;color:rgba(247,243,236,.35)}
.foot .bottom b{font-weight:400;color:rgba(191,150,87,.8)}
.foot .bottom a:hover{color:var(--cream)}
.clink{font-size:inherit;color:rgba(247,243,236,.6);text-decoration:underline;text-underline-offset:3px}
@media(min-width:640px){.foot .bottom{flex-direction:row}}
@media(min-width:768px){.foot .top{flex-direction:row;align-items:flex-end}}

/* ---------- WhatsApp pre-chat modal ---------- */
.wamodal{position:fixed;inset:0;z-index:1100;display:flex;align-items:center;justify-content:center;padding:16px}
.wabackdrop{position:absolute;inset:0;background:rgba(11,34,48,.62);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
.wabox{position:relative;width:100%;max-width:480px;max-height:calc(100vh - 32px);overflow:auto;background:var(--cream);border-top:2px solid var(--gold);padding:32px 28px;animation:introFade .6s var(--ease-expo)}
.wahead{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}
.wahead h2{margin-top:16px;font-size:1.9rem;line-height:1.15}
.waclose{font-size:1.6rem;line-height:1;color:var(--ink-60);padding:4px}
.waclose:hover{color:var(--marine)}
.wabox .intro-t{margin-top:12px;font-size:.9rem;line-height:1.7;color:var(--ink-80)}
.lf.light{margin-top:28px;gap:24px}
.lf.light input[type=text],.lf.light input[type=tel],.lf.light textarea{color:var(--marine);border-bottom-color:rgba(17,48,63,.25)}
.lf.light input::placeholder,.lf.light textarea::placeholder{color:var(--ink-50)}
.lf.light .iti__selected-country,.lf.light .iti__selected-dial-code{color:var(--marine)}
.lf.light .iti__arrow{border-top-color:var(--ink-60)}
.lf.light .consent{color:var(--ink-70)}
.lf.light .errmsg,.lf.light .fielderr{color:#b0412e}
.wa-ico{width:18px;height:18px;fill:currentColor}

/* ---------- Floating WhatsApp (desktop) + sticky bar (mobile) ---------- */
.wafab{position:fixed;right:28px;bottom:28px;z-index:60;width:56px;height:56px;border-radius:50%;background:var(--marine);color:var(--cream);border:1px solid rgba(191,150,87,.6);display:none;align-items:center;justify-content:center;box-shadow:0 10px 30px rgba(11,34,48,.25);opacity:0;transform:translateY(12px);pointer-events:none;transition:opacity .6s var(--ease-expo),transform .6s var(--ease-expo),background .4s}
.wafab svg{width:24px;height:24px;fill:currentColor}
.wafab:hover{background:var(--gold);color:var(--marine)}
.mbar{position:fixed;left:0;right:0;bottom:0;z-index:60;display:grid;grid-template-columns:1fr 1fr;background:var(--marine);border-top:1px solid rgba(191,150,87,.35);transform:translateY(100%);transition:transform .6s var(--ease-expo);padding-bottom:env(safe-area-inset-bottom)}
.mbar a,.mbar button{display:flex;align-items:center;justify-content:center;gap:8px;padding:16px 8px;font-size:.7rem;text-transform:uppercase;letter-spacing:.2em;color:var(--cream)}
.mbar a{background:var(--gold);color:var(--marine)}
.mbar svg{width:16px;height:16px;fill:currentColor}
body.past-hero .wafab{opacity:1;transform:none;pointer-events:auto}
body.past-hero .mbar{transform:none}
@media(min-width:768px){.wafab{display:flex}.mbar{display:none}}
@media(max-width:767px){body{padding-bottom:0}.foot{padding-bottom:96px}}

/* ---------- Cookie banner (/consent-v1.js) ---------- */
.cbanner{position:fixed;left:16px;right:16px;bottom:16px;z-index:1000;background:var(--cream);border:1px solid rgba(17,48,63,.12);border-top:2px solid var(--gold);box-shadow:0 18px 40px rgba(11,34,48,.18);padding:20px;max-width:460px}
.cbanner p{font-size:.8rem;line-height:1.6;color:var(--ink-80)}
.cbanner .cbtns{margin-top:14px;display:flex;gap:10px;justify-content:flex-end}
.cbanner button{padding:10px 18px;font-size:.66rem;text-transform:uppercase;letter-spacing:.2em;border-radius:.3em}
.cbanner .cno{border:1px solid rgba(17,48,63,.3);color:var(--marine)}
.cbanner .cyes{background:var(--gold);color:var(--marine)}
@media(max-width:767px){body.past-hero .cbanner{bottom:72px}}

/* ---------- Scroll effects (enabled only when JS runs: html.js) ---------- */
.js [data-fade]{opacity:0;transform:translateY(24px);transition:opacity 1.1s var(--ease-expo),transform 1.1s var(--ease-expo)}
.js [data-fade].is-in{opacity:1;transform:none}
[data-mask]{overflow:hidden}
.js [data-mask] img{transform:scale(1.12);transition:transform 1.6s var(--ease-expo)}
.js [data-mask].is-in img{transform:scale(1)}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .kb-slide{animation:none}.kb-slide:first-child{opacity:1}
  .intro{animation:none;opacity:1}
  .cue{animation:none}
  .js [data-fade]{opacity:1!important;transform:none!important;transition:none}
  .js [data-mask] img{transform:none!important;transition:none}
  .band>img{transform:none!important}
}

/* ---------- DLD Trakheesi permit (footer) ---------- */
.foot .permit{margin-top:24px;display:flex;align-items:center;gap:16px;font-size:.72rem;letter-spacing:.04em;color:rgba(247,243,236,.6)}
.foot .permit b{font-weight:400;color:var(--cream)}
.foot .permit img{width:72px;height:72px;background:#fff;padding:5px;image-rendering:pixelated}

/* ---------- Abou Dhabi Immobilier: page-specific blocks ---------- */
/* Payment plan: the three creds numbers, larger */
.creds.plan .v{font-size:clamp(2.6rem,5vw,4.6rem)}
.plan-cta{margin-top:56px}
/* Unit / district rows with 5 columns (type · size/profile · price · yield · delivery) */
@media(min-width:1024px){
  .units.u5 .head,.units.u5 .urow{grid-template-columns:3fr 3fr 2.4fr 2.2fr 1.6fr}
}
.units .phase{margin-top:56px;font:400 .72rem/1.4 var(--sans);text-transform:uppercase;letter-spacing:.22em;color:var(--gold)}
.units .phase:first-child{margin-top:0}
.units .phase+.urow,.units .phase+.head+.urow{border-top:1px solid var(--line)}
/* Buying steps: 2 columns on desktop */
@media(min-width:1024px){.svcs.two{grid-template-columns:repeat(2,minmax(0,1fr))}.svcs.two .svc:nth-last-child(2){border-bottom:1px solid var(--line)}}
.market .rows{margin-top:40px}
.market .rows>div{border-color:var(--line-light)}
.market .rows .n{color:rgba(247,243,236,.85)}
/* Sub-page hero (shorter), breadcrumb, developer wordmarks, feature card, district blocks */
.hero.short{height:78vh;height:78svh;min-height:560px}
.hero.short h1{font-size:clamp(2.6rem,7vw,5.2rem)}
.hero .crumbs{font-size:.68rem;text-transform:uppercase;letter-spacing:.2em;color:rgba(247,243,236,.65)}
.hero .crumbs a:hover{color:var(--cream)}
.devs{margin-top:64px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-top:1px solid var(--line);border-left:1px solid var(--line)}
@media(min-width:768px){.devs{grid-template-columns:repeat(3,minmax(0,1fr))}}
.devs>*{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:6px;min-height:132px;padding:24px 12px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);text-align:center;transition:background-color .5s}
.devs>a:hover{background:var(--white)}
.devs .wm{font:500 clamp(1.15rem,2vw,1.55rem)/1.1 var(--serif);letter-spacing:.14em;text-transform:uppercase;color:var(--marine)}
.devs .sm{font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-55)}
.feat{display:block;position:relative;margin-top:64px}
.feat img{width:100%;aspect-ratio:16/9;object-fit:cover;transition:transform 1.6s var(--ease-expo)}
.feat:hover img{transform:scale(1.03)}
.feat .ov{position:absolute;inset:auto 0 0 0;padding:32px var(--gut);background:linear-gradient(180deg,transparent,rgba(6,17,28,.85));color:var(--cream)}
.feat .ov h3{color:var(--cream);font-size:clamp(1.8rem,3.4vw,3rem);line-height:1.1;margin-top:12px}
.feat .ov p{margin-top:8px;color:rgba(247,243,236,.8);font-size:.95rem}
.feat .cap{position:absolute;right:16px;top:14px;color:rgba(247,243,236,.8)}
.feat-wrap{overflow:hidden}
.district+.district{border-top:1px solid var(--line)}
.district .rows{margin-top:8px}
.explore{margin-top:64px}
@media(max-width:767px){.rows .w.gold{white-space:normal;max-width:48%;line-height:1.5}.rows .n{min-width:0;overflow-wrap:anywhere}}