/* Add custom CSS styles below */ 
/* ===== بانرات الصفحة الرئيسية: كل بانرين جنب بعض ===== */
/* البانر الرئيسي وشريط الدفع (أول بانرين) يبقيان بعرض الصفحة */

body.index main#main-content {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  max-width: 1580px;
  margin-inline: auto;
}

body.index main#main-content > * {
  flex: 0 0 100%;
  max-width: 100%;
}

body.index main#main-content > section[id^="s-block--fixed-banner-"]:not(#s-block--fixed-banner-0):not(#s-block--fixed-banner-1) {
  flex: 0 0 50%;
  max-width: 50%;
  margin-top: 20px;
}

body.index main#main-content > section[id^="s-block--fixed-banner-"]:not(#s-block--fixed-banner-0):not(#s-block--fixed-banner-1) .container {
  padding-inline: 8px;
}

/* الجوال: مسافات أصغر بين البانرات */
@media (max-width: 767px) {
  body.index main#main-content > section[id^="s-block--fixed-banner-"]:not(#s-block--fixed-banner-0):not(#s-block--fixed-banner-1) {
    margin-top: 10px;
  }
  body.index main#main-content > section[id^="s-block--fixed-banner-"]:not(#s-block--fixed-banner-0):not(#s-block--fixed-banner-1) .container {
    padding-inline: 5px;
  }
  body.index main#main-content > section[id^="s-block--fixed-banner-"]:not(#s-block--fixed-banner-0):not(#s-block--fixed-banner-1) a.banner {
    border-radius: 10px;
  }
}
/* كل بانرات الشبكة بنسبة 2:1 — صورةٌ بمقاسٍ مختلف تُقصّ أطرافها بدل أن تصغر */
body.index main#main-content > section[id^="s-block--fixed-banner-"]:not(#s-block--fixed-banner-0):not(#s-block--fixed-banner-1) a.banner {
  display: block;
  aspect-ratio: 2 / 1;
  overflow: hidden;
}
body.index main#main-content > section[id^="s-block--fixed-banner-"]:not(#s-block--fixed-banner-0):not(#s-block--fixed-banner-1) a.banner picture,
body.index main#main-content > section[id^="s-block--fixed-banner-"]:not(#s-block--fixed-banner-0):not(#s-block--fixed-banner-1) a.banner img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}