body#app { 
      background-color: white; 
  } 

  .banner--fixed img { 
      background-color: rgb(255 255 255); 
  } 



@media screen and (min-width: 1024px) {
 

  section.s-block.s-block--fixed-banner.wide-placeholder:nth-of-type(1) > .container { 
      margin-top: 0; 
      max-width: 100%; 
  } 

  .index section.s-block.s-block--fixed-banner.wide-placeholder > .container { 
      max-width: 100%; 
      padding: 0; 
  } 

  section.s-block.s-block--fixed-banner.wide-placeholder:first-of-type { 
      margin-top: 0; 
      height: 100%; 
      overflow: hidden; 
  } 

  .s-block--fixed-banner .banner--fixed img { 
      display: block; 
      margin: 0 auto; 
      max-width: 65%; 
      height: auto; 
  } 

  .s-block--banners .grid.two-row { 
      display: grid; 
      grid-template-columns: repeat(4, 1fr); 
      gap: 1rem; 
  } 

  .s-block--banners .grid.two-row > * { 
      aspect-ratio: 1 / 1; 
      width: 100%; 
      height: 200px; 
      object-fit: cover; 
  } 

  .s-slider-block__title-right { 
      display: flex; 
      justify-content: center; 
      position: absolute; 
      left: 50%; 
      top: 50%; 
      transform: translate(-50%, -50%); 
  } 

  .s-slider-block__title-right h2 { 
      border: 2px solid #8F2C2E; 
      padding: 5px 10px; 
      margin: 15px 0 0 0; 
      text-align: center; 
      color: #8F2C2E; 
      font-size: 29px; 
  } 

  .s-slider-block__title { 
      position: relative; 
  } 

  .s-button-primary-outline { 
      position: relative; 
      overflow: hidden; 
      transition: all 0.4s ease; 
      border: 2px solid #8F2C2E; 
      color: #8F2C2E; 
      background: transparent; 
  } 

  .s-button-primary-outline:hover { 
      background: linear-gradient(90deg, #8F2C2E, #A03B3B, #8F2C2E); 
      color: #fff; 
      box-shadow: 0 5px 15px rgba(143,44,46,0.5); 
  } 

  .s-button-primary-outline::after { 
      content: ''; 
      position: absolute; 
      top: -50%; 
      left: -50%; 
      width: 200%; 
      height: 200%; 
      background: rgba(255,255,255,0.3); 
      transform: rotate(45deg) translateX(-100%); 
      transition: all 0.5s ease; 
  } 

  .s-button-primary-outline:hover::after { 
      transform: rotate(45deg) translateX(100%); 
  }
}
/* الجريد الافتراضي للسطح المكتب */
.grid.two-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr); /* 3 أعمدة */
  gap: 1rem; /* المسافة بين العناصر */
}

/* للموبايل: عرض عنصرين في كل صف */
@media screen and (max-width: 768px) {
  .grid.two-row {
    grid-template-columns: repeat(2, 1fr); /* عمودين فقط */
    gap: 0.75rem; /* مسافة مناسبة للموبايل */
  }

  .grid.two-row .banner-entry {
    aspect-ratio: 1 / 1; /* يحافظ على نفس ارتفاع وعرض المربع */
    width: 100%;
    height : 80% ; 
  }
}
@media(max-width:767px){
#photos-0-slider > div.swiper.s-slider-container.swiper-initialized.swiper-horizontal.swiper-rtl.swiper-ios.swiper-backface-hidden{
   padding:0;
}
.s-products-slider-card {
    max-width: 185px;
}
.main-nav-container {
    min-height: 56px;
}
  .s-button-element:not(:disabled):not([loading]) {
    font-size: 11px;
}
  .s-button-primary-outline { 
      position: relative; 
      overflow: hidden; 
      transition: all 0.4s ease; 
      border: 2px solid #8F2C2E; 
      color: #8F2C2E; 
      background: transparent; 
  } 

  .s-button-primary-outline:hover { 
      background: linear-gradient(90deg, #8F2C2E, #A03B3B, #8F2C2E); 
      color: #fff; 
      box-shadow: 0 5px 15px rgba(143,44,46,0.5); 
  } 

  .s-button-primary-outline::after { 
      content: ''; 
      position: absolute; 
      top: -50%; 
      left: -50%; 
      width: 200%; 
      height: 200%; 
      background: rgba(255,255,255,0.3); 
      transform: rotate(45deg) translateX(-100%); 
      transition: all 0.5s ease; 
  } 

  .s-button-primary-outline:hover::after { 
      transform: rotate(45deg) translateX(100%); 
  }



}