/** Shopify CDN: Minification failed

Line 1124:14 Unexpected "{"
Line 1124:23 Expected ":"
Line 1125:14 Unexpected "{"
Line 1125:23 Expected ":"
Line 1133:0 All "@import" rules must come first

**/
/* SHOPIFY_STYLESHEETS_VERSION: 1.0 */


/* CSS from section stylesheet tags */
/* START_SECTION:bomba-about-us (INDEX:2) */
/* ============================================================
     Bomba About Us — Vibrant Local DS
     Warm Off-White surface, Burgundy primary, Copper accent.
     Diffuse Lift shadows, soft 14px radii. No brutalist 4px hard
     shadows, no italic uppercase body, no mint green background.
     ============================================================ */

  /* Above-fold intro animation — mirrors homepage hero pattern */
  @keyframes bombaAboutHeroUp {
    from { opacity: 0; transform: translate3d(0, 28px, 0); }
    to   { opacity: 1; transform: translate3d(0, 0, 0); }
  }
  @keyframes bombaAboutHeroChildUp {
    from { opacity: 0; transform: translate3d(0, 18px, 0); }
    to   { opacity: 1; transform: translate3d(0, 0, 0); }
  }
  .bomba-about__hero-grid {
    animation: bombaAboutHeroUp 700ms cubic-bezier(0.16, 1, 0.3, 1) both;
  }
  .bomba-about__hero-grid > * {
    animation: bombaAboutHeroChildUp 600ms cubic-bezier(0.16, 1, 0.3, 1) both;
  }
  .bomba-about__hero-grid > :nth-child(1) { animation-delay: 80ms; }
  .bomba-about__hero-grid > :nth-child(2) { animation-delay: 220ms; }

  @media (prefers-reduced-motion: reduce) {
    .bomba-about__hero-grid,
    .bomba-about__hero-grid > * { animation: none !important; opacity: 1 !important; transform: none !important; }
  }
  .shopify-design-mode .bomba-about__hero-grid,
  .shopify-design-mode .bomba-about__hero-grid > * { animation: none !important; opacity: 1 !important; transform: none !important; }

  .bomba-about-us {
    width: 100%;
    background: #FFF5F8;
    color: #2B1D24;
    font-family: var(--font-bomba-manrope, 'Manrope', sans-serif);
    overflow-x: hidden;
  }

  .bomba-about-us h1,
  .bomba-about-us h2,
  .bomba-about-us h3 {
    margin: 0;
    font-family: var(--font-bomba-manrope, 'Manrope', sans-serif) !important;
    font-style: normal !important;
    text-transform: none !important;
    letter-spacing: -0.02em !important;
    line-height: 1.05 !important;
  }

  .bomba-about__container {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 1.5rem;
  }

  @media screen and (min-width: 768px) {
    .bomba-about__container {
      padding: 0 3rem;
    }
  }

  /* ---------- 1. Hero ---------- */
  .bomba-about__hero {
    /* Top clears the floating header via the shared global token; only the
       bottom rhythm is section-local. */
    padding: var(--bomba-header-clear) 0 3rem;
    position: relative;
    isolation: isolate;
    overflow: hidden;
  }

  @media screen and (min-width: 768px) {
    .bomba-about__hero {
      padding: var(--bomba-header-clear) 0 3.5rem;
    }
  }

  /* Blush atmosphere — twin drifting blobs mirroring the home hero */
  .bomba-about__hero::before,
  .bomba-about__hero::after {
    content: '';
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
    z-index: -1;
    filter: blur(80px);
  }

  .bomba-about__hero::before {
    top: -18%;
    left: -10%;
    width: 540px;
    height: 540px;
    background: radial-gradient(circle, rgba(212, 154, 137, 0.32) 0%, rgba(212, 154, 137, 0) 65%);
  }

  .bomba-about__hero::after {
    bottom: -32%;
    right: -10%;
    width: 480px;
    height: 480px;
    background: radial-gradient(circle, rgba(223, 168, 188, 0.30) 0%, rgba(223, 168, 188, 0) 65%);
  }

  @media (prefers-reduced-motion: no-preference) {
    .bomba-about__hero::before {
      animation: about-blush-a 22s ease-in-out infinite alternate;
    }
    .bomba-about__hero::after {
      animation: about-blush-b 26s ease-in-out infinite alternate;
    }
  }

  @keyframes about-blush-a {
    from { transform: translate(0, 0); }
    to { transform: translate(40px, 24px); }
  }
  @keyframes about-blush-b {
    from { transform: translate(0, 0); }
    to { transform: translate(-40px, -20px); }
  }

  .bomba-about__hero-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.75rem;
    align-items: end;
  }

  @media screen and (min-width: 900px) {
    .bomba-about__hero-grid {
      grid-template-columns: 1.4fr 1fr;
      gap: 3rem;
    }
  }

  .bomba-about__kicker {
    font-family: var(--font-bomba-manrope);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: #D16B61;
    margin: 0 0 1rem;
  }

  .bomba-about__hero-title {
    font-size: clamp(1.85rem, 3.8vw, 3rem) !important;
    font-weight: 800 !important;
    color: #8A2E52;
    max-width: 18ch;
  }

  .bomba-about__hero-lede p {
    font-family: var(--font-bomba-merriweather, 'Merriweather', serif);
    font-style: italic;
    font-size: clamp(15px, 1.15vw, 17px);
    line-height: 1.6;
    color: #2B1D24;
    opacity: 0.88;
    max-width: 44ch;
    margin: 0;
  }

  /* ---------- 2 + 4. Story sections ---------- */
  .bomba-about__story {
    padding: 3rem 0;
    background: #FFFFFF;
    position: relative;
    isolation: isolate;
    overflow: hidden;
  }

  .bomba-about__story--alt {
    background: #FFF5F8;
  }

  @media screen and (min-width: 768px) {
    .bomba-about__story {
      padding: 4rem 0;
    }
  }

  /* Subtle drifting blush blob accent (one per story section) */
  .bomba-about__story::before {
    content: '';
    position: absolute;
    top: -25%;
    right: -8%;
    width: 360px;
    height: 360px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(212, 154, 137, 0.22) 0%, rgba(212, 154, 137, 0) 65%);
    filter: blur(70px);
    z-index: -1;
    pointer-events: none;
  }

  /* Alt story flips the blob to the opposite side for rhythm */
  .bomba-about__story--alt::before {
    top: auto;
    bottom: -25%;
    right: auto;
    left: -8%;
    background: radial-gradient(circle, rgba(223, 168, 188, 0.22) 0%, rgba(223, 168, 188, 0) 65%);
  }

  @media (prefers-reduced-motion: no-preference) {
    .bomba-about__story::before {
      animation: about-blush-a 28s ease-in-out infinite alternate;
    }
    .bomba-about__story--alt::before {
      animation: about-blush-b 30s ease-in-out infinite alternate;
    }
  }

  .bomba-about__story-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 2rem;
    align-items: center;
  }

  /* Text-leads layout: image is the SMALLER column on desktop, capped
     so nothing busts the fold. Editorial like Ferm Living / Anna+Nina. */
  @media screen and (min-width: 900px) {
    .bomba-about__story-grid {
      grid-template-columns: 5fr 7fr;
      gap: 3.5rem;
    }

    .bomba-about__story-grid--reverse {
      grid-template-columns: 7fr 5fr;
    }

    .bomba-about__story-grid--reverse .bomba-about__story-media {
      order: 2;
    }
  }

  .bomba-about__story-media {
    position: relative;
  }

  .bomba-about__media-frame {
    position: relative;
    overflow: hidden;
    border-radius: 14px;
    aspect-ratio: 5/6;
    background: #FFEEF3;
    box-shadow: 0 10px 24px rgba(43, 29, 36, 0.10);
    /* Hard cap so nothing taller than half the viewport ever ships,
       no matter how wide the column is. Prevents the "image overflows
       the laptop fold" problem on desktop. */
    max-height: min(56vh, 480px);
    margin: 0 auto;
  }

  .bomba-about__media-frame--square {
    aspect-ratio: 4/5;
  }

  .bomba-about__img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transition: transform 1s cubic-bezier(0.16, 1, 0.3, 1);
  }

  .bomba-about__media-frame:hover .bomba-about__img {
    transform: scale(1.04);
  }

  .bomba-about__tag {
    position: absolute;
    top: 1rem;
    left: 1rem;
    background: rgba(138, 46, 82, 0.94);
    backdrop-filter: blur(8px);
    color: #FFF5F8;
    padding: 7px 16px;
    border-radius: 40px;
    font-family: var(--font-bomba-manrope);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    box-shadow: 0 6px 16px rgba(138, 46, 82, 0.25);
  }

  .bomba-about__tag--copper {
    background: rgba(209, 107, 97, 0.94);
    box-shadow: 0 6px 16px rgba(209, 107, 97, 0.28);
  }

  .bomba-about__story-copy {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
  }

  .bomba-about__eyebrow {
    font-family: var(--font-bomba-manrope);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: #D16B61;
  }

  .bomba-about__h2 {
    font-size: clamp(1.5rem, 2.6vw, 2rem) !important;
    font-weight: 800 !important;
    color: #8A2E52;
  }

  .bomba-about__body {
    font-family: var(--font-bomba-manrope);
    font-size: 17px;
    line-height: 1.7;
    color: #2B1D24;
    max-width: 58ch;
  }

  .bomba-about__body p {
    margin: 0 0 1rem;
  }

  .bomba-about__body p:last-child {
    margin-bottom: 0;
  }

  .bomba-about__link {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    color: #8A2E52;
    font-family: var(--font-bomba-manrope);
    font-weight: 800;
    font-size: 13px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    text-decoration: none;
    padding: 8px 0 4px;
    border-bottom: 2px solid transparent;
    transition: border-color 0.25s ease, gap 0.25s ease;
    align-self: flex-start;
    margin-top: 0.5rem;
  }

  .bomba-about__link .material-symbols-outlined {
    font-size: 18px;
    transition: transform 0.25s ease;
  }

  .bomba-about__link:hover,
  .bomba-about__link:focus-visible {
    border-bottom-color: #8A2E52;
    gap: 0.7rem;
    outline: none;
  }

  .bomba-about__link:hover .material-symbols-outlined {
    transform: translateX(3px);
  }

  /* ---------- 3. Trust strip ---------- */
  .bomba-about__trust {
    padding: 2.5rem 0;
    background: #FFF5F8;
  }

  @media screen and (min-width: 768px) {
    .bomba-about__trust {
      padding: 3rem 0;
    }
  }

  .bomba-about__trust-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.5rem;
    align-items: center;
    text-align: center;
  }

  @media screen and (min-width: 768px) {
    .bomba-about__trust-grid {
      grid-template-columns: 1fr auto 1fr auto 1fr;
      gap: 2rem;
    }
  }

  .bomba-about__trust-item {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
  }

  .bomba-about__trust-value {
    font-family: var(--font-bomba-manrope);
    font-size: clamp(1.65rem, 2.6vw, 2.25rem);
    font-weight: 800;
    color: #8A2E52;
    letter-spacing: -0.02em;
    line-height: 1;
  }

  .bomba-about__trust-label {
    font-family: var(--font-bomba-merriweather, 'Merriweather', serif);
    font-style: italic;
    font-size: 13px;
    line-height: 1.5;
    color: #2B1D24;
    opacity: 0.78;
    max-width: 22ch;
    margin: 0 auto;
  }

  .bomba-about__trust-divider {
    display: none;
    width: 1px;
    height: 48px;
    background: rgba(138, 46, 82, 0.18);
  }

  @media screen and (min-width: 768px) {
    .bomba-about__trust-divider {
      display: block;
    }
  }

  /* Optional value blocks (preserved) */
  .bomba-about__values {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 1.25rem;
    margin-top: 2.5rem;
  }

  .bomba-about__value {
    display: flex;
    gap: 1rem;
    align-items: flex-start;
    background: #FFFFFF;
    border-radius: 14px;
    padding: 1.25rem;
    box-shadow: 0 8px 24px rgba(43, 29, 36, 0.06);
  }

  .bomba-about__value-icon {
    flex: 0 0 auto;
    width: 44px;
    height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #FFEEF3;
    color: #8A2E52;
    border-radius: 50%;
    font-size: 22px;
  }

  .bomba-about__value-body h3 {
    font-size: 17px !important;
    font-weight: 800 !important;
    color: #2B1D24;
    margin: 0 0 0.25rem !important;
  }

  .bomba-about__value-body p {
    font-size: 14px;
    line-height: 1.5;
    color: #2B1D24;
    opacity: 0.78;
    margin: 0;
  }

  /* ---------- 5. Testimonial ---------- */
  .bomba-about__quote-wrap {
    padding: 2.75rem 0;
    background: #FFFFFF;
  }

  @media screen and (min-width: 768px) {
    .bomba-about__quote-wrap {
      padding: 3.75rem 0;
    }
  }

  .bomba-about__quote {
    max-width: 760px;
    margin: 0 auto;
    text-align: center;
    position: relative;
    padding: 0 1rem;
  }

  .bomba-about__quote-mark {
    display: block;
    font-family: var(--font-bomba-merriweather, 'Merriweather', serif);
    font-size: clamp(3rem, 5vw, 4.5rem);
    line-height: 0.8;
    color: #D49A89;
    margin-bottom: 0.35rem;
  }

  .bomba-about__quote-text {
    font-family: var(--font-bomba-merriweather, 'Merriweather', serif);
    font-style: italic;
    font-size: clamp(17px, 1.7vw, 22px);
    line-height: 1.45;
    color: #2B1D24;
    margin: 0 0 1.25rem;
  }

  .bomba-about__quote-meta {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
  }

  .bomba-about__quote-author {
    font-family: var(--font-bomba-manrope);
    font-weight: 800;
    font-size: 14px;
    color: #8A2E52;
  }

  .bomba-about__quote-role {
    font-family: var(--font-bomba-manrope);
    font-size: 12px;
    color: #2B1D24;
    opacity: 0.65;
    letter-spacing: 0.04em;
  }

  /* ---------- 6. CTA banner ---------- */
  .bomba-about__cta {
    padding: 3rem 0 4rem;
    background: #FFF5F8;
    position: relative;
    isolation: isolate;
    overflow: hidden;
  }

  @media screen and (min-width: 768px) {
    .bomba-about__cta {
      padding: 3.5rem 0 5rem;
    }
  }

  .bomba-about__cta::before {
    content: '';
    position: absolute;
    top: -20%;
    right: -8%;
    width: 420px;
    height: 420px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(212, 154, 137, 0.28) 0%, rgba(212, 154, 137, 0) 65%);
    filter: blur(80px);
    z-index: -1;
    pointer-events: none;
  }

  @media (prefers-reduced-motion: no-preference) {
    .bomba-about__cta::before {
      animation: about-blush-a 30s ease-in-out infinite alternate;
    }
  }

  .bomba-about__cta-banner {
    background: #FFFFFF;
    border-radius: 14px;
    padding: 1.75rem 1.5rem;
    box-shadow: 0 10px 28px rgba(43, 29, 36, 0.08);
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.25rem;
    align-items: center;
  }

  @media screen and (min-width: 900px) {
    .bomba-about__cta-banner {
      grid-template-columns: 1.4fr 1fr;
      gap: 2.5rem;
      padding: 2.25rem 2.5rem;
    }
  }

  .bomba-about__cta-title {
    margin-bottom: 0.75rem !important;
  }

  .bomba-about__cta-desc {
    font-family: var(--font-bomba-merriweather, 'Merriweather', serif);
    font-style: italic;
    font-size: clamp(15px, 1.15vw, 17px);
    line-height: 1.55;
    color: #2B1D24;
    opacity: 0.85;
    margin: 0 0 1rem;
    max-width: 52ch;
  }

  .bomba-about__cta-meta {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    margin-top: 0.5rem;
  }

  .bomba-about__cta-meta-row {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font-family: var(--font-bomba-manrope);
    font-size: 14px;
    color: #2B1D24;
  }

  .bomba-about__cta-meta-row .material-symbols-outlined {
    font-size: 18px;
    color: #8A2E52;
  }

  .bomba-about__cta-actions {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
  }

  @media screen and (min-width: 500px) {
    .bomba-about__cta-actions {
      flex-direction: row;
      flex-wrap: wrap;
    }
  }

  .bomba-about__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 16px 32px;
    border-radius: 40px;
    font-family: var(--font-bomba-manrope);
    font-weight: 800;
    font-size: 13px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    text-decoration: none;
    transition:
      transform 0.25s cubic-bezier(0.16, 1, 0.3, 1),
      box-shadow 0.25s cubic-bezier(0.16, 1, 0.3, 1),
      background 0.25s ease,
      color 0.25s ease;
  }

  .bomba-about__btn--primary {
    background: #8A2E52;
    color: #FFF5F8;
    box-shadow: 0 10px 30px rgba(138, 46, 82, 0.25);
  }

  .bomba-about__btn--primary:hover,
  .bomba-about__btn--primary:focus-visible {
    transform: translateY(-2px);
    background: #6F2342;
    box-shadow: 0 16px 38px rgba(138, 46, 82, 0.35);
    outline: none;
  }

  .bomba-about__btn--secondary {
    background: transparent;
    color: #8A2E52;
    border: 1.5px solid #8A2E52;
  }

  .bomba-about__btn--secondary:hover,
  .bomba-about__btn--secondary:focus-visible {
    background: #8A2E52;
    color: #FFF5F8;
    transform: translateY(-2px);
    box-shadow: 0 10px 24px rgba(138, 46, 82, 0.22);
    outline: none;
  }

  /* Accessibility — reduced motion */
  @media (prefers-reduced-motion: reduce) {
    .bomba-about__img,
    .bomba-about__btn,
    .bomba-about__link,
    .bomba-about__link .material-symbols-outlined {
      transition: none !important;
    }
  }
/* END_SECTION:bomba-about-us */

