/* CSS from section stylesheet tags */
.collection-grid-section {
  padding: 40px 0;
}
.collection-grid__wrapper {
  display: grid;
  gap: 20px;
}

@media screen and (min-width: 1024px) {
  .collection-grid__wrapper.columns-desktop-2 { grid-template-columns: repeat(2, 1fr); }
  .collection-grid__wrapper.columns-desktop-3 { grid-template-columns: repeat(3, 1fr); }
  .collection-grid__wrapper.columns-desktop-4 { grid-template-columns: repeat(4, 1fr); }
  .collection-grid__wrapper.columns-desktop-5 { grid-template-columns: repeat(5, 1fr); }
}

@media screen and (min-width: 768px) and (max-width: 1023px) {
  .collection-grid__wrapper.columns-tablet-1 { grid-template-columns: repeat(1, 1fr); }
  .collection-grid__wrapper.columns-tablet-2 { grid-template-columns: repeat(2, 1fr); }
  .collection-grid__wrapper.columns-tablet-3 { grid-template-columns: repeat(3, 1fr); }
}

@media screen and (max-width: 767px) {
  .collection-grid__wrapper.columns-mobile-1 { grid-template-columns: repeat(1, 1fr); }
  .collection-grid__wrapper.columns-mobile-2 { grid-template-columns: repeat(2, 1fr); }
}
.collection-grid__card {
  text-align: center;
  background: #fff;
  border: 1px solid #eee;
  padding: 15px;
}
.collection-grid__image {
  width: 100%;
  height: auto;
  margin-bottom: 10px;
}
.collection-slider-wrapper {
  padding: 50px 0;
}
.collection-slider .swiper {
  position: relative;
}
.collection-slide {
  text-align: center;
  padding: 20px;
  background-color: var(--slide-bg, #f9f9f9);
  border-radius: var(--slide-radius, 12px);
  transition: transform 0.3s ease;
}
.collection-slide:hover {
  transform: scale(1.03);
}
.collection-slide img {
  max-width: 100%;
  border-radius: 8px;
  display: block;
  margin: 0 auto;
}
.collection-slide-title {
  margin-top: 12px;
  font-size: 1.1rem;
  font-weight: 600;
  color: var(--slide-title-color, #000);
}

/* Custom Arrow Buttons */
.swiper-button-prev,
.swiper-button-next {
  display: flex !important;
  justify-content: center;
  align-items: center;
  width: 48px;
  height: 48px;
  background-color: #4DB9FF;
  border-radius: 50%;
  z-index: 10;
  top: 50%;
  transform: translateY(-50%);
  position: absolute;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15);
}

.swiper-button-prev {
  left: 0;
}

.swiper-button-next {
  right: 0;
}

.swiper-button-next::after,
.swiper-button-prev::after {
  content: '';
  width: 28px;
  height: 28px;
  display: block;
  background-color: #FFD700;
  mask-repeat: no-repeat;
  mask-position: center;
  mask-size: contain;
}

/* Right Arrow */
.swiper-button-next::after {
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 45 30'%3E%3Cpath fill='white' d='M41.8693 15.8699H41.1989C34.6074 15.8699 7.91358 15.8617 1.32206 15.8617C1.15235 15.8617 0.980945 15.8683 0.812933 15.8502C0.346232 15.801 -0.00336969 15.4268 2.45036e-05 14.9951C0.00341869 14.5618 0.356414 14.1925 0.821418 14.1482C0.989431 14.1318 1.16084 14.14 1.33055 14.14C7.92206 14.14 34.6159 14.1482 41.2074 14.1482H41.8812C41.6877 13.9496 41.5808 13.8347 41.4688 13.7264C37.2719 9.71005 33.0732 5.69537 28.8729 1.6807C28.5963 1.41644 28.2806 1.1325 28.4232 0.735295C28.5131 0.482531 28.7507 0.229768 28.9934 0.0902552C29.3328 -0.106704 29.6858 0.0442981 29.9574 0.297062C30.5972 0.894503 31.2251 1.50343 31.8581 2.10908C35.9854 6.05646 40.1145 10.0055 44.2435 13.9529C44.3742 14.0776 44.5151 14.1909 44.6474 14.3156C45.1192 14.762 45.1175 15.2561 44.6423 15.7074C42.3156 17.9216 39.9855 20.1325 37.6639 22.3499C35.1522 24.7479 32.6456 27.1524 30.139 29.5569C29.881 29.8048 29.6146 30.0296 29.2259 29.9968C28.8594 29.9656 28.5997 29.7736 28.4571 29.4371C28.301 29.0662 28.4385 28.7642 28.7032 28.5081C29.4398 27.7909 30.1848 27.0818 30.9264 26.3711C34.4632 22.99 37.9999 19.6089 41.535 16.2277C41.6215 16.144 41.6996 16.0521 41.8693 15.8683V15.8699Z'/%3E%3C/svg%3E");
}

/* Left Arrow - Flip the same SVG */
.swiper-button-prev::after {
  transform: rotate(180deg);
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 45 30'%3E%3Cpath fill='white' d='M41.8693 15.8699H41.1989C34.6074 15.8699 7.91358 15.8617 1.32206 15.8617C1.15235 15.8617 0.980945 15.8683 0.812933 15.8502C0.346232 15.801 -0.00336969 15.4268 2.45036e-05 14.9951C0.00341869 14.5618 0.356414 14.1925 0.821418 14.1482C0.989431 14.1318 1.16084 14.14 1.33055 14.14C7.92206 14.14 34.6159 14.1482 41.2074 14.1482H41.8812C41.6877 13.9496 41.5808 13.8347 41.4688 13.7264C37.2719 9.71005 33.0732 5.69537 28.8729 1.6807C28.5963 1.41644 28.2806 1.1325 28.4232 0.735295C28.5131 0.482531 28.7507 0.229768 28.9934 0.0902552C29.3328 -0.106704 29.6858 0.0442981 29.9574 0.297062C30.5972 0.894503 31.2251 1.50343 31.8581 2.10908C35.9854 6.05646 40.1145 10.0055 44.2435 13.9529C44.3742 14.0776 44.5151 14.1909 44.6474 14.3156C45.1192 14.762 45.1175 15.2561 44.6423 15.7074C42.3156 17.9216 39.9855 20.1325 37.6639 22.3499C35.1522 24.7479 32.6456 27.1524 30.139 29.5569C29.881 29.8048 29.6146 30.0296 29.2259 29.9968C28.8594 29.9656 28.5997 29.7736 28.4571 29.4371C28.301 29.0662 28.4385 28.7642 28.7032 28.5081C29.4398 27.7909 30.1848 27.0818 30.9264 26.3711C34.4632 22.99 37.9999 19.6089 41.535 16.2277C41.6215 16.144 41.6996 16.0521 41.8693 15.8683V15.8699Z'/%3E%3C/svg%3E");
}
.cube-card-grid {
        display: flex;
        flex-wrap: wrap;
        gap: 20px;
        justify-content: center;
      }
      .cube-card {
        flex: 1 1 calc(33.333% - 20px);
        padding: 30px;
        border-radius: 12px;
        display: flex;
        justify-content: space-between;
        align-items: center;
        min-height: 200px;
        color: #fff;
      }
      .cube-card .cube-text {
        max-width: 60%;
      }
      .cube-card h3 {
        font-size: 18px;
        font-weight: bold;
        margin-bottom: 8px;
      }
      .cube-card p {
        margin-bottom: 12px;
        font-size: 14px;
        line-height: 1.5;
        white-space: pre-line;
      }


      .cube-card a.button {
        display: inline-block;
        margin-top: 5px;
        padding: 0px 0px;
        font-weight: 600;
        text-align: left;
        text-decoration: none;
        border: 1px solid var(--btn-border, transparent);
        background: var(--btn-bg, #fff);
        color: var(--btn-color, #fff);
        border-radius: var(--btn-radius, 6px);
        text-decoration: underline;
    }
      .cube-card img {
        max-height: 120px;
        width: auto;
      }
     @media (max-width: 768px) {
    .cube-card {
      flex: 1 1 100%;
      flex-direction: row; /* Keep image beside text */
      text-align: left;    /* Align text properly */
      flex-wrap: wrap;     /* Just in case text is long */
      gap: 10px;
    }

    .cube-card .cube-text {
      max-width: 60%; /* Maintain text width */
    }

    .cube-card img {
      margin-top: 0;
      max-width: 40%;
      height: auto;
    }
  }
.cube-card1-grid1 {
        display: flex;
        flex-wrap: wrap;
        gap: 20px;
        justify-content: center;
      }
      .cube-card1 {
        flex: 1 1 calc(33.333% - 20px);
        padding: 30px;
        border-radius: 12px;
        display: flex;
        justify-content: space-between;
        align-items: center;
        min-height: 200px;
        color: #fff;
      }
      .cube-card1 .cube-text {
        max-width: 90%;
      }
      .cube-card1 h3 {
        font-size: 30px;
        font-weight: bold;
        margin-bottom: 8px;
      }
      .cube-card1 p {
        margin-bottom: 12px;
        font-size: 14px;
        line-height: 1.5;
        white-space: pre-line;
      }

  .discontpre{

  }
      .cube-card1 a.button {
        display: inline-block;
        margin-top: 5px;
        padding: 0px 0px;
        font-weight: 600;
        text-align: left;
        text-decoration: none;
        border: 1px solid var(--btn-border, transparent);
        background: var(--btn-bg, #fff);
        color: var(--btn-color, #fff);
        border-radius: var(--btn-radius, 6px);
        text-decoration: underline;
    }
      .cube-car1 img {
        max-height: 120px;
        width: auto;
      }
      @media (max-width: 768px) {
        .cube-card1 {
          flex: 1 1 100%;
          flex-direction: column;
          text-align: center;
        }
        .cube-card1 .cube-text {
          max-width: 100%;
        }
        .cube-card1 img {
          margin-top: 15px;
        }
      }