/* ==========================================================================
   أنماط خاصة بصفحة المشروع فقط — لا تُحمَّل في باقي الصفحات.
   ========================================================================== */

/* --- الشريط الثابت العلوي --- */
.actionbar{position:fixed;top:var(--hdr-h);inset-inline:0;z-index:55;background:var(--ink);
  color:#fff;transform:translateY(-110%);transition:transform .45s var(--ease);
  border-bottom:1px solid rgba(255,255,255,.1)}
.actionbar.is-on{transform:none}
.actionbar .wrap{display:flex;align-items:center;gap:24px;padding-block:12px}
.ab-title{font-family:var(--f-ar);font-size:18px;white-space:nowrap;font-weight:600}
.ab-facts{display:flex;gap:26px;margin-inline-start:auto}
.ab-facts div{line-height:1.4}
.ab-facts b{display:block;font-size:14.5px;font-weight:600}
.ab-facts span{font-size:11px;color:rgba(255,255,255,.55);letter-spacing:.05em}
.ab-cta{display:flex;gap:9px;flex:none}

/* --- الأرقام الأساسية --- */
.keyfacts{background:var(--paper-2);border-bottom:1px solid var(--line)}
.kf-grid{display:grid;grid-template-columns:repeat(var(--kf-cols,5),1fr);gap:1px;
  background:var(--line);border-inline:1px solid var(--line)}
.kf-grid div{background:var(--paper-2);padding:24px 20px;text-align:center}
.kf-grid b{display:block;font-family:var(--f-en);font-size:clamp(22px,2.6vw,31px);
  line-height:1.1;color:var(--ink)}
