@media (max-width: 1600px) {
  .left a img {
  display:block;
  width: 260px;
  max-width: 100%;
  height: auto;
}
.right a img {
  display:block;
  width: 300px;
  max-width: 100%;
  height: auto;
}
}
@media (max-width: 1440px) {
  .left a img {
  display:block;
  width: 260px;
  max-width: 100%;
  height: auto;
}
.right a img {
  display:block;
  width: 300px;
  max-width: 100%;
  height: auto;
}
}
@media (max-width: 1280px) {
.read-more p, .jobs p {
  font-size: clamp(0.1rem, 0.3vw + 0.8rem, 10rem);
}


}

@media (max-width: 1024px) {
  .menu-panel {
    height: 100dvh; /* oder 100vh */
  }

  .menu-pannel-wrapper {
    height: 100%;
    display: flex;
    flex-direction: column;
  }

  /* left oben, right unten */
  .right {
    margin-top: auto;
  }

  .left,
  .right {
    width: 100%;
    height: 50dvh;
  }

  /* optional: Bilder responsiv */
  .left img,
  .right img {
    width: 100%;
    height: 50%;
    object-fit: cover;
  }

  .left .logo-wrapper {
    margin: 0;
  }

  .left a h2 {
    padding-top: 10rem;
    font-size: 20px;
  }



  .right a .vaga-logo-sun {
    margin-top: 2rem;
  }

}
@media (max-width: 576px) {
  #typewriter {
    font-size: 15px;
  }
    .left a h2 {
    padding-bottom: 5rem;
    font-size: 14px;
  }

  .hero-ctas {
    bottom: 10rem;
  }

    .hero-ctas h3 {
    font-size: 14px;
  }
  .read-more p, .jobs p, .imprint-toggle, .privacy-toggle{
    font-size: 12px;
    padding-left: 5px;
    padding-right: 5px;
    text-align: center;
    
  }

  .right a p {
    display: none;
  }

    .left a p {
    display: none;
  }

    .vaga-logo {
    padding-bottom: 0rem;
  }


}
@media (max-width: 480px) {
  .left a img {
  display:block;
  width: 260px;
  max-width: 100%;
  height: auto;
}
.right a img {
  display:block;
  width: 300px;
  max-width: 100%;
  height: auto;
}
}
@media (max-width: 376px) {

.left a img {
  display:block;
  width: 260px;
  max-width: 100%;
  height: auto;
}
.right a img {
  display:block;
  width: 300px;
  max-width: 100%;
  height: auto;
}

  body {
    background-color: black;
  }

  .hero a {
    margin-top: -16rem;
  }

  .hero-ctas {
    bottom: 8rem;
  }

   .hero-ctas h3 {
    font-size: 12px;
  }
  .read-more p, .jobs p {
    font-size: 10px;
  }
  .left a p {
    display: none;
  }
}
@media (max-width: 320px) {
}

