/* ===== theme.css : أسلوب مستوحى من موقع عروبة، بأخضر أهل البلد =====
   يُحمَّل بعد styles.css ويعدّل المظهر فقط. لإلغائه احذف رابطه من الصفحتين. */
:root{--g:#075a50;--gd:#06463f;--c1:#f3eee2;--c2:#f2f1ee;--sand:#d4cab4;--sand-d:#a89c7e;--tx:#1d2421;--mu:#5d6662;--ln:rgba(7,90,80,.16);--r:0;--cut:22px}
body{background:var(--c2);color:var(--tx)}
h1,h2,h3{font-weight:500;letter-spacing:0}
/* الزاوية المقطوعة (علامة عروبة) */
.btn,.card,.project-visual,.fr img,.card .ph,.contact-card,.near div,.sg div,.gl div,.sp li:first-child{--c:var(--cut)}
.btn{border-radius:0;clip-path:polygon(0 0,calc(100% - 14px) 0,100% 14px,100% 100%,0 100%);padding:13px 30px;border-width:1px;letter-spacing:0}
.btn.pri{background:var(--sand);border-color:var(--sand);color:var(--gd)}
.btn.pri:hover{background:#e3dac6}
.btn.out{border-color:rgba(255,255,255,.7);color:#fff}
.btn.fill{background:var(--g);border-color:var(--g)}
.btn.dk,.btn.ghost{border-color:var(--g);color:var(--g);clip-path:none}
.fr img,.card .ph,.project-visual{clip-path:polygon(0 0,calc(100% - var(--cut)) 0,100% var(--cut),100% 100%,0 100%);border-radius:0}
.fr::after{display:none}
.card,.project-feature,.contact-card{border-radius:0;border:0;box-shadow:none}
/* الهيدر: شريط خفيف + قائمة جانبية دائمة */
header{padding:0;height:76px;display:flex;align-items:center}
header.s{background:rgba(242,241,238,.97);box-shadow:0 1px 0 var(--ln);padding:0}
.nav{width:min(1280px,94%)}
header .logos img,header .corp-logo img{height:38px;width:auto}
header.s .logos img:first-child,header.s .corp-logo img{content:url(assets/logo/ahl-albalad-green.png)}
header.s .logos img:last-child{content:url(assets/logo/biout-wasl-green.png)}
header.s .logos i{background:var(--ln)}
header.s .menu{color:var(--g)}
header .btn{margin-inline-start:auto;min-height:42px;padding:9px 22px;font-size:15px;background:transparent;color:#fff;border:1px solid rgba(255,255,255,.7)}
header.s .btn{color:var(--g);border-color:var(--g)}
.menu{display:block!important;margin-inline-start:0!important;z-index:70;order:3}
.nav .btn{display:inline-flex!important}
nav{position:static}
nav ul{position:fixed;inset:0 0 0 auto;top:0;bottom:0;left:auto;right:0;width:min(400px,100%);height:100vh;height:100dvh;flex-direction:column;justify-content:center;align-items:flex-start;background:var(--gd);padding:90px 44px 40px;gap:6px;opacity:0;visibility:hidden;transition:opacity .35s ease,visibility 0s .35s;margin:0;z-index:60;box-shadow:-20px 0 60px rgba(0,0,0,.25)}
nav ul.o{opacity:1;visibility:visible;transition:opacity .35s ease,visibility 0s}
nav ul a{display:block;color:#fff;font:500 22px 'Noto Kufi Arabic',sans-serif;padding:11px 0;border-bottom:1px solid rgba(212,202,180,.18);width:100%;opacity:1}
nav ul a:hover{color:var(--sand)}
/* الواجهة */
.hero::before{background:linear-gradient(0deg,rgba(4,38,33,.9) 0%,rgba(4,38,33,.35) 48%,rgba(4,38,33,.55) 100%)!important}
.hero h1{font-weight:500;font-size:clamp(46px,8vw,92px)}
.hero-kicker,.hero h1+p{color:var(--sand)}
.hero small,.chips{color:var(--sand)}
/* عناوين الأقسام */
.eyebrow{display:inline-block;color:var(--sand-d);font:500 15px 'Noto Kufi Arabic',sans-serif;padding-bottom:6px;border-bottom:1px solid var(--sand-d);margin-bottom:16px}
section h2{font-size:clamp(30px,4.4vw,52px);margin-bottom:22px;position:relative}
.lead,.about p,.des p{color:var(--mu)}
/* ألوان الأقسام: كريمي ورمادي دافئ بالتناوب */
#about,.corp-about{background:var(--c2)}
.projects-sec,#units{background:var(--c1)}
.loc{background:var(--c2)}
.gal{background:var(--c1)}
section.gu{background:var(--gd);color:#fff}
.gu h2,.gu h3{color:#fff}.gu .lead{color:#dde4de}.gu .eyebrow{color:var(--sand);border-color:var(--sand)}
.adapt{background:var(--c1);color:var(--tx)}.adapt h2{color:var(--g)}.adapt .lead{color:var(--mu)}
.adapt h2::after,.gu h2::after{content:"";display:block;width:90px;height:1px;background:var(--sand-d);margin:18px auto 0}
.adapt .wrap{text-align:center}
/* بطاقات الوحدات: صورة + جسم رملي */
.card{background:#fff}
.cb{background:var(--sand)}
.card .sub,.cb .vn{color:#4b4a42}
.card .area{color:var(--g)}
.sp li{border-color:rgba(7,90,80,.2)}
.vt button{border-radius:0;background:rgba(255,255,255,.55)}.vt button.on{background:var(--g)}
.plans button{background:var(--c2);border-color:rgba(7,90,80,.18);border-radius:0}
/* المواصفات والشركاء على الأخضر الداكن */
.sg div{background:rgba(255,255,255,.04);border:1px solid rgba(212,202,180,.22);color:#dde4de;border-radius:0;clip-path:polygon(0 0,calc(100% - 18px) 0,100% 18px,100% 100%,0 100%)}
.sg b{color:#fff}.sg svg{stroke:var(--sand)}
.gl div{background:var(--c2);border:0;border-radius:0}
.gl b{color:var(--g)}
.near div{background:#fff;border-radius:0;border-inline-start:3px solid var(--sand-d)}
.map{border-radius:0;clip-path:polygon(0 0,calc(100% - 26px) 0,100% 26px,100% 100%,0 100%)}
/* قسم النهج: أخضر داكن */
#approach{background:var(--gd);color:#fff;text-align:center}
#approach h2{color:#fff}#approach .eyebrow{color:var(--sand);border-color:var(--sand)}
.approach-grid>div{background:rgba(255,255,255,.04);border:1px solid rgba(212,202,180,.2);border-radius:0;text-align:start;clip-path:polygon(0 0,calc(100% - 20px) 0,100% 20px,100% 100%,0 100%)}
.approach-grid svg{stroke:var(--sand);color:var(--sand)}.approach-grid h3{color:#fff}.approach-grid p{color:#cfd8d2}
/* مشروع مميز */
.project-feature{background:var(--sand)}.project-copy{background:var(--sand)}
.project-facts span{color:#4b4a42}.project-facts b{color:var(--g)}
/* دعوة للتواصل / التسجيل */
.corp-contact,.fm{background:linear-gradient(rgba(4,38,33,.86),rgba(4,38,33,.9)),url(assets/images/facade-front-2.webp) center/cover}
.contact-card{background:transparent;color:#fff}.contact-card h2{color:#fff}
/* التذييل: فاتح */
footer{background:var(--c2);color:var(--tx);border-top:1px solid var(--ln)}
footer h4{color:var(--g)}footer a{color:var(--tx)}footer a:hover{color:var(--g)}
footer img{content:url(assets/logo/ahl-albalad-green.png)}
footer img[alt*="بيوت"]{content:url(assets/logo/biout-wasl-green.png)}
.cp{border-color:var(--ln);color:var(--mu)}.cp button{color:var(--mu)}.disc{color:var(--mu)}
form{border-radius:0;clip-path:polygon(0 0,calc(100% - 24px) 0,100% 24px,100% 100%,0 100%)}
input,select,textarea{border-radius:0}
.wa{background:#1f8f55}
@media(max-width:560px){header{height:68px}header .btn{display:none!important}.menu{margin-inline-start:auto!important}nav ul{padding:84px 28px 30px}nav ul a{font-size:20px}}
/* إصلاح: صور الشبكة كانت توسّع الصفحة أفقيًا بعد التحميل */
.ug>*,.lg>*,.about>*,.des>*,.fw>*,.co>*,.gg>*{min-width:0}
figure img{max-width:100%;height:auto}
.about .fr img{max-height:520px;object-fit:cover;width:100%}
/* ===== خط Doran =====
   Doran خط تجاري غير متوفر في Google Fonts. ضع ملفاته في assets/fonts/ ثم فعّل السطور التالية (احذف علامتي التعليق):
@font-face{font-family:'Doran';src:url(assets/fonts/Doran-Regular.woff2) format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Doran';src:url(assets/fonts/Doran-Medium.woff2) format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:'Doran';src:url(assets/fonts/Doran-Bold.woff2) format('woff2');font-weight:700;font-display:swap}
*/
:root{--fh:'Doran','Noto Kufi Arabic','IBM Plex Sans Arabic',Tahoma,sans-serif;--fb:'Doran','IBM Plex Sans Arabic',Tahoma,sans-serif}
body,input,select,textarea,button{font-family:var(--fb)}
h1,h2,h3,h4,.eyebrow,.area,.vt button,nav ul a,.btn{font-family:var(--fh)}
/* مرر للاستكشاف */
.hero{position:relative}
.scroll{position:absolute;z-index:3;left:50%;bottom:22px;transform:translateX(-50%);color:var(--sand);font-size:14px;text-decoration:none;display:flex;flex-direction:column;align-items:center;gap:4px}
.scroll::after{content:"";width:1px;height:26px;background:var(--sand);animation:sc 1.8s ease-in-out infinite}
@keyframes sc{0%,100%{transform:scaleY(.4);transform-origin:top}50%{transform:scaleY(1)}}
@media(prefers-reduced-motion:reduce){.scroll::after{animation:none}}
@media(max-width:560px){.scroll{display:none}}
/* مميزات المشروع بأيقونات الكتيب */
.feat-sec{background:var(--gd);color:#fff}
.feat-sec h2{color:#fff}.feat-sec .eyebrow{color:var(--sand);border-color:var(--sand)}
.feat-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;margin-top:34px;border-top:1px solid rgba(212,202,180,.22)}
.feat-grid div{padding:30px 16px;text-align:center;border-bottom:1px solid rgba(212,202,180,.22);border-inline-start:1px solid rgba(212,202,180,.22)}
.feat-grid div:nth-child(4n+1){border-inline-start:0}
.feat-grid img,.feat-grid svg{height:56px;width:56px;object-fit:contain;margin:0 auto 14px}
.feat-grid svg{display:block;fill:none;stroke:var(--sand);stroke-width:1.55;stroke-linecap:round;stroke-linejoin:round}
.feat-grid b{display:block;font:500 17px var(--fh);color:#fff}.feat-grid span{font-size:14px;color:#cfd8d2}
@media(max-width:860px){.feat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.feat-grid div:nth-child(4n+1){border-inline-start:1px solid rgba(212,202,180,.22)}.feat-grid div:nth-child(odd){border-inline-start:0}}
/* بطاقة الوحدة: المخطط في الأعلى مثل بطاقة مشروع عروبة */
.card{clip-path:polygon(0 0,calc(100% - 26px) 0,100% 26px,100% 100%,0 100%)}
.cb{padding-top:0;gap:14px}
.cb>.plans{order:-3;margin:0 -28px;display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:2px;background:#fffde3}
.cb>.vt{order:-2;margin-top:18px}.cb>.vn{order:-1}
.plans button{border:0;background:#fffde3;padding:10px 10px 6px}
.plans img{height:auto;aspect-ratio:3/2;object-fit:contain;width:100%}
.plans span{font-size:13px;color:var(--mu)}
/* صورة «عن المشروع» بإطار مزاح مثل عروبة */
.fr{isolation:isolate}
@media(min-width:561px){.fr::after{display:block;content:"";position:absolute;inset:-14px 14px 14px -14px;border:1px solid var(--sand-d);z-index:-1}}
.fr img,.about .fr img{aspect-ratio:4/3;max-height:none;object-fit:cover}
.cb>.plans[hidden],.plans[hidden]{display:none!important}

/* ===== تنقية الأشكال: بدون قصّات زوايا أو ستروكات ===== */
.btn,.card,.project-feature,.project-visual,.fr img,.sg div,.approach-grid>div,.map,form{
  clip-path:none!important;
  border:0!important;
  border-radius:0!important;
}
.btn,.btn.out,.btn.dk,.btn.ghost,header .btn{border:0!important}
.btn.out{background:rgba(255,255,255,.13)}
.btn.dk,.btn.ghost{background:rgba(7,90,80,.08)}
header .btn{background:rgba(255,255,255,.1)}
header.s .btn{background:rgba(7,90,80,.07)}
.fr::after{display:none!important}
.sg{gap:12px}
.sg div{background:rgba(255,255,255,.055)}
.approach-grid>div{background:rgba(255,255,255,.055)}
.feat-grid{gap:10px;border:0!important}
.feat-grid div{border:0!important;background:rgba(255,255,255,.045)}
.sp{gap:8px;border:0!important}
.sp li,.sp li+li,.sp li:nth-child(n+4){border:0!important;background:rgba(255,255,255,.45)}
.near{gap:12px;border:0!important}
.near div,.near div+div{border:0!important;background:#fff}
.gl{gap:12px;border:0!important}
.gl div,.gl div+div{border:0!important}

/* ===== عن المشروع: عنوان علوي ثم صورة يمين ونص يسار ===== */
.about-editorial{display:block}
.about-intro{max-width:850px;margin:0 auto clamp(54px,7vw,94px);text-align:center}
.about-intro h2{font-size:clamp(38px,5.2vw,70px);line-height:1.42;margin:4px 0 18px;color:var(--g)}
.about-intro p{max-width:650px;margin-inline:auto;font-size:clamp(17px,1.55vw,20px);line-height:2;color:var(--mu)}
.about-story{display:grid;grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr);grid-template-areas:"copy image";gap:clamp(44px,7vw,112px);align-items:center;direction:ltr}
.about-media{grid-area:image;direction:rtl;margin:0}
.about-media img,.about .about-media img{display:block;width:100%;aspect-ratio:4/4.35;object-fit:cover;object-position:center;border:0}
.about-detail{grid-area:copy;direction:rtl;text-align:right}
.about-detail h3{font-size:clamp(30px,3.2vw,46px);line-height:1.5;margin:4px 0 22px;color:var(--tx)}
.about-detail>p{font-size:17px;line-height:2.15;color:var(--mu);max-width:39ch}
.about-detail .dev{margin-top:24px;color:var(--g);font-weight:600}
.about-detail .facts{border:0;gap:10px;margin-top:30px}
.about-detail .facts div,.about-detail .facts div:first-child{border:0;padding:15px 12px;background:rgba(7,90,80,.045)}

/* ===== رسالة ترحيب الصفحة الرئيسية ===== */
.hero-welcome{position:absolute;z-index:12;left:max(28px,calc((100vw - 1240px)/2));bottom:34px;width:min(390px,calc(100vw - 56px));padding:28px 28px 24px;background:rgba(4,38,33,.94);color:#fff;box-shadow:0 22px 60px rgba(0,0,0,.24);direction:rtl;text-align:right;opacity:0;visibility:hidden;transform:translateY(22px);transition:opacity .45s ease,transform .45s ease,visibility .45s}
.hero-welcome.show{opacity:1;visibility:visible;transform:translateY(0)}
.hero-welcome[hidden]{display:block}
.hero-welcome-close{position:absolute;top:14px;left:14px;width:34px;height:34px;display:grid;place-items:center;border:0;background:rgba(255,255,255,.08);color:#fff;cursor:pointer}
.hero-welcome-kicker{font:500 14px var(--fh);color:var(--sand);margin-bottom:8px}
.hero-welcome h2{font-size:30px;line-height:1.45;color:#fff;margin:0 0 12px}
.hero-welcome p{font-size:15px;line-height:1.9;color:#e3e8e4;margin:0 0 20px;max-width:32ch}
.hero-welcome-link{min-height:48px;display:flex;align-items:center;justify-content:center;background:var(--sand);color:var(--gd);font:600 15px var(--fh);text-decoration:none;padding:12px 20px}
.welcome-open .wa{opacity:0;pointer-events:none}

@media(max-width:860px){
  .about-story{grid-template-columns:1fr;grid-template-areas:"image" "copy";gap:34px}
  .about-media img,.about .about-media img{aspect-ratio:16/10}
  .about-detail>p{max-width:52ch}
}
@media(max-width:560px){
  .about-intro{margin-bottom:36px;text-align:right}
  .about-intro h2{font-size:clamp(32px,9.5vw,42px);line-height:1.55}
  .about-intro p{font-size:16px;line-height:1.9}
  .about-story{gap:26px}
  .about-media img,.about .about-media img{aspect-ratio:4/3}
  .about-detail h3{font-size:28px;line-height:1.55;margin-bottom:16px}
  .about-detail>p{font-size:16px;line-height:1.95}
  .about-detail .facts{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
  .about-detail .facts div,.about-detail .facts div:first-child{padding:12px 6px;text-align:center}
  .about-detail .facts b{font-size:13px;white-space:normal}
  .about-detail .facts span{font-size:11.5px}
  .hero-welcome{position:absolute;left:12px;right:12px;bottom:14px;width:auto;padding:22px 20px 18px}
  .hero-welcome h2{font-size:25px;margin-bottom:8px}
  .hero-welcome p{font-size:14px;line-height:1.75;margin-bottom:14px;max-width:34ch}
  .hero-welcome-link{min-height:44px;font-size:14px}
  .hero-welcome-close{top:10px;left:10px;width:31px;height:31px}
}
@media(max-width:560px) and (max-height:720px){
  .hero-welcome{padding:18px 18px 16px}
  .hero-welcome-kicker{margin-bottom:3px}
  .hero-welcome h2{font-size:22px;margin-bottom:5px}
  .hero-welcome p{line-height:1.6;margin-bottom:10px}
  .hero-welcome-link{min-height:40px;padding-block:8px}
}
@media(prefers-reduced-motion:reduce){.hero-welcome{transition:none}}