/* ============================================================
   SEITE: TEAMVIEWER DOWNLOAD (/teamviewer-download/, Page-ID 416)
   Prefix tv- · Werte 1:1 aus Original-CSS 416.css + universal.css
   (.software-icon-wrap). Breakpoints: 1920 / 1399 / 767 / 479 px.
   ============================================================ */

/* Original hat auf dieser Seite KEINEN overflow-hidden-Wrapper —
   der Blob läuft unter den Footer weiter. base.css-Clip hier lösen. */
body.page-id-416 main#main-content {
  overflow: visible;
}

/* section-3-416 */
.tv-section {
  display: block;
  text-align: right;
  position: relative;
}

.tv-section .section-inner {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding: 150px 50px;
  display: flex;
  flex-direction: row;
  align-items: center;
}

/* new_columns-4-416 */
.tv-columns {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  align-items: stretch;
  width: 100%;
  position: relative;
  z-index: 5;
}

/* div_block-5-416 (+ Oxygen-Default: Spalten-Kinder padding 20px) */
.tv-col {
  display: flex;
  flex-direction: column;
  width: 100%;
  text-align: left;
  align-items: center;
  justify-content: center;
  padding: 106px 20px 125px 0;
}

/* div_block-25-416 */
.tv-content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  max-width: 1000px;
  color: #fdfeff;
  overflow: hidden;
}

/* div_block-81-416 */
.tv-logo {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: 100%;
  text-align: center;
  margin-top: 1px;
  margin-bottom: 26px;
}

/* image-6-416 */
.tv-logo img {
  width: 100%;
  border-radius: 15px;
  max-width: 600px;
  object-fit: cover;
}

/* headline-9-416 (+ .M-Strong: line-height 1.2, fw 400) */
.tv-headline {
  margin: 0;
  font-size: 37px;
  line-height: 1.2;
  font-weight: 400;
  margin-top: 29px;
  margin-bottom: 16px;
  color: #111111; /* Original: WP-Global-Styles-Headingfarbe */
}

/* span-18-416 */
.tv-headline span {
  color: #32b4a2;
  display: inline-block;
}

/* text_block-13-416 */
.tv-intro {
  font-weight: 300;
  margin-bottom: 25px;
  font-size: 22px;
}

/* div_block-149-416 */
.tv-downloads {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 20px;
}

/* div_block-29-416 / div_block-145-416 (.ct-link + .software-icon-wrap) */
.tv-download {
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  text-decoration: none;
  width: 100%;
  padding: 15px;
  background-color: #f7f7f7;
  color: #606060;
  border-radius: 3px;
  min-width: 120px;
  transition: .15s;
}

.tv-download img {
  max-width: 100%;
}

/* div_block-14-416 (has-blured-background) */
.tv-blob {
  position: absolute;
  top: 0;
  right: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  pointer-events: none;
}