/* START_SECTION:bomba-brands-carousel (INDEX:3) */
/* ============================================================
     Bomba Brands Carousel — Vibrant Local DS
     Embla-driven, snap-on-center, soft Surface Lift shadows,
     Burgundy nav buttons with Ambient Glow on hover.
     ============================================================ */
  .brands-marquee__container {
    max-width: 1320px;
    margin: 0 auto;
  }

  /* ---------- Intro ---------- */
  .brands-marquee__intro {
    text-align: center;
    max-width: 640px;
    margin: 0 auto 2.5rem;
    padding: 0 1.5rem;
  }

  .brands-marquee__eyebrow {
    display: block;
    font-family: var(--font-bomba-manrope);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: #D16B61;
    margin-bottom: 0.75rem;
  }

  .brands-marquee__heading {
    font-family: var(--font-bomba-manrope);
    font-size: clamp(1.85rem, 3.4vw, 2.75rem);
    font-weight: 800;
    letter-spacing: -0.02em;
    line-height: 1.05;
    color: #8A2E52;
    margin: 0 0 0.85rem;
  }

  .brands-marquee__lede {
    font-family: var(--font-bomba-merriweather, 'Merriweather', serif);
    font-style: italic;
    font-weight: 400;
    font-size: clamp(14px, 1.05vw, 16px);
    line-height: 1.6;
    color: #2B1D24;
    opacity: 0.85;
    margin: 0;
  }

  /* Short mobile lede hidden by default (desktop shows full text). */
  .brands-marquee__lede--mobile { display: none; }

  @media screen and (max-width: 767px) {
    .brands-marquee__lede--desktop { display: none; }
    .brands-marquee__lede--mobile { display: block; }

    /* Drop the "Stockist van" eyebrow and enlarge the heading so it reads as
       a real anchor (matches Nieuw Binnen / Curated). Desktop unchanged. */
    .brands-marquee__eyebrow { display: none; }
    .brands-marquee__heading { font-size: clamp(2.8rem, 8vw, 3.6rem); }
  }

  /* ---------- Carousel wrapper ---------- */
  .brands-marquee__viewport {
    position: relative;
    width: 100%;
    padding: 0 1.5rem;
  }

  @media screen and (min-width: 768px) {
    .brands-marquee__viewport {
      padding: 0 3.5rem;
    }
  }

  /* ---------- Embla viewport / track ---------- */
  .brands-embla {
    overflow: hidden;
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
  }

  .brands-embla__container {
    display: flex;
    touch-action: pan-y;
    padding: 2rem 0;
    cursor: grab;
  }

  .brands-embla__container:active {
    cursor: grabbing;
  }

  .brands-embla__slide {
    flex: 0 0 70vw;
    min-width: 0;
    padding: 0 0.5rem;
  }

  @media screen and (min-width: 640px) {
    .brands-embla__slide {
      flex: 0 0 44vw;
      padding: 0 0.6rem;
    }
  }

  @media screen and (min-width: 900px) {
    .brands-embla__slide {
      flex: 0 0 30vw;
      padding: 0 0.75rem;
    }
  }

  @media screen and (min-width: 1280px) {
    .brands-embla__slide {
      flex: 0 0 26vw;
    }
  }

  /* ---------- Brand card ---------- */
  .brand-card {
    display: block;
    width: 100%;
    aspect-ratio: 4/5;
    background: #FFFFFF;
    border-radius: 14px;
    overflow: hidden;
    position: relative;
    text-decoration: none;
    color: inherit;
    box-shadow: none;
    transform: scale(0.94);
    opacity: 0.65;
    transition:
      transform 0.55s cubic-bezier(0.16, 1, 0.3, 1),
      opacity 0.55s cubic-bezier(0.16, 1, 0.3, 1),
      box-shadow 0.55s cubic-bezier(0.16, 1, 0.3, 1);
  }

  @media screen and (min-width: 640px) {
    .brand-card {
      aspect-ratio: 1/1;
    }
  }

  .brands-embla__slide.is-selected .brand-card {
    transform: scale(1.04);
    opacity: 1;
    box-shadow: none;
  }

  .brand-card:hover {
    box-shadow: none;
  }

  .brand-card__img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    padding: 0;
    transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
  }

  /* Overlay — gradient + flex container for the text live inside
     the same element (mirrors main branch pattern).               */
  .brand-card__overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(
      to top,
      rgba(0, 0, 0, 0.82) 0%,
      rgba(0, 0, 0, 0.45) 28%,
      rgba(0, 0, 0, 0.10) 55%,
      rgba(0, 0, 0, 0) 75%
    );
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 1.3rem 1.4rem 1.4rem;
    gap: 0.35rem;
    pointer-events: none;
    color: #FFFFFF;
    z-index: 2;
  }

  .brand-card__cta {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-family: var(--font-bomba-manrope, 'Manrope', sans-serif);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: #FFFFFF;
    opacity: 0.92;
    filter: drop-shadow(0 1px 4px rgba(0, 0, 0, 0.6));
  }

  .brand-card__name {
    font-family: var(--font-bomba-manrope, 'Manrope', sans-serif);
    font-size: clamp(1.5rem, 2.2vw, 2rem);
    font-weight: 800;
    letter-spacing: -0.02em;
    line-height: 1.05;
    color: #FFFFFF;
    filter: drop-shadow(0 2px 6px rgba(0, 0, 0, 0.65));
  }

  .brand-card__cta-arrow {
    display: inline-block;
    transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
  }

  .brands-embla__slide.is-selected .brand-card:hover .brand-card__cta-arrow {
    transform: translateX(4px);
  }

  @media screen and (max-width: 639px) {
    .brand-card__overlay { padding: 1rem 1.1rem 1.1rem; gap: 0.3rem; }
    .brand-card__name { font-size: 1.4rem; }
    .brand-card__cta { font-size: 10px; letter-spacing: 0.16em; }
  }

  .brands-embla__slide.is-selected .brand-card:hover .brand-card__img {
    transform: scale(1.04);
  }

  /* Wordmark fallback when no logo image is set */
  .brand-card__wordmark {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1.25rem;
    text-align: center;
    background: linear-gradient(135deg, #FFFAFC 0%, #FFEEF3 100%);
  }

  .brand-card__wordmark-text {
    font-family: var(--font-bomba-manrope);
    font-size: clamp(18px, 2.3vw, 26px);
    font-weight: 800;
    color: #2B1D24;
    letter-spacing: -0.02em;
    line-height: 1.05;
    transition: color 0.3s ease;
  }

  .brand-card:hover .brand-card__wordmark-text {
    color: #8A2E52;
  }

  /* ---------- Nav buttons (desktop) ---------- */
  .brand-nav-btn {
    display: none;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 5;
    width: 52px;
    height: 52px;
    align-items: center;
    justify-content: center;
    background: #FFFFFF;
    color: #8A2E52;
    border: 1px solid rgba(212, 154, 137, 0.5);
    border-radius: 50%;
    cursor: pointer;
    box-shadow: 0 8px 20px rgba(43, 29, 36, 0.08);
    transition:
      transform 0.25s cubic-bezier(0.16, 1, 0.3, 1),
      box-shadow 0.25s cubic-bezier(0.16, 1, 0.3, 1),
      background 0.25s ease,
      color 0.25s ease;
  }

  @media screen and (min-width: 768px) {
    .brand-nav-btn {
      display: inline-flex;
    }
  }

  .brand-nav-btn:hover,
  .brand-nav-btn:focus-visible {
    background: #8A2E52;
    color: #FFF5F8;
    transform: translateY(-50%) scale(1.06);
    box-shadow: 0 12px 28px rgba(138, 46, 82, 0.28);
    outline: none;
    border-color: #8A2E52;
  }

  .brand-nav-btn:active {
    transform: translateY(-50%) scale(0.96);
  }

  .brand-nav-btn--prev { left: 0; }
  .brand-nav-btn--next { right: 0; }

  @media screen and (min-width: 1280px) {
    .brand-nav-btn--prev { left: -8px; }
    .brand-nav-btn--next { right: -8px; }
  }

  .brand-nav-btn .material-symbols-outlined {
    font-size: 26px;
  }

  /* ---------- Controls row: [‹] dots [›] on one line (mobile) ---------- */
  .brand-controls {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1.5rem;
    margin-top: 1.75rem;
    padding: 0 1.5rem;
  }

  /* Mobile prev/next buttons hidden on desktop; side arrows take over. */
  @media screen and (min-width: 768px) {
    .brand-mobile-btn {
      display: none;
    }
  }

  .brand-mobile-btn {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #FFFFFF;
    color: #8A2E52;
    border: 1px solid rgba(212, 154, 137, 0.55);
    border-radius: 50%;
    cursor: pointer;
    box-shadow: 0 6px 16px rgba(43, 29, 36, 0.08);
    transition:
      transform 0.2s cubic-bezier(0.16, 1, 0.3, 1),
      box-shadow 0.2s cubic-bezier(0.16, 1, 0.3, 1),
      background 0.2s ease,
      color 0.2s ease;
  }

  .brand-mobile-btn:hover,
  .brand-mobile-btn:focus-visible {
    background: #8A2E52;
    color: #FFF5F8;
    outline: none;
  }

  .brand-mobile-btn:active {
    transform: scale(0.94);
    box-shadow: 0 3px 10px rgba(43, 29, 36, 0.08);
  }

  .brand-mobile-btn .material-symbols-outlined {
    font-size: 22px;
  }

  /* ---------- Dots (page indicators) ---------- */
  .brand-dots {
    display: flex;
    justify-content: center;
    gap: 0.5rem;
    margin: 0;
    padding: 0;
  }

  .brand-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    border: 0;
    padding: 0;
    background: rgba(43, 29, 36, 0.18);
    cursor: pointer;
    transition: background 0.25s ease, transform 0.25s ease;
  }

  .brand-dot.is-active {
    background: #8A2E52;
    transform: scale(1.4);
  }

  .brand-dot:hover {
    background: rgba(138, 46, 82, 0.55);
  }

  /* Accessibility — reduced motion */
  @media (prefers-reduced-motion: reduce) {
    .brand-card,
    .brand-card__img,
    .brand-nav-btn,
    .brand-mobile-btn,
    .brand-dot,
    #section-{{ section.id }}::before,
    #section-{{ section.id }}::after {
      transition: none !important;
      animation: none !important;
    }
  }
/* END_SECTION:bomba-brands-carousel */

/* START_SECTION:bomba-brands-editorial (INDEX:4) */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;1,300&family=Fredoka:wght@500;600&family=Nunito:wght@200;300&family=Playfair+Display:wght@400&family=Work+Sans:wght@200;300&display=swap');

  .brands-ed {
    width: 100%;
    padding: 5rem 1.5rem;
  }

  @media screen and (min-width: 1024px) {
    .brands-ed {
      padding: 8rem 4rem;
    }
  }

  .brands-ed__container {
    max-width: 1440px;
    margin: 0 auto;
  }

  .brands-ed__intro {
    max-width: 640px;
    margin-bottom: 3.5rem;
  }

  .brands-ed__eyebrow {
    display: block;
    font-family: var(--font-bomba-manrope);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    opacity: 0.7;
    margin-bottom: 1rem;
  }

  .brands-ed__heading {
    font-family: var(--font-bomba-manrope);
    font-size: clamp(2rem, 4vw, 3.25rem);
    font-weight: 800;
    letter-spacing: -0.02em;
    line-height: 1.1;
    margin: 0 0 1rem;
  }

  .brands-ed__lede {
    font-family: var(--font-bomba-merriweather, 'Merriweather', serif);
    font-style: italic;
    font-size: clamp(15px, 1.2vw, 18px);
    line-height: 1.6;
    max-width: 56ch;
    color: #2B1D24;
    opacity: 0.85;
    margin: 0;
  }

  .brands-ed__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 3rem;
  }

  @media screen and (min-width: 768px) {
    .brands-ed__grid {
      grid-template-columns: repeat(2, 1fr);
      gap: 2.5rem;
    }
  }

  @media screen and (min-width: 1024px) {
    .brands-ed__grid {
      grid-template-columns: repeat(3, 1fr);
      gap: 3rem;
    }
  }

  .brands-ed__card {
    display: flex;
    flex-direction: column;
  }

  .brands-ed__media-link {
    display: block;
    text-decoration: none;
  }

  .brands-ed__media {
    position: relative;
    aspect-ratio: 4/5;
    overflow: hidden;
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(43, 29, 36, 0.08);
    transition: transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1),
                box-shadow 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
  }

  .brands-ed__card:hover .brands-ed__media {
    transform: translateY(-4px);
    box-shadow: 0 14px 36px rgba(43, 29, 36, 0.14);
  }

  .brands-ed__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 1s cubic-bezier(0.165, 0.84, 0.44, 1);
  }

  .brands-ed__card:hover .brands-ed__image {
    transform: scale(1.05);
  }

  .brands-ed__body {
    padding: 1.5rem 0.25rem 0;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
  }

  .brand-mark--card {
    color: #2B1D24;
    line-height: 1.05;
    margin: 0;
  }

  .brand-mark--card.brand-mark--anna-nina {
    font-family: 'Linotype Didot', 'Didot', 'Playfair Display', 'GFS Didot', serif;
    font-weight: 400;
    font-size: clamp(1.6rem, 2.2vw, 2rem);
    letter-spacing: 0.02em;
  }

  .brand-mark--card.brand-mark--doing-goods {
    font-family: 'Canela Thin', 'Cormorant Garamond', 'Didot', serif;
    font-weight: 300;
    font-style: italic;
    font-size: clamp(1.8rem, 2.4vw, 2.25rem);
    letter-spacing: 0.03em;
  }

  .brand-mark--card.brand-mark--hkliving {
    font-family: 'Helvetica Neue', 'Helvetica', 'Arial', sans-serif;
    font-weight: 700;
    font-size: clamp(1.4rem, 1.9vw, 1.75rem);
    letter-spacing: -0.03em;
  }

  .brand-mark--card.brand-mark--ib-laursen {
    font-family: 'Work Sans', 'Helvetica Neue', sans-serif;
    font-weight: 200;
    font-size: clamp(1.2rem, 1.6vw, 1.55rem);
    letter-spacing: 0.32em;
    text-transform: uppercase;
  }

  .brand-mark--card.brand-mark--storytiles {
    font-family: 'Bubbledot Coarse Positive', 'Fredoka', 'Manrope', sans-serif;
    font-weight: 600;
    font-size: clamp(1.5rem, 2vw, 1.85rem);
  }

  .brand-mark--card.brand-mark--all-the-luck-in-the-world {
    font-family: 'Nunito', 'Manrope', sans-serif;
    font-weight: 300;
    font-size: clamp(1.2rem, 1.5vw, 1.45rem);
    letter-spacing: 0.02em;
  }

  .brands-ed__tagline {
    font-family: var(--font-bomba-merriweather, 'Merriweather', serif);
    font-style: italic;
    font-size: 15px;
    line-height: 1.55;
    color: #2B1D24;
    opacity: 0.8;
    max-width: 42ch;
    margin: 0;
  }

  .brands-ed__btn {
    display: inline-block;
    align-self: flex-start;
    margin-top: 0.5rem;
    background: transparent;
    color: #8A2E52;
    border: 1px solid #8A2E52;
    border-radius: 8px;
    padding: 12px 28px;
    font-family: var(--font-bomba-manrope);
    font-weight: 700;
    font-size: 13px;
    letter-spacing: 0.04em;
    text-decoration: none;
    transition: all 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
  }

  .brands-ed__btn:hover {
    background: #8A2E52;
    color: #FFF5F8;
    transform: translateY(-2px);
  }
/* END_SECTION:bomba-brands-editorial */

/* START_SECTION:bomba-contact (INDEX:5) */
.bomba-contact {
    --ct-space-2xs: 0.5rem;
    --ct-space-xs: 0.75rem;
    --ct-space-sm: 1rem;
    --ct-space-md: 1.5rem;
    --ct-space-lg: 2.5rem;
    --ct-space-xl: 4rem;
  }

  .bomba-contact__inner {
    max-width: 1280px;
    margin: 0 auto;
  }

  /* ---------- Intro ---------- */
  .bomba-contact__intro {
    max-width: 720px;
    margin: 0 0 var(--ct-space-lg);
  }

  @keyframes bombaContactIntroUp {
    from { opacity: 0; transform: translate3d(0, 22px, 0); }
    to   { opacity: 1; transform: translate3d(0, 0, 0); }
  }

  .bomba-contact__intro > * {
    animation: bombaContactIntroUp 0.8s cubic-bezier(0.16, 1, 0.3, 1) both;
  }
  .bomba-contact__intro > :nth-child(1) { animation-delay: 60ms; }
  .bomba-contact__intro > :nth-child(2) { animation-delay: 180ms; }
  .bomba-contact__intro > :nth-child(3) { animation-delay: 300ms; }

  .bomba-contact__eyebrow {
    font-family: var(--font-bomba-merriweather, 'Merriweather', serif);
    font-style: italic;
    font-weight: 400;
    font-size: 15px;
    letter-spacing: 0.01em;
    color: #D16B61;
    margin: 0 0 var(--ct-space-2xs);
  }

  .bomba-contact__title {
    font-family: var(--font-bomba-manrope);
    font-weight: 800;
    font-size: clamp(2.25rem, 5vw, 3.75rem);
    letter-spacing: -0.02em;
    line-height: 1.04;
    color: #2B1D24;
    margin: 0;
  }

  .bomba-contact__lede {
    font-family: var(--font-bomba-manrope);
    font-weight: 400;
    font-size: clamp(16px, 1.2vw, 18px);
    line-height: 1.6;
    color: #2B1D24;
    opacity: 0.85;
    max-width: 56ch;
    margin: var(--ct-space-md) 0 0;
  }

  /* ---------- Two-column body ---------- */
  .bomba-contact__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--ct-space-lg);
    align-items: stretch;
  }

  @media screen and (min-width: 900px) {
    .bomba-contact__grid {
      grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
      gap: var(--ct-space-xl);
    }
  }

  /* ---------- Left: info panel (committed burgundy) ---------- */
  .bomba-contact__info {
    background: #8A2E52;
    color: #FFF5F8;
    border-radius: 8px;
    padding: var(--ct-space-lg) var(--ct-space-md);
    box-shadow: 0 8px 24px rgba(43, 29, 36, 0.12);
    display: flex;
    flex-direction: column;
    gap: var(--ct-space-md);
  }

  @media screen and (min-width: 900px) {
    .bomba-contact__info {
      padding: var(--ct-space-xl) var(--ct-space-lg);
    }
  }

  .bomba-contact__info-title {
    font-family: var(--font-bomba-manrope);
    font-weight: 800;
    font-size: clamp(1.35rem, 2.2vw, 1.75rem);
    letter-spacing: -0.01em;
    line-height: 1.15;
    margin: 0;
  }

  .bomba-contact__info-lede {
    font-family: var(--font-bomba-merriweather, 'Merriweather', serif);
    font-style: italic;
    font-size: 15px;
    line-height: 1.55;
    opacity: 0.92;
    margin: 0;
  }

  .bomba-contact__meta {
    display: flex;
    flex-direction: column;
    gap: var(--ct-space-sm);
    margin-top: var(--ct-space-2xs);
  }

  .bomba-contact__meta-row {
    display: flex;
    align-items: flex-start;
    gap: var(--ct-space-xs);
    font-family: var(--font-bomba-manrope);
    font-weight: 400;
    font-size: 15px;
    line-height: 1.5;
    color: #FFF5F8;
    text-decoration: none;
  }

  a.bomba-contact__meta-row {
    transition: opacity 0.2s ease;
  }

  a.bomba-contact__meta-row:hover {
    opacity: 0.8;
    text-decoration: underline;
    text-underline-offset: 3px;
  }

  .bomba-contact__meta-row .material-symbols-outlined {
    font-size: 20px !important;
    color: #D49A89 !important;
    flex-shrink: 0;
    margin-top: 1px;
  }

  .bomba-contact__meta-label {
    display: block;
    font-weight: 700;
    font-size: 11px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    opacity: 0.7;
    margin-bottom: 2px;
  }

  .bomba-contact__socials {
    display: flex;
    gap: var(--ct-space-xs);
    margin-top: var(--ct-space-2xs);
  }

  .bomba-contact__social {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 999px;
    border: 1px solid rgba(255, 245, 248, 0.35);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #FFF5F8;
    text-decoration: none;
    transition: background-color 0.25s ease, transform 0.25s ease, border-color 0.25s ease;
  }

  .bomba-contact__social:hover {
    background: #FFF5F8;
    color: #8A2E52;
    border-color: #FFF5F8;
    transform: translateY(-2px);
  }

  .bomba-contact__social .material-symbols-outlined {
    font-size: 20px !important;
    color: inherit !important;
  }

  /* ---------- Map (fills the panel void) ---------- */
  .bomba-contact__map {
    display: flex;
    flex-direction: column;
    gap: var(--ct-space-xs);
    flex: 1 1 auto;
    min-height: 220px;
    margin-top: var(--ct-space-2xs);
  }

  .bomba-contact__map-frame {
    position: relative;
    flex: 1 1 auto;
    min-height: 200px;
    border-radius: 8px;
    overflow: hidden;
    border: 1px solid rgba(255, 245, 248, 0.28);
    box-shadow: inset 0 0 0 1px rgba(43, 29, 36, 0.06),
                0 6px 18px rgba(43, 29, 36, 0.18);
  }

  .bomba-contact__map-frame iframe {
    display: block;
    width: 100%;
    height: 100%;
    border: 0;
    /* gentle warm wash so the map sits inside the burgundy panel */
    filter: saturate(0.92) contrast(0.98);
  }

  .bomba-contact__map-foot {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: var(--ct-space-2xs) var(--ct-space-sm);
  }

  .bomba-contact__map-caption {
    font-family: var(--font-bomba-merriweather, 'Merriweather', serif);
    font-style: italic;
    font-size: 14px;
    line-height: 1.5;
    color: #FFF5F8;
    opacity: 0.9;
    margin: 0;
  }

  .bomba-contact__directions {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-family: var(--font-bomba-manrope);
    font-weight: 700;
    font-size: 13px;
    letter-spacing: 0.04em;
    color: #FFF5F8;
    text-decoration: none;
    white-space: nowrap;
    transition: opacity 0.2s ease;
  }

  .bomba-contact__directions .material-symbols-outlined {
    font-size: 18px !important;
    color: #D49A89 !important;
    transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
  }

  .bomba-contact__directions:hover {
    opacity: 0.85;
    text-decoration: underline;
    text-underline-offset: 3px;
  }

  .bomba-contact__directions:hover .material-symbols-outlined {
    transform: translateX(3px);
  }

  /* ---------- Right: form card ---------- */
  .bomba-contact__card {
    background: #FFFFFF;
    border-radius: 8px;
    padding: var(--ct-space-lg) var(--ct-space-md);
    box-shadow: 0 8px 24px rgba(43, 29, 36, 0.08);
    display: flex;
    flex-direction: column;
    justify-content: center;
  }

  @media screen and (min-width: 900px) {
    .bomba-contact__card {
      padding: var(--ct-space-xl) var(--ct-space-lg);
    }
  }

  .bomba-contact__form {
    display: flex;
    flex-direction: column;
    gap: var(--ct-space-sm);
  }

  .bomba-contact__form-row {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--ct-space-sm);
  }

  @media screen and (min-width: 560px) {
    .bomba-contact__form-row {
      grid-template-columns: 1fr 1fr;
    }
  }

  .bomba-contact__field {
    display: flex;
    flex-direction: column;
    gap: var(--ct-space-2xs);
  }

  .bomba-contact__label {
    font-family: var(--font-bomba-manrope);
    font-weight: 700;
    font-size: 11px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: #2B1D24;
    opacity: 0.75;
  }

  .bomba-contact__input,
  .bomba-contact__textarea {
    width: 100%;
    background: #FFFFFF;
    border: 1px solid rgba(43, 29, 36, 0.2);
    border-radius: 4px;
    padding: 14px 16px;
    font-family: var(--font-bomba-manrope);
    font-weight: 400;
    font-size: 16px;
    line-height: 1.4;
    color: #2B1D24;
    outline: none;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
  }

  .bomba-contact__textarea {
    resize: vertical;
    min-height: 140px;
  }

  .bomba-contact__input::placeholder,
  .bomba-contact__textarea::placeholder {
    color: rgba(43, 29, 36, 0.4);
    font-weight: 400;
  }

  .bomba-contact__input:focus,
  .bomba-contact__textarea:focus {
    border-color: #8A2E52;
    box-shadow: 0 0 0 3px rgba(138, 46, 82, 0.15);
  }

  .bomba-contact__error {
    font-family: var(--font-bomba-manrope);
    font-weight: 600;
    font-size: 13px;
    color: #8A2E52;
    margin: 0;
  }

  .bomba-contact__submit {
    appearance: none;
    -webkit-appearance: none;
    background: #8A2E52;
    color: #FFFFFF;
    border: none;
    border-radius: 8px;
    padding: 16px 32px;
    font-family: var(--font-bomba-manrope);
    font-weight: 700;
    font-size: 15px;
    letter-spacing: 0.02em;
    cursor: pointer;
    box-shadow: 0 10px 30px rgba(138, 46, 82, 0.25);
    transition: transform 0.3s cubic-bezier(0.165, 0.84, 0.44, 1),
                box-shadow 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
    margin-top: var(--ct-space-2xs);
  }

  .bomba-contact__submit:hover {
    transform: translateY(-2px);
    box-shadow: 0 14px 40px rgba(138, 46, 82, 0.35);
  }

  .bomba-contact__submit:focus-visible {
    outline: 2px solid #2B1D24;
    outline-offset: 3px;
  }

  .bomba-contact__privacy {
    font-family: var(--font-bomba-manrope);
    font-weight: 400;
    font-size: 12px;
    line-height: 1.5;
    color: #2B1D24;
    opacity: 0.6;
    margin: 0;
  }

  .bomba-contact__privacy a {
    color: #8A2E52;
    text-decoration: underline;
    text-underline-offset: 2px;
  }

  /* ---------- Success state ---------- */
  .bomba-contact__success {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--ct-space-xs);
    text-align: left;
    padding: var(--ct-space-sm) 0;
  }

  .bomba-contact__success-icon {
    color: #8A2E52 !important;
    font-size: 40px !important;
  }

  .bomba-contact__success-title {
    font-family: var(--font-bomba-manrope);
    font-weight: 800;
    font-size: clamp(1.35rem, 2.2vw, 1.75rem);
    letter-spacing: -0.01em;
    color: #2B1D24;
    margin: 0;
  }

  .bomba-contact__success-body {
    font-family: var(--font-bomba-merriweather, 'Merriweather', serif);
    font-style: italic;
    font-size: 16px;
    line-height: 1.55;
    color: #2B1D24;
    opacity: 0.85;
    margin: 0;
  }

  @media (prefers-reduced-motion: reduce) {
    .bomba-contact__intro > * {
      animation: none !important;
      opacity: 1 !important;
      transform: none !important;
    }
    .bomba-contact__submit,
    .bomba-contact__input,
    .bomba-contact__textarea,
    .bomba-contact__social,
    .bomba-contact__directions,
    .bomba-contact__directions .material-symbols-outlined {
      transition: none;
    }
    .bomba-contact__submit:hover,
    .bomba-contact__social:hover {
      transform: none;
    }
    .bomba-contact__directions:hover .material-symbols-outlined {
      transform: none;
    }
  }

  .shopify-design-mode .bomba-contact__intro > * {
    animation: none !important;
    opacity: 1 !important;
    transform: none !important;
  }
