/** Shopify CDN: Minification failed

Line 178:1 Expected "}" to go with "{"

**/
/* ================================================
   CUSTOM MOBILE OVERRIDES
   Breakpoints: 767.98px (mobile), 768px (tablet)
   ================================================ */

@media (max-width: 767.98px) {

  /* -----------------------------------------------
     1. IMAGES — Prevent overflow
  ----------------------------------------------- */
  img,
  .media-wrapper img,
  .product-card__image,
  .collection-card__image {
    max-width: 100%;
    height: auto;
  }

  /* Prevent any section from causing horizontal scroll */
  .shopify-section {
    overflow-x: hidden;
  }


  /* -----------------------------------------------
     2. FEATURED PRODUCT — Stack vertically,
        keep 2-col image gallery
  ----------------------------------------------- */

  /* Stack media + info wrappers full width */
  .product__media-wrapper,
  .product__info-wrapper {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
  }

  /* Force vertical stacking */
  .product .f-grid,
  .product__grid,
  .featured-product .f-grid {
    grid-template-columns: 1fr !important;
    --f-columns-mobile: 1 !important;
  }

  /* Keep product image thumbnails/gallery as 2 columns */
  .product__media-list,
  .product__thumbnails {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 0.8rem;
  }


  /* -----------------------------------------------
     3. COLLECTION / PRODUCT GRID — Force 2 columns
        Overrides theme's mobile default (which may
        be 1-col or slider depending on settings)
  ----------------------------------------------- */

  .collection-product-grid.f-grid,
  .product-list.f-grid,
  .f-grid.mobile-columns--2,
  .collection__products .f-grid {
    --f-columns-mobile: 2 !important;
    --f-column-gap-mobile: 1.2rem !important;
    --f-row-gap-mobile: 2rem !important;
  }

  /* Fallback for any grid not using f-grid */
  .collection-product-grid,
  .product-list:not(.swiper-wrapper) {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 1.2rem 1.2rem;
  }


  /* -----------------------------------------------
     4. TEXT — Scale down large hero/banner headings
  ----------------------------------------------- */

  /* Hero headings that are too large */
  .hd1 {
    font-size: clamp(2.8rem, 8vw, 5rem) !important;
  }

  .hd2 {
    font-size: clamp(2.4rem, 6vw, 4rem) !important;
  }

  h1, .h1 {
    font-size: clamp(2.2rem, 6vw, 3.5rem) !important;
  }

  h2, .h2 {
    font-size: clamp(1.8rem, 5vw, 2.8rem) !important;
  }

  /* Banner/hero specific — these tend to be the
     most oversized on mobile */
  .hero .hd1,
  .hero .hd2,
  .banner__heading,
  .card-media .hd1,
  .card-media .hd2 {
    font-size: clamp(2.4rem, 7vw, 4.5rem) !important;
    line-height: 1.15 !important;
  }


  /* -----------------------------------------------
     5. TEXT — Scale up small text that's too tiny
        (product cards in 2-col can get cramped)
  ----------------------------------------------- */

  /* Keep product card titles legible at 2 columns */
  .product-card__info .text-pcard-title,
  .product-card .text-pcard-title {
    font-size: calc(var(--font-body-size) * 0.92) !important;
    line-height: 1.4 !important;
  }

  /* Price legibility */
  .f-price {
    font-size: calc(var(--font-body-size) * 0.95) !important;
  }

  /* Collection card titles at small sizes */
  .collection-card--style-standard .collection-card__title {
    font-size: calc(var(--font-body-size) * 0.88) !important;
  }


  /* -----------------------------------------------
     6. GENERAL GUARDS — Padding & safe zones
  ----------------------------------------------- */

  .page-width {
    padding-inline: 1.6rem !important;
  }

  /* Prevent swiper/slider from breaking 2-col grid */
  .collection-product-grid .swiper-wrapper {
    flex-wrap: wrap !important;
    transform: none !important;
  }

  .collection-product-grid .swiper-slide {
    width: calc(50% - 0.6rem) !important;
    margin-right: 1.2rem !important;
  }

  .collection-product-grid .swiper-slide:nth-child(2n) {
    margin-right: 0 !important;
  }

.slide__title .rte p {
  margin: 0;
  line-height: 0.65;
}
@media (max-width: 767.98px) {
  .grid-banner .card-media,
  .grid-banner .media-wrapper,
  .grid-banner [style*="--aspect-ratio"] {
    --aspect-ratio-mobile: 1 !important;
    --media-ratio-mobile: 1 !important;
  }

  .grid-banner [style*="--aspect-ratio"]:before {
    padding-top: 75% !important;
  }
}