.kf-grid span{font-size:12.5px;color:#6B7278}

/* --- الموقع والمسافات --- */
.loc{background:var(--paper-2)}
.loc-grid{display:grid;grid-template-columns:1fr 1.15fr;gap:clamp(26px,4vw,56px);align-items:start}
.dist{list-style:none;padding:0;margin:0;border:1px solid var(--line);background:#fff}
.dist li{display:flex;justify-content:space-between;align-items:center;gap:16px;
  padding:15px 22px;border-bottom:1px solid var(--line);font-size:15px}
.dist li:last-child{border-bottom:0}
.dist b{font-family:var(--f-en);font-size:17px;color:var(--stone-dk);white-space:nowrap}
.map{border:1px solid var(--line);overflow:hidden;background:var(--paper-3);
  aspect-ratio:4/3;min-height:340px}
.map iframe{width:100%;height:100%;border:0;filter:grayscale(.3)}

/* --- المخطط العام --- */
.mplan{background:var(--ink);color:#fff}
.mplan .h-sec{color:#fff}
.mplan .lead{color:rgba(255,255,255,.55)}
.mp-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(22px,4vw,62px);align-items:center}
.mp-text-col{display:grid;gap:24px}
.mp-block{border-inline-start:3px solid var(--stone);padding-inline-start:20px;
  transition:border-color .3s,transform .3s}
.mp-block:hover{border-inline-start-color:#fff;transform:translateX(-4px)}
[dir=ltr] .mp-block:hover{transform:translateX(4px)}
.mp-block h3{font-size:20px;margin-bottom:6px;color:#fff}
.mp-block p{font-size:14px;color:rgba(255,255,255,.7);margin:0}
.mp-media{border:1px solid rgba(255,255,255,.15);overflow:hidden;position:relative}
.mp-media img{width:100%;aspect-ratio:16/11;object-fit:cover;
  transition:transform 1s var(--ease),filter 1s var(--ease);filter:saturate(.7) brightness(.9)}
.mp-media:hover img{transform:scale(1.05);filter:saturate(.95) brightness(1)}
.mp-download{position:absolute;inset-block-end:14px;inset-inline-end:14px;
  background:rgba(28,32,36,.9);color:#fff;padding:9px 16px;font-size:12.5px;
  display:inline-flex;align-items:center;gap:8px;backdrop-filter:blur(6px)}
.mp-download:hover{background:var(--stone);color:var(--ink)}

/* --- الوحدات (تبويبات) --- */
.tabs{display:flex;border:1px solid var(--line);margin-bottom:30px;overflow:hidden;flex-wrap:wrap}
.tabs button{flex:1;min-width:150px;padding:16px 20px;background:#fff;border:0;
  border-inline-end:1px solid var(--line);cursor:pointer;font-size:14.5px;
  font-weight:500;transition:.3s var(--ease);color:#6B7278}
.tabs button:last-child{border-inline-end:0}
.tabs button:hover{background:var(--paper-2)}
.tabs button.on{background:var(--ink);color:#fff;font-weight:600}
.panel{display:none}
.panel.on{display:block;animation:hp-fade .45s var(--ease)}
@keyframes hp-fade{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.unit-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(24px,4vw,52px);align-items:center}
.unit-grid img{aspect-ratio:4/3;object-fit:cover;width:100%}
.unit-grid h3{font-size:clamp(22px,2.6vw,30px);margin-bottom:12px}
.unit-grid p{color:#5C646B;font-size:15px;margin:0 0 22px}
.tbl{width:100%;border-collapse:collapse;font-size:14.5px;border:1px solid var(--line);margin-bottom:24px}
.tbl th,.tbl td{padding:13px 16px;text-align:start;border-bottom:1px solid var(--line)}
.tbl th{background:var(--paper-2);font-family:var(--f-body);font-weight:600;
  font-size:13px;width:42%;color:#5C646B}
.tbl tr:last-child th,.tbl tr:last-child td{border-bottom:0}
.unit-cta{display:flex;gap:10px;flex-wrap:wrap}

/* --- أنظمة السداد --- */
.pay{background:var(--paper-2)}
.pay-grid{display:grid;grid-template-columns:repeat(var(--pay-cols,3),1fr);gap:clamp(14px,2vw,22px)}
.pay-card{background:#fff;border:1px solid var(--line);padding:clamp(26px,3vw,34px);
  display:flex;flex-direction:column;transition:.4s var(--ease);position:relative}
.pay-card:hover{border-color:var(--stone-dk);transform:translateY(-5px);
  box-shadow:0 22px 46px rgba(28,32,36,.1)}
.pay-card.featured{border-color:var(--ink);border-width:1.5px}
.pay-card .flag{position:absolute;inset-block-start:-1px;inset-inline-end:22px;background:var(--ink);
  color:#fff;font-size:10.5px;letter-spacing:.1em;padding:5px 12px;font-weight:600}
.pay-card h3{font-size:22px;margin-bottom:6px}
.pay-card .sub{font-size:13px;color:#6B7278;margin-bottom:22px}
.pay-rows{display:grid;gap:1px;background:var(--line);border:1px solid var(--line);margin-bottom:24px}
.pay-rows div{background:#fff;padding:14px 16px;display:flex;justify-content:space-between;
  gap:12px;font-size:14px}
.pay-rows span{color:#6B7278}
.pay-rows b{font-family:var(--f-en);font-size:18px}
.pay-card .btn{margin-top:auto}
.pay-note{margin-top:22px;background:#fff;border:1px solid var(--line);
  border-inline-start:3px solid var(--stone);padding:20px 24px;font-size:14.5px;color:#4E565C;
  display:flex;gap:16px;align-items:center;flex-wrap:wrap;justify-content:space-between}
.pay-note p{margin:0}

/* --- المرافق --- */
.amen-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;
  background:var(--line);border:1px solid var(--line)}
.amen-grid article{background:#fff;padding:30px 26px;transition:background .35s var(--ease)}
.amen-grid article:hover{background:var(--paper-2)}
.amen-ico{width:28px;height:28px;stroke:var(--stone-dk);stroke-width:1.4;margin-bottom:14px}
.amen-grid h3{font-size:18px;margin-bottom:6px}
.amen-grid p{font-size:14px;color:#6B7278;margin:0}

/* --- معرض المشروع --- */
.gal{background:var(--ink);color:#fff}
.gal .h-sec{color:#fff}
.gal-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.gal-grid figure{margin:0;position:relative;overflow:hidden;cursor:zoom-in;aspect-ratio:4/3}
.gal-grid figure:nth-child(1){grid-column:span 2;grid-row:span 2;aspect-ratio:auto}
.gal-grid img{width:100%;height:100%;object-fit:cover;filter:saturate(.75) brightness(.9);
  transition:transform .9s var(--ease),filter .9s var(--ease)}
.gal-grid figure:hover img{transform:scale(1.06);filter:saturate(.95) brightness(1)}

/* --- المراحل --- */
.ph-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(14px,2vw,20px)}
.ph-card{border:1px solid var(--line);padding:26px 24px;transition:.35s var(--ease);
  display:flex;flex-direction:column}
.ph-card:hover{border-color:var(--slate);transform:translateY(-4px)}
.ph-status{font-size:10.5px;letter-spacing:.1em;font-weight:600;padding:5px 11px;
  align-self:flex-start;margin-bottom:16px}
.st-done{background:var(--ok);color:#fff}
.st-build{background:var(--paper-3);color:var(--ink)}
.st-new{background:var(--stone);color:var(--ink)}
.ph-card h3{font-size:20px;margin-bottom:4px}
.ph-card .en{font-family:var(--f-en);font-size:12.5px;letter-spacing:.12em;
  color:var(--slate-lt);display:block;margin-bottom:14px}
.ph-card p{font-size:14px;color:#6B7278;margin:0 0 18px}
.ph-card>a{margin-top:auto;font-size:13px;color:var(--stone-dk);
  border-bottom:1px solid var(--stone);align-self:flex-start;padding-bottom:3px}
.ph-card>a:hover{color:var(--ink);border-color:var(--ink)}

/* --- الثقة --- */
.trust{background:var(--paper-2)}
.trust-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2.4vw,26px)}
.trust-card{background:#fff;border:1px solid var(--line);padding:30px 28px}
.trust-card b{font-family:var(--f-en);font-size:30px;color:var(--ink);display:block;
  line-height:1.1;margin-bottom:8px}
.trust-card h3{font-size:18px;margin-bottom:8px}
.trust-card p{font-size:14px;color:#6B7278;margin:0}
.share-list{list-style:none;padding:0;margin:24px 0 0;display:flex;gap:10px;flex-wrap:wrap}
.share-list li{display:flex;align-items:center;gap:10px;font-size:14px;padding:11px 18px;
  background:#fff;border:1px solid var(--line)}
.share-list li::before{content:"";width:6px;height:6px;background:var(--stone);
  flex:none;transform:rotate(45deg)}

/* --- مشاريع ذات صلة --- */
.rel-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.rel{position:relative;aspect-ratio:3/4;overflow:hidden;display:block;background:var(--ink)}
.rel img{width:100%;height:100%;object-fit:cover;filter:saturate(.75) brightness(.88);
  transition:transform 1s var(--ease)}
.rel:hover img{transform:scale(1.07)}
.rel::after{content:"";position:absolute;inset:0;
  background:linear-gradient(to top,rgba(20,23,26,.9) 5%,transparent 60%)}
.rel-in{position:absolute;inset-block-end:0;padding:20px;z-index:2;color:#fff}
.rel-in span{font-size:11px;letter-spacing:.12em;color:var(--stone);display:block;margin-bottom:5px}
.rel-in h3{font-size:20px}

/* --- الاستجابة --- */
@media(max-width:1100px){
  .kf-grid{grid-template-columns:repeat(3,1fr)}
  .amen-grid,.ph-grid,.rel-grid{grid-template-columns:repeat(2,1fr)}
  .mp-grid,.loc-grid{grid-template-columns:1fr}
  .ab-facts{display:none}
  .trust-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:900px){
  .unit-grid{grid-template-columns:1fr}
  .pay-grid{grid-template-columns:1fr}
  .gal-grid{grid-template-columns:1fr 1fr}
  .gal-grid figure:nth-child(1){grid-column:span 2;grid-row:auto;aspect-ratio:16/10}
  .actionbar{display:none}
  .trust-grid{grid-template-columns:1fr}
}
@media(max-width:600px){
  .kf-grid{grid-template-columns:1fr 1fr}
  .amen-grid,.ph-grid,.rel-grid{grid-template-columns:1fr}
  .tabs button{min-width:100%;border-inline-end:0;border-bottom:1px solid var(--line)}
  .map{min-height:260px}
}