/* END_SECTION:bomba-contact */

/* START_SECTION:bomba-curated-collections (INDEX:6) */
/* ============================================================
     Bomba Curated — Shop-the-look mosaic
     ONE editorial lifestyle photo + real product grid + ONE
     Restorff Burgundy CTA. Replaces the two-card scene duo.
     ============================================================ */
  .bomba-curated {
    width: 100%;
    padding: 4rem 1.5rem;
  }

  @media screen and (min-width: 1024px) {
    .bomba-curated {
      padding: 5.5rem 4rem;
    }
  }

  .bomba-curated__container {
    max-width: 1320px;
    margin: 0 auto;
  }

  /* ---------- Intro ---------- */
  .bomba-curated__intro {
    max-width: 640px;
    margin-bottom: 2.5rem;
  }

  .bomba-curated__eyebrow-section {
    display: block;
    font-family: var(--font-bomba-manrope);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: #D16B61;
    margin-bottom: 0.75rem;
  }

  .bomba-curated__heading {
    font-family: var(--font-bomba-manrope);
    font-size: clamp(1.85rem, 3.4vw, 2.75rem);
    font-weight: 800;
    letter-spacing: -0.02em;
    line-height: 1.05;
    color: #8A2E52;
    margin: 0 0 0.75rem;
  }

  .bomba-curated__lede {
    font-family: var(--font-bomba-merriweather, 'Merriweather', serif);
    font-style: italic;
    font-weight: 400;
    font-size: clamp(14px, 1.05vw, 16px);
    line-height: 1.6;
    max-width: 56ch;
    color: #2B1D24;
    opacity: 0.85;
    margin: 0;
  }

  /* Short mobile lede hidden by default (desktop shows full text). */
  .bomba-curated__lede--mobile { display: none; }

  /* ---------- Mosaic: lifestyle (5fr) + product grid (7fr) ---------- */
  .bomba-curated__mosaic {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.5rem;
    align-items: stretch;
  }

  @media screen and (min-width: 1024px) {
    .bomba-curated__mosaic {
      grid-template-columns: 5fr 7fr;
      gap: 2.5rem;
    }
  }

  /* ---------- Lifestyle photo (LEFT) ---------- */
  .bomba-curated__lifestyle {
    position: relative;
    overflow: hidden;
    border-radius: 14px;
    aspect-ratio: 4/5;
    background: #FFEEF3;
    box-shadow: 0 8px 24px rgba(43, 29, 36, 0.08);
    text-decoration: none;
    color: inherit;
    isolation: isolate;
    transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1),
                box-shadow 0.4s cubic-bezier(0.16, 1, 0.3, 1);
  }

  @media screen and (min-width: 1024px) {
    .bomba-curated__lifestyle {
      aspect-ratio: auto;
      height: 100%;
      align-self: stretch;
    }
  }

  .bomba-curated__lifestyle:hover {
    transform: translateY(-3px);
    box-shadow: 0 18px 38px rgba(138, 46, 82, 0.16);
  }

  .bomba-curated__lifestyle-img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transform-origin: center center;
    animation: bombaKenBurns 16s cubic-bezier(0.4, 0, 0.6, 1) infinite alternate;
    will-change: transform;
    z-index: 0;
  }

  @keyframes bombaKenBurns {
    0%   { transform: scale(1.02) translate3d(0.5%, 0.5%, 0); }
    100% { transform: scale(1.14) translate3d(-3%, -2%, 0); }
  }

  @media (prefers-reduced-motion: reduce) {
    .bomba-curated__lifestyle-img { animation: none !important; }
  }
  .shopify-design-mode .bomba-curated__lifestyle-img {
    animation: none !important;
  }

  .bomba-curated__lifestyle-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(
      to top,
      rgba(0, 0, 0, 0.82) 0%,
      rgba(0, 0, 0, 0.45) 28%,
      rgba(0, 0, 0, 0.10) 55%,
      rgba(0, 0, 0, 0) 75%
    );
    padding: 1.75rem 1.75rem 1.65rem;
    color: #FFF5F8;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    gap: 0.5rem;
    z-index: 2;
  }

  @media screen and (min-width: 1024px) {
    .bomba-curated__lifestyle-overlay {
      padding: 2.25rem 2.25rem 2rem;
    }
  }

  .bomba-curated__lifestyle-eyebrow {
    font-family: var(--font-bomba-merriweather, 'Merriweather', serif);
    font-style: italic;
    font-size: 14px;
    font-weight: 400;
    color: #FFD4DE;
    margin: 0;
  }

  .bomba-curated__lifestyle-title {
    font-family: var(--font-bomba-manrope);
    font-size: clamp(1.6rem, 2.6vw, 2.25rem);
    font-weight: 800;
    letter-spacing: -0.02em;
    line-height: 1.05;
    color: #FFF5F8;
    margin: 0;
    text-shadow: 0 2px 12px rgba(0, 0, 0, 0.22);
  }

  .bomba-curated__lifestyle-arrow {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    color: #FFF5F8;
    font-family: var(--font-bomba-manrope);
    font-weight: 800;
    font-size: 12px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    margin-top: 0.5rem;
    border-bottom: 2px solid rgba(255, 245, 248, 0.5);
    padding-bottom: 4px;
    align-self: flex-start;
    transition: border-color 0.25s ease, gap 0.25s ease;
  }

  .bomba-curated__lifestyle-arrow::after {
    content: '\2192';
    font-size: 15px;
    transition: transform 0.25s ease;
  }

  .bomba-curated__lifestyle:hover .bomba-curated__lifestyle-arrow {
    border-bottom-color: #FFF5F8;
    gap: 0.6rem;
  }

  .bomba-curated__lifestyle:hover .bomba-curated__lifestyle-arrow::after {
    transform: translateX(3px);
  }

  .bomba-curated__lifestyle-tag {
    position: absolute;
    top: 1.25rem;
    left: 1.25rem;
    background: rgba(138, 46, 82, 0.94);
    backdrop-filter: blur(8px);
    color: #FFF5F8;
    padding: 6px 14px;
    border-radius: 40px;
    font-family: var(--font-bomba-manrope);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    box-shadow: 0 6px 16px rgba(138, 46, 82, 0.25);
    z-index: 2;
  }

  /* ---------- Product grid (RIGHT) ---------- */
  .bomba-curated__products-wrap {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
  }

  .bomba-curated__products {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
  }

  @media screen and (min-width: 700px) {
    .bomba-curated__products {
      grid-template-columns: repeat(3, 1fr);
      gap: 1.1rem;
    }
  }

  @media screen and (min-width: 1024px) {
    .bomba-curated__products {
      gap: 1.25rem;
    }
  }

  .bomba-curated__product {
    display: flex;
    flex-direction: column;
    text-decoration: none;
    color: inherit;
    transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
  }

  .bomba-curated__product:hover {
    transform: translateY(-3px);
  }

  .bomba-curated__product-media {
    position: relative;
    overflow: hidden;
    border-radius: 10px;
    aspect-ratio: 1/1;
    background: #FFFAFC;
    box-shadow: 0 6px 18px rgba(43, 29, 36, 0.06);
    margin-bottom: 0.65rem;
    transition: box-shadow 0.3s cubic-bezier(0.16, 1, 0.3, 1);
  }

  .bomba-curated__product:hover .bomba-curated__product-media {
    box-shadow: 0 12px 28px rgba(138, 46, 82, 0.14);
  }

  .bomba-curated__product-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.7s cubic-bezier(0.16, 1, 0.3, 1);
  }

  .bomba-curated__product:hover .bomba-curated__product-img {
    transform: scale(1.06);
  }

  .bomba-curated__product-name {
    font-family: var(--font-bomba-manrope);
    font-size: 14px;
    font-weight: 600;
    line-height: 1.3;
    color: #2B1D24;
    margin: 0 0 0.15rem;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    transition: color 0.2s ease;
  }

  .bomba-curated__product:hover .bomba-curated__product-name {
    color: #8A2E52;
  }

  .bomba-curated__product-price {
    font-family: var(--font-bomba-manrope);
    font-size: 14px;
    font-weight: 700;
    color: #8A2E52;
    margin: 0;
  }

  .bomba-curated__product-price--compare {
    text-decoration: line-through;
    font-weight: 500;
    color: #2B1D24;
    opacity: 0.55;
    margin-right: 0.4rem;
  }

  .bomba-curated__product-price-row {
    display: flex;
    align-items: baseline;
    gap: 0.25rem;
  }

  /* ---------- Placeholder products (no collection set) ---------- */
  .bomba-curated__product-placeholder .bomba-curated__product-media {
    background: linear-gradient(135deg, #FFEEF3 0%, #FFF5F8 100%);
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .bomba-curated__product-placeholder .bomba-curated__product-media::before {
    content: '';
    width: 36%;
    height: 36%;
    border-radius: 50%;
    background: rgba(138, 46, 82, 0.12);
    animation: bombaPlaceholderPulse 3.2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
  }

  @keyframes bombaPlaceholderPulse {
    0%, 100% { transform: scale(1);    opacity: 0.7; }
    50%      { transform: scale(1.18); opacity: 1; }
  }

  /* Stagger so placeholders breathe out of sync, less robotic */
  .bomba-curated__products > :nth-child(1) .bomba-curated__product-media::before { animation-delay: 0ms; }
  .bomba-curated__products > :nth-child(2) .bomba-curated__product-media::before { animation-delay: 240ms; }
  .bomba-curated__products > :nth-child(3) .bomba-curated__product-media::before { animation-delay: 480ms; }
  .bomba-curated__products > :nth-child(4) .bomba-curated__product-media::before { animation-delay: 720ms; }
  .bomba-curated__products > :nth-child(5) .bomba-curated__product-media::before { animation-delay: 960ms; }
  .bomba-curated__products > :nth-child(6) .bomba-curated__product-media::before { animation-delay: 1200ms; }

  @media (prefers-reduced-motion: reduce) {
    .bomba-curated__product-placeholder .bomba-curated__product-media::before {
      animation: none !important;
    }
  }

  /* ---------- Primary CTA (Restorff isolation) ----------
     Lives BELOW the mosaic, centered across the full container so
     it visually anchors both the lifestyle photo and product grid. */
  .bomba-curated__cta-wrap {
    display: flex;
    justify-content: center;
    margin-top: 2rem;
  }

  @media screen and (min-width: 1024px) {
    .bomba-curated__cta-wrap {
      margin-top: 2.5rem;
    }
  }

  .bomba-curated__cta {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    background: #8A2E52;
    color: #FFF5F8;
    padding: 16px 36px;
    border-radius: 40px;
    font-family: var(--font-bomba-manrope);
    font-weight: 800;
    font-size: 14px;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    text-decoration: none;
    box-shadow: 0 10px 30px rgba(138, 46, 82, 0.25);
    transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1),
                box-shadow 0.25s cubic-bezier(0.16, 1, 0.3, 1),
                background 0.25s ease;
  }

  .bomba-curated__cta::after {
    content: '\2192';
    font-size: 17px;
    transition: transform 0.25s ease;
  }

  .bomba-curated__cta:hover,
  .bomba-curated__cta:focus-visible {
    transform: translateY(-2px);
    background: #6F2342;
    box-shadow: 0 16px 38px rgba(138, 46, 82, 0.35);
    outline: none;
  }

  .bomba-curated__cta:hover::after,
  .bomba-curated__cta:focus-visible::after {
    transform: translateX(4px);
  }

  @media (prefers-reduced-motion: reduce) {
    .bomba-curated__lifestyle,
    .bomba-curated__lifestyle-img,
    .bomba-curated__product,
    .bomba-curated__product-media,
    .bomba-curated__product-img,
    .bomba-curated__cta {
      transition: none !important;
      animation: none !important;
    }
  }

  /* ── Mobile: less intro text + slightly shorter Sharon's Pick card ── */
  @media screen and (max-width: 767px) {
    .bomba-curated__lede--desktop { display: none; }
    .bomba-curated__lede--mobile { display: block; }

    /* Center + enlarge the intro on phones, matching the Nieuw Binnen header.
       Heading jumps from ~18px to ~28–36px so it reads as a real anchor;
       eyebrow + lede center under it. Desktop stays left-aligned. */
    .bomba-curated__intro { max-width: 100%; text-align: center; }
    .bomba-curated__heading { font-size: clamp(2.8rem, 8vw, 3.6rem); }
    .bomba-curated__lede { margin-left: auto; margin-right: auto; }

    /* Trim the lifestyle card height: 4/5 (h = 1.25w) → 5/6 (h = 1.2w). */
    .bomba-curated__lifestyle {
      aspect-ratio: 5 / 6;
    }

    /* Show only the first 2 products on mobile; the rest is too much. */
    .bomba-curated__products > :nth-child(n + 3) {
      display: none;
    }
  }
/* END_SECTION:bomba-curated-collections */

/* START_SECTION:bomba-footer (INDEX:7) */
.bomba-footer {
    background-color: var(--color-bomba-black);
    color: var(--color-bomba-white);
    padding: 100px 0 40px;
    width: 100%;
    border-top: 2px solid var(--color-bomba-black);
  }

  .bomba-footer__mission {
    max-width: 1200px;
    margin: 0 auto 80px;
    padding: 0 20px;
  }

  .bomba-footer__mission-text {
    font-family: 'Manrope', sans-serif;
    font-weight: 800;
    font-size: clamp(3rem, 12vw, 8rem);
    line-height: 0.85;
    letter-spacing: -0.06em;
    text-transform: uppercase;
    color: var(--color-bomba-white);
    margin: 0;
  }

  .bomba-footer__grid {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 40px;
    border-top: 1px solid rgba(255,255,255,0.1);
    padding-top: 60px;
  }

  .bomba-footer__col-title {
    font-family: 'Manrope', sans-serif;
    font-weight: 800;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    margin-bottom: 25px;
    color: var(--color-bomba-white);
  }

  .bomba-footer__links {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
  }

  .bomba-footer__link a {
    font-family: 'Manrope', sans-serif;
    font-weight: 700;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: rgba(255,255,255,0.6);
    text-decoration: none;
    transition: color 0.2s ease;
  }

  .bomba-footer__link a:hover {
    color: var(--color-bomba-white);
  }

  .bomba-footer__bottom {
    max-width: 1200px;
    margin: 80px auto 0;
    padding: 40px 20px 0;
    border-top: 1px solid rgba(255,255,255,0.1);
    display: flex;
    justify-content: space-between;
    align-items: center;
  }

  .bomba-footer__copyright {
    font-family: 'Manrope', sans-serif;
    font-weight: 700;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: rgba(255,255,255,0.4);
  }

  .bomba-footer__payments {
    display: flex;
    flex-wrap: wrap;          /* 10 payment icons (≈470px) would force a
                                 nowrap row wider than a phone viewport →
                                 horizontal page overflow. Let them wrap. */
    justify-content: center;
    gap: 10px;
    max-width: 100%;
    opacity: 0.6;
    filter: invert(1);
  }

  /* ── Openingstijden block ── */
  .bomba-footer__hours {
    display: flex;
    flex-direction: column;
    gap: 12px;
  }

  .bomba-footer__hours-row {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    font-family: 'Manrope', sans-serif;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: rgba(255,255,255,0.6);
  }

  @media screen and (max-width: 1024px) {
    .bomba-footer__hours-row {
      justify-content: flex-start;
      gap: 8px;
    }
    .bomba-footer__hours-time {
      text-align: left;
    }
  }

  @media screen and (max-width: 768px) {
    .bomba-footer__hours-row {
      justify-content: center;
    }
  }

  .bomba-footer__hours-row--today {
    color: #fff;
  }

  .bomba-footer__hours-day {
    flex-shrink: 0;
  }

  .bomba-footer__hours-time {
    text-align: right;
  }

  .bomba-footer__hours-note {
    margin-top: 10px;
    font-family: 'Manrope', sans-serif;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.03em;
    color: rgba(255,255,255,0.35);
    line-height: 1.5;
  }

  /* ── Socials block ── */
  .bomba-footer__socials {
    display: flex;
    gap: 16px;
    align-items: center;
    margin-top: 4px;
  }

  .bomba-footer__social-link {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: rgba(255,255,255,0.08);
    transition: background 0.2s ease, transform 0.2s ease;
    text-decoration: none;
  }

  .bomba-footer__social-link:hover {
    background: rgba(255,255,255,0.18);
    transform: translateY(-2px);
  }

  .bomba-footer__social-link svg {
    width: 20px;
    height: 20px;
    fill: rgba(255,255,255,0.75);
    display: block;
  }

  .bomba-footer__social-link:hover svg {
    fill: #fff;
  }

  @media screen and (max-width: 1024px) {
    .bomba-footer__grid {
      grid-template-columns: repeat(2, 1fr);
    }
  }

  @media screen and (max-width: 768px) {
    .bomba-footer {
      padding: 60px 0 30px;
    }
    .bomba-footer__grid {
      grid-template-columns: 1fr;
      text-align: center;
    }
    .bomba-footer__links {
      align-items: center;
    }
    .bomba-footer__socials {
      justify-content: center;
    }
    .bomba-footer__bottom {
      flex-direction: column-reverse;
      gap: 30px;
    }
    .bomba-footer__mission-text {
      text-align: center;
    }
  }
/* END_SECTION:bomba-footer */

/* START_SECTION:bomba-hero (INDEX:9) */
/* Above-fold intro animation — pure CSS, no JS dependency.
     animation-fill-mode: both = element starts at `from` state, ends at `to`.
     Plays on every page load (cold load, navigation, bfcache restore on parse). */
  @keyframes bombaHeroUp {
    from { opacity: 0; transform: translate3d(0, 28px, 0); }
    to   { opacity: 1; transform: translate3d(0, 0, 0); }
  }
  @keyframes bombaHeroChildUp {
    from { opacity: 0; transform: translate3d(0, 18px, 0); }
    to   { opacity: 1; transform: translate3d(0, 0, 0); }
  }
  .bomba-hero-grid {
    animation: bombaHeroUp 700ms cubic-bezier(0.16, 1, 0.3, 1) both;
  }
  .bomba-hero-grid > * {
    animation: bombaHeroChildUp 600ms cubic-bezier(0.16, 1, 0.3, 1) both;
  }
  .bomba-hero-grid > :nth-child(1) { animation-delay: 80ms; }
  .bomba-hero-grid > :nth-child(2) { animation-delay: 220ms; }

  @media (prefers-reduced-motion: reduce) {
    .bomba-hero-grid,
    .bomba-hero-grid > * { animation: none !important; opacity: 1 !important; transform: none !important; }
  }
  .shopify-design-mode .bomba-hero-grid,
  .shopify-design-mode .bomba-hero-grid > * { animation: none !important; opacity: 1 !important; transform: none !important; }

  .bomba-hero {
    overflow: hidden;
    position: relative;
    width: 100%;
    min-height: 100vh;
    display: flex;
    align-items: center;
    isolation: isolate;
  }

  .bomba-hero::before,
  .bomba-hero::after {
    content: '';
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
    z-index: 0;
    filter: blur(60px);
  }

  .bomba-hero::before {
    top: -8%;
    left: -10%;
    width: 520px;
    height: 520px;
    background: radial-gradient(circle, rgba(212, 154, 137, 0.55) 0%, rgba(212, 154, 137, 0) 65%);
  }

  .bomba-hero::after {
    bottom: 8%;
    right: -8%;
    width: 560px;
    height: 560px;
    background: radial-gradient(circle, rgba(212, 154, 137, 0.45) 0%, rgba(212, 154, 137, 0) 65%);
    filter: blur(80px);
  }

  @media (prefers-reduced-motion: no-preference) {
    .bomba-hero::before {
      animation: bomba-hero-drift-a 18s ease-in-out infinite alternate;
    }
    .bomba-hero::after {
      animation: bomba-hero-drift-b 22s ease-in-out infinite alternate;
    }
  }

  @keyframes bomba-hero-drift-a {
    from { transform: translate(0, 0); }
    to { transform: translate(40px, 30px); }
  }
  @keyframes bomba-hero-drift-b {
    from { transform: translate(0, 0); }
    to { transform: translate(-50px, -25px); }
  }

  .bomba-hero-container {
    width: 100%;
    max-width: 1440px;
    margin: 0 auto;
    padding: 8rem 1.25rem 3rem;
    position: relative;
    z-index: 1;
  }

  @media screen and (min-width: 1024px) {
    .bomba-hero-container {
      padding: 11rem 4rem 4rem;
    }
  }

  .bomba-hero-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 3rem;
    align-items: center;
    position: relative;
  }

  @media screen and (min-width: 1024px) {
    .bomba-hero-grid {
      grid-template-columns: 1.25fr 0.75fr;
      gap: 5rem;
    }
  }

  .bomba-hero__content {
    display: flex;
    flex-direction: column;
    gap: 3.5rem;
    z-index: 10;
  }

  .bomba-hero__text {
    position: relative;
  }

  .bomba-hero__tag {
    font-weight: normal;
    opacity: 0.6;
    margin-bottom: 1rem;
  }

  .bomba-hero__title {
    line-height: 1.2 !important;
    margin: 0;
    margin-left: -0.1em;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
  }

  .pyramid-line {
    display: block;
    white-space: nowrap;
    width: fit-content;
  }

  .bomba-hero__title-line {
    display: block;
    margin-bottom: 0.4rem;
  }

  .bomba-hero__subtitle {
    margin-top: 2rem;
    line-height: 1.8;
    position: relative;
    max-width: 800px;
    text-align: left;
    font-weight: 700;
  }

  @media screen and (max-width: 1023px) {
    .bomba-hero__subtitle {
      max-width: 100%;
    }
  }

  .bomba-hero__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 1.5rem;
  }

  .bomba-hero__visual {
    position: relative;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  /* Mobile-only elements are hidden by default (desktop). */
  .bomba-hero__subtitle--mobile { display: none; }
  .bomba-hero__collections-kicker { display: none; }
  .bomba-hero__trust-mobile { display: none; }

  /* ── Mobile / tablet portrait: conversion-first hero ──
     Order seen first: social proof (tagline) → headline → short subline
     → CTA → trust micro-copy. The collection cards leave the hero and
     become a labelled "Shop onze collecties" swipe row BELOW the CTA,
     so the money action and proof sit above the fold. */
  @media screen and (max-width: 1023px) {
    .bomba-hero {
      min-height: auto;
      align-items: flex-start;
    }

    .bomba-hero-container {
      padding-top: 8rem;
    }

    .bomba-hero-grid {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 2.75rem;
    }

    .bomba-hero__content {
      align-items: center;
      text-align: center;
      gap: 1.75rem;
    }

    .bomba-hero__title {
      align-items: center;
      margin-left: 0;
      text-align: center;
    }

    /* Swap the long paragraph for the short mobile subline. */
    .bomba-hero__subtitle--desktop { display: none; }
    .bomba-hero__subtitle--mobile {
      display: block;
      margin: 0.75rem auto 0;
      max-width: 34ch;
      line-height: 1.5;
      text-align: center;
    }

    /* Give the CTA air above it so it reads as its own focal element. */
    .bomba-hero__actions {
      justify-content: center;
      width: 100%;
      margin-top: 0.75rem;
    }

    /* One compact, scannable trust line under the CTA (replaces the two
       tracked-caps blobs). Mixed case + middots reads calmer than caps. */
    .bomba-hero__trust-mobile {
      display: block;
      margin: 1.5rem auto 0;
      text-align: center;
      color: #8A2E52;
      font-family: var(--font-bomba-manrope);
      font-weight: 600;
      font-size: 12.5px;
      letter-spacing: 0.02em;
      line-height: 1.5;
    }

    /* Cards as a labelled collection swipe row under the CTA. */
    .bomba-hero__visual {
      flex-direction: column;
      align-items: stretch;
      width: 100%;
      gap: 0.85rem;
    }

    .bomba-hero__collections-kicker {
      display: block;
      margin: 0;
      text-align: center;
      color: #8A2E52;
      font-family: var(--font-bomba-manrope) !important;
      font-weight: 700;
      font-size: 12px;
      letter-spacing: 0.16em;
      text-transform: uppercase;
    }
  }

  /* ── Laptop band: short wide viewports — tighten vertical rhythm so the
     two-column hero clears 100vh under the floating header instead of
     overflowing. Keyed on height; tall monitors keep the roomy desktop
     spacing. Placed last so it wins the source-order tiebreak against the
     min-width:1024px desktop block above (equal specificity, no !important).
     Top padding stays at 8rem (80px) to clear the ~73px floating header. */
  @media screen and (min-width: 1024px) and (max-height: 900px) {
    .bomba-hero-container {
      padding: 8rem 4rem 3rem;
    }
    .bomba-hero-grid {
      gap: 4rem;
    }
    .bomba-hero__content {
      gap: 2.25rem;
    }
    .bomba-hero__subtitle {
      margin-top: 1.25rem;
      line-height: 1.6;
    }
    .bomba-hero__actions {
      gap: 1.25rem;
    }
  }
/* END_SECTION:bomba-hero */

/* START_SECTION:bomba-newsletter (INDEX:10) */
.bomba-newsletter {
    --nl-cream: #FFF5F8;
    --nl-burgundy: #8A2E52;
    --nl-espresso: #2B1D24;
    position: relative;
  }

  /* Faint tactile grain so the drench reads as a surface, not a flat fill. */
  .bomba-newsletter::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image: radial-gradient(rgba(255, 245, 248, 0.06) 1px, transparent 1px);
    background-size: 24px 24px;
    opacity: 0.5;
    pointer-events: none;
  }

  .bomba-nl__inner {
    position: relative;
    z-index: 1;
    max-width: 620px;
    margin: 0 auto;
    text-align: center;
    color: var(--nl-cream);
  }

  /* ------- Heading block ------- */
  .bomba-nl__head {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.6rem;
  }

  .bomba-nl__eyebrow {
    font-family: var(--font-bomba-manrope);
    font-weight: 700;
    font-size: 11px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--nl-cream);
    opacity: 0.85;
    margin: 0;
  }

  .bomba-nl__heading {
    font-family: var(--font-bomba-manrope) !important;
    font-weight: 800 !important;
    font-style: normal !important;
    text-transform: none !important;
    font-size: clamp(2rem, 4.6vw, 3.1rem);
    letter-spacing: -0.025em !important;
    line-height: 1.04 !important;
    color: var(--nl-cream);
    margin: 0;
  }

  .bomba-nl__lede {
    font-family: var(--font-bomba-merriweather, 'Merriweather', serif);
    font-style: italic;
    font-weight: 400;
    font-size: clamp(15px, 1.2vw, 17px);
    line-height: 1.55;
    color: var(--nl-cream);
    opacity: 0.9;
    max-width: 46ch;
    margin: 0.2rem auto 0;
  }

  /* ------- Form ------- */
  .bomba-nl__form {
    margin: 2.25rem auto 0;
    max-width: 520px;
  }

  .bomba-nl__row {
    display: flex;
    gap: 0.75rem;
    align-items: stretch;
  }

  .bomba-nl__field { flex: 1; min-width: 0; }

  .bomba-nl__sr-only {
    position: absolute;
    width: 1px; height: 1px;
    padding: 0; margin: -1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
    border: 0;
  }

  /* Ghost field: belongs to the band rather than floating as a white block. */
  .bomba-nl__input {
    width: 100%;
    background: rgba(255, 245, 248, 0.12);
    border: 1.5px solid rgba(255, 245, 248, 0.5);
    border-radius: 8px;
    padding: 15px 22px;
    font-family: var(--font-bomba-manrope);
    font-weight: 400;
    font-size: 16px;
    line-height: 1.4;
    color: var(--nl-cream);
    outline: none;
    transition: border-color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease;
  }
  .bomba-nl__input::placeholder { color: rgba(255, 245, 248, 0.6); }
  .bomba-nl__input:focus {
    border-color: var(--nl-cream);
    background: rgba(255, 245, 248, 0.18);
    box-shadow: 0 0 0 3px rgba(255, 245, 248, 0.25);
  }

  /* Cream button, burgundy label: brightest, most-isolated element on the band. */
  .bomba-nl__submit {
    appearance: none;
    -webkit-appearance: none;
    flex-shrink: 0;
    background: var(--nl-cream);
    color: var(--nl-burgundy);
    border: none;
    border-radius: 8px;
    padding: 15px 30px;
    font-family: var(--font-bomba-manrope);
    font-weight: 800;
    font-size: 15px;
    letter-spacing: 0.02em;
    white-space: nowrap;
    cursor: pointer;
    box-shadow: 0 10px 30px rgba(43, 29, 36, 0.28);
    transition: transform 0.3s cubic-bezier(0.165, 0.84, 0.44, 1),
                box-shadow 0.3s cubic-bezier(0.165, 0.84, 0.44, 1),
                background-color 0.2s ease;
  }
  .bomba-nl__submit:hover {
    background: #FFFFFF;
    transform: translateY(-2px);
    box-shadow: 0 16px 40px rgba(43, 29, 36, 0.36);
  }
  .bomba-nl__submit:focus-visible {
    outline: 2px solid var(--nl-espresso);
    outline-offset: 3px;
  }

  .bomba-nl__error {
    font-family: var(--font-bomba-manrope);
    font-weight: 600;
    font-size: 13px;
    color: var(--nl-cream);
    margin: 0.75rem 0 0;
  }

  /* ------- Trust + privacy ------- */
  .bomba-nl__trust {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 0.4rem 0.65rem;
    font-family: var(--font-bomba-manrope);
    font-weight: 600;
    font-size: 13px;
    letter-spacing: 0.02em;
    color: var(--nl-cream);
    opacity: 0.82;
    margin: 1.4rem 0 0;
  }
  .bomba-nl__trust-sep { opacity: 0.45; }

  .bomba-nl__privacy {
    font-family: var(--font-bomba-manrope);
    font-weight: 400;
    font-size: 12px;
    line-height: 1.5;
    color: var(--nl-cream);
    opacity: 0.7;
    max-width: 46ch;
    margin: 0.8rem auto 0;
  }
  .bomba-nl__privacy a {
    color: var(--nl-cream);
    text-decoration: underline;
    text-underline-offset: 2px;
  }

  /* ------- Success state ------- */
  .bomba-nl__success {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
  }
  .bomba-nl__success-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 60px; height: 60px;
    border-radius: 50%;
    background: rgba(255, 245, 248, 0.15);
    color: var(--nl-cream);
    margin-bottom: 0.5rem;
  }
  .bomba-nl__success-icon .material-symbols-outlined { font-size: 32px !important; }
  .bomba-nl__success-title {
    font-family: var(--font-bomba-manrope);
    font-weight: 800;
    font-size: clamp(1.4rem, 3vw, 1.9rem);
    letter-spacing: -0.02em;
    color: var(--nl-cream);
    margin: 0;
  }
  .bomba-nl__success-body {
    font-family: var(--font-bomba-merriweather, 'Merriweather', serif);
    font-style: italic;
    font-size: clamp(15px, 1.2vw, 17px);
    line-height: 1.55;
    color: var(--nl-cream);
    opacity: 0.9;
    max-width: 42ch;
    margin: 0;
  }

  /* ------- Mobile: stack the control ------- */
  @media screen and (max-width: 600px) {
    .bomba-nl__row { flex-direction: column; }
    .bomba-nl__submit { width: 100%; }
  }

  @media (prefers-reduced-motion: reduce) {
    .bomba-nl__submit,
    .bomba-nl__input { transition: none; }
    .bomba-nl__submit:hover { transform: none; }
  }
