@media all {

  .ce-element.ce-type-dw_quote {
    flex-direction: column;
    align-items: stretch;
    position: relative;
  }

  .ce-type-dw_quote {
    grid-row-gap: var(--element-header-gap);

    & > .ce-header,
    & > .ce-inner {
      grid-column: 3 / -3;
      width: 100%;
    }

    & > .ce-header {
      max-width: var(--max-inline-width);
      margin-inline: auto;
    }

    & .ce-quote-wrap {
      max-width: var(--max-inline-width);
      margin-inline: auto;
      width: 100%;
    }

    & [data-quotes-layout="row"] .ce-quote-wrap:has(.ce-quotes:not([data-items-count="1"])) {
      max-width: none;
    }

    & .ce-quotes {
      display: flex;
      flex-direction: column;
      gap: var(--page-grid-gap);
    }

    & .ce-quote-item {
      position: relative;
      margin: 0;
      padding: 0;
      border: 0;
      min-width: 0;
    }

    & .ce-quote-item-inner {
      position: relative;
      padding: var(--element-padding) 0;
      /*! padding-inline-start: calc(var(--element-padding) + clamp(1.25rem, 5vw, 2.75rem)); */
      border: 0;
      color: var(--current-text-color);
    }

    & .ce-quote-item::before {
      content: "";
      position: absolute;
      top: calc(var(--element-padding) * -0.95);
      left: 50%;
      transform: translateX(-50%);
      width: clamp(5rem, 7vw, 30rem);
      aspect-ratio: 1;
      background-color: white;
      mask: var(--dw-quote-mask-url) center / contain no-repeat;
      opacity: 0.3;
    }

    & .ce-quote-item-inner > .ce-bodytext > :first-child {
      margin-block-start: 0;
    }

    & .ce-quote-item-inner .ce-bodytext {
      color: var(--current-text-color);
    }

    & .ce-quote-item-inner > .ce-bodytext > :last-child {
      margin-block-end: 0;
    }

  }

}

@media all {

  .ce-type-dw_quote [data-quotes-layout="row"] .ce-quotes {
    --columns: 3;
    display: grid;
    gap: var(--page-grid-gap);
    align-items: stretch;
    grid-template-columns: repeat(var(--columns), minmax(0, 1fr));
  }

  .ce-type-dw_quote [data-quotes-layout="row"] .ce-quotes[data-items-count="1"] {
    --columns: 1;
  }

  .ce-type-dw_quote [data-quotes-layout="row"] .ce-quotes[data-items-count="2"] {
    --columns: 2;
  }

  .ce-type-dw_quote [data-quotes-layout="row"] .ce-quotes[data-items-count="3"] {
    --columns: 3;
  }

}

@media (min-width: 62.5rem) {

  .ce-type-dw_quote .ce-quote-item::before {
    top: auto;
    bottom: 0;
    left: -5rem;
    transform: none;
  }

  .column-content .ce-type-dw_quote {

    & > .ce-header,
    & > .ce-inner {
      max-width: unset;
    }

    & .ce-quote-item::before {
      left: var(--element-padding);
    }

  }
}