/* معرضُ صور العقار داخل الصفحة (توجيه الرئيس التنفيذي ١٣ نوفمبر ٢٠٢٦: «لو ضغطت على الصورة يوديك لصفحة ثانية …
   يحط لك الصور كذا جنب بعض»). شبكةٌ: الأولى كبيرة والبقيةُ بجانبها، وطبقةُ عرضٍ فوق الصفحة بلا مكتبةٍ خارجية.
   الصورُ كلُّها من مسار العلامة المائية /sg/img/wm — لا أصلَ هنا. */

/* ─── الشبكة ─── */
.sgx-gal{display:grid;gap:10px;grid-template-columns:repeat(4,1fr);margin-top:14px}
.sgx-gal .gt{position:relative;display:block;border-radius:16px;overflow:hidden;aspect-ratio:4/3;background:#E6ECF3;
  box-shadow:0 10px 24px -14px rgba(16,21,58,.45);cursor:zoom-in;outline-offset:3px}
.sgx-gal .gt img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .45s ease}
.sgx-gal .gt:hover img,.sgx-gal .gt:focus-visible img{transform:scale(1.045)}
.sgx-gal .gt:focus-visible{outline:3px solid #0DA4DB}
.sgx-gal .gt::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(16,21,58,0) 55%,rgba(16,21,58,.38));
  opacity:0;transition:opacity .3s ease;pointer-events:none}