/* END_SECTION:bomba-newsletter */

/* START_SECTION:bomba-reviews (INDEX:15) */
.bomba-reviews {
    --rv-space-3xs: 0.25rem;
    --rv-space-2xs: 0.5rem;
    --rv-space-xs: 0.75rem;
    --rv-space-sm: 1rem;
    --rv-space-md: 1.5rem;
    --rv-space-lg: 2.5rem;
    --rv-space-xl: 4rem;
    --rv-space-2xl: clamp(5rem, 8vw, 7rem);
    --rv-hairline: rgba(255, 245, 248, 0.18);
  }

  .bomba-reviews__container {
    max-width: 1200px;
    margin: 0 auto;
    position: relative;
  }

  .bomba-reviews__intro {
    text-align: center;
    margin: 0 auto var(--rv-space-2xl);
    max-width: 600px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--rv-space-sm);
  }

  .bomba-reviews__eyebrow {
    display: block;
    font-family: var(--font-bomba-merriweather, 'Merriweather', serif);
    font-style: italic;
    font-weight: 400;
    font-size: 15px;
    letter-spacing: 0.01em;
    opacity: 1;
    margin: 0;
  }

  .bomba-reviews__heading {
    font-family: var(--font-bomba-manrope) !important;
    font-size: clamp(2rem, 4vw, 3.25rem);
    font-weight: 800 !important;
    letter-spacing: -0.02em !important;
    line-height: 1.05 !important;
    margin: 0;
  }

  .bomba-reviews__subtitle {
    font-family: var(--font-bomba-merriweather, 'Merriweather', serif);
    font-style: italic;
    font-weight: 400;
    font-size: clamp(15px, 1.2vw, 18px);
    line-height: 1.6;
    opacity: 0.9;
    margin: var(--rv-space-2xs) 0 0;
    max-width: 52ch;
  }

  /* Aggregate rating row — mobile only (desktop uses the footer trust strip). */
  .bomba-reviews__aggregate { display: none; }

  .bomba-reviews__featured {
    position: relative;
    max-width: 760px;
    margin: 0 auto var(--rv-space-2xl);
    text-align: center;
    padding: 0 var(--rv-space-sm);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--rv-space-md);
  }

  .bomba-reviews__quote-glyph {
    font-family: var(--font-bomba-merriweather, 'Merriweather', serif);
    font-style: italic;
    font-size: clamp(4rem, 8vw, 6.5rem);
    line-height: 0.5;
    opacity: 0.7;
    margin: 0;
    user-select: none;
    pointer-events: none;
  }

  .bomba-reviews__featured-quote {
    font-family: var(--font-bomba-merriweather, 'Merriweather', serif);
    font-style: italic;
    font-weight: 400;
    font-size: clamp(1.5rem, 3vw, 2.125rem);
    line-height: 1.35;
    margin: 0;
    letter-spacing: -0.005em;
  }

  .bomba-reviews__featured-author {
    font-family: var(--font-bomba-manrope);
    font-weight: 700;
    font-size: 12px;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    opacity: 1;
    display: inline-flex;
    align-items: center;
    gap: var(--rv-space-xs);
    margin-top: var(--rv-space-2xs);
  }

  .bomba-reviews__featured-author::before {
    content: '';
    display: inline-block;
    width: 48px;
    height: 1px;
    background: #D49A89;
    opacity: 0.9;
  }

  .bomba-reviews__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--rv-space-md);
    margin-bottom: var(--rv-space-2xl);
  }

  @media screen and (min-width: 700px) {
    .bomba-reviews__grid {
      grid-template-columns: repeat(2, 1fr);
      gap: var(--rv-space-lg);
    }
  }

  @media screen and (min-width: 1024px) {
    .bomba-reviews__grid {
      grid-template-columns: repeat(3, 1fr);
      gap: var(--rv-space-lg);
      align-items: start;
    }

    /* Offset the middle card so the row of three isn't flat. */
    .bomba-reviews__item:nth-child(3n + 2) {
      transform: translateY(32px);
    }
  }

  .bomba-reviews__item {
    display: flex;
  }

  .bomba-reviews__card {
    border-radius: 8px;
    padding: var(--rv-space-lg) var(--rv-space-md);
    width: 100%;
    display: flex;
    flex-direction: column;
    box-shadow: 0 8px 24px rgba(43, 29, 36, 0.08);
    transition: transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1),
                box-shadow 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
  }

  .bomba-reviews__card:hover {
    transform: translateY(-4px);
    box-shadow: 0 10px 30px rgba(138, 46, 82, 0.25);
  }

  .bomba-reviews__stars {
    color: #D16B61;
    font-size: 18px;
    line-height: 1;
    letter-spacing: 3px;
    margin-bottom: var(--rv-space-md);
  }

  .bomba-reviews__featured-stars {
    color: #D16B61;
    font-size: clamp(18px, 1.8vw, 22px);
    line-height: 1;
    letter-spacing: 4px;
  }

  .bomba-reviews__text {
    font-family: var(--font-bomba-merriweather, 'Merriweather', serif);
    font-style: italic;
    font-weight: 400;
    font-size: 17px;
    line-height: 1.55;
    margin: 0;
  }

  .bomba-reviews__author {
    font-family: var(--font-bomba-manrope);
    font-weight: 700;
    font-size: 12px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    margin: 0;
    margin-top: auto;
    padding-top: var(--rv-space-md);
  }

  .bomba-reviews__footer {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--rv-space-md);
    text-align: center;
  }

  @media screen and (min-width: 768px) {
    .bomba-reviews__footer {
      flex-direction: row;
      justify-content: space-between;
      align-items: center;
      text-align: left;
      gap: var(--rv-space-lg);
      padding-top: var(--rv-space-lg);
      border-top: 1px solid var(--rv-hairline);
    }
  }

  .bomba-reviews__trust {
    display: flex;
    align-items: center;
    gap: var(--rv-space-2xs);
    font-family: var(--font-bomba-manrope);
    font-weight: 600;
    font-size: 14px;
    letter-spacing: 0.04em;
    flex-wrap: wrap;
    justify-content: center;
  }

  @media screen and (min-width: 768px) {
    .bomba-reviews__trust {
      justify-content: flex-start;
    }
  }

  .bomba-reviews__trust-rating {
    font-weight: 700;
    letter-spacing: 0.02em;
  }

  .bomba-reviews__trust-star {
    font-size: 18px !important;
  }

  .bomba-reviews__trust-sep {
    opacity: 0.5;
    margin: 0 var(--rv-space-3xs);
  }

  /* ============================================================
     MOBILE REWORK — aggregate-led, swipeable reviews
     (Okendo / Loox / Gymshark pattern). Desktop is untouched.
     ============================================================ */
  @media screen and (max-width: 767px) {
    /* Tighten the huge vertical rhythm between blocks. */
    .bomba-reviews { --rv-space-2xl: 2.75rem; }

    /* Intro: drop the subtitle, lead with heading + aggregate stars. */
    .bomba-reviews__subtitle { display: none; }

    .bomba-reviews__aggregate {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 0.4rem;
      margin-top: 0.25rem;
    }
    .bomba-reviews__aggregate-stars {
      color: #D16B61;
      font-size: 20px;
      line-height: 1;
      letter-spacing: 3px;
    }
    .bomba-reviews__aggregate-text {
      font-family: var(--font-bomba-manrope);
      font-weight: 700;
      font-size: 14px;
      letter-spacing: 0.02em;
      color: #FFF5F8;
    }

    /* Featured quote: shrink so it leads instead of filling the screen. */
    .bomba-reviews__quote-glyph { font-size: 3rem; }
    .bomba-reviews__featured { gap: 0.85rem; }
    .bomba-reviews__featured-quote {
      font-size: 1.25rem;
      line-height: 1.4;
    }

    /* Reviews: stacked cards → horizontal swipe carousel (cards peek). */
    .bomba-reviews__grid {
      display: flex;
      grid-template-columns: none;
      gap: 1rem;
      overflow-x: auto;
      scroll-snap-type: x mandatory;
      -webkit-overflow-scrolling: touch;
      scrollbar-width: none;
      padding-bottom: 0.5rem;
    }
    .bomba-reviews__grid::-webkit-scrollbar { display: none; }
    .bomba-reviews__item {
      flex: 0 0 85%;
      scroll-snap-align: center;
    }

    /* Rating already shown up top; footer keeps just the CTA. */
    .bomba-reviews__trust { display: none; }
  }

  @media (prefers-reduced-motion: reduce) {
    .bomba-reviews__card,
    .bomba-reviews__cta {
      transition: none;
    }
    .bomba-reviews__card:hover,
    .bomba-reviews__cta:hover {
      transform: none;
    }
  }
