.shopify-section--image-double-content {
  & > zag-section {
    display: block;
    position: relative;
    inline-size: calc(100% - 2 * var(--zag-gutter));
    max-inline-size: var(--max-inline-size, 120rem);
    margin-inline: auto;
    margin-block-start: var(--mobile-margin-block-start, 0);
    margin-block-end: var(--mobile-margin-block-end, 0);

    @media (width >= 48rem) {
      margin-block-start: var(--desktop-margin-block-start, 0);
      margin-block-end: var(--desktop-margin-block-end, 0);
      padding-block: var(--mobile-padding-block, 3rem);
    }
  }

  & > [data-modifiers*="full-width"] {
    inline-size: 100%;
    max-inline-size: 100%;
  }

  & .main-container {
    display: grid;
    grid-template-columns: 1fr;
  }

  & [data-modifiers*="gap:true"] {
    & .main-container {
      gap: var(--desktop-grid-gap, 3rem);
    }
  }

  @media (width >= 48rem) {
    & .main-container {
      grid-template-columns: 1fr 1fr;
    }

    & [data-modifiers*="gap:true"] {
      & .main-container {
        gap: var(--desktop-grid-gap, 3rem);
      }
    }
  }

  & .column-content {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: flex-start;

    @media (width >= 48rem) {
      gap: var(--desktop-grid-gap, 0rem);
    }
  }

  & .column-content[data-modifiers*="column-order:text-first"] .content-block {
    padding-bottom: var(--mobile-padding-block, 0rem);

    @media (width >= 48rem) {
      padding-bottom: var(--desktop-padding-block, 0rem);
    }
  }

  & .column-content[data-modifiers*="column-order:image-first"] .content-block {
    padding-top: var(--mobile-padding-block, 0rem);
    order: 1;
    @media (width >= 48rem) {
      padding-top: var(--desktop-padding-block, 0rem);
    }
  }

  & .column-content[data-modifiers*="block-position:center"] .content-block {
    padding-top: var(--mobile-padding-block, 0rem);

    @media (width >= 48rem) {
      margin-inline: auto;
    }
  }

  & .media-container {
    width: 100%;
  }

  & .media-container :is(img, video) {
    display: block;
    inline-size: 100%;
    block-size: auto;
    object-fit: cover;
    max-height: 100vh;
    overflow: hidden;
  }

  & .media-container .hero-video {
    &[data-modifiers*="desktop"] {
      display: none;
    }

    @media (width >= 48rem) {
      &[data-modifiers*="mobile"] {
        display: none;
      }

      &[data-modifiers*="desktop"] {
        display: block;
      }
    }
  }

  &
    > [data-modifiers*="mobile-height:percentage"]
    .media-container
    :is(img, video) {
    block-size: var(--mobile-height-percentage);
  }

  @media (width >= 48rem) {
    &
      > [data-modifiers*="desktop-height:percentage"]
      .media-container
      :is(img, video) {
      block-size: var(--desktop-height-percentage);
    }
  }

  & > [data-modifiers*="mobile-height:fixed"] .media-container :is(img, video) {
    block-size: var(--mobile-height-fixed);
  }

  @media (width >= 48rem) {
    &
      > [data-modifiers*="desktop-height:fixed"]
      .media-container
      :is(img, video) {
      block-size: var(--desktop-height-fixed);
    }
  }

  &
    > [data-modifiers*="mobile-height:aspect_ratio"]
    .media-container
    :is(img, video) {
    aspect-ratio: var(--mobile-height-aspect-ratio);
  }

  @media (width >= 48rem) {
    &
      > [data-modifiers*="desktop-height:aspect_ratio"]
      .media-container
      :is(img, video) {
      aspect-ratio: var(--desktop-height-aspect-fixed);
    }
  }

  & .play-pause-button {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 2.5rem;
    height: 2.5rem;
    display: flex;
    align-items: center;
    justify-content: center;

    & .play-pause-button__button {
      width: 100%;
      height: 100%;
      color: var(--white-color);
      background-color: rgba(255, 255, 255, 0.2);
      backdrop-filter: blur(25px);
      border-radius: 32px;
      padding: 0.75rem;

      & .play__icon {
        display: none;
      }
      > * {
        display: block;
        width: 100%;
        height: 100%;

        & svg {
          width: 100%;
          height: 100%;
        }
      }
    }
  }

  & .shopify-block--button:not([data-modifiers*="full-width"]) {
    inline-size: fit-content;
  }
}
