/*
 * Mobile Pinch-Zoom-Stabilität
 * Begrenzt ausschließlich in den Bereichen Vorteile, Zertifikate und News
 * teure Safari-Compositing-Effekte. Inhalt, Abstände, Schriftgrößen und
 * Desktop-Darstellung bleiben unverändert.
 */
@media (max-width: 1024px) {
  .modul-9.benefits-phase9,
  .modul-10.certificates-phase10,
  .sd-news-section {
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
    filter: none !important;
    will-change: auto !important;
    isolation: auto !important;
    contain: layout paint style;
    overflow: hidden !important;
  }

  /* Große weichgezeichnete Dekorationsflächen erzeugen beim Pinch-Zoom
     besonders große Offscreen-Texturen. Die Karten behalten ihre Verläufe. */
  .modul-9.benefits-phase9::before,
  .modul-9.benefits-phase9 .ellipse-div,
  .modul-9.benefits-phase9 .group-child4,
  .modul-10.certificates-phase10::before,
  .modul-10.certificates-phase10 > .modul-10-child,
  .modul-10.certificates-phase10 > .modul-10-item,
  .modul-10.certificates-phase10 > .modul-10-inner,
  .modul-10.certificates-phase10 > .rectangle-div::after,
  .modul-10.certificates-phase10 > .modul-10-child2::after,
  .modul-10.certificates-phase10 > .modul-10-child3::after,
  .modul-10.certificates-phase10 .group-child,
  .sd-news-section::before,
  .sd-news-section::after,
  .sd-news-glow {
    display: none !important;
    content: none !important;
    -webkit-filter: none !important;
    filter: none !important;
    box-shadow: none !important;
    will-change: auto !important;
  }

  .modul-9.benefits-phase9 > .group-div,
  .modul-9.benefits-phase9 > .ellipse-parent2,
  .modul-9.benefits-phase9 > .ellipse-parent3,
  .modul-9.benefits-phase9 > .ellipse-parent4,
  .modul-9.benefits-phase9 > .ellipse-parent5,
  .modul-9.benefits-phase9 > .ellipse-parent6,
  .modul-10.certificates-phase10 > .rectangle-div,
  .modul-10.certificates-phase10 > .modul-10-child2,
  .modul-10.certificates-phase10 > .modul-10-child3,
  .sd-news-card,
  .sd-news-media,
  .sd-news-video-shell,
  .sd-news-video-preview-link,
  .sd-news-image-placeholder {
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
    -webkit-filter: none !important;
    filter: none !important;
    box-shadow: none !important;
    text-shadow: none !important;
    will-change: auto !important;
  }

  .modul-9.benefits-phase9 > .group-div,
  .modul-9.benefits-phase9 > .ellipse-parent2,
  .modul-9.benefits-phase9 > .ellipse-parent3,
  .modul-9.benefits-phase9 > .ellipse-parent4,
  .modul-9.benefits-phase9 > .ellipse-parent5,
  .modul-9.benefits-phase9 > .ellipse-parent6,
  .sd-news-card {
    contain: layout paint style;
  }

  /* Frühere translateZ(0)-Regeln erzwingen für jedes Facebook-Bild einen
     eigenen GPU-Layer. Safari vergrößert diese Layer beim Pinch-Zoom. */
  .sd-news-image,
  .sd-news-gallery-image,
  .sd-news-video-poster {
    -webkit-transform: none !important;
    transform: none !important;
    -webkit-filter: none !important;
    filter: none !important;
    backface-visibility: visible !important;
    will-change: auto !important;
    transition: none !important;
  }

  .sd-news-card,
  .sd-news-load-more,
  .modul-9.benefits-phase9 > div,
  .modul-10.certificates-phase10 > div,
  .modul-10.certificates-phase10 > img {
    animation: none !important;
    transition: none !important;
    will-change: auto !important;
  }

  .modul-9.benefits-phase9,
  .modul-10.certificates-phase10,
  .sd-news-section,
  .sd-news-section * {
    touch-action: pan-x pan-y pinch-zoom;
  }
}

@media (max-width: 1024px) {
  .modul-9.benefits-phase9 > .group-div,
  .modul-9.benefits-phase9 > .ellipse-parent2,
  .modul-9.benefits-phase9 > .ellipse-parent3,
  .modul-9.benefits-phase9 > .ellipse-parent4,
  .modul-9.benefits-phase9 > .ellipse-parent5,
  .modul-9.benefits-phase9 > .ellipse-parent6 {
    background:
      radial-gradient(circle at 50% 118%, rgba(105, 255, 41, 0.11), transparent 48%),
      linear-gradient(180deg, rgba(27, 27, 27, 0.9), rgba(10, 10, 10, 0.96)) !important;
  }

  .modul-10.certificates-phase10 > .rectangle-div,
  .modul-10.certificates-phase10 > .modul-10-child2,
  .modul-10.certificates-phase10 > .modul-10-child3 {
    background:
      radial-gradient(circle at 50% 108%, rgba(105, 255, 41, 0.09), transparent 52%),
      #181818 !important;
  }
}