@media all {

  .ce-type-dw_ctapanels {
    --ctapanels-card-row: 1;
    position: relative;
    isolation: isolate;

    &:has(> .ce-header) {
      --ctapanels-card-row: 2;
    }

    .ce-bodytext {
      gap: 0;
    }

    .ce-card {
      border-radius: 0;
      box-shadow: none;
      padding-block: var(--size-2);
    }

    .ce-card.ce-teaser:is(:hover, :focus, :has(a:focus-visible)) {
      transform: none;
      box-shadow: none;
    }

    .ce-card.ce-teaser:has(a:focus-visible) {
      outline: var(--size-d2) solid var(--current-link-color);
      outline-offset: calc(-1 * var(--size-d2));
    }

    & .ce-header .ce-teaser-link-inline {
      font-weight: inherit;
    }

    & .ce-cta .ce-teaser-link-inline {
      position: static;

      &:hover .ce-cta-label,
      &:focus-visible .ce-cta-label {
        text-decoration-line: underline;
      }
    }

    &>.ce-header {
      grid-column: 3 / -3;
      grid-row: 1;
    }

    &>.ce-inner {
      --columns: 1;
      grid-gap: 0;
      grid-column: 1 / -1;
      grid-row: var(--ctapanels-card-row);
      display: grid;
      grid-template-columns: repeat(var(--columns), minmax(0, 1fr));

      &>.ce-element-nested {
        grid-column: unset;
        display: flex;
        flex-direction: column;

        & .ce-inner {
          padding-top: var(--element-gap-smallest);

          & .ce-text {
            --dynamic-size-min: 1.0625;
            --dynamic-size-max: 1.1875;
            text-align: left;
            font-size: var(--dynamic-size-scaler);
          }

          & .ce-header .paragraph {
            --dynamic-size-min: 1.375;
            --dynamic-size-max: 1.875;
            font-size: var(--dynamic-size-scaler);
            line-height: 1.25;
          }

        }

        & .ce-media-svg-mask {
          display: grid;
          place-items: start;
        }

        & .svg-mask-icon {
          width: var(--size-6);
          height: var(--size-6);
          background-color: var(--current-text-color);
          mask-size: contain;
          mask-position: center;
          mask-repeat: no-repeat;
        }

      }

    }

  }

  .column-full > .ce-type-dw_ctapanels > .ce-inner > .ce-card {
    padding-inline: max(var(--page-grid-padding), calc((min(100vw, var(--page-width)) - var(--page-grid-width-inner)) / 2));

    & > .ce-inner {
      padding-inline-start: 0;
    }

    & > .ce-media > .ce-media-svg-mask {
      margin-inline-start: 0;
    }

  }

}

@media (min-width: 62.5rem) {

  .ce-type-dw_ctapanels {

    &>.ce-inner {
      &[data-items-count="2"] {
        --columns: 2;
        grid-template-rows: auto auto 1fr auto;
        row-gap: var(--element-gap-text);

        & > .ce-element-nested {
          display: grid;
          grid-row: 1 / span 4;
          grid-template-rows: subgrid;

          & > .ce-media {
            grid-row: 1;
          }

          & > .ce-inner {
            grid-row: 2 / span 3;
            grid-template-rows: subgrid;

            & > .ce-text {
              display: grid;
              grid-row: 1 / span 3;
              grid-template-rows: subgrid;

              & > .ce-header {
                grid-row: 1;
                align-self: start;
              }

              & > .ce-bodytext {
                grid-row: 2;
                align-self: start;
              }

              & > .ce-cta {
                grid-row: 3;
                align-self: start;
              }

            }

          }

        }

      }
    }

  }

  .column-full > .ce-type-dw_ctapanels > .ce-inner > .ce-card {

    &:not(:first-child) {
      padding-inline-start: var(--element-gap);
    }

    &:not(:last-child) {
      padding-inline-end: 0;
    }

  }

}
