@font-face {
  font-family: "Montserrat";
  src: url("../assets/font/Montserrat-VariableFont_wght.woff2") format("woff2"),
    url("../assets/font/Montserrat-VariableFont_wght.ttf") format("truetype");
  font-weight: 100 900;
  font-style: normal;
}

.golden-ratio-height {
  /*height: 61.8vh; /* 61.8% der Bildschirmhöhe */
  height: 61.8vh;
}

/* Standard für Handys (kleine Bildschirme) */
.hero {
  background-image: url("../assets/img/hero-small.webp");
  background-size: cover;
  background-position: center;
  background-attachment: scroll;
}

/* Für Tablets (Bildschirme größer als 640px) */
@media (min-width: 640px) {
  .hero {
    background-image: url("../assets/img/hero-medium.webp");
  }
}

/* Für Laptops und Desktops (Bildschirme größer als 1024px) */
@media (min-width: 1024px) {
  .hero {
    background-image: url("../assets/img/hero-large.webp");
  }
}

/* Für große Desktops oder 4K-Displays (Bildschirme größer als 1440px) */
@media (min-width: 1440px) {
  .hero {
    background-image: url("../assets/img/hero-xlarge.webp");
  }
}

.banner {
  background-image: url("../assets/img/Banner2.webp");
}

body.modal-open {
  overflow: hidden;
}