.sgx-gal .gt:hover::after{opacity:1}
.sgx-gal .gt:first-child{grid-column:span 2;grid-row:span 2;aspect-ratio:auto;min-height:260px}
.sgx-gal .gt.hid{display:none}
.sgx-gal .gt .mo{position:absolute;inset:0;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;
  background:rgba(16,21,58,.66);color:#fff;font-weight:700;font-size:1.7rem;line-height:1.2}
.sgx-gal .gt .mo small{font-size:.8rem;font-weight:500;opacity:.9}
/* صورةٌ واحدة · صورتان · ثلاث · أربع — كلٌّ بتوزيعه، فلا خانةَ فارغة */
.sgx-gal.n1{grid-template-columns:1fr;max-width:920px}
.sgx-gal.n1 .gt:first-child{grid-column:auto;grid-row:auto;aspect-ratio:16/9;min-height:0}
.sgx-gal.n2{grid-template-columns:repeat(2,1fr)}
.sgx-gal.n2 .gt:first-child{grid-column:auto;grid-row:auto;aspect-ratio:4/3;min-height:0}
.sgx-gal.n3{grid-template-columns:repeat(3,1fr)}
.sgx-gal.n4 .gt:nth-child(4){grid-column:span 2;aspect-ratio:8/3}
@media (max-width:720px){
  .sgx-gal,.sgx-gal.n3{grid-template-columns:repeat(2,1fr);gap:8px}
  .sgx-gal .gt{border-radius:13px}
  .sgx-gal .gt:first-child,.sgx-gal.n2 .gt:first-child{grid-column:span 2;grid-row:auto;aspect-ratio:4/3;min-height:0}
  .sgx-gal.n1{grid-template-columns:1fr}
  .sgx-gal.n1 .gt:first-child{grid-column:auto}
  .sgx-gal.n2 .gt:nth-child(2),.sgx-gal.n4 .gt:nth-child(4){grid-column:span 2;aspect-ratio:8/3}
}

/* ─── طبقةُ العرض ─── */
html.sglb-on,html.sglb-on body{overflow:hidden}
.sglb{position:fixed;inset:0;z-index:10050;display:flex;flex-direction:column;direction:rtl;color:#fff;
  font-family:'LamaSans','Lama Sans',Tahoma,sans-serif;background:rgba(9,12,34,.96);opacity:0;transition:opacity .25s ease}
.sglb.on{opacity:1}
.sglb[hidden]{display:none}
.sglb-top{display:flex;align-items:center;gap:12px;padding:12px 16px;flex:0 0 auto}
.sglb-ttl{flex:1 1 auto;min-width:0;font-weight:700;font-size:1rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sglb-cnt{flex:0 0 auto;font-weight:700;font-size:.95rem;direction:ltr;unicode-bidi:isolate;font-variant-numeric:tabular-nums;
  background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.22);border-radius:999px;padding:5px 14px}
.sglb-b{flex:0 0 auto;width:46px;height:46px;border-radius:50%;border:1px solid rgba(255,255,255,.28);background:rgba(255,255,255,.1);
  color:#fff;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;padding:0;transition:background .2s ease,border-color .2s ease}
.sglb-b:hover{background:#0DA4DB;border-color:#0DA4DB}
.sglb-b:focus-visible{outline:3px solid #0DA4DB;outline-offset:2px}
.sglb-b svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.sglb-b[aria-disabled="true"]{opacity:.3;cursor:default;background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.28)}
.sglb-stage{position:relative;flex:1 1 auto;min-height:0;display:flex;align-items:center;justify-content:center;padding:0 12px;
  touch-action:pan-y pinch-zoom;-webkit-user-select:none;user-select:none}
.sglb.zoomed .sglb-stage{touch-action:auto}
.sglb-img{max-width:100%;max-height:100%;object-fit:contain;border-radius:10px;box-shadow:0 30px 80px -30px rgba(0,0,0,.9);
  opacity:0;transition:opacity .3s ease,transform .3s ease;-webkit-user-drag:none}
.sglb-img.ok{opacity:1}
.sglb-nav{position:absolute;top:50%;margin-top:-26px;width:52px;height:52px;z-index:2}
.sglb-nav.prev{right:16px}
.sglb-nav.next{left:16px}
.sglb-spin{position:absolute;top:50%;left:50%;width:42px;height:42px;margin:-21px 0 0 -21px;border-radius:50%;
  border:3px solid rgba(255,255,255,.2);border-top-color:#0DA4DB;animation:sglb-rot .9s linear infinite}
.sglb-spin[hidden],.sglb-err[hidden]{display:none}
.sglb-err{position:absolute;inset:auto 0 50% 0;text-align:center;font-weight:500;color:#F3E3AE}
@keyframes sglb-rot{to{transform:rotate(360deg)}}
/* شريطُ المصغّرات: الصورُ جنباً إلى جنب */
.sglb-strip{flex:0 0 auto;display:flex;gap:8px;overflow-x:auto;padding:12px 16px 16px;scrollbar-width:thin;
  scrollbar-color:rgba(255,255,255,.35) transparent;justify-content:safe center}
.sglb-th{flex:0 0 auto;width:92px;height:68px;border-radius:10px;overflow:hidden;padding:0;border:2px solid transparent;background:#1C2352;
  cursor:pointer;opacity:.55;transition:opacity .2s ease,border-color .2s ease,transform .2s ease}
.sglb-th img{width:100%;height:100%;object-fit:cover;display:block}
.sglb-th:hover{opacity:.9}
.sglb-th[aria-current="true"]{opacity:1;border-color:#0DA4DB;transform:translateY(-2px)}
.sglb-th:focus-visible{outline:3px solid #0DA4DB;outline-offset:2px;opacity:1}
.sglb-one .sglb-strip,.sglb-one .sglb-nav{display:none}
@media (max-width:720px){
  .sglb-top{padding:10px 12px}
  .sglb-stage{padding:0 4px}
  .sglb-nav{width:44px;height:44px;margin-top:-22px;background:rgba(16,21,58,.6)}
  .sglb-nav.prev{right:8px}.sglb-nav.next{left:8px}
  .sglb-th{width:70px;height:52px}
  .sglb-strip{padding:10px 12px 14px;justify-content:flex-start}
}
@media (prefers-reduced-motion:reduce){
  .sglb,.sglb-img,.sglb-b,.sglb-th,.sgx-gal .gt img,.sgx-gal .gt::after{transition:none}
  .sgx-gal .gt:hover img,.sgx-gal .gt:focus-visible img{transform:none}
  .sglb-spin{animation-duration:2.4s}
}