/* === RESET & TOKENS === */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
img,video{display:block;max-width:100%;height:auto}
button,input,select,textarea{font:inherit;color:inherit;background:none;border:none;outline:none}
a{color:inherit;text-decoration:none}
ul,ol{list-style:none}

:root{
  --ink:#08090e;
  --ink-2:#0d1018;
  --warm-dark:#15100b;
  --paper:#f7f4f0;
  --stone:#e8e4de;
  --muted:#6b6e74;
  --muted-d:#a8abb1;
  --red:#c8102e;
  --red-d:#9e0c24;
  --f:'Cairo','Segoe UI',Tahoma,sans-serif;
  --f-num:'Outfit','Cairo',sans-serif;
  --f-script:'Cormorant Garamond',Georgia,serif;
  --gut:max(20px,env(safe-area-inset-left,0px));
  --navh:60px;
  --r:16px;
}

html,body{overflow-x:clip;max-width:100%}
body{font-family:var(--f);background:var(--ink);color:#fff;direction:rtl}
.wrap{max-width:1200px;margin:0 auto;padding:0 var(--gut)}

/* === TYPOGRAPHY === */
h1{font-size:clamp(2rem,7vw,4.5rem);font-weight:900;line-height:1.1}
h2{font-size:clamp(1.6rem,4.5vw,3rem);font-weight:800;line-height:1.15}
h3{font-size:clamp(1.2rem,3vw,1.8rem);font-weight:800}
.eyebrow{font-size:.75rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--muted-d);margin-bottom:.5rem}
.num-red{color:var(--red)}
.sec-head{text-align:center;margin-bottom:2.5rem}
.script{font-family:var(--f-script);font-style:italic;font-weight:400}

/* === NAV === */
.nav{
  position:fixed;top:0;inset-inline:0;z-index:100;
  height:var(--navh);display:flex;align-items:center;gap:1rem;
  padding:0 var(--gut);
  transition:background .3s,backdrop-filter .3s;
}
.nav.solid{background:rgba(8,9,14,.92);backdrop-filter:blur(14px)}
.brand img{height:40px;width:auto;display:block}
.nav-links{display:none}
.lang{font-size:.75rem;font-weight:700;letter-spacing:.1em;padding:.25rem .6rem;border:1px solid rgba(255,255,255,.28);border-radius:4px;margin-inline-start:auto}
.wa-round{
  display:flex;align-items:center;justify-content:center;
  width:36px;height:36px;border-radius:50%;
  background:#25d366;color:#fff;flex-shrink:0;
  margin-inline-start:.5rem;
}
.wa-round svg{width:20px;height:20px}

/* === HERO === */
.hero{position:relative;min-height:88svh;display:flex;align-items:flex-end;padding-bottom:max(60px,env(safe-area-inset-bottom,0px));overflow:hidden}
.hero-media{position:absolute;inset:0;overflow:hidden}
.hero-media video{width:100%;height:100%;object-fit:cover}
.hero-shade{position:absolute;inset:0;background:linear-gradient(0deg,rgba(8,9,14,.94) 0%,rgba(8,9,14,.25) 55%,transparent 100%)}
.hero-copy{position:relative;z-index:2;padding:0 var(--gut) var(--gut);padding-top:calc(var(--navh)+20px);width:100%}
.hero-copy h1{margin-bottom:.75rem}
.hero-sub{font-size:clamp(.9rem,2.5vw,1.1rem);color:rgba(255,255,255,.72);max-width:520px;margin-bottom:1.5rem;line-height:1.6}
.hero-pills{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:1.5rem}
.hero-pills a{
  display:flex;flex-direction:column;align-items:center;gap:.1rem;
  padding:.6rem 1rem;
  border:1px solid rgba(255,255,255,.2);
  border-radius:12px;
  background:rgba(255,255,255,.08);
  backdrop-filter:blur(14px) saturate(160%);
  -webkit-backdrop-filter:blur(14px) saturate(160%);
  transition:background .2s,border-color .2s;
}
.hero-pills a b{
  font-family:var(--f-num);
  font-size:1.6rem;font-weight:700;
  color:var(--red);line-height:1;
  letter-spacing:-.01em;
}
.hero-pills a span{font-size:.62rem;color:rgba(255,255,255,.6);text-align:center;white-space:nowrap}
.hero-pills a:hover{background:rgba(255,255,255,.15);border-color:rgba(255,255,255,.42)}
.hero-cta{display:flex;gap:.75rem;flex-wrap:wrap}
.scroll-cue{position:absolute;bottom:20px;left:50%;transform:translateX(-50%);z-index:2}
.scroll-cue span{display:block;width:1px;height:40px;background:rgba(255,255,255,.38);animation:scrollDown 1.5s ease-in-out infinite}
@keyframes scrollDown{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}51%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}

