@media all {

  .ce-type-dw_testimonials {

    & > .ce-header ,
    & > .ce-inner {
      justify-self: center;
    }

    & > .ce-header {
      max-width: var(--max-inline-width);
      grid-column: 3 / -3;      
      width: 100%;
    }

    & > .ce-nested-container {
      --image-width: 6;
      grid-gap: var(--page-grid-gap);
      grid-column: 3 / -3;
      display: grid;
      grid-template-columns: repeat(var(--columns), minmax(0, 1fr));
      overflow: visible;
      margin-inline: calc(var(--page-grid-gap) * -1 / 2);
      max-width: calc(var(--max-inline-width) + var(--page-grid-gap));

      & > .swiper-wrapper {

        & > .swiper-slide {
          width: calc(100% - var(--page-grid-gap)) !important;
          padding-inline: calc(var(--page-grid-gap) * 1 / 2);

          &:not(.swiper-slide-visible) .ce-element-nested {

            & .ce-inner ,
            & .ce-media {
              filter: blur(.125em) saturate(.5);
              opacity: .5;            
            }

          }

        }

      }

      & .swiper-controls {
        padding-inline: calc(var(--page-grid-gap) * 1 / 2);
        display: flex;
        justify-content: center;
        align-items: center;
        z-index: 3;

        & .swiper-button {
          padding: 0;
          height: var(--size-7);
          aspect-ratio: 1;
          box-sizing: content-box;
        }

        & .swiper-pagination {
          position: relative;
          inset: unset;
          display: flex;
          justify-content: center;

          & .swiper-pagination-bullet {
            display: block;
            width: auto;
            height: 1rem;
            aspect-ratio: 1;
            background-color: transparent;
            border: var(--border-width) solid var(--current-text-color);
            opacity: 1;

            &.swiper-pagination-bullet-active {
              background-color: var(--current-text-color);
            }

            &:focus ,
            &:hover {
              background-color: var(--current-button-hover-background);
              border-color: var(--current-button-hover-background);
            }

            &:focus-visible {
              outline: none;
              box-shadow: var(--shadow-focus);
            }

          }

        }

      }

      & .swiper-shadow-button {
        width: calc((100vw - var(--max-inline-width)) / 2);
      }

    }

    & > .ce-inner {
      grid-column: 3 / -3;
    }

    & ,
    & > .ce-nested-container > .ce-element-nested {

      & .ce-inner ,
      & .ce-media {
        transition: var(--transition-default);
        transition-property: filter opacity;
      }

      & .ce-inner {
        order: 1;

        & .ce-testimonial-text {
          font-style: italic;
          font-size: calc(20 / 18 * 1em);
          line-height: 137.5%;

          & p::before {
            content: "\201E";
          }

          & p::after {
            content: "\201C";
          }

        }

      }

      & .ce-media {
        order: 0;
        max-width: calc((var(--page-grid-col-width) * var(--image-width)) + (var(--page-grid-gap) * (var(--image-width) - 1)));
        justify-self: center;

        & .ce-media-file {
          border-radius: 100vmax;
          overflow: clip;
        }

      }

    }

    & > .ce-inner:not(.ce-nested-container) {
      max-width: var(--max-inline-width);
      width: 100%;
    }

  }

}

@media (min-width: 62.5rem) {

  .ce-type-dw_testimonials {

    & ,
    & > .ce-nested-container > .ce-element-nested {

      & .ce-inner {

        & .ce-testimonial-text {
          font-size: calc(32 / 18 * 1em);
        }

      }

    }

    & > .ce-nested-container .ce-element-nested {
      grid-template-columns: var(--page-grid-inner);
      align-items: center;

      & .ce-inner {
        grid-column: 1 / -1;
        padding-inline: var(--element-padding);
      }

      & .ce-inner:has(+ .ce-media) {
        grid-row: 1 / span 1;
        grid-column: 6 / span 10;
      }

      & .ce-media {
        grid-row: 1 / span 1;
        grid-column: 1 / span 5;
        max-width: 100%;
        justify-self: stretch;
        align-self: start;
      }

    }

    &:has(> .ce-media) {
      grid-template-columns: subgrid;
      align-items: center;

      & .ce-inner {
        grid-row: 1 / span 1;
        grid-column: 12 / span 10;
        padding-inline: var(--element-padding);
      }

      & .ce-media {
        grid-row: 1 / span 1;
        grid-column: 7 / span 5;
        max-width: 100%;
        justify-self: stretch;
        align-self: start;
      }

    }

  }

}

@media (min-width: 72.5rem) {

  .ce-type-dw_testimonials {

    & > .ce-nested-container 

    & > .swiper-controls {

      & .swiper-button {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        z-index: 2;

        &.swiper-prev {
          right: 100%;
          margin-right: calc(var(--page-grid-gap) * 3 / 2)
        }

        &.swiper-next {
          left: 100%;
          margin-left: calc(var(--page-grid-gap) * 3 / 2)
        }

      }

    }

  }

}

}