/* Original .has-blured-background:after (fehlt in base.css) */
.tv-blob:after {
  /* Statischer Gradient-Ersatz für die Original-Ellipse (650% x 80%, #004270,
     filter: blur(350px)) — iOS-Safari hängt bei Laufzeit-Blur auf großen Flächen.
     Box = Ellipse + 2×3σ (σ = 350px). Vertikalprofil als Hintergrund-Gradient,
     Horizontalprofil als Maske (Produkt ≈ 2D-Gauß-Faltung, Fehler < 0.04 Alpha). */
  content: "";
  /* Nur nach links erweitert (right bleibt -300%): die Seite hat keinen
     Overflow-Clip, eine rechts erweiterte Box wuerde die Scrollbreite
     gegenueber dem Original vergroessern. Maske daher asymmetrisch
     (Ellipsen-Zentrum bei ~61.5% der Box, rechter Falloff an der Box-Kante
     abgeschnitten = Scroll-Ende, wie im Original unerreichbar). */
  /* Vertikal ebenfalls asymmetrisch: unten nur +838px statt +1050px, damit
     die Box an der Original-Dokumenthoehe (1802px) endet und die Seite nicht
     waechst. Restkante dort: Alpha 0.008 — unsichtbar. */
  width: calc(650% + 1050px);
  height: calc(80% + 1888px);
  position: absolute;
  top: calc(10% - 1050px);
  right: -300%;
  z-index: 2;
  pointer-events: none;
  background: linear-gradient(to bottom,
    rgba(0,66,112,0) 0%,
    rgba(0,66,112,0.008) 7.29%,
    rgba(0,66,112,0.016) 10.93%,
    rgba(0,66,112,0.032) 14.57%,
    rgba(0,66,112,0.058) 18.22%,
    rgba(0,66,112,0.099) 21.86%,
    rgba(0,66,112,0.158) 25.5%,
    rgba(0,66,112,0.237) 29.15%,
    rgba(0,66,112,0.332) 32.79%,
    rgba(0,66,112,0.438) 36.43%,
    rgba(0,66,112,0.546) 40.08%,
    rgba(0,66,112,0.644) 43.72%,
    rgba(0,66,112,0.721) 47.36%,
    rgba(0,66,112,0.768) 51.01%,
    rgba(0,66,112,0.778) 54.65%,
    rgba(0,66,112,0.752) 58.29%,
    rgba(0,66,112,0.691) 61.94%,
    rgba(0,66,112,0.604) 65.58%,
    rgba(0,66,112,0.5) 69.22%,
    rgba(0,66,112,0.392) 72.87%,
    rgba(0,66,112,0.289) 76.51%,
    rgba(0,66,112,0.201) 80.15%,
    rgba(0,66,112,0.13) 83.79%,
    rgba(0,66,112,0.079) 87.44%,
    rgba(0,66,112,0.045) 91.08%,
    rgba(0,66,112,0.024) 94.72%,
    rgba(0,66,112,0.012) 98.37%,
    rgba(0,66,112,0.008) 100%);
  -webkit-mask-image: linear-gradient(to right,
    rgba(0,0,0,0) 0%,
    rgba(0,0,0,0.006) 6.6%,
    rgba(0,0,0,0.018) 9.9%,
    rgba(0,0,0,0.045) 13.2%,
    rgba(0,0,0,0.096) 16.49%,
    rgba(0,0,0,0.177) 19.79%,
    rgba(0,0,0,0.287) 23.09%,
    rgba(0,0,0,0.417) 26.39%,
    rgba(0,0,0,0.55) 29.69%,
    rgba(0,0,0,0.67) 32.99%,
    rgba(0,0,0,0.768) 36.29%,
    rgba(0,0,0,0.842) 39.59%,
    rgba(0,0,0,0.896) 42.89%,
    rgba(0,0,0,0.935) 46.18%,
    rgba(0,0,0,0.962) 49.48%,
    rgba(0,0,0,0.981) 52.78%,
    rgba(0,0,0,0.993) 56.08%,
    rgba(0,0,0,0.999) 59.38%,
    rgba(0,0,0,0.985) 69.28%,
    rgba(0,0,0,0.969) 72.58%,
    rgba(0,0,0,0.944) 75.87%,
    rgba(0,0,0,0.91) 79.17%,
    rgba(0,0,0,0.861) 82.47%,
    rgba(0,0,0,0.793) 85.77%,
    rgba(0,0,0,0.703) 89.07%,
    rgba(0,0,0,0.589) 92.37%,
    rgba(0,0,0,0.459) 95.67%,
    rgba(0,0,0,0.327) 98.97%,
    rgba(0,0,0,0.287) 100%);
  mask-image: linear-gradient(to right,
    rgba(0,0,0,0) 0%,
    rgba(0,0,0,0.006) 6.6%,
    rgba(0,0,0,0.018) 9.9%,
    rgba(0,0,0,0.045) 13.2%,
    rgba(0,0,0,0.096) 16.49%,
    rgba(0,0,0,0.177) 19.79%,
    rgba(0,0,0,0.287) 23.09%,
    rgba(0,0,0,0.417) 26.39%,
    rgba(0,0,0,0.55) 29.69%,
    rgba(0,0,0,0.67) 32.99%,
    rgba(0,0,0,0.768) 36.29%,
    rgba(0,0,0,0.842) 39.59%,
    rgba(0,0,0,0.896) 42.89%,
    rgba(0,0,0,0.935) 46.18%,
    rgba(0,0,0,0.962) 49.48%,
    rgba(0,0,0,0.981) 52.78%,
    rgba(0,0,0,0.993) 56.08%,
    rgba(0,0,0,0.999) 59.38%,
    rgba(0,0,0,0.985) 69.28%,
    rgba(0,0,0,0.969) 72.58%,
    rgba(0,0,0,0.944) 75.87%,
    rgba(0,0,0,0.91) 79.17%,
    rgba(0,0,0,0.861) 82.47%,
    rgba(0,0,0,0.793) 85.77%,
    rgba(0,0,0,0.703) 89.07%,
    rgba(0,0,0,0.589) 92.37%,
    rgba(0,0,0,0.459) 95.67%,
    rgba(0,0,0,0.327) 98.97%,
    rgba(0,0,0,0.287) 100%);
}