/* END_SECTION:bomba-reviews */

/* START_SECTION:bomba-wishlist (INDEX:17) */
/* ============================================================
     Bomba Wishlist — Vibrant Local
     Palette: Burgundy #8A2E52 · Copper #D16B61 · Browngold #D49A89
              Dusty Pink #DFA8BC · Blush #FFEEF3 · Cream #FFF5F8
              Espresso #2B1D24
     ============================================================ */
  .bomba-wl {
    --wl-burgundy: #8A2E52;
    --wl-burgundy-dark: #6F2342;
    --wl-copper:   #D16B61;
    --wl-browngold:#D49A89;
    --wl-dustypink:#DFA8BC;
    --wl-blush:    #FFEEF3;
    --wl-cream:    #FFF5F8;
    --wl-espresso: #2B1D24;

    /* One continuous blush→cream wash for the whole page, so the hero melts
       into the content below with no horizontal seam on either side. */
    background: linear-gradient(180deg, var(--wl-blush) 0%, var(--wl-cream) 480px) no-repeat;
    background-color: var(--wl-cream);
    min-height: 100vh;
    color: var(--wl-espresso);
    font-family: var(--font-bomba-manrope, 'Manrope', sans-serif);
    padding-bottom: 0 !important;
  }

  .bomba-wl__container {
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 1.5rem;
  }

  @media (min-width: 768px) {
    .bomba-wl__container { padding: 0 3rem; }
  }

  /* ---------- Above-fold intro animation — pure CSS ---------- */
  @keyframes bombaWlIntroUp {
    from { opacity: 0; transform: translate3d(0, 24px, 0); }
    /* End on `none`, NOT translate3d(0,0,0): with fill-mode:both an identity
       translate3d still counts as a transform and leaves a permanent stacking
       context on the hero, which trapped the sort dropdown's z-index under the
       product cards. `none` releases the context once the intro finishes. */
    to   { opacity: 1; transform: none; }
  }
  .bomba-wl__hero > .bomba-wl__container {
    animation: bombaWlIntroUp 700ms cubic-bezier(0.16, 1, 0.3, 1) both;
  }
  .bomba-wl__hero > .bomba-wl__container > * {
    animation: bombaWlIntroUp 600ms cubic-bezier(0.16, 1, 0.3, 1) both;
  }
  .bomba-wl__hero > .bomba-wl__container > :nth-child(1) { animation-delay: 60ms; }
  .bomba-wl__hero > .bomba-wl__container > :nth-child(2) { animation-delay: 140ms; }
  .bomba-wl__hero > .bomba-wl__container > :nth-child(3) { animation-delay: 220ms; }
  .bomba-wl__hero > .bomba-wl__container > :nth-child(4) { animation-delay: 300ms; }

  @media (prefers-reduced-motion: reduce) {
    .bomba-wl__hero > .bomba-wl__container,
    .bomba-wl__hero > .bomba-wl__container > * {
      animation: none !important;
      opacity: 1 !important;
      transform: none !important;
    }
  }
  .shopify-design-mode .bomba-wl__hero > .bomba-wl__container,
  .shopify-design-mode .bomba-wl__hero > .bomba-wl__container > * {
    animation: none !important;
    opacity: 1 !important;
    transform: none !important;
  }

  /* ---------- Hero header ---------- */
  .bomba-wl__hero {
    position: relative;
    /* No overflow:hidden / isolation here — both trapped the sort dropdown
       (clipped at the hero edge + z-index scoped to the hero). The decorative
       radial gradients are backgrounds, so they never bleed past the box anyway. */
    /* Top clears the floating header via the shared global token so the
       wishlist title lines up with every other page. */
    padding: var(--bomba-header-clear) 0 1rem;
    /* No base fill: the page (.bomba-wl) owns the blush→cream wash, so the hero
       shares one continuous background with the content below. Decorative warmth
       only, lifted clear of the bottom edge so nothing clips into a hard line. */
    background:
      radial-gradient(ellipse 60% 80% at 12% 0%, rgba(223, 168, 188, 0.45) 0%, transparent 65%),
      radial-gradient(ellipse 75% 58% at 96% 26%, rgba(212, 154, 137, 0.30) 0%, transparent 62%);
  }

  .bomba-wl__eyebrow {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: var(--wl-copper);
    margin: 0 0 0.85rem;
  }

  .bomba-wl__title {
    font-size: clamp(2.4rem, 5vw, 3.75rem);
    font-weight: 800;
    line-height: 1.02;
    letter-spacing: -0.025em;
    color: var(--wl-burgundy);
    margin: 0;
  }

  .bomba-wl__lede {
    font-family: var(--font-bomba-merriweather, 'Merriweather', serif);
    font-style: italic;
    font-size: clamp(14px, 1.05vw, 16px);
    color: rgba(43, 29, 36, 0.82);
    margin: 0.85rem 0 0;
    max-width: 56ch;
  }

  /* Toolbar (count + sort + clear) */
  .bomba-wl__toolbar {
    margin-top: 1.75rem;
    display: flex;
    flex-wrap: wrap;
    gap: 1rem 1.5rem;
    align-items: center;
    justify-content: space-between;
  }
  .bomba-wl__toolbar[hidden] { display: none; }

  .bomba-wl__count {
    margin: 0;
    font-size: 14px;
    color: var(--wl-burgundy);
    font-weight: 700;
  }

  .bomba-wl__toolbar-actions {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    flex-wrap: wrap;
  }

  .bomba-wl__sort {
    position: relative;
    display: inline-block;
    font-size: 13px;
  }
  /* Trigger pill — click anywhere opens the custom menu. */
  .bomba-wl__sort-trigger {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    width: 100%;
    font-family: inherit;
    font-size: 13px;
    color: var(--wl-espresso);
    background: rgba(255, 255, 255, 0.7);
    border: 1px solid rgba(138, 46, 82, 0.18);
    border-radius: 999px;
    padding: 0.55rem 1rem 0.55rem 1.1rem;
    cursor: pointer;
    transition: border-color 0.2s ease, background 0.2s ease;
  }
  .bomba-wl__sort-trigger:hover { border-color: var(--wl-burgundy); background: #fff; }
  .bomba-wl__sort-trigger:focus-visible {
    outline: 2px solid var(--wl-burgundy);
    outline-offset: 2px;
  }
  .bomba-wl__sort-label { font-weight: 600; }
  .bomba-wl__sort-value {
    font-weight: 700;
    color: var(--wl-burgundy);
  }
  .bomba-wl__sort-caret {
    color: var(--wl-burgundy);
    flex-shrink: 0;
    margin-left: auto;
    transition: transform 0.25s ease;
  }
  .bomba-wl__sort-trigger[aria-expanded='true'] .bomba-wl__sort-caret {
    transform: rotate(180deg);
  }

  /* Portaled to <body>, so re-declare the palette tokens here — the
     .bomba-wl-scoped vars don't reach these once they're moved out. */
  .bomba-wl__sort-menu,
  .bomba-wl__modal {
    --wl-burgundy: #8A2E52;
    --wl-burgundy-dark: #6F2342;
    --wl-copper: #D16B61;
    --wl-blush: #FFEEF3;
    --wl-cream: #FFF5F8;
    --wl-espresso: #2B1D24;
  }

  /* Custom dropdown menu */
  .bomba-wl__sort-menu {
    position: absolute;
    top: calc(100% + 0.5rem);
    right: 0;
    z-index: 9000;        /* must clear the cards (they create stacking contexts via transform) */
    min-width: 220px;
    max-width: calc(100vw - 1.5rem);   /* never spill off the viewport on phones */
    margin: 0;
    padding: 0.4rem;
    list-style: none;
    background: #fff;
    border: 1px solid rgba(138, 46, 82, 0.12);
    border-radius: 14px;
    box-shadow: 0 16px 36px rgba(43, 29, 36, 0.16);
    transform-origin: top right;
    animation: bombaSortMenuIn 0.18s cubic-bezier(0.16, 1, 0.3, 1) both;
  }
  .bomba-wl__sort-menu[hidden] { display: none; }

  @keyframes bombaSortMenuIn {
    from { opacity: 0; transform: translateY(-6px) scale(0.98); }
    to   { opacity: 1; transform: translateY(0) scale(1); }
  }

  .bomba-wl__sort-option {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.6rem 0.85rem;
    border-radius: 9px;
    font-size: 13px;
    font-weight: 600;
    color: var(--wl-espresso);
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
  }
  .bomba-wl__sort-option:hover {
    background: var(--wl-blush);
    color: var(--wl-burgundy);
  }
  .bomba-wl__sort-option[aria-selected='true'] {
    color: var(--wl-burgundy);
    font-weight: 800;
  }
  /* Check mark on the active option */
  .bomba-wl__sort-option[aria-selected='true']::after {
    content: '';
    width: 7px;
    height: 11px;
    margin-left: auto;
    border: solid var(--wl-burgundy);
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
  }

  @media (prefers-reduced-motion: reduce) {
    .bomba-wl__sort-menu { animation: none; }
    .bomba-wl__sort-caret { transition: none; }
  }

  .bomba-wl__clear {
    appearance: none;
    background: transparent;
    border: 0;
    color: rgba(43, 29, 36, 0.6);
    font-family: inherit;
    font-size: 13px;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    cursor: pointer;
    transition: color 0.2s ease;
  }
  .bomba-wl__clear:hover { color: var(--wl-burgundy); }

  /* ---------- Main column ---------- */
  .bomba-wl__main { padding-top: 1rem; }
  .bomba-wl__filled { padding-bottom: 9rem; }   /* runway so the last card's CTA scrolls clear of the sticky total bar */

  /* ---------- Free shipping progress ---------- */
  .bomba-wl__shipping {
    background: #fff;
    border-radius: 14px;
    padding: 1.1rem 1.4rem;
    box-shadow: 0 8px 24px rgba(43, 29, 36, 0.06);
    border: 1px solid rgba(138, 46, 82, 0.08);
    margin: 0 auto 1rem;
    max-width: 940px;       /* same content column as the saved grid below it */
  }
  .bomba-wl__shipping[data-empty='true'] {
    background: transparent;
    box-shadow: none;
    border: 1px dashed rgba(138, 46, 82, 0.25);
  }
  .bomba-wl__ship-row {
    display: flex;
    align-items: center;
    gap: 0.8rem;
    flex-wrap: wrap;
    justify-content: space-between;
  }
  .bomba-wl__ship-msg {
    margin: 0;
    font-size: 14px;
    color: var(--wl-espresso);
  }
  .bomba-wl__ship-msg b { color: var(--wl-burgundy); font-weight: 800; }
  .bomba-wl__ship-msg em { font-style: italic; color: var(--wl-copper); }
  .bomba-wl__ship-percent {
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.08em;
    color: rgba(138, 46, 82, 0.55);
  }
  .bomba-wl__ship-track {
    margin-top: 0.85rem;
    height: 6px;
    border-radius: 999px;
    background: var(--wl-blush);
    overflow: hidden;
  }
  .bomba-wl__ship-fill {
    height: 100%;
    background: linear-gradient(90deg, var(--wl-copper) 0%, var(--wl-burgundy) 100%);
    border-radius: 999px;
    width: 0%;
    transition: width 0.9s cubic-bezier(0.16, 1, 0.3, 1);
  }
  .bomba-wl__ship-done {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    color: var(--wl-burgundy);
    font-weight: 800;
  }

  /* ---------- Filled layout: saved items + recs rail ---------- */
  /* Mobile/tablet: plain stack (grid, then recs below). Desktop: two columns
     so the recommendations ride in the otherwise-dead space to the right of the
     saved items and are visible on first paint instead of far below the fold. */
  /* Single constrained column: the saved list stays a tight, centered focus;
     recommendations break full-width below it as a discovery gallery. */
  .bomba-wl__layout { display: block; }

  /* ---------- Item grid ---------- */
  /* auto-fit + fixed track collapses empty columns: a single saved item
     centers, 2-3 pack centered, cards keep a compact ~300px size (so the CTA
     clears the total bar). No reserved empty columns, so no dead-center void. */
  .bomba-wl__grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);   /* phone: 2 saved items side by side */
    justify-content: start;
    gap: 1.5rem 1rem;
    max-width: 940px;
    margin-inline: auto;
  }
  @media (min-width: 700px) {
    .bomba-wl__grid {
      grid-template-columns: repeat(auto-fit, minmax(190px, 212px));
      gap: 2rem 1.5rem;
    }
  }

  /* ---------- Card ---------- */
  .bomba-wl__card {
    position: relative;
    display: flex;
    flex-direction: column;
    background: #fff;
    border-radius: 14px;
    overflow: hidden;
    box-shadow: 0 8px 24px rgba(43, 29, 36, 0.06);
    border: 1px solid rgba(138, 46, 82, 0.06);
    opacity: 0;
    transform: translateY(12px);
    transition: opacity 0.5s ease, transform 0.5s cubic-bezier(0.16, 1, 0.3, 1),
                box-shadow 0.3s ease, border-color 0.3s ease;
  }
  .bomba-wl__card--visible { opacity: 1; transform: translateY(0); }
  .bomba-wl__card--removing { opacity: 0; transform: scale(0.94); }
  .bomba-wl__card:hover {
    box-shadow: 0 14px 30px rgba(138, 46, 82, 0.14);
    border-color: rgba(138, 46, 82, 0.18);
  }

  .bomba-wl__card-media {
    position: relative;
    display: block;
    aspect-ratio: 1/1;   /* squarer than 4/5: trims card height so the CTA clears the sticky total bar */
    background: var(--wl-blush);
    overflow: hidden;
  }
  .bomba-wl__card-img {
    width: 100%; height: 100%;
    object-fit: cover;
    transition: transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
  }
  .bomba-wl__card:hover .bomba-wl__card-img { transform: scale(1.04); }
  .bomba-wl__card-placeholder {
    position: absolute; inset: 0;
    background: linear-gradient(135deg, var(--wl-blush) 0%, var(--wl-cream) 100%);
  }

  .bomba-wl__card-remove {
    position: absolute;
    top: 0.65rem;
    right: 0.65rem;
    z-index: 3;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    border: 0;
    background: rgba(255, 255, 255, 0.92);
    backdrop-filter: blur(4px);
    color: var(--wl-espresso);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(43, 29, 36, 0.18);
    transition: background 0.2s ease, color 0.2s ease, transform 0.2s ease;
  }
  .bomba-wl__card-remove:hover {
    background: var(--wl-burgundy);
    color: var(--wl-cream);
    transform: scale(1.05);
  }
  .bomba-wl__card-remove:focus-visible {
    outline: 2px solid var(--wl-burgundy);
    outline-offset: 2px;
  }

  .bomba-wl__card-body {
    padding: 0.8rem 1rem 0.9rem;
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
    flex: 1;
  }

  .bomba-wl__card-text {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
  }

  /* Price + ATC stay pinned to the bottom of the card body, no matter how long
     the product name runs. margin-top:auto eats the slack above them. */
  .bomba-wl__card-foot {
    margin-top: auto;
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
  }

  .bomba-wl__card-name-link {
    text-decoration: none;
    color: inherit;
  }
  .bomba-wl__card-name {
    margin: 0;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.3;
    color: var(--wl-espresso);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    transition: color 0.2s ease;
  }
  .bomba-wl__card-name-link:hover .bomba-wl__card-name { color: var(--wl-burgundy); }

  .bomba-wl__card-meta {
    margin: 0;
    font-size: 11px;
    color: rgba(43, 29, 36, 0.5);
    letter-spacing: 0.02em;
  }

  .bomba-wl__card-price {
    margin: 0.15rem 0 0;
    font-size: 15px;
    font-weight: 800;
    color: var(--wl-burgundy);
  }

  /* Card CTA */
  .bomba-wl__card-cta {
    appearance: none;
    width: 100%;
    padding: 0.7rem 1rem;
    border-radius: 999px;
    border: 1px solid var(--wl-burgundy);
    background: transparent;
    color: var(--wl-burgundy);
    font-family: inherit;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    cursor: pointer;
    transition: background 0.25s ease, color 0.25s ease, transform 0.25s ease,
                border-color 0.25s ease, box-shadow 0.25s ease;
  }
  .bomba-wl__card-cta:hover {
    background: var(--wl-burgundy);
    color: var(--wl-cream);
    transform: translateY(-1px);
    box-shadow: 0 8px 20px rgba(138, 46, 82, 0.25);
  }
  .bomba-wl__card-cta:focus-visible {
    outline: 2px solid var(--wl-burgundy);
    outline-offset: 3px;
  }
  .bomba-wl__card-cta[data-state='loading'] {
    background: var(--wl-blush);
    color: var(--wl-burgundy);
    pointer-events: none;
  }
  .bomba-wl__card-cta[data-state='done'] {
    background: var(--wl-burgundy);
    color: var(--wl-cream);
  }
  .bomba-wl__card-cta[data-state='error'] {
    background: var(--wl-copper);
    border-color: var(--wl-copper);
    color: var(--wl-cream);
  }
  .bomba-wl__card-cta[disabled] {
    opacity: 0.45;
    cursor: not-allowed;
  }
  .bomba-wl__card-cta-icon { flex-shrink: 0; transition: transform 0.25s ease; }
  .bomba-wl__card-cta:hover .bomba-wl__card-cta-icon { transform: translateX(2px); }

  /* ---------- Buttons (shared) ---------- */
  .bomba-wl__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.95rem 1.75rem;
    border-radius: 999px;
    font-family: inherit;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    text-decoration: none;
    border: 1px solid transparent;
    cursor: pointer;
    transition: transform 0.25s ease, background 0.25s ease, color 0.25s ease,
                box-shadow 0.25s ease, border-color 0.25s ease;
  }
  .bomba-wl__btn--primary {
    background: var(--wl-burgundy);
    color: var(--wl-cream);
    box-shadow: 0 10px 28px rgba(138, 46, 82, 0.25);
  }
  .bomba-wl__btn--primary:hover {
    background: var(--wl-burgundy-dark);
    transform: translateY(-2px);
    box-shadow: 0 14px 34px rgba(138, 46, 82, 0.32);
  }
  .bomba-wl__btn--ghost {
    background: rgba(255, 255, 255, 0.6);
    color: var(--wl-burgundy);
    border-color: var(--wl-burgundy);
    backdrop-filter: blur(2px);
  }
  .bomba-wl__btn--ghost:hover,
  .bomba-wl__btn--ghost:focus-visible {
    background: var(--wl-burgundy);
    color: var(--wl-cream);
    border-color: var(--wl-burgundy);
    transform: translateY(-2px);
    box-shadow: 0 14px 32px rgba(138, 46, 82, 0.28);
    outline: none;
  }
  .bomba-wl__btn--ghost:active {
    transform: translateY(0);
    box-shadow: 0 6px 16px rgba(138, 46, 82, 0.22);
  }

  /* ---------- Empty state ---------- */
  .bomba-wl__empty {
    display: none;
    flex-direction: column;
    gap: 3.5rem;
  }
  .bomba-wl__empty.is-active { display: flex; }

  .bomba-wl__empty-card {
    position: relative;
    padding: 4rem 1.75rem;
    text-align: center;
    background:
      radial-gradient(ellipse 50% 50% at 50% 30%, rgba(223, 168, 188, 0.35) 0%, transparent 60%),
      linear-gradient(180deg, var(--wl-blush) 0%, var(--wl-cream) 100%);
    border-radius: 22px;
    border: 1px solid rgba(138, 46, 82, 0.10);
    box-shadow: 0 12px 30px rgba(43, 29, 36, 0.05);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
  }
  @media (min-width: 768px) {
    .bomba-wl__empty-card { padding: 5rem 2.5rem; }
  }

  .bomba-wl__empty-icon {
    width: 76px; height: 76px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 10px 24px rgba(138, 46, 82, 0.14);
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
  .bomba-wl__empty-title {
    margin: 0.5rem 0 0;
    font-size: clamp(1.5rem, 2.4vw, 2rem);
    font-weight: 800;
    color: var(--wl-burgundy);
    letter-spacing: -0.02em;
  }
  .bomba-wl__empty-desc {
    margin: 0;
    font-family: var(--font-bomba-merriweather, 'Merriweather', serif);
    font-style: italic;
    font-size: 15px;
    line-height: 1.6;
    max-width: 48ch;
    color: rgba(43, 29, 36, 0.78);
  }
  .bomba-wl__empty-cta {
    margin-top: 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
  }
  @media (min-width: 640px) {
    .bomba-wl__empty-cta { flex-direction: row; }
  }

  /* ---------- Recommendations ---------- */
  .bomba-wl__recs { padding: 0; }
  /* Full-width discovery gallery below the saved list, set off by a generous
     section break so the wishlist stays the clear primary zone. */
  .bomba-wl__recs--bottom {
    margin-top: 3rem;
    padding-top: 2.25rem;
    border-top: 1px solid rgba(138, 46, 82, 0.14);
  }
  .bomba-wl__recs-title {
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--wl-burgundy);
    margin: 0 0 1.5rem;
  }

  /* Filled-state recs get a real section header (eyebrow + headline) instead of
     a tiny uppercase label, so the jump from "your saved items" to "suggestions"
     reads as a new zone, not a continuation of the saved list. */
  .bomba-wl__recs-head { margin-bottom: 1.5rem; }
  .bomba-wl__recs--bottom .bomba-wl__recs-eyebrow {
    margin: 0 0 0.4rem;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--wl-copper);
  }
  .bomba-wl__recs--bottom .bomba-wl__recs-title {
    margin: 0;
    font-size: clamp(1.3rem, 4.5vw, 1.65rem);
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: -0.015em;
    text-transform: none;
    color: var(--wl-burgundy);
  }

  /* Phone: the recs become a distinct warm "discovery tray" — a blush surface,
     full-bleed to the viewport edges with a rounded top lip, that the cream page
     folds into. Saved white cards sit on cream above; the moment the surface
     turns blush you know you've left your list and entered suggestions. This is
     what disambiguates the rec card's heart-in-corner from the saved card's
     X-in-corner: the planes are visibly different surfaces. */
  @media (max-width: 699px) {
    .bomba-wl__recs--bottom {
      /* bleed sideways past the 1.5rem container padding; eat the filled runway
         below (.bomba-wl__filled padding-bottom: 9rem) so the tray paints all
         the way down to the sticky summary bar instead of leaving a cream gap. */
      margin: 3rem -1.5rem -9rem;
      padding: 2.25rem 1.5rem 9rem;
      border-top: 0;
      border-radius: 24px 24px 0 0;
      background:
        radial-gradient(ellipse 80% 60% at 50% 0%, rgba(223, 168, 188, 0.34) 0%, transparent 72%),
        var(--wl-blush);
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.65);
    }
  }
  .bomba-wl__rec-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.25rem;
  }
  @media (min-width: 700px)  { .bomba-wl__rec-grid { grid-template-columns: repeat(4, 1fr); gap: 1.5rem; } }

  .bomba-wl__rec {
    display: flex;
    flex-direction: column;
    text-decoration: none;
    color: inherit;
    transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
  }
  .bomba-wl__rec:hover { transform: translateY(-3px); }
  .bomba-wl__rec-media {
    position: relative;
    aspect-ratio: 1/1;
    border-radius: 10px;
    overflow: hidden;
    background: linear-gradient(135deg, var(--wl-blush) 0%, var(--wl-cream) 100%);
    box-shadow: 0 6px 16px rgba(43, 29, 36, 0.05);
    margin-bottom: 0.65rem;
  }
  .bomba-wl__rec-media-link {
    display: block;
    width: 100%;
    height: 100%;
  }
  .bomba-wl__rec-img {
    width: 100%; height: 100%; object-fit: cover;
    transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
  }
  .bomba-wl__rec:hover .bomba-wl__rec-img { transform: scale(1.05); }
  .bomba-wl__rec-name {
    margin: 0 0 0.1rem;
    font-size: 13px;
    font-weight: 600;
    color: var(--wl-espresso);
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
  .bomba-wl__rec-price {
    margin: 0;
    font-size: 13px;
    font-weight: 700;
    color: var(--wl-burgundy);
  }
  .bomba-wl__rec--placeholder .bomba-wl__rec-name,
  .bomba-wl__rec--placeholder .bomba-wl__rec-price { opacity: 0.5; }

  .bomba-wl__rec-link {
    text-decoration: none;
    color: inherit;
  }

  .bomba-wl__rec-wl-btn {
    position: absolute;
    top: 0.5rem;
    right: 0.5rem;
    z-index: 3;
  }

  /* ---------- Sticky summary bar (sticks to viewport bottom, stops at footer) ---------- */
  .bomba-wl__summary {
    position: sticky;
    bottom: 0;
    z-index: 50;
    background: #FFF5F8;
    border-top: 1px solid rgba(138, 46, 82, 0.16);
    box-shadow: 0 -8px 24px rgba(43, 29, 36, 0.08);
    padding: 1.25rem 0;
  }
  .bomba-wl__summary[hidden] { display: none; }
  .bomba-wl__summary-row {
    display: flex;
    flex-direction: column;
    gap: 0.9rem;
    align-items: stretch;
  }
  @media (min-width: 768px) {
    .bomba-wl__summary-row {
      flex-direction: row;
      align-items: center;
      justify-content: space-between;
    }
  }
  .bomba-wl__summary-info {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 0.5rem 1rem;
  }
  .bomba-wl__summary-label {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--wl-copper);
  }
  .bomba-wl__summary-total {
    font-size: 1.65rem;
    font-weight: 800;
    color: var(--wl-burgundy);
    letter-spacing: -0.02em;
  }
  .bomba-wl__summary-count {
    font-size: 13px;
    color: rgba(43, 29, 36, 0.6);
  }
  .bomba-wl__summary-actions {
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
  }
  @media (min-width: 640px) {
    .bomba-wl__summary-actions { flex-direction: row; }
  }

  /* ---------- Share button ---------- */
  /* Solid Copper fill so Deel is unmissable, and distinct from the Burgundy
     primaries (Alles in winkelmandje) so the two never compete. */
  .bomba-wl__share-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    background: var(--wl-copper);
    border: 1.5px solid var(--wl-copper);
    border-radius: 999px;
    padding: 0.7rem 1.4rem;
    font-family: inherit;
    font-size: 13px;
    font-weight: 800;
    color: #fff;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    cursor: pointer;
    box-shadow: 0 8px 20px rgba(209, 107, 97, 0.38);
    transition: background 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
  }
  .bomba-wl__share-btn svg { width: 15px; height: 15px; }
  .bomba-wl__share-btn:hover {
    background: #c25a50;
    transform: translateY(-2px);
    box-shadow: 0 12px 28px rgba(209, 107, 97, 0.48);
  }
  .bomba-wl__share-btn:focus-visible {
    outline: 2px solid var(--wl-burgundy);
    outline-offset: 3px;
  }

  /* ---------- Guest state ---------- */
  .bomba-wl__guest {
    padding: 5rem 1.75rem;
    text-align: center;
    background:
      radial-gradient(ellipse 50% 50% at 50% 30%, rgba(223, 168, 188, 0.3) 0%, transparent 60%),
      linear-gradient(180deg, var(--wl-blush) 0%, var(--wl-cream) 100%);
    border-radius: 22px;
    border: 1px solid rgba(138, 46, 82, 0.10);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
    margin: 2rem 0;
  }
  .bomba-wl__guest-icon {
    width: 72px;
    height: 72px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 10px 24px rgba(138, 46, 82, 0.14);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 0.5rem;
  }
  .bomba-wl__guest-title {
    margin: 0;
    font-size: clamp(1.4rem, 2.2vw, 1.75rem);
    font-weight: 800;
    color: var(--wl-burgundy);
    letter-spacing: -0.02em;
  }
  .bomba-wl__guest-desc {
    margin: 0;
    font-family: var(--font-bomba-merriweather, 'Merriweather', serif);
    font-style: italic;
    font-size: 15px;
    line-height: 1.6;
    max-width: 42ch;
    color: rgba(43, 29, 36, 0.72);
  }
  .bomba-wl__guest-cta {
    margin-top: 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
  }
  @media (min-width: 480px) {
    .bomba-wl__guest-cta { flex-direction: row; }
  }

  /* ---------- Shared wishlist ---------- */
  .bomba-wl__shared-header {
    padding: 2.5rem 0 2rem;
    text-align: center;
  }
  .bomba-wl__shared-title {
    font-size: clamp(1.6rem, 2.5vw, 2.2rem);
    font-weight: 800;
    color: var(--wl-burgundy);
    letter-spacing: -0.02em;
    margin: 0.5rem 0 0;
  }
  .bomba-wl__shared-lede {
    margin: 0.75rem auto 0;
    font-family: var(--font-bomba-merriweather, 'Merriweather', serif);
    font-style: italic;
    font-size: 15px;
    line-height: 1.6;
    color: rgba(43, 29, 36, 0.7);
    max-width: 52ch;
  }
  .bomba-wl__shared-actions {
    display: flex;
    justify-content: center;
    gap: 0.75rem;
    padding: 2.5rem 0;
  }
  .bomba-wl__grid--shared {
    margin: 4.5rem 0;
  }

  /* ---------- Share toast ---------- */
  .bomba-wl__share-toast {
    position: fixed;
    bottom: 2rem;
    left: 50%;
    transform: translateX(-50%) translateY(0);
    z-index: 9100;
    background: var(--wl-espresso);
    color: var(--wl-cream);
    border-radius: 14px;
    padding: 1rem 1.25rem;
    display: flex;
    align-items: center;
    gap: 1rem;
    min-width: 260px;
    max-width: 90vw;
    box-shadow: 0 16px 40px rgba(43, 29, 36, 0.28);
    animation: bombaToastIn 0.4s cubic-bezier(0.16, 1, 0.3, 1) both;
  }
  .bomba-wl__share-toast[hidden] { display: none; }

  @keyframes bombaToastIn {
    from { opacity: 0; transform: translateX(-50%) translateY(12px); }
    to   { opacity: 1; transform: translateX(-50%) translateY(0); }
  }

  .bomba-wl__share-toast-inner { flex: 1; }
  .bomba-wl__share-toast-label {
    font-weight: 700;
    font-size: 14px;
    margin: 0;
  }
  .bomba-wl__share-toast-sub {
    font-size: 12px;
    opacity: 0.65;
    margin: 0.1rem 0 0;
  }
  .bomba-wl__share-toast-close {
    background: none;
    border: none;
    color: inherit;
    opacity: 0.6;
    cursor: pointer;
    padding: 4px;
    display: flex;
    flex-shrink: 0;
    transition: opacity 0.2s ease;
  }
  .bomba-wl__share-toast-close:hover { opacity: 1; }

  /* ---------- Clear-wishlist confirm modal ---------- */
  .bomba-wl__modal {
    position: fixed;
    inset: 0;
    z-index: 9200;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1.25rem;
  }
  .bomba-wl__modal[hidden] { display: none; }
  .bomba-wl__modal-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(43, 29, 36, 0.42);
    animation: bombaModalFade 0.2s ease both;
  }

  /* Page-wide blur while the clear modal is open. Blur the real page wrappers
     (not the modal — it's portaled to <body>, outside #MainContent). The header
     is deliberately excluded: a filter on its wrapper turns it into the fixed
     header's containing block and it jumps off-screen once scrolled. */
  body.bomba-wl-modal-open #MainContent,
  body.bomba-wl-modal-open .shopify-section-group-footer-group {
    filter: blur(5px);
    transition: filter 0.25s ease;
    pointer-events: none;
  }
  .bomba-wl__modal-card {
    position: relative;
    width: 100%;
    max-width: 380px;
    background: #fff;
    border-radius: 20px;
    padding: 2rem 1.75rem 1.6rem;
    text-align: center;
    box-shadow: 0 24px 60px rgba(43, 29, 36, 0.32);
    animation: bombaModalPop 0.25s cubic-bezier(0.16, 1, 0.3, 1) both;
  }
  .bomba-wl__modal-icon {
    width: 52px;
    height: 52px;
    margin: 0 auto 1rem;
    border-radius: 50%;
    background: var(--wl-blush);
    color: var(--wl-burgundy);
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
  .bomba-wl__modal-title {
    margin: 0 0 0.5rem;
    font-size: 1.35rem;
    font-weight: 800;
    color: var(--wl-burgundy);
    letter-spacing: -0.02em;
  }
  .bomba-wl__modal-desc {
    margin: 0 0 1.6rem;
    font-size: 14px;
    line-height: 1.55;
    color: rgba(43, 29, 36, 0.7);
  }
  .bomba-wl__modal-actions {
    display: flex;
    flex-direction: column-reverse;
    gap: 0.65rem;
  }
  @media (min-width: 420px) {
    .bomba-wl__modal-actions { flex-direction: row; justify-content: center; }
    .bomba-wl__modal-actions .bomba-wl__btn { flex: 1; }
  }

  @keyframes bombaModalFade { from { opacity: 0; } to { opacity: 1; } }
  @keyframes bombaModalPop {
    from { opacity: 0; transform: translateY(12px) scale(0.96); }
    to   { opacity: 1; transform: translateY(0) scale(1); }
  }

  /* ---------- Reduced motion ---------- */
  @media (prefers-reduced-motion: reduce) {
    .bomba-wl__card,
    .bomba-wl__card-img,
    .bomba-wl__card-cta,
    .bomba-wl__ship-fill,
    .bomba-wl__btn,
    .bomba-wl__rec,
    .bomba-wl__rec-img {
      transition: none !important;
      animation: none !important;
    }
  }
/* END_SECTION:bomba-wishlist */

/* START_SECTION:main-404 (INDEX:37) */
.bomba-404 {
    --b404-burgundy: #8A2E52;
    --b404-burgundy-deep: #6F2441;
    --b404-copper: #D16B61;
    --b404-browngold: #D49A89;
    --b404-canvas: #FFF5F8;
    --b404-card: #ffffff;
    --b404-espresso: #2B1D24;

    position: relative;
    overflow: hidden;
    background: var(--b404-canvas);
    /* Top clears the floating header via the shared global token. */
    padding: var(--bomba-header-clear) 1.25rem 7rem;
    display: flex;
    justify-content: center;
  }

  @media screen and (min-width: 750px) {
    .bomba-404 { padding: var(--bomba-header-clear) 2rem 9rem; }
  }

  /* Soft ambient wash */
  .bomba-404__bg {
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
      radial-gradient(ellipse 60% 55% at 50% 18%, rgba(209, 107, 97, 0.16), transparent 70%),
      radial-gradient(ellipse 50% 50% at 85% 90%, rgba(223, 168, 188, 0.22), transparent 70%);
  }

  .bomba-404__bg::after {
    content: '';
    position: absolute;
    inset: 0;
    background-image: radial-gradient(rgba(43, 29, 36, 0.05) 1px, transparent 1px);
    background-size: 26px 26px;
    -webkit-mask-image: radial-gradient(ellipse 70% 60% at 50% 35%, #000 0%, transparent 75%);
    mask-image: radial-gradient(ellipse 70% 60% at 50% 35%, #000 0%, transparent 75%);
    opacity: 0.8;
  }

  .bomba-404__inner {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 680px;
    margin: 0 auto;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  /* ------- The big 404 ------- */
  .bomba-404__code {
    font-family: var(--font-bomba-manrope);
    font-weight: 800;
    font-size: clamp(7rem, 28vw, 16rem);
    line-height: 0.86;
    letter-spacing: -0.045em;
    background: linear-gradient(135deg, #8A2E52 0%, #D16B61 58%, #D49A89 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
    margin: 0 0 0.5rem;
    display: block;
    -webkit-user-select: none;
    user-select: none;
  }

  /* ------- Copy ------- */
  .bomba-404__eyebrow {
    font-family: var(--font-bomba-merriweather, 'Merriweather', serif);
    font-style: italic;
    font-weight: 400;
    font-size: clamp(15px, 1.4vw, 17px);
    color: var(--b404-copper);
    margin: 0 0 0.65rem;
    letter-spacing: 0.01em;
  }

  .bomba-404__heading {
    font-family: var(--font-bomba-manrope);
    font-weight: 800;
    font-style: normal;
    text-transform: none;
    font-size: clamp(2rem, 5vw, 3.25rem);
    line-height: 1.05;
    letter-spacing: -0.02em;
    color: var(--b404-espresso);
    margin: 0;
  }

  .bomba-404__description {
    font-family: var(--font-bomba-manrope);
    font-weight: 400;
    font-size: clamp(15px, 1.2vw, 17px);
    line-height: 1.6;
    color: var(--b404-espresso);
    opacity: 0.78;
    margin: 0.9rem 0 0;
    max-width: 46ch;
  }

  /* ------- Search ------- */
  .bomba-404__search {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    max-width: 460px;
    margin: 2.25rem 0 0;
    background: var(--b404-card);
    border: 1px solid rgba(43, 29, 36, 0.12);
    border-radius: 40px;
    padding: 0.35rem 0.4rem 0.35rem 1.1rem;
    box-shadow: 0 8px 24px rgba(43, 29, 36, 0.08);
    transition: border-color 0.25s ease, box-shadow 0.25s ease;
  }

  .bomba-404__search:focus-within {
    border-color: var(--b404-burgundy);
    box-shadow: 0 8px 24px rgba(138, 46, 82, 0.16);
  }

  .bomba-404__search-icon {
    color: var(--b404-burgundy);
    font-size: 22px !important;
    flex-shrink: 0;
  }

  .bomba-404__search-input {
    flex: 1;
    min-width: 0;
    border: none;
    background: transparent;
    outline: none;
    font-family: var(--font-bomba-manrope);
    font-size: 16px;
    color: var(--b404-espresso);
    padding: 0.55rem 0.75rem;
  }

  .bomba-404__search-input::placeholder {
    color: rgba(43, 29, 36, 0.42);
  }

  .bomba-404__search-submit {
    flex-shrink: 0;
    appearance: none;
    -webkit-appearance: none;
    border: none;
    cursor: pointer;
    background: var(--b404-burgundy);
    color: #fff;
    border-radius: 40px;
    height: 42px;
    width: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 10px 30px rgba(138, 46, 82, 0.25);
    transition: background 0.25s ease, box-shadow 0.25s ease;
  }

  .bomba-404__search-submit .material-symbols-outlined { font-size: 22px !important; }

  /* ------- Actions ------- */
  .bomba-404__actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 0.85rem;
    margin: 2rem 0 0;
  }

  .bomba-404__cta {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    background: var(--b404-burgundy);
    color: #fff;
    text-decoration: none;
    font-family: var(--font-bomba-manrope);
    font-weight: 700;
    font-size: 11px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    padding: 15px 26px;
    border-radius: 8px;
    box-shadow: 0 10px 30px rgba(138, 46, 82, 0.25);
    transition: background 0.3s cubic-bezier(0.16, 1, 0.3, 1),
                box-shadow 0.3s cubic-bezier(0.16, 1, 0.3, 1),
                transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
  }

  .bomba-404__cta .material-symbols-outlined { font-size: 18px !important; }

  .bomba-404__ghost {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    color: var(--b404-burgundy);
    text-decoration: none;
    font-family: var(--font-bomba-manrope);
    font-weight: 700;
    font-size: 14px;
    padding: 13px 10px;
    border-radius: 8px;
    transition: color 0.25s ease;
  }

  .bomba-404__ghost .material-symbols-outlined { font-size: 18px !important; }

  @media (hover: hover) {
    .bomba-404__cta:hover {
      background: var(--b404-burgundy-deep);
      box-shadow: 0 14px 40px rgba(138, 46, 82, 0.4);
      transform: translateY(-2px);
    }
    .bomba-404__search-submit:hover {
      background: var(--b404-burgundy-deep);
      box-shadow: 0 14px 40px rgba(138, 46, 82, 0.35);
    }
    .bomba-404__ghost:hover { color: var(--b404-burgundy-deep); }
  }

  .bomba-404__cta:focus-visible,
  .bomba-404__ghost:focus-visible,
  .bomba-404__search-submit:focus-visible {
    outline: 2px solid var(--b404-burgundy);
    outline-offset: 3px;
  }

  /* ------- Entrance ------- */
  @keyframes b404-rise {
    from { opacity: 0; transform: translate3d(0, 22px, 0); }
    to   { opacity: 1; transform: none; }
  }

  .bomba-404__inner > * {
    animation: b404-rise 0.7s cubic-bezier(0.16, 1, 0.3, 1) both;
  }
  .bomba-404__code        { animation-delay: 0.02s; }
  .bomba-404__eyebrow     { animation-delay: 0.12s; }
  .bomba-404__heading     { animation-delay: 0.18s; }
  .bomba-404__description { animation-delay: 0.24s; }
  .bomba-404__search      { animation-delay: 0.32s; }
  .bomba-404__actions     { animation-delay: 0.40s; }

  @media (prefers-reduced-motion: reduce) {
    .bomba-404__inner > * { animation: none; }
    .bomba-404__cta,
    .bomba-404__search-submit { transition: none; }
  }
/* END_SECTION:main-404 */

/* START_SECTION:main-search (INDEX:56) */
/* Search page only: sidebar search-refine box (not in the shared PLP styles). */
  /* Sidebar search-refine */
  .bomba-search-refine { display: flex; align-items: center; background: var(--bomba-card); border: 1px solid var(--bomba-border-soft); border-radius: var(--bomba-radius-pill); padding: 6px 6px 6px 16px; box-shadow: var(--bomba-shadow-lift); transition: border-color 0.2s ease, box-shadow 0.2s ease; }
  .bomba-search-refine:focus-within { border-color: var(--bomba-primary); box-shadow: 0 8px 24px rgba(138,46,82,0.14); }
  .bomba-search-refine__input { flex: 1; min-width: 0; border: none; background: transparent; outline: none; font-family: var(--font-bomba-manrope),'Manrope',sans-serif; font-size: 13px; color: var(--bomba-text); padding: 4px 0; }
  .bomba-search-refine__input::placeholder { color: rgba(43,29,36,0.4); }
  .bomba-shop .bomba-search-refine__input:focus,
  .bomba-shop .bomba-search-refine__input:focus-visible { outline: none; box-shadow: none; }
  .bomba-search-refine__btn { flex-shrink: 0; width: 34px; height: 34px; background: var(--bomba-primary); border: none; border-radius: 50%; display: flex; align-items: center; justify-content: center; cursor: pointer; color: #fff; transition: background 0.2s ease; }
  .bomba-search-refine__btn .material-symbols-outlined { font-size: 18px; }
  @media (hover: hover) { .bomba-search-refine__btn:hover { background: var(--bomba-primary-deep); } }
/* END_SECTION:main-search */

/* CSS from snippet stylesheet tags */
/* START_SNIPPET:bomba-product-card (INDEX:74) */
/* Badges — soft pill shape, diffuse lift, DS-aligned palette */
  .bomba-badge {
    position: absolute;
    top: 14px;
    left: 14px;
    z-index: 15;
    padding: 6px 12px;
    font-family: var(--font-bomba-manrope), 'Manrope', sans-serif;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    border-radius: 999px;
    pointer-events: none;
    white-space: nowrap;
    line-height: 1;
    box-shadow: 0 6px 18px rgba(43, 29, 36, 0.12);
  }

  .bomba-badge--sale {
    background: #D16B61;
    color: #fff;
  }

  .bomba-badge--new {
    background: #DFA8BC;
    color: #2B1D24;
  }

  .bomba-badge--bestseller {
    background: #D49A89;
    color: #2B1D24;
  }

  /* Sale price styling */
  .bomba-product-card__price--compare {
    opacity: 0.5;
    margin-right: 8px;
    font-weight: 500;
    text-decoration: line-through;
    text-decoration-thickness: 1px;
  }

  .bomba-product-card__price--sale {
    color: #D16B61;
    font-weight: 700;
  }

  /* Image link fills the image wrapper. tabindex=-1 + aria-hidden so SR / kb users don't tab through duplicate links to the product page. */
  .bomba-product-card__image-link {
    display: block;
    position: absolute;
    inset: 0;
    z-index: 10;
  }

  /* Wishlist position only — visual styling lives in section stylesheet */
  .bomba-product-card__wishlist-container {
    position: absolute;
    top: 14px;
    right: 14px;
    z-index: 20;
  }

  /* Variant-aware quick-add: the "Kies opties" control is an <a> to the PDP but
     wears the ATC button styling (position, glow, mobile circle) from the shared
     class. Only the anchor underline needs clearing. */
  a.bomba-product-card__add-to-cart {
    text-decoration: none;
  }
/* END_SNIPPET:bomba-product-card */

/* START_SNIPPET:bomba-shop-styles (INDEX:76) */
/* Above-fold intro animation — matches homepage / wishlist / about hero */
  @keyframes bombaShopHeroUp {
    from { opacity: 0; transform: translate3d(0, 28px, 0); }
    to   { opacity: 1; transform: translate3d(0, 0, 0); }
  }
  @keyframes bombaShopHeroChildUp {
    from { opacity: 0; transform: translate3d(0, 18px, 0); }
    to   { opacity: 1; transform: translate3d(0, 0, 0); }
  }
  .bomba-shop__hero-inner {
    animation: bombaShopHeroUp 700ms cubic-bezier(0.16, 1, 0.3, 1) both;
  }
  .bomba-shop__hero-inner > * {
    animation: bombaShopHeroChildUp 600ms cubic-bezier(0.16, 1, 0.3, 1) both;
  }
  .bomba-shop__hero-inner > :nth-child(1) { animation-delay: 80ms; }
  .bomba-shop__hero-inner > :nth-child(2) { animation-delay: 220ms; }

  @media (prefers-reduced-motion: reduce) {
    .bomba-shop__hero-inner,
    .bomba-shop__hero-inner > * { animation: none !important; opacity: 1 !important; transform: none !important; }
  }
  .shopify-design-mode .bomba-shop__hero-inner,
  .shopify-design-mode .bomba-shop__hero-inner > * { animation: none !important; opacity: 1 !important; transform: none !important; }

  .bomba-shop {
    --bomba-bg: #FFF5F8;
    --bomba-text: #2B1D24;
    --bomba-primary: #8A2E52;
    --bomba-primary-deep: #6F2441;
    --bomba-secondary: #D16B61;
    --bomba-accent: #D49A89;
    --bomba-surface: #DFA8BC;
    --bomba-card: #ffffff;
    --bomba-border-soft: rgba(43, 29, 36, 0.10);
    --bomba-border-softer: rgba(43, 29, 36, 0.06);
    --bomba-radius-sm: 4px;
    --bomba-radius-md: 8px;
    --bomba-radius-lg: 16px;
    --bomba-radius-pill: 40px;
    --bomba-shadow-lift: 0 8px 24px rgba(43, 29, 36, 0.08);
    --bomba-shadow-lift-hover: 0 14px 36px rgba(43, 29, 36, 0.12);
    --bomba-shadow-glow: 0 10px 30px rgba(138, 46, 82, 0.25);
    --bomba-shadow-glow-hover: 0 14px 40px rgba(138, 46, 82, 0.4);
    --bomba-shadow-drawer: 0 -8px 26px rgba(43, 29, 36, 0.14);

    min-height: 100vh;
    display: flex;
    flex-direction: column;
    font-family: var(--font-bomba-manrope), 'Manrope', sans-serif;
  }

  /* Global focus indicator */
  .bomba-shop a:focus-visible,
  .bomba-shop button:focus-visible,
  .bomba-shop input:focus-visible,
  .bomba-shop select:focus-visible,
  .bomba-shop .bomba-filter__nav-link:focus-visible,
  .bomba-drawer a:focus-visible,
  .bomba-drawer button:focus-visible,
  .bomba-drawer input:focus-visible,
  .bomba-drawer select:focus-visible {
    outline: 2px solid var(--bomba-primary);
    outline-offset: 3px;
    border-radius: var(--bomba-radius-sm);
  }
  .bomba-filter__option:has(input:focus-visible) {
    outline: 2px solid var(--bomba-primary);
    outline-offset: 2px;
    border-radius: var(--bomba-radius-sm);
  }

  .visually-hidden {
    position: absolute !important;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
  }

  /* Trust bar — quick reassurance band under hero */
  .bomba-shop__trust-bar {
    background: rgba(255, 255, 255, 0.55);
    -webkit-backdrop-filter: blur(12px);
            backdrop-filter: blur(12px);
    border-top: 1px solid var(--bomba-border-softer);
    border-bottom: 1px solid var(--bomba-border-softer);
    padding: 20px 24px;
  }
  .bomba-shop__trust-inner {
    max-width: 80rem;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 14px 24px;
    list-style: none;
    padding: 0;
  }
  @media (min-width: 768px) {
    .bomba-shop__trust-inner {
      grid-template-columns: repeat(4, 1fr);
      gap: 18px;
    }
  }
  .bomba-shop__trust-item {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.02em;
    color: var(--bomba-text);
    min-width: 0;
  }
  .bomba-shop__trust-icon {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: var(--bomba-surface);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--bomba-primary);
    flex-shrink: 0;
    box-shadow: var(--bomba-shadow-lift);
  }
  .bomba-shop__trust-icon .material-symbols-outlined {
    font-size: 18px;
  }
  .bomba-shop__trust-label {
    line-height: 1.35;
    min-width: 0;
  }
  @media (max-width: 767px) {
    /* Mobile: keep the top row only (2 items), drop the bottom row */
    .bomba-shop__trust-item:nth-child(n+3) {
      display: none;
    }
  }
  @media (max-width: 540px) {
    .bomba-shop__trust-item {
      font-size: 11px;
    }
  }

  /* Hero */
  .bomba-shop__hero {
    /* Top clears the floating header via the shared global token so the label
       lands on the same line as every other page; only the bottom band tightens
       on mobile to bring the first product row to the fold sooner. */
    padding: var(--bomba-header-clear) 0 24px;
  }
  @media (min-width: 768px) {
    .bomba-shop__hero {
      padding: var(--bomba-header-clear) 0 80px;
    }
  }
  .bomba-shop__hero-inner {
    max-width: 80rem;
    margin: 0 auto;
    padding: 0 1.5rem;
  }
  @media (min-width: 768px) {
    .bomba-shop__hero-inner {
      padding: 0 3rem;
    }
  }
  .bomba-shop__hero-label {
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.18em;
    margin: 0 0 16px;
    opacity: 0.9;
  }
  .bomba-shop__hero-title {
    font-size: clamp(2.5rem, 6vw, 4rem);
    font-weight: 800;
    line-height: 1.05;
    letter-spacing: -0.02em;
    margin: 0;
    max-width: 24ch;
  }
  .bomba-shop__hero-title em {
    font-family: var(--font-bomba-merriweather), 'Merriweather', serif;
    font-style: italic;
    font-weight: 400;
    letter-spacing: -0.01em;
  }

  /* Layout */
  .bomba-shop__container {
    display: grid;
    grid-template-columns: 1fr;
  }
  @media (min-width: 768px) {
    .bomba-shop__container {
      grid-template-columns: 260px 1fr;
    }
  }

  /* Sidebar */
  .bomba-shop__sidebar {
    padding: 48px 32px;
    display: none;
    border-right: 1px solid var(--bomba-border-softer);
  }
  @media (min-width: 768px) {
    .bomba-shop__sidebar {
      display: block;
      position: sticky;
      top: 120px;
      align-self: start;
      max-height: calc(100vh - 120px);
      overflow-y: auto;
    }
  }

  .bomba-filter__group {
    margin-bottom: 36px;
  }
  .bomba-filter__header {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 18px;
  }
  .bomba-filter__icon {
    width: 32px;
    height: 32px;
    border-radius: var(--bomba-radius-md);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
  }
  .bomba-filter__title {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.16em;
    margin: 0;
  }

  /* Collections nav */
  .bomba-filter__nav {
    display: flex;
    flex-direction: column;
    gap: 4px;
  }
  .bomba-filter__nav-link {
    display: block;
    padding: 10px 14px;
    font-size: 13px;
    font-weight: 600;
    color: var(--bomba-text);
    text-decoration: none;
    border-radius: var(--bomba-radius-md);
    border: 1px solid transparent;
    transition: background 0.2s ease, color 0.2s ease, transform 0.2s ease;
  }
  .bomba-filter__nav-link:hover {
    background: var(--bomba-surface);
    transform: translateX(2px);
  }
  .bomba-filter__nav-link.is-active {
    background: var(--bomba-primary);
    color: #fff;
  }

  /* Two-layer collections nav: main category -> subcategories (accordion) */
  .bomba-filter__nav-group {
    display: flex;
    flex-direction: column;
  }
  .bomba-filter__nav-parent {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    width: 100%;
    padding: 10px 14px;
    font-family: inherit;
    font-size: 13px;
    font-weight: 700;
    color: var(--bomba-text);
    text-align: left;
    background: transparent;
    border: 1px solid transparent;
    border-radius: var(--bomba-radius-md);
    cursor: pointer;
    -webkit-appearance: none;
    appearance: none;
    transition: background 0.2s ease, color 0.2s ease;
  }
  .bomba-filter__nav-parent:hover {
    background: var(--bomba-surface);
  }
  .bomba-filter__nav-parent .material-symbols-outlined {
    color: rgba(43, 29, 36, 0.4);
    flex: 0 0 auto;
    transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), color 0.2s ease;
  }
  .bomba-filter__nav-parent[aria-expanded="true"] {
    color: var(--bomba-primary);
  }
  .bomba-filter__nav-parent[aria-expanded="true"] .material-symbols-outlined {
    transform: rotate(90deg);
    color: var(--bomba-primary);
  }
  .bomba-filter__subnav {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows 0.3s cubic-bezier(0.16, 1, 0.3, 1);
  }
  .bomba-filter__subnav.is-open {
    grid-template-rows: 1fr;
  }
  .bomba-filter__subnav-inner {
    overflow: hidden;
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding-left: 12px;
  }
  .bomba-filter__nav-sublink {
    font-size: 12.5px;
    font-weight: 500;
  }
  @media (prefers-reduced-motion: reduce) {
    .bomba-filter__subnav,
    .bomba-filter__nav-parent .material-symbols-outlined {
      transition: none;
    }
  }

  /* Filter option list (checkboxes) */
  .bomba-filter__values {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
  }
  .bomba-filter__option {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 12px;
    border-radius: var(--bomba-radius-sm);
    cursor: pointer;
    font-size: 13px;
    color: var(--bomba-text);
    transition: background 0.18s ease;
  }
  .bomba-filter__option:hover {
    background: rgba(223, 168, 188, 0.25);
  }
  .bomba-filter__option input[type="checkbox"] {
    appearance: none;
    -webkit-appearance: none;
    width: 18px;
    height: 18px;
    border: 1.5px solid rgba(43, 29, 36, 0.35);
    border-radius: 4px;
    flex: 0 0 auto;
    position: relative;
    cursor: pointer;
    transition: all 0.2s ease;
    background: #fff;
  }
  .bomba-filter__option input[type="checkbox"]:checked {
    background: var(--bomba-primary);
    border-color: var(--bomba-primary);
  }
  .bomba-filter__option input[type="checkbox"]:checked::after {
    content: '';
    position: absolute;
    inset: 0;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='%23ffffff' d='M6.173 11.328L3.05 8.205l1.06-1.06 2.063 2.062L11.89 3.49l1.06 1.061z'/%3E%3C/svg%3E") center/12px 12px no-repeat;
  }
  .bomba-filter__option.is-active {
    font-weight: 700;
  }
  .bomba-filter__option.is-disabled {
    opacity: 0.4;
    cursor: not-allowed;
  }
  .bomba-filter__option-label {
    flex: 1;
    min-width: 0;
  }
  .bomba-filter__option-count {
    font-size: 11px;
    opacity: 0.55;
    font-variant-numeric: tabular-nums;
  }

  /* Price range */
  .bomba-filter__price {
    padding: 4px 0;
  }
  .bomba-filter__price-row {
    display: flex;
    gap: 10px;
  }
  .bomba-filter__price-field {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
  }
  .bomba-filter__price-label {
    font-size: 10px;
    font-weight: 700;
    opacity: 0.6;
    letter-spacing: 0.14em;
    text-transform: uppercase;
  }
  .bomba-filter__price-field input {
    font-family: var(--font-bomba-manrope), 'Manrope', sans-serif;
    font-size: 13px;
    padding: 10px 12px;
    border: 1px solid var(--bomba-border-soft);
    border-radius: var(--bomba-radius-md);
    background: var(--bomba-card);
    color: var(--bomba-text);
    width: 100%;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
  }
  .bomba-filter__price-field input:focus {
    border-color: var(--bomba-primary);
    outline: none;
    box-shadow: 0 0 0 3px rgba(138, 46, 82, 0.12);
  }

  .bomba-filter__actions {
    margin-top: 12px;
  }
  .bomba-filter__reset {
    display: inline-block;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--bomba-primary);
    text-decoration: underline;
    text-underline-offset: 4px;
    text-decoration-thickness: 1px;
  }
  .bomba-filter__reset:hover {
    color: var(--bomba-primary-deep);
  }

  /* Grid area */
  .bomba-shop__grid-area {
    padding: 40px 24px;
    min-width: 0;
  }
  @media (min-width: 1024px) {
    .bomba-shop__grid-area {
      padding: 64px 48px;
    }
  }

  .bomba-shop__controls {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    margin-bottom: 48px;
    gap: 24px;
    flex-wrap: wrap;
  }
  .bomba-shop__controls-right {
    display: flex;
    align-items: center;
    gap: 14px;
    flex-wrap: wrap;
  }
  .bomba-shop__breadcrumbs {
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.16em;
    opacity: 0.7;
    margin-bottom: 10px;
  }
  .bomba-shop__breadcrumbs a {
    color: inherit;
    text-decoration: none;
  }
  .bomba-shop__breadcrumbs a:hover {
    color: var(--bomba-primary);
    opacity: 1;
  }
  .bomba-shop__breadcrumbs span[aria-hidden="true"] {
    margin: 0 8px;
    opacity: 0.45;
  }
  .bomba-shop__collection-title {
    font-size: clamp(1.5rem, 2.4vw, 2rem);
    font-weight: 700;
    letter-spacing: -0.01em;
    margin: 0;
  }
  .bomba-shop__count {
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    opacity: 0.7;
    font-variant-numeric: tabular-nums;
  }
  /* Keep the "N producten" count visible on small phones too — it reassures
     shoppers the catalog is deep. It wraps to its own line under the controls
     when the row runs out of room. */
  @media (max-width: 540px) {
    .bomba-shop__count {
      flex-basis: 100%;
      text-align: left;
    }
  }

  /* Sort select */
  .bomba-shop__sort {
    position: relative;
    display: inline-flex;
    align-items: center;
  }
  .bomba-shop__sort select {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background: var(--bomba-card);
    border: 1px solid var(--bomba-border-soft);
    border-radius: var(--bomba-radius-pill);
    padding: 11px 40px 11px 18px;
    font-family: var(--font-bomba-manrope), 'Manrope', sans-serif;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--bomba-text);
    cursor: pointer;
    transition: background 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
  }
  .bomba-shop__sort select:hover {
    background: var(--bomba-surface);
    border-color: var(--bomba-surface);
    box-shadow: var(--bomba-shadow-lift);
  }
  .bomba-shop__sort-chevron {
    position: absolute;
    right: 14px;
    pointer-events: none;
    color: var(--bomba-text);
  }

  /* Mobile filter button (top of list, original spot) */
  .bomba-shop__mobile-filter-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    background: var(--bomba-card);
    color: var(--bomba-text);
    border: 1px solid var(--bomba-border-soft);
    border-radius: var(--bomba-radius-pill);
    padding: 11px 20px;
    cursor: pointer;
    transition: transform 0.12s ease, background 0.14s ease, box-shadow 0.14s ease;
  }
  /* Hover state only on real hover devices — no sticky pink ramp on tap. */
  @media (hover: hover) {
    .bomba-shop__mobile-filter-btn:hover {
      background: var(--bomba-surface);
      border-color: var(--bomba-surface);
      box-shadow: var(--bomba-shadow-lift);
    }
  }
  @media (min-width: 768px) {
    .bomba-shop__mobile-filter-btn {
      display: none;
    }
  }

  /* Active-filter count badge on the trigger */
  .bomba-shop__filter-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    margin-left: 2px;
    border-radius: 9px;
    background: var(--bomba-primary);
    color: #fff;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0;
  }

  /* Floating filter trigger — fixed, always reachable on mobile */
  .bomba-shop__filter-fab { display: none; }
  @media (max-width: 767px) {
    .bomba-shop__filter-fab {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      position: fixed;
      /* Lifted clear of the iOS Safari bottom-toolbar hot zone, so the first
         tap opens the filter instead of revealing Safari's chrome. */
      bottom: calc(64px + env(safe-area-inset-bottom));
      left: 50%;
      z-index: 900;
      background: var(--bomba-primary);
      color: #fff;
      border: none;
      border-radius: var(--bomba-radius-pill);
      padding: 14px 26px;
      font-family: var(--font-bomba-manrope), 'Manrope', sans-serif;
      font-size: 12px;
      font-weight: 700;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      box-shadow: 0 10px 30px rgba(138, 46, 82, 0.35);
      cursor: pointer;
      /* Hidden by default; fades in/out (no transform = no jitter). */
      transform: translateX(-50%);
      opacity: 0;
      visibility: hidden;
      pointer-events: none;
      transition: opacity 0.28s ease, visibility 0s linear 0.28s;
      will-change: opacity;
    }
    .bomba-shop__filter-fab.is-visible {
      opacity: 1;
      visibility: visible;
      pointer-events: auto;
      transition: opacity 0.28s ease;
    }
    /* room so the FAB never covers the last product row */
    .bomba-shop__grid-area { padding-top: 24px; padding-bottom: 150px; }
    /* Tighten the gap above the first product row so products reach the fold. */
    .bomba-shop__controls { margin-bottom: 24px; }
  }

  /* Applied-filter chips (mobile) */
  .bomba-shop__chips { display: none; }
  @media (max-width: 767px) {
    .bomba-shop__chips {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      margin: -24px 0 28px;
    }
    .bomba-shop__chip {
      display: inline-flex;
      align-items: center;
      gap: 5px;
      padding: 7px 8px 7px 14px;
      border-radius: var(--bomba-radius-pill);
      background: var(--bomba-card);
      border: 1px solid var(--bomba-border-soft);
      color: var(--bomba-text);
      font-size: 12px;
      font-weight: 600;
      text-decoration: none;
      line-height: 1;
    }
    .bomba-shop__chip .material-symbols-outlined {
      opacity: 0.55;
    }
    .bomba-shop__chip--clear {
      padding: 7px 14px;
      background: transparent;
      border-color: transparent;
      color: var(--bomba-primary);
      text-decoration: underline;
      text-underline-offset: 2px;
    }
  }

  /* Grid */
  .bomba-shop__grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 54px 14px;
  }
  @media (min-width: 640px) {
    .bomba-shop__grid {
      gap: 64px 28px;
    }
  }
  @media (min-width: 1024px) {
    .bomba-shop__grid {
      grid-template-columns: repeat(4, 1fr);
      gap: 72px 32px;
    }
  }

  /* Desktop / laptop: cap the product image height. The 1/1 square ran
     ~390px tall on wide 4-up screens (and far taller on the old 2-up
     laptop band), pushing the title + price below the fold on landing.
     Capping height crops square photos slightly via object-fit: cover but
     keeps the title visible the moment you arrive. Mobile keeps full 1/1. */
  @media (min-width: 1024px) {
    .bomba-product-card__image-wrapper {
      max-height: 300px;
    }
  }

  /* Phones: compact circular quick-add tucked in the image corner
     (ASOS / Zalando / H&M pattern) so it barely covers the photo.
     `.bomba-shop` prefix raises specificity above the base button rules so
     the circular layout holds in every state (incl. disabled / "toegevoegd"),
     instead of snapping back to the centered base position on click. */
  @media (max-width: 639px) {
    .bomba-shop .bomba-product-card__add-to-cart {
      left: auto;
      right: 10px;
      bottom: 10px;
      transform: none;
      width: 44px;
      height: 44px;
      min-width: 0;
      max-width: none;
      padding: 0;
      gap: 0;
      border-radius: 50%;
      font-size: 0;            /* hides the text label; icon keeps its size */
      white-space: nowrap;
      overflow: hidden;
      box-shadow: 0 4px 14px rgba(138, 46, 82, 0.32);
    }
    .bomba-shop .bomba-product-card__add-to-cart .material-symbols-outlined {
      font-size: 20px !important;
    }
    .bomba-shop .bomba-product-card__add-to-cart:hover {
      transform: none;
    }
    .bomba-product-card__info {
      padding-top: 12px;
    }
  }

  /* Product card */
  .bomba-product-card {
    position: relative;
    display: flex;
    flex-direction: column;
  }
  .bomba-product-card__image-wrapper {
    position: relative;
    aspect-ratio: 1 / 1;
    background: var(--bomba-card);
    border-radius: var(--bomba-radius-md);
    box-shadow: var(--bomba-shadow-lift);
    overflow: visible;
    transition: box-shadow 0.35s cubic-bezier(0.16, 1, 0.3, 1), transform 0.35s cubic-bezier(0.16, 1, 0.3, 1);
  }
  .bomba-product-card__image-container {
    position: absolute;
    inset: 0;
    overflow: hidden;
    border-radius: var(--bomba-radius-md);
  }
  .bomba-product-card__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.7s cubic-bezier(0.16, 1, 0.3, 1);
  }
  /* Lift + zoom ONLY on hover-capable devices. On touchscreens a tap
     triggers :hover, which made the whole card jump/resize on press. */
  @media (hover: hover) {
    .bomba-product-card:hover .bomba-product-card__image-wrapper {
      box-shadow: var(--bomba-shadow-lift-hover);
      transform: translateY(-2px);
    }
    .bomba-product-card:hover .bomba-product-card__image {
      transform: scale(1.05);
    }
  }

  .bomba-product-card__wishlist {
    width: 40px;
    height: 40px;
    background: rgba(255, 255, 255, 0.92);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border: 1px solid var(--bomba-border-softer);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: var(--bomba-shadow-lift);
    transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1);
    cursor: pointer;
    color: var(--bomba-text);
  }
  @media (hover: hover) {
    .bomba-product-card__wishlist:hover {
      background: var(--bomba-surface);
      transform: translateY(-1px);
      box-shadow: var(--bomba-shadow-lift-hover);
    }
  }

  .bomba-product-card__add-to-cart {
    position: absolute;
    bottom: -22px;
    left: 50%;
    transform: translateX(-50%);
    width: auto;
    min-width: 70%;
    max-width: 220px;
    padding: 13px 22px;
    border: 1px solid transparent;
    border-radius: var(--bomba-radius-md);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font-family: var(--font-bomba-manrope), 'Manrope', sans-serif;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    z-index: 20;
    box-shadow: var(--bomba-shadow-glow);
    /* Narrow transition (not `all`) — cheaper on older Safari. */
    transition: background 0.25s ease, box-shadow 0.3s ease, color 0.2s ease;
    cursor: pointer;
    white-space: nowrap;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
  }
  @media (hover: hover) {
    .bomba-product-card__add-to-cart:hover {
      transform: translate(-50%, -2px);
      box-shadow: var(--bomba-shadow-glow-hover);
    }
  }
  .bomba-product-card__add-to-cart[disabled] {
    opacity: 0.55;
    cursor: not-allowed;
    box-shadow: var(--bomba-shadow-lift);
  }

  .bomba-product-card__sold-out {
    position: absolute;
    inset: 0;
    z-index: 10;
    background: rgba(43, 29, 36, 0.35);
    border-radius: var(--bomba-radius-md);
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
  }
  .bomba-product-card__sold-out-text {
    font-family: var(--font-bomba-merriweather), 'Merriweather', serif;
    font-size: 1.4rem;
    font-weight: 400;
    font-style: italic;
    letter-spacing: 0.04em;
    color: #fff;
    background: var(--bomba-text);
    padding: 10px 22px;
    border-radius: var(--bomba-radius-pill);
  }

  .bomba-product-card__info {
    padding-top: 38px;
    text-align: center;
    display: flex;
    flex-direction: column;
    gap: 8px;
  }
  .bomba-product-card__title {
    font-size: 17px;
    font-weight: 700;
    text-decoration: none;
    letter-spacing: -0.005em;
    line-height: 1.3;
    transition: color 0.2s ease;
  }
  .bomba-product-card__price {
    font-weight: 600;
    font-size: 15px;
  }

  /* Mobile: clamp titles to two lines and reserve that height so every card's
     price sits on the same baseline — otherwise 1- vs 3-line titles stagger the
     prices across the 2-up grid. */
  @media (max-width: 767px) {
    .bomba-product-card__title {
      display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
      overflow: hidden;
      min-height: 2.6em; /* 2 lines at line-height 1.3 */
    }
  }

  /* Pagination */
  .bomba-shop__pagination {
    display: flex;
    justify-content: center;
    gap: 6px;
    margin-top: 72px;
    flex-wrap: wrap;
  }
  .bomba-shop__page-link {
    min-width: 44px;
    height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 12px;
    border-radius: var(--bomba-radius-md);
    font-size: 13px;
    font-weight: 600;
    color: var(--bomba-text);
    text-decoration: none;
    background: transparent;
    border: 1px solid transparent;
    transition: all 0.2s ease;
    font-variant-numeric: tabular-nums;
  }
  .bomba-shop__page-link:hover {
    background: var(--bomba-surface);
  }
  .bomba-shop__page-link.is-current {
    background: var(--bomba-primary);
    color: #fff;
    cursor: default;
  }
  .bomba-shop__page-link--ellipsis {
    cursor: default;
    opacity: 0.5;
  }

  /* Empty state */
  .bomba-shop__empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 80px 24px;
    gap: 16px;
  }
  .bomba-shop__empty-glyph {
    width: 88px;
    height: 88px;
    border-radius: 50%;
    background: var(--bomba-surface);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--bomba-primary);
    box-shadow: var(--bomba-shadow-lift);
  }
  .bomba-shop__empty-glyph .material-symbols-outlined {
    font-size: 40px;
  }
  .bomba-shop__empty-title {
    font-size: 22px;
    font-weight: 700;
    letter-spacing: -0.01em;
    margin: 0;
  }
  .bomba-shop__empty-body {
    font-size: 15px;
    line-height: 1.6;
    color: rgba(43, 29, 36, 0.75);
    max-width: 42ch;
    margin: 0;
  }
  .bomba-shop__empty-cta {
    margin-top: 16px;
    padding: 14px 28px;
    background: var(--bomba-primary);
    color: #fff;
    border-radius: var(--bomba-radius-md);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    text-decoration: none;
    box-shadow: var(--bomba-shadow-glow);
    transition: all 0.25s ease;
  }
  .bomba-shop__empty-cta:hover {
    background: var(--bomba-primary-deep);
    box-shadow: var(--bomba-shadow-glow-hover);
    transform: translateY(-1px);
  }

  /* Mobile Drawer */
  /* Two-state drawer:
       .is-open   = mounted (visible, panel still off-screen) — paints the
                    start frame so the slide never skips.
       .is-active = animate in (overlay fades, panel slides to 0).        */
  .bomba-drawer {
    position: fixed;
    inset: 0;
    z-index: 1000;
    visibility: hidden;
    pointer-events: none;
  }
  .bomba-drawer.is-open {
    visibility: visible;
    pointer-events: auto;
  }
  .bomba-drawer__overlay {
    position: absolute;
    inset: 0;
    background: rgba(43, 29, 36, 0.45);
    opacity: 0;
    transition: opacity 0.4s ease;
  }
  .bomba-drawer.is-active .bomba-drawer__overlay {
    opacity: 1;
  }
  .bomba-drawer__panel {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: var(--bomba-bg);
    border-top-left-radius: 24px;
    border-top-right-radius: 24px;
    /* No top/bottom padding: the sticky header IS the top of the panel and
       the sticky footer IS the bottom. Scrollport padding would offset the
       sticky stops (top:0 / bottom:0) and leave gaps the list scrolls through. */
    padding: 0 24px;
    height: 75vh;
    max-height: 75vh;
    overflow-y: auto;
    transform: translateY(100%);
    /* CLOSE curve: ease-in (slow start, accelerates down) so the exit reads. */
    transition: transform 0.4s cubic-bezier(0.5, 0, 0.75, 0.25);
    box-shadow: var(--bomba-shadow-drawer);
    -webkit-overflow-scrolling: touch;
    will-change: transform;
    touch-action: manipulation;
  }
  .bomba-drawer.is-active .bomba-drawer__panel {
    transform: translateY(0);
    /* OPEN curve: ease-out (decelerates into place), snappy. */
    transition: transform 0.34s cubic-bezier(0.22, 1, 0.36, 1);
  }

  /* Remove the legacy ~300ms touch delay + add tactile press feedback. */
  .bomba-shop__mobile-filter-btn,
  .bomba-shop__filter-fab,
  .bomba-drawer__close,
  .bomba-drawer__apply,
  .bomba-drawer__reset {
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
  }
  .bomba-shop__mobile-filter-btn:active,
  .bomba-shop__filter-fab:active,
  .bomba-drawer__apply:active {
    transform: scale(0.97);
  }
  .bomba-shop__filter-fab.is-visible:active {
    transform: translateX(-50%) scale(0.97);
  }
  @media (prefers-reduced-motion: reduce) {
    .bomba-drawer,
    .bomba-drawer__overlay,
    .bomba-drawer__panel {
      transition: none !important;
    }
  }
  .bomba-drawer__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: sticky;
    top: 0;
    z-index: 2;
    background: var(--bomba-bg);
    /* First child + no panel top padding → the bar sits flush against the top
       of the panel. Negative side margins make it full-bleed over the gutters
       so scrolled content can never peek above the "Filters" title; the panel's
       overflow + border-radius clips this bar to the rounded top corners. */
    margin: 0 -24px 24px;
    padding: 24px 24px 12px;
  }
  .bomba-drawer__header h3 {
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.16em;
    margin: 0;
  }
  .bomba-drawer__close {
    width: 40px;
    height: 40px;
    background: var(--bomba-card);
    border: 1px solid var(--bomba-border-soft);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1);
    color: var(--bomba-text);
  }
  .bomba-drawer__close:hover {
    background: var(--bomba-surface);
    box-shadow: var(--bomba-shadow-lift);
  }

  /* Drawer batches selections; this sticky footer applies them once. */
  .bomba-drawer__footer {
    position: sticky;
    bottom: 0;
    display: flex;
    align-items: center;
    gap: 14px;
    /* Full-bleed over the 24px gutters; flush to the panel bottom (panel has no
       bottom padding now) so the sticky bottom:0 stop has no gap beneath it. */
    margin: 20px -24px 0;
    padding: 16px 24px calc(20px + env(safe-area-inset-bottom));
    background: var(--bomba-bg);
    border-top: 1px solid var(--bomba-border-soft);
  }
  .bomba-drawer__reset {
    color: var(--bomba-text);
    font-size: 13px;
    font-weight: 600;
    text-decoration: underline;
    text-underline-offset: 3px;
    white-space: nowrap;
  }
  .bomba-drawer__apply {
    flex: 1;
    background: var(--bomba-primary);
    color: #fff;
    border: none;
    border-radius: var(--bomba-radius-md);
    padding: 15px 20px;
    font-family: var(--font-bomba-manrope), 'Manrope', sans-serif;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    cursor: pointer;
    box-shadow: var(--bomba-shadow-glow);
    transition: background 0.2s ease, transform 0.25s cubic-bezier(0.16, 1, 0.3, 1);
  }
  .bomba-drawer__apply:hover {
    background: var(--bomba-primary-deep);
    transform: translateY(-1px);
  }
  /* Drawer uses its own footer reset; hide the duplicate inline one. */
  .bomba-drawer .bomba-filter__actions { display: none; }

  /* Animations — staged reveals, hover affordance choreography */
  @keyframes bomba-badge-in {
    from {
      opacity: 0;
      transform: translateY(-6px) scale(0.92);
    }
    to {
      opacity: 1;
      transform: translateY(0) scale(1);
    }
  }
  .bomba-product-card .bomba-badge {
    animation: bomba-badge-in 0.5s cubic-bezier(0.22, 1, 0.36, 1) both;
    animation-delay: 0.25s;
  }

  /* ATC reveal choreography (hover-capable pointers only — mobile keeps full prominence) */
  @media (hover: hover) and (pointer: fine) {
    .bomba-product-card .bomba-product-card__add-to-cart {
      opacity: 0.78;
      transform: translate(-50%, 6px);
      transition:
        transform 0.4s cubic-bezier(0.22, 1, 0.36, 1),
        opacity 0.3s ease,
        box-shadow 0.4s cubic-bezier(0.22, 1, 0.36, 1),
        background 0.3s ease;
    }
    .bomba-product-card:hover .bomba-product-card__add-to-cart {
      opacity: 1;
      transform: translate(-50%, -2px) scale(1.03);
      box-shadow: var(--bomba-shadow-glow-hover);
    }
    .bomba-product-card .bomba-product-card__add-to-cart:hover {
      transform: translate(-50%, -4px) scale(1.05);
    }
  }

  /* Reduced motion */
  @media (prefers-reduced-motion: reduce) {
    .bomba-product-card,
    .bomba-product-card__image,
    .bomba-product-card__image-wrapper,
    .bomba-product-card__add-to-cart,
    .bomba-product-card__wishlist,
    .bomba-filter__nav-link,
    .bomba-filter__button,
    .bomba-shop__page-link,
    .bomba-shop__mobile-filter-btn {
      transition: none !important;
    }
    .bomba-product-card:hover .bomba-product-card__image-wrapper,
    .bomba-product-card:hover .bomba-product-card__image {
      transform: none !important;
    }
    .bomba-product-card .bomba-product-card__add-to-cart,
    .bomba-product-card:hover .bomba-product-card__add-to-cart,
    .bomba-product-card .bomba-product-card__add-to-cart:hover {
      transform: translateX(-50%) !important;
      opacity: 1 !important;
    }
    .bomba-product-card .bomba-badge {
      animation: none !important;
      opacity: 1 !important;
      transform: none !important;
    }
  }
