/** Shopify CDN: Minification failed

Line 19:20 Unexpected "{"
Line 19:29 Expected ":"
Line 23:20 Unexpected "{"
Line 23:29 Expected ":"
Line 33:20 Unexpected "{"
Line 33:29 Expected ":"
Line 37:20 Unexpected "{"
Line 37:29 Expected ":"
Line 41:20 Unexpected "{"
Line 41:29 Expected ":"
... and 56 more hidden warnings

**/
/* START_SECTION:pdp-brand-story (INDEX:58) */
/* ---- Backdrop wrapper: one wave/stripe image OR solid color spans behind
     BOTH the About Us row and the holiday panel row below it ---- */
  #shopify-section-{{ section.id }} .pdp-brand-story__backdrop {
    position: relative;
    width: 100%;
  }
  #shopify-section-{{ section.id }} .pdp-brand-story__backdrop-bg {
    position: absolute;
    top: var(--backdrop-start, 35%);
    left: 0;
    width: 100%;
    height: calc(100% - var(--backdrop-start, 35%));
    object-fit: cover;
    object-position: center var(--backdrop-position, 50%);
    z-index: 0;
  }
  #shopify-section-{{ section.id }} .pdp-brand-story__backdrop-bg--color {
    /* solid-color variant reuses the same top/height/border-radius as the image */
    background-repeat: no-repeat;
  }
  #shopify-section-{{ section.id }} .pdp-brand-story__row {
    position: relative;
    z-index: 2;
  }
  #shopify-section-{{ section.id }} .pdp-brand-story__holiday-row {
    position: relative;
    z-index: 1;
  }

  /* ---- Layout: Row 1 = image + content side by side ---- */
  #shopify-section-{{ section.id }} .pdp-brand-story__row {
    display: flex;
    flex-wrap: wrap;
    gap: 32px;
    align-items: center;
  }
  #shopify-section-{{ section.id }} .pdp-brand-story__media {
    flex: 1 1 380px;
    min-width: 260px;
    display: flex;
    flex-direction: column;
  }
  #shopify-section-{{ section.id }} .pdp-brand-story__content {
    flex: 1 1 380px;
    min-width: 260px;
    position: relative;
    z-index: 2;
  }
  #shopify-section-{{ section.id }} .pdp-brand-story__row--image-right .pdp-brand-story__media {
    order: 1;
  }

  /* ---- Row 2 = full-width holiday panel below. Left/right/bottom padding
     exposes the backdrop (color or image) as a frame around the panel,
     ending flush with the bottom of the section. Top spacing stays as a
     fixed gap below Row 1, matching the original design. ---- */
  #shopify-section-{{ section.id }} .pdp-brand-story__holiday-row {
    width: 100%;
    margin-top: 40px;
    padding: 0 var(--panel-padding, 0) var(--panel-padding, 0);
    box-sizing: border-box;
  }

  /* ---- Decoration anchors need relative positioning + visible overflow ---- */
  .pdp-decoration-anchor {
    position: relative;
  }
  .pdp-brand-story__header.pdp-decoration-anchor,
  .pdp-brand-story__media.pdp-decoration-anchor,
  .pdp-holiday-panel.pdp-decoration-anchor {
    overflow: visible;
  }

  /* ---- Floating decoration images. Position (top/left/width) comes from
     an inline style set in pdp-decoration.liquid — a fluid calc()/clamp()
     formula that scales continuously with viewport width, so it isn't
     limited to two fixed mobile/desktop snapshots. ---- */
  .pdp-decoration {
    position: absolute;
    z-index: 5;
    pointer-events: none;
    max-width: none;
    will-change: transform, opacity;
    transition: transform var(--anim-duration, 700ms) cubic-bezier(0.2, 0.7, 0.3, 1),
                opacity var(--anim-duration, 700ms) ease;
    opacity: 1;
  }
  .pdp-decoration.pdp-anim-ready:not(.is-inview) {
    opacity: 0;
  }
  .pdp-decoration--hide-mobile {
    display: none;
  }
  @media screen and (min-width: 750px) {
    .pdp-decoration--hide-mobile {
      display: block;
    }
    .pdp-decoration--hide-desktop {
      display: none;
    }
  }