/* === BUTTONS === */
.btn{display:inline-flex;align-items:center;gap:.5rem;padding:.75rem 1.5rem;border-radius:8px;font-weight:700;font-size:.9rem;cursor:pointer;transition:background .2s,color .2s,transform .1s}
.btn:active{transform:scale(.97)}
.btn:disabled{opacity:.6;cursor:wait}
.btn-red{background:var(--red);color:#fff}
.btn-red:hover{background:var(--red-d)}
.btn-ghost{background:rgba(255,255,255,.11);color:#fff;border:1px solid rgba(255,255,255,.28)}
.btn-ghost:hover{background:rgba(255,255,255,.2)}
.btn-ink{background:var(--ink);color:#fff}
.btn-ink:hover{background:#0d0f15}
.btn-wa{background:#25d366;color:#fff}
.btn-wa:hover{background:#1da851}
.link-wa{display:inline-flex;align-items:center;gap:.5rem;font-weight:700;color:#25d366;font-size:.9rem;padding:.5rem 0;cursor:pointer}
.link-wa::before{content:"";width:18px;height:18px;background:url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%2325d366' d='M16 3a13 13 0 0 0-11.2 19.6L3 29l6.6-1.7A13 13 0 1 0 16 3z'/%3E%3C/svg%3E") center/contain no-repeat;flex-shrink:0}
.link-wa.on-light{color:#1b7a38}
.link-wa.on-light::before{background:url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%231b7a38' d='M16 3a13 13 0 0 0-11.2 19.6L3 29l6.6-1.7A13 13 0 1 0 16 3z'/%3E%3C/svg%3E") center/contain no-repeat}

/* === OFFERS CAROUSEL === */
.offers{position:relative;background:var(--ink-2)}
.offers-scroller{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.offers-scroller::-webkit-scrollbar{display:none}
.ocard{
  flex:0 0 100vw;height:84svh;
  scroll-snap-align:start;
  position:relative;overflow:hidden;
  display:flex;align-items:flex-end;
}
.ocard img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.ocard-shade{position:absolute;inset:0;background:linear-gradient(0deg,rgba(8,9,14,.96) 0%,rgba(8,9,14,.18) 50%,transparent 100%)}
.ocard-body{position:relative;z-index:2;padding:1.5rem var(--gut);padding-bottom:max(1.5rem,env(safe-area-inset-bottom,0px));width:100%}
.ocard-tag{font-size:.72rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.42);margin-bottom:.3rem}
.ocard-body h2{font-size:clamp(1.5rem,5vw,3rem);margin-bottom:.4rem}
.ocard-pct{display:flex;align-items:flex-end;gap:.7rem;margin-bottom:.7rem}
.ocard-pct b{
  font-family:var(--f-num);
  font-size:clamp(72px,15vw,112px);
  font-weight:700;
  color:var(--red);
  line-height:.85;
  letter-spacing:-.03em;
}
.ocard-pct span{font-size:.82rem;color:rgba(255,255,255,.62);line-height:1.5;padding-bottom:.5rem}
.ocard-facts{display:flex;flex-wrap:wrap;gap:.35rem .8rem;margin-bottom:.7rem}
.ocard-facts li{font-size:.82rem;color:rgba(255,255,255,.65)}
.ocard-facts li b{color:#fff}
.ocard-plans{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:1rem}
.plan-opt{padding:.3rem .7rem;border:1px solid rgba(255,255,255,.14);border-radius:6px;display:flex;flex-direction:column;gap:.1rem;background:rgba(255,255,255,.04)}
.plan-opt span{font-size:.66rem;color:rgba(255,255,255,.48)}
.plan-opt b{font-size:.78rem;font-weight:700}
.plan-opt.hi{border-color:rgba(200,16,46,.45);background:rgba(200,16,46,.1)}
.plan-opt.hi b{color:#ff7080}
.plan-opt.cash{border-color:rgba(37,211,102,.28);background:rgba(37,211,102,.07)}
.plan-opt.cash b{color:#25d366}
.offers-nav{display:flex;align-items:center;justify-content:center;gap:1rem;padding:1rem;background:var(--ink-2)}
.onav-btn{font-size:1.5rem;color:rgba(255,255,255,.38);padding:.3rem .8rem;border:1px solid rgba(255,255,255,.14);border-radius:6px;cursor:pointer;transition:color .2s,border-color .2s;line-height:1}
.onav-btn:hover{color:#fff;border-color:#fff}
html[lang="ar"] .onav-btn{transform:scaleX(-1)}
.onav-dots{display:flex;gap:.5rem}
.onav-dots li{width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.22);transition:background .3s,transform .3s}
.onav-dots li.on{background:#fff;transform:scale(1.35)}

/* === VILLAS (LIGHT) === */
.villas{padding:5rem 0;background:var(--paper);color:var(--ink);overflow:hidden}
.villas .eyebrow{color:var(--muted)}
.villas .sec-head h2{color:var(--ink)}
.vtabs-row{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:1.5rem;padding:0 var(--gut)}
.vtab{padding:.55rem 1.1rem;border:1px solid rgba(8,9,14,.16);border-radius:7px;font-weight:700;font-size:.85rem;cursor:pointer;color:rgba(8,9,14,.42);transition:all .2s}
.vtab.on{background:var(--ink);color:#fff;border-color:var(--ink)}
.villas-split{display:flex;flex-direction:column;gap:1.5rem}
.villas-img-wrap{position:relative;height:58vw;max-height:400px;overflow:hidden;border-radius:var(--r);margin:0 var(--gut)}
.vimg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .4s}
.vimg.on{opacity:1}
.villas-data{padding:0 var(--gut)}
.vgroup{display:none}
.vgroup.on{display:block}
.vgroup h3{font-size:1.3rem;margin-bottom:.4rem;color:var(--ink)}
.vdesc{font-size:.88rem;color:var(--muted);margin-bottom:1rem;line-height:1.55}
.vrows{display:flex;flex-direction:column;gap:.4rem;margin-bottom:1rem}
.vrows li{display:flex;flex-wrap:wrap;align-items:baseline;gap:.25rem .6rem;padding:.65rem .75rem;border:1px solid rgba(8,9,14,.08);border-radius:10px;background:#fff}
.vrows li b{font-weight:700;font-size:.9rem;color:var(--ink)}
.vrows li span{font-size:.75rem;color:var(--muted)}
.vrows li em{font-style:normal;font-weight:800;color:var(--red);margin-inline-start:auto}
.vcash-note{font-size:.8rem;color:var(--muted);line-height:1.5;margin-bottom:1rem;padding:.75rem 1rem;background:rgba(8,9,14,.04);border-radius:8px}

/* === LEGACY === */
.legacy{padding:4rem 0;background:var(--warm-dark)}
.legacy-line{font-size:clamp(1.1rem,3.5vw,1.9rem);font-weight:700;line-height:1.6;text-align:center;margin-bottom:3rem;color:#fff}
.legacy-line em{font-style:normal;color:var(--red)}
.counters{display:grid;grid-template-columns:1fr 1fr;gap:1rem;padding:0 var(--gut)}
.counters div{text-align:center;padding:1.75rem 1rem;border:1px solid rgba(255,255,255,.07);border-radius:var(--r);background:rgba(255,255,255,.03)}
.counters dd{font-family:var(--f-num);font-size:clamp(36px,7vw,68px);font-weight:700;color:var(--red);line-height:1;letter-spacing:-.02em}
.counters dt{font-size:.75rem;color:rgba(255,255,255,.42);margin-top:.5rem;line-height:1.4}

/* === BUILD === */
.build{background:var(--ink)}
.build-media{position:relative;height:78svh;overflow:hidden;display:flex;align-items:flex-end}
.build-media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.build-shade{position:absolute;inset:0;background:linear-gradient(0deg,rgba(8,9,14,.97) 0%,rgba(8,9,14,.1) 60%,transparent 100%)}
.build-copy{position:relative;z-index:2;padding:1.5rem var(--gut);width:100%}
.build-copy h2{margin-bottom:1rem}
.build-steps{counter-reset:step;display:flex;flex-direction:column;gap:.75rem}
.build-steps li{display:flex;gap:.75rem;align-items:flex-start;opacity:.38;transition:opacity .3s}
.build-steps li.on{opacity:1}
.build-steps li::before{counter-increment:step;content:counter(step,decimal-leading-zero);font-family:var(--f-num);font-size:.72rem;font-weight:600;color:var(--red);flex-shrink:0;padding-top:.15rem;width:1.8rem}
.build-steps li b{font-size:.92rem;font-weight:700;display:block;margin-bottom:.15rem}
.build-steps li span{font-size:.8rem;color:rgba(255,255,255,.52);line-height:1.45}
.build-rail{display:none}
.proof{background:rgba(255,255,255,.04);padding:2.5rem 0}
.proof-inner{display:flex;flex-direction:column;gap:1.5rem}
.proof-big{display:flex;flex-direction:column;gap:.25rem;padding-bottom:1.25rem;border-bottom:1px solid rgba(255,255,255,.07)}
.proof-big b{font-family:var(--f-num);font-size:clamp(40px,9vw,80px);font-weight:700;color:var(--red);line-height:1;letter-spacing:-.02em}
.proof-big span{font-size:.9rem;color:rgba(255,255,255,.68)}
.proof-names{font-family:var(--f-script);font-style:italic;font-size:.8rem;color:rgba(255,255,255,.32);display:block;margin-top:.25rem}
.proof-stats{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}
.proof-stats div{padding:.75rem;border:1px solid rgba(255,255,255,.07);border-radius:10px}
.proof-stats b{display:block;font-family:var(--f-num);font-size:1.6rem;font-weight:700;color:#fff;letter-spacing:-.01em}
.proof-stats span{font-size:.72rem;color:rgba(255,255,255,.42);margin-top:.15rem;display:block}
.proof-src{font-size:.7rem;color:rgba(255,255,255,.24);padding-top:.5rem}

/* === ETAJ COMMERCIAL (LIGHT) === */
.etaj-com{padding:5rem 0;background:var(--paper);color:var(--ink)}
.etaj-com .eyebrow{color:var(--muted)}
.ec-head{margin-bottom:2rem}
.ec-head h2{margin-bottom:.6rem;color:var(--ink)}
.ec-sub{font-size:.9rem;color:var(--muted);max-width:580px;line-height:1.6}
.ec-grid{display:flex;flex-direction:column;gap:.75rem;margin-bottom:1.25rem}
.ec-card{padding:1.5rem;border:1px solid rgba(8,9,14,.09);border-radius:var(--r);background:#fff;box-shadow:0 2px 14px rgba(8,9,14,.06)}
.ec-card-main{border-color:rgba(200,16,46,.22);background:#fff1f3;box-shadow:0 2px 20px rgba(200,16,46,.1)}
.ec-type{font-size:.72rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:.5rem}
.ec-price{display:block;font-family:var(--f-num);font-size:clamp(1.8rem,5vw,2.8rem);font-weight:700;line-height:1;margin-bottom:.2rem;color:var(--ink);letter-spacing:-.02em}
.ec-card-main .ec-price{color:var(--red)}
.ec-unit{font-size:.8rem;color:var(--muted);display:block;margin-bottom:.4rem}
.ec-from{font-size:.82rem;color:var(--ink);font-weight:600}
.ec-plan{text-align:center;font-size:.85rem;color:var(--muted);padding:.75rem;border:1px solid rgba(8,9,14,.09);border-radius:8px;margin-bottom:1.25rem;background:#fff}
.ec-plan b{color:var(--ink)}
.ec-features{display:flex;flex-direction:column;gap:.55rem;margin-bottom:2rem}
.ec-features li{font-size:.85rem;color:var(--muted);padding-inline-start:1rem;position:relative;line-height:1.5}
.ec-features li::before{content:"·";position:absolute;inset-inline-start:0;color:var(--red)}

/* === PROJECTS DECK === */
.projects{padding:4rem 0;background:var(--ink-2);overflow:hidden}
.deck-head{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;margin-bottom:1.5rem}
.deck-head h2{margin-bottom:0}
.deck-ctrl{display:flex;flex-direction:column;align-items:flex-end;gap:.5rem}
.deck-count{font-size:.75rem;color:rgba(255,255,255,.32);display:flex;align-items:center;gap:.5rem}
.deck-count b{font-family:var(--f-num);font-size:1.1rem;font-weight:600;color:#fff}
.deck-dots{display:flex;gap:.35rem}
.deck-dots li{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.2);transition:background .3s}
.deck-dots li.on{background:#fff}
.deck-arrows{display:flex;gap:.5rem}
.deck-btn{font-size:1.3rem;padding:.3rem .7rem;border:1px solid rgba(255,255,255,.14);border-radius:6px;cursor:pointer;color:rgba(255,255,255,.38);transition:all .2s;line-height:1}
.deck-btn:hover{color:#fff;border-color:#fff}
.deck-track{display:flex;gap:1rem;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding:0 var(--gut)}
.deck-track::-webkit-scrollbar{display:none}
.dcard{flex:0 0 84vw;max-width:320px;scroll-snap-align:start;border:1px solid rgba(255,255,255,.08);border-radius:var(--r);overflow:hidden;background:rgba(255,255,255,.04)}
.dcard figure{height:48vw;max-height:220px;overflow:hidden}
.dcard figure img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.dcard:hover figure img{transform:scale(1.05)}
.dcard-body{padding:1.25rem}
.dcard-n{font-family:var(--f-num);font-size:.85rem;font-weight:600;color:rgba(255,255,255,.28);margin-bottom:.2rem}
.proj-place{font-size:.72rem;color:rgba(255,255,255,.32);margin-bottom:.3rem}
.dcard-body h3{margin-bottom:.5rem}
.dcard-offer{display:flex;align-items:baseline;gap:.5rem;margin-bottom:.75rem}
.dcard-offer b{font-family:var(--f-num);font-size:1.5rem;font-weight:700;color:var(--red)}
.dcard-offer span{font-size:.78rem;color:rgba(255,255,255,.42)}
.dcard-body p{font-size:.83rem;color:rgba(255,255,255,.52);line-height:1.55;margin-bottom:.75rem}
.chips{display:flex;flex-wrap:wrap;gap:.35rem;margin-bottom:.75rem}
.chips li{font-size:.72rem;padding:.25rem .55rem;border:1px solid rgba(255,255,255,.12);border-radius:5px;color:rgba(255,255,255,.52)}

/* === BUSINESS === */
.business{padding:4rem 0;background:var(--ink-2)}
.biz-pin{display:flex;flex-direction:column;gap:1.5rem}
.biz-imgs{position:relative;height:38svh;overflow:hidden;margin:0 var(--gut);border-radius:var(--r)}
.bimg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .5s}
.bimg.on{opacity:1}
.biz-text{padding:0 var(--gut)}
.biz-text h2{margin-bottom:1rem}
.biz-list{display:flex;flex-direction:column;gap:.6rem;margin-bottom:1.5rem}
.biz-list li{padding:.75rem 1rem;border:1px solid rgba(255,255,255,.07);border-radius:12px;background:rgba(255,255,255,.03);cursor:pointer;transition:border-color .3s,background .3s}
.biz-list li.on{border-color:rgba(200,16,46,.32);background:rgba(200,16,46,.06)}
.biz-list li b{display:block;font-size:.92rem;font-weight:700;margin-bottom:.2rem}
.biz-where{display:block;font-size:.7rem;color:rgba(255,255,255,.32);margin-bottom:.3rem}
.biz-list li span:last-child{font-size:.82rem;color:rgba(255,255,255,.48);line-height:1.5}

/* === LOCATION === */
.location{padding:5rem 0;background:var(--ink)}
.loc-grid{display:flex;flex-direction:column;gap:2rem}
.loc-text h2{margin-bottom:1rem}
.loc-list{display:flex;flex-direction:column;gap:.6rem;margin-bottom:1.5rem}
.loc-list li{padding:.75rem 1rem .75rem calc(1rem + 2px);border-inline-start:2px solid var(--red);background:rgba(255,255,255,.03);border-radius:0 8px 8px 0}
.loc-list li b{display:block;font-size:.92rem;font-weight:700;margin-bottom:.2rem}
.loc-list li span{font-size:.82rem;color:rgba(255,255,255,.48);line-height:1.5}
.corridor svg{width:100%;height:auto;display:block;border-radius:12px;background:rgba(255,255,255,.04);overflow:visible}
.corridor figcaption{font-size:.68rem;color:rgba(255,255,255,.24);margin-top:.5rem;text-align:center}
.rd{stroke-dasharray:600;stroke-dashoffset:600;animation:drawRoad 1.5s ease forwards}
.rd-ring{animation-delay:.1s}
.rd-ism{animation-delay:.3s}
.rd-suez{animation-delay:.5s}
.rd-amal{animation-delay:.8s}
@keyframes drawRoad{to{stroke-dashoffset:0}}
.pin .ring{fill:rgba(200,16,46,.15);stroke:var(--red);stroke-width:1.5;animation:pulse 2s ease-in-out infinite}
@keyframes pulse{0%,100%{r:30;opacity:1}50%{r:36;opacity:.4}}

/* === CONTACT === */
.contact{position:relative;padding:5rem 0;overflow:hidden;background:var(--ink)}
.contact-bg{position:absolute;inset:0}
.contact-bg img{width:100%;height:100%;object-fit:cover;opacity:.14}
.contact-grid{position:relative;z-index:2;display:flex;flex-direction:column;gap:2rem}
.contact-copy h2{margin-bottom:.75rem}
.contact-copy p{font-size:.9rem;color:rgba(255,255,255,.58);line-height:1.6}
.form{display:flex;flex-direction:column;gap:.65rem;background:rgba(8,9,14,.87);backdrop-filter:blur(16px);padding:1.5rem;border-radius:var(--r);border:1px solid rgba(255,255,255,.09)}
.form label{font-size:.78rem;font-weight:700;color:rgba(255,255,255,.52)}
.form input,.form select{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.1);border-radius:8px;padding:.65rem .9rem;font-size:.9rem;color:#fff;width:100%}
.form input:focus,.form select:focus{border-color:rgba(255,255,255,.32);outline:none}
.form select option{background:#0e111a;color:#fff}
.phone{display:flex;align-items:stretch;border:1px solid rgba(255,255,255,.1);border-radius:8px;overflow:hidden;background:rgba(255,255,255,.07);direction:ltr;max-width:100%}
.phone:focus-within{border-color:rgba(255,255,255,.32)}
.phone span{display:flex;align-items:center;padding:.65rem .8rem;background:rgba(255,255,255,.06);border-inline-end:1px solid rgba(255,255,255,.08);font-size:.85rem;color:rgba(255,255,255,.55);white-space:nowrap;flex-shrink:0}
.phone input{flex:1;border:none;background:transparent;padding:.65rem .8rem;font-size:.9rem;color:#fff;min-width:0;width:auto}
.form .phone input,.wagate-card .phone input,#promoForm .phone input{border:none!important;background:transparent!important;width:auto!important;border-radius:0!important;padding:.65rem .8rem!important}
.phone .phone-code{border:none;border-inline-end:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.05);color:rgba(255,255,255,.75);font-size:.8rem;font-family:var(--f-num);font-weight:600;padding:.65rem .5rem;flex-shrink:0;cursor:pointer;min-width:58px;border-radius:0;width:auto}
.phone .phone-code:focus{outline:none}
.phone .phone-code option{background:#0e111a;color:#fff}
.form .btn{width:100%;justify-content:center;margin-top:.35rem}
.types{border:none;padding:0}
.types legend{font-size:.78rem;font-weight:700;color:rgba(255,255,255,.52);margin-bottom:.4rem}
.types>div,.types{display:flex;flex-wrap:wrap;gap:.5rem}
.types label{display:flex;align-items:center;gap:.35rem;padding:.4rem .75rem;border:1px solid rgba(255,255,255,.11);border-radius:6px;cursor:pointer;font-size:.82rem;transition:all .2s}
.types input[type=radio]{accent-color:var(--red);width:14px;height:14px}
.types input[type=radio]:checked~span{font-weight:700}
.form-err{font-size:.78rem;color:#ff6b80;padding:.4rem 0}

/* === FOOTER === */
.foot{padding:2rem 0;background:var(--ink-2);border-top:1px solid rgba(255,255,255,.06)}
.foot-in{display:flex;justify-content:center}

/* === WA GATE === */
.wagate{position:fixed;inset:0;z-index:200;background:rgba(0,0,0,.68);backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;padding:var(--gut)}
.wagate[hidden]{display:none}
.wagate-card{background:#13161e;border:1px solid rgba(255,255,255,.09);border-radius:18px;padding:1.75rem;max-width:380px;width:100%;position:relative}
.wagate-x{position:absolute;top:.75rem;inset-inline-end:.75rem;font-size:1.4rem;color:rgba(255,255,255,.32);cursor:pointer;transition:color .2s;padding:.25rem .5rem}
.wagate-x:hover{color:#fff}
.wagate-card h3{font-size:1.2rem;margin-bottom:.4rem}
.wagate-card p{font-size:.85rem;color:rgba(255,255,255,.48);margin-bottom:1rem}
.wagate-card label{font-size:.78rem;font-weight:700;color:rgba(255,255,255,.52);display:block;margin-bottom:.3rem;margin-top:.75rem}
.wagate-card input,.wagate-card select{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.1);border-radius:8px;padding:.65rem .9rem;font-size:.9rem;color:#fff;width:100%}
.wagate-card input:focus,.wagate-card select:focus{border-color:rgba(255,255,255,.32)}
.wagate-card select option{background:#0e111a;color:#fff}
.wagate-card .types label{display:flex;margin:0}
.wagate-card .btn{width:100%;justify-content:center;margin-top:.9rem}
.types label[hidden]{display:none}
.gate-done{text-align:center;padding:1.5rem 0}
.gate-done-icon{font-size:2.5rem;line-height:1;margin-bottom:.5rem}
.gate-done-title{font-size:1.2rem;font-weight:800;margin-bottom:.35rem}
.gate-done-sub{font-size:.85rem;color:rgba(255,255,255,.48)}

/* === PROMO POPUP === */
.promo-overlay{position:fixed;inset:0;z-index:200;background:rgba(0,0,0,.78);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;padding:var(--gut)}
.promo-overlay[hidden]{display:none}
.promo-card{background:#0d1019;border:1px solid rgba(255,255,255,.08);border-radius:24px;overflow:hidden;max-width:860px;width:100%;max-height:92svh;display:flex;flex-direction:column}
.promo-img-side{position:relative;height:46vw;min-height:220px;max-height:300px;overflow:hidden;flex-shrink:0}
.promo-img-side img{width:100%;height:100%;object-fit:cover}
.promo-img-copy{position:absolute;inset:0;background:linear-gradient(0deg,rgba(6,7,12,.9) 0%,rgba(6,7,12,.08) 60%);display:flex;flex-direction:column;justify-content:flex-end;padding:1.5rem}
.promo-tag{font-size:.65rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.5);margin-bottom:.4rem}
.promo-img-copy h2{font-size:clamp(1.1rem,4.5vw,2rem);line-height:1.25}
.promo-form-side{padding:1.75rem;position:relative;overflow-y:auto}
.promo-x{position:absolute;top:.875rem;inset-inline-end:.875rem;font-size:1.5rem;line-height:1;color:rgba(255,255,255,.3);cursor:pointer;padding:.25rem .5rem;border-radius:6px;transition:color .2s,background .2s;z-index:1}
.promo-x:hover{color:#fff;background:rgba(255,255,255,.08)}
#promoForm{display:flex;flex-direction:column;gap:.9rem}
#promoForm label{font-size:.78rem;font-weight:700;color:rgba(255,255,255,.5);margin-bottom:-.25rem}
#promoForm input:not(.phone-code):not([type=radio]),#promoForm select:not(.phone-code){background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);border-radius:10px;padding:.72rem 1rem;font-size:.9rem;color:#fff;width:100%}
#promoForm input:not(.phone-code):not([type=radio]):focus,#promoForm select:not(.phone-code):focus{border-color:rgba(255,255,255,.3);outline:none}
#promoForm select option{background:#0e111a;color:#fff}
#promoForm .types{display:flex;flex-direction:column;gap:.45rem;border:none;padding:0;margin:0}
#promoForm .types legend{font-size:.78rem;font-weight:700;color:rgba(255,255,255,.5);float:none;margin-bottom:.1rem}
#promoForm .types-grid{display:grid;grid-template-columns:1fr 1fr;gap:.4rem}
#promoForm .types label{display:flex;align-items:center;gap:.5rem;padding:.5rem .8rem;border:1px solid rgba(255,255,255,.1);border-radius:8px;cursor:pointer;transition:border-color .15s,background .15s;margin:0;font-size:.82rem;font-weight:500;color:rgba(255,255,255,.75)}
#promoForm .types label:has(input:checked){border-color:rgba(37,211,102,.5);background:rgba(37,211,102,.07)}
#promoForm .types input[type=radio]{width:14px;height:14px;flex-shrink:0;accent-color:#25d366}
#promoForm .btn{justify-content:center;margin-top:.2rem;gap:.6rem;font-size:.95rem;padding:.85rem 1.25rem}
.promo-skip-link{display:block;text-align:center;font-size:.78rem;color:rgba(255,255,255,.22);margin-top:.65rem;cursor:pointer;text-decoration:underline}
.promo-skip-link:hover{color:rgba(255,255,255,.45)}

/* === FAB === */
.fab{
  position:fixed;
  bottom:max(20px,env(safe-area-inset-bottom,20px));
  inset-inline-end:max(20px,env(safe-area-inset-right,20px));
  z-index:90;width:52px;height:52px;border-radius:50%;
  background:#25d366;color:#fff;display:flex;align-items:center;justify-content:center;
  box-shadow:0 4px 20px rgba(37,211,102,.4);
  transition:transform .3s,opacity .3s;
}
.fab svg{width:26px;height:26px}
.fab.hidden{transform:scale(0);opacity:0;pointer-events:none}

/* === DESKTOP === */
@media(min-width:861px){
  :root{--navh:70px;--gut:max(40px,env(safe-area-inset-left,0px))}

  .nav-links{display:flex;gap:1.5rem;align-items:center;margin-inline-start:auto}
  .nav-links a{font-size:.85rem;font-weight:600;color:rgba(255,255,255,.58);transition:color .2s}
  .nav-links a:hover{color:#fff}
  .lang{margin-inline-start:0}
  .wa-round{display:none}

  .hero{min-height:100svh}
  .hero-copy{max-width:700px}
  .hero-pills a b{font-size:2rem}

  .ocard{flex:0 0 100vw;height:100svh}
  .ocard-body{padding:3rem var(--gut);max-width:640px}
  .ocard-body h2{font-size:3.5rem}
  .ocard-pct b{font-size:clamp(100px,14vw,144px)}

  .villas{padding:8rem 0}
  .vtabs-row{padding:0;justify-content:flex-start;margin-bottom:2rem}
  .vtab{padding:.65rem 1.4rem;font-size:.92rem}
  .villas-split{flex-direction:row;gap:3rem;align-items:flex-start}
  .villas-img-wrap{flex:1;height:75vh;max-height:none;position:sticky;top:var(--navh);border-radius:var(--r);margin:0}
  .villas-data{flex:1;padding:0}

  .legacy{padding:6rem 0}
  .counters{grid-template-columns:repeat(4,1fr);gap:1.5rem}

  .build-media{height:100svh}
  .build-rail{display:block;position:absolute;inset-inline-start:var(--gut);bottom:3rem;top:var(--navh);width:2px;background:rgba(255,255,255,.08);z-index:2}
  .build-rail span{display:block;height:0%;background:var(--red);transition:height .1s}
  .build-copy{max-width:540px}

  .proof-inner{flex-direction:row;gap:3rem;align-items:flex-start}
  .proof-big{border-bottom:none;padding-bottom:0;border-inline-end:1px solid rgba(255,255,255,.07);padding-inline-end:3rem;flex:1}
  .proof-stats{flex:2;grid-template-columns:repeat(3,1fr)}

  .ec-grid{flex-direction:row;gap:1rem}
  .ec-card{flex:1}
  .ec-head h2{font-size:3rem}

  .deck-track{padding:0 var(--gut)}
  .dcard{flex:0 0 380px;max-width:none}
  .dcard figure{height:260px;max-height:none}

  .biz-pin{flex-direction:row;align-items:stretch;min-height:100svh}
  .biz-imgs{flex:1;height:auto;min-height:100svh;margin:0;border-radius:0;position:sticky;top:0}
  .biz-text{flex:1;padding:6rem var(--gut);display:flex;flex-direction:column;justify-content:center}
  .biz-list li{padding:1.25rem 1rem}

  .loc-grid{flex-direction:row;align-items:center;gap:4rem}
  .loc-text{flex:1}
  .corridor{flex:1.3}

  .contact-grid{flex-direction:row;align-items:flex-start;gap:4rem}
  .contact-copy,.form{flex:1}
  .form{padding:2rem}

  .promo-card{flex-direction:row;max-height:600px}
  .promo-img-side{flex:0 0 44%;height:auto;min-height:0;max-height:none}
  .promo-form-side{flex:1;display:flex;flex-direction:column;justify-content:center;padding:2rem 2.25rem;overflow-y:auto}
  #promoForm{gap:1rem}
}
