/** Shopify CDN: Minification failed

Line 10:0 Unexpected "<"
Line 171:2 Unexpected "<"

**/


/* CSS from section stylesheet tags */
<style>
    .mobile-card-carousel-wrapper {
      width: 100vw; /* Full viewport width */
      margin-left: calc(-50vw + 50%); /* Center align the full-width section */
      padding: 6px;
      background: #ffffff;
      background-size: cover;
      background-position: center;
      background-repeat: no-repeat;
      border-radius: inherit;
      box-sizing: border-box;
      overflow: visible;
      position: relative;
      max-height: 165px;
   }

    .mobile-card-carousel-wrapper::before {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      background: linear-gradient(135deg, rgba(0,0,0,0.02) 0%, rgba(255,255,255,0.05) 100%);
      pointer-events: none;
      border-radius: inherit;
    }

    .mobile-card-carousel-wrapper h2 {
      font-weight: 700;
      font-size: 1.1rem;
      background: linear-gradient(135deg, #1a1a1a 0%, #4a4a4a 100%);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
      margin-bottom: 8px;
      letter-spacing: -0.02em;
      position: relative;
      z-index: 1;
    }

    .mobile-card-carousel {
      display: flex;
      align-items: center;
      overflow-x: auto;
      scroll-snap-type: x mandatory;
      -webkit-overflow-scrolling: touch;
      gap: 12px;
      padding: 4px 5px 4px 5px;
      position: relative;
      height: 128px;
      scrollbar-width: none;
      -ms-overflow-style: none;
    }

    .mobile-card-carousel::-webkit-scrollbar {
      display: none;
    }

    .mobile-card-carousel .card {
      flex: 0 0 78%;
      max-width: 78%;
      min-width: 78%;
      height: 120px;
      scroll-snap-align: center;
      scroll-snap-stop: always;
      background: #ffffff;
      border-radius: 16px;
      box-shadow:
        0 8px 20px rgba(0, 0, 0, 0.1),
        0 3px 6px rgba(0, 0, 0, 0.08);
      overflow: hidden;
      display: flex;
      flex-direction: column;
      transition: transform 0.3s ease, box-shadow 0.3s ease;
      position: relative;
      align-self: center;
    }

    .mobile-card-carousel .card:hover {
      transform: translateY(-4px);
      box-shadow:
        0 12px 24px rgba(0, 0, 0, 0.12),
        0 6px 12px rgba(0, 0, 0, 0.08);
    }

    .mobile-card-carousel .card-image {
      position: relative;
      height: 100%; /* Full height of the card */
      overflow: hidden;
      border-radius: 16px;
      background: none; /* Remove gradient if you want full image */
    }


    .mobile-card-carousel .card-image img {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
      border-radius: 16px; /* Uniform rounding for entire image */
      transition: transform 0.3s ease;
    }

    .mobile-card-carousel .card:hover .card-image img {
      transform: scale(1.05);
    }

    .mobile-card-carousel .card-content {
      padding: 6px 12px;
      background: #ffffff;
      height: 35px;
      display: flex;
      flex-direction: column;
      justify-content: center;
    }


    .mobile-card-carousel .card-content h3 {
      margin: 0 0 4px;
      font-size: 0.9rem;
      font-weight: 700;
      color: #1a1a1a;
      letter-spacing: -0.01em;
      line-height: 1.2;

    }

    .mobile-card-carousel .card-content p {
      margin: 0;
      font-size: 0.75rem;
      color: #ffffff;
      line-height: 1.3;
      font-weight: 400;

    }

    @media (max-width: 480px) {
      .mobile-card-carousel .card {
        flex: 0 0 82%;
        max-width: 82%;
        min-width: 82%;
        height: 110px;
      }

      .mobile-card-carousel-wrapper {
        padding: 4px;
        max-height: 155px;
      }

      .mobile-card-carousel {
        height: 118px;
        padding: 4px 4px;
      }

      .card-image {
      height: 100%;
    }
    }
  </style>