/* END_SNIPPET:bomba-shop-styles */

/* START_SNIPPET:bomba-wishlist-button (INDEX:77) */
.bomba-wishlist-toggle {
    background: rgba(255, 255, 255, 0.92);
    border: none;
    padding: 0.5rem;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #8A2E52;
    position: relative;
    border-radius: 50%;
    box-shadow: 0 2px 10px rgba(43, 29, 36, 0.15);
    transition: color 0.25s ease, background 0.25s ease, box-shadow 0.25s ease;
  }

  .bomba-wishlist-toggle.is-active::after {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: 50%;
    border: 2px solid rgba(138, 46, 82, 0.6);
    pointer-events: none;
    animation: bomba-heart-ring 0.5s cubic-bezier(0.16, 1, 0.3, 1) forwards;
  }

  @keyframes bomba-heart-ring {
    0%   { transform: scale(0.7); opacity: 1; }
    100% { transform: scale(2); opacity: 0; }
  }

  .bomba-wishlist-toggle .heart-icon {
    transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1);
  }

  .bomba-wishlist-toggle:hover .heart-icon {
    transform: scale(1.12);
    color: #6F2342;
  }

  .bomba-wishlist-toggle:focus-visible {
    outline: 2px solid #8A2E52;
    outline-offset: 3px;
    border-radius: 50%;
  }

  .bomba-wishlist-toggle.is-active {
    background: #FFCFE0;
    box-shadow: 0 3px 16px rgba(138, 46, 82, 0.45);
    border: 1.5px solid rgba(138, 46, 82, 0.35);
  }

  .bomba-wishlist-toggle.is-active .heart-icon--filled {
    display: block !important;
    color: #8A2E52 !important;
    animation: bomba-heart-pop 0.55s cubic-bezier(0.22, 1, 0.36, 1);
  }

  .bomba-wishlist-toggle.is-active .heart-icon:not(.heart-icon--filled) {
    display: none !important;
  }

  @keyframes bomba-heart-pop {
    0%   { transform: scale(0.45) rotate(-8deg); }
    30%  { transform: scale(1.45) rotate(4deg); }
    55%  { transform: scale(0.88) rotate(-1deg); }
    75%  { transform: scale(1.1); }
    100% { transform: scale(1); }
  }

  @media (prefers-reduced-motion: reduce) {
    .bomba-wishlist-toggle,
    .bomba-wishlist-toggle .heart-icon {
      transition: none !important;
      animation: none !important;
    }
    .bomba-wishlist-toggle:hover .heart-icon {
      transform: none !important;
    }
  }
/* END_SNIPPET:bomba-wishlist-button */