@media screen and (max-width: 790px) {
   .pdp-brand-story__header.pdp-decoration-anchor
  {
    overflow: visible;
    padding: 0 15px;
  }
}
  .pdp-decoration[data-animate-from="top"]    { transform: translate(0, calc(-1 * var(--anim-distance, 50px))); }
  .pdp-decoration[data-animate-from="bottom"] { transform: translate(0, var(--anim-distance, 50px)); }
  .pdp-decoration[data-animate-from="left"]   { transform: translate(calc(-1 * var(--anim-distance, 50px)), 0); }
  .pdp-decoration[data-animate-from="right"]  { transform: translate(var(--anim-distance, 50px), 0); }
  .pdp-decoration.is-inview {
    opacity: 1;
    transform: translate(0, 0) !important;
  }
  @media (prefers-reduced-motion: reduce) {
    .pdp-decoration, .js-pdp-animate { transition: none !important; opacity: 1 !important; transform: none !important; }
  }

  /* ---- Fade/slide-up for content blocks ---- */
  .js-pdp-animate {
    opacity: 1;
    transform: translateY(0);
    transition: transform var(--anim-duration, 700ms) cubic-bezier(0.2, 0.7, 0.3, 1),
                opacity var(--anim-duration, 700ms) ease;
    transition-delay: var(--pdp-delay, 0ms);
  }
  .js-pdp-animate.pdp-anim-ready:not(.is-inview) {
    opacity: 0;
    transform: translateY(var(--anim-distance, 50px));
  }
  .js-pdp-animate.is-inview {
    opacity: 1;
    transform: translateY(0);
  }

  /* ---- Holiday panel: one rounded box, two FLUSH halves ---- */
  #shopify-section-{{ section.id }} .pdp-holiday-panel {
    width: 100%;
    position: relative;
    border-radius: 24px;
    overflow: hidden;
    display: flex;
    align-items: stretch;
    min-height: var(--holiday-panel-height, 460px);
  }

  /* ---- Left half: photo, edge to edge. Transparent background lets the
     backdrop (image or color, behind both rows) show through. Height is
     driven by the photo's own aspect ratio (set inline as
     --photo-aspect-ratio), so the box always matches the photo exactly —
     no cropping, no gaps. ---- */
  #shopify-section-{{ section.id }} .pdp-holiday-panel__photo-col {
    position: relative;
    flex: 1 1 50%;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    background-color: transparent;
  }
  #shopify-section-{{ section.id }} .pdp-holiday-panel__body-col:only-child {
    flex: 1 1 100%;
  }
  #shopify-section-{{ section.id }} .pdp-holiday-panel__photo-frames {
    position: relative;
    flex: 1 1 auto;
    width: 100%;
  }
  #shopify-section-{{ section.id }} .pdp-holiday-panel__photo-frame {
    position: relative;
    width: 100%;
    aspect-ratio: var(--photo-aspect-ratio, 1.5);
  }
  #shopify-section-{{ section.id }} .pdp-holiday-panel__photo {
    display: block;
    width: 100%;
    height: 100%;
    max-width: none;
    object-fit: cover;
  }

  /* ---- Right half: image, fills edge to edge ---- */
  #shopify-section-{{ section.id }} .pdp-holiday-panel__body-col {
    flex: 1 1 50%;
    position: relative;
    overflow: hidden;
  }
  #shopify-section-{{ section.id }} .pdp-holiday-panel__body-image {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  @media screen and (max-width: 749px) {
    #shopify-section-{{ section.id }} .pdp-brand-story__row {
      flex-direction: column;
    }
    #shopify-section-{{ section.id }} .pdp-brand-story__row--image-right .pdp-brand-story__media {
      order: 0;
    }
    #shopify-section-{{ section.id }} .pdp-brand-story__header,
    #shopify-section-{{ section.id }} .pdp-brand-story__media,
    #shopify-section-{{ section.id }} .pdp-brand-story__content {
      text-align: center;
    }
    #shopify-section-{{ section.id }} .pdp-brand-story__content {
      display: flex;
      flex-direction: column;
      align-items: center;
      padding-left: var(--content-padding-mobile, 20px);
      padding-right: var(--content-padding-mobile, 20px);
      box-sizing: border-box;
      margin-top: var(--media-content-gap-mobile, 0px);
    }
    #shopify-section-{{ section.id }} .pdp-brand-story__media,
    #shopify-section-{{ section.id }} .pdp-brand-story__content {
      flex: 1 1 auto;
    }
    #shopify-section-{{ section.id }} .pdp-brand-story__row {
      gap: 0;
    }
    #shopify-section-{{ section.id }} .pdp-brand-story__holiday-row {
      margin-top: calc(-1 * var(--content-panel-pull, 60px));
      position: relative;
      z-index: 1;
    }
    #shopify-section-{{ section.id }} .pdp-brand-story__content {
      gap: var(--content-gap-mobile, 12px);
    }
    #shopify-section-{{ section.id }} .pdp-brand-story__text.rte p {
      margin: 0 0 8px;
    }

    #shopify-section-{{ section.id }} .pdp-holiday-panel {
      flex-direction: column;
      min-height: 0;
    }
    #shopify-section-{{ section.id }} .pdp-holiday-panel__body-col {
      min-height: 0;
      aspect-ratio: var(--body-aspect-ratio, 1.2);
    }
    #shopify-section-{{ section.id }} .pdp-holiday-panel__body-image {
      position: absolute;
      inset: 0;
      object-fit: cover;
    }
  }
/* END_SECTION:pdp-brand-story */