/* image-15-416 */
.tv-blob img {
  position: relative;
  z-index: 5;
  width: 538px;
  height: 1071px;
  max-width: 100%;
  display: block;
  pointer-events: none;
}

@media (max-width: 1920px) {
  .tv-col {
    padding-right: 30px;
  }
}

@media (max-width: 1399px) {
  .tv-col {
    text-align: center;
    align-items: flex-start;
    padding-right: 15px;
  }

  .tv-logo img {
    width: 90%;
  }
}

@media (max-width: 767px) {
  .tv-section .section-inner {
    padding: 15px 20px 57px;
  }

  .tv-columns {
    flex-direction: column;
  }

  .tv-columns > .tv-col {
    width: 100% !important;
  }

  .tv-col {
    padding-bottom: 0;
  }

  .tv-content {
    max-width: 100%;
    text-align: left;
    align-items: center;
    z-index: 55;
    position: relative;
  }

  .tv-logo {
    text-align: left;
    align-items: center;
    margin-bottom: 0;
  }

  /* Original @767: "width:100%px" (ungültig) → es bleibt bei 90% */
  .tv-logo img {
    max-width: 100%;
  }

  .tv-headline {
    font-size: 30px;
    text-align: center;
  }

  .tv-intro {
    text-align: center;
    font-size: 20px;
  }

  .tv-blob {
    z-index: 1;
  }

  .tv-blob img {
    padding-left: 20px;
    padding-right: 20px;
  }
}

@media (max-width: 479px) {
  .tv-section .section-inner {
    padding-right: 20px;
    padding-left: 20px;
  }

  .tv-blob {
    padding-bottom: 230px;
  }

  .tv-blob img {
    margin-bottom: 1px;
  }

  /* Blob-Container ist hier 1301px hoch (1071 + 230 padding) -> Vertikalprofil
     des Gradient-Ersatzes fuer b = 520px neu berechnet (Box 1041 + 2100 = 3141px). */
  .tv-blob:after {
    /* Hier symmetrische Box (Mobile-Seite ist hoch genug, kein Wachstum). */
    height: calc(80% + 2100px);
    top: calc(10% - 1050px);
    background: linear-gradient(to bottom,
      rgba(0,66,112,0) 0%,
      rgba(0,66,112,0.005) 5.43%,
      rgba(0,66,112,0.012) 8.61%,
      rgba(0,66,112,0.024) 11.79%,
      rgba(0,66,112,0.045) 14.98%,
      rgba(0,66,112,0.08) 18.16%,
      rgba(0,66,112,0.131) 21.34%,
      rgba(0,66,112,0.201) 24.53%,
      rgba(0,66,112,0.29) 27.71%,
      rgba(0,66,112,0.394) 30.9%,
      rgba(0,66,112,0.506) 34.08%,
      rgba(0,66,112,0.615) 37.26%,
      rgba(0,66,112,0.712) 40.45%,
      rgba(0,66,112,0.787) 43.63%,
      rgba(0,66,112,0.835) 46.82%,
      rgba(0,66,112,0.852) 50%,
      rgba(0,66,112,0.835) 53.18%,
      rgba(0,66,112,0.787) 56.37%,
      rgba(0,66,112,0.712) 59.55%,
      rgba(0,66,112,0.615) 62.74%,
      rgba(0,66,112,0.506) 65.92%,
      rgba(0,66,112,0.394) 69.1%,
      rgba(0,66,112,0.29) 72.29%,
      rgba(0,66,112,0.201) 75.47%,
      rgba(0,66,112,0.131) 78.66%,
      rgba(0,66,112,0.08) 81.84%,
      rgba(0,66,112,0.045) 85.02%,
      rgba(0,66,112,0.024) 88.21%,
      rgba(0,66,112,0.012) 91.39%,
      rgba(0,66,112,0.005) 94.57%,
      rgba(0,66,112,0) 100%);
  }
}
