.image-section {
  margin-left: 0vw;               /* Abstand vom linken Rand */
  margin-top: 0vh;                /* Abstand nach oben */
  width: 15.75vw;                    /* Breite des Containers */
  height: 40vh;                   /* Höhe des Containers */
  display: flex;
  align-items: center;
  justify-content: center;

  border: 0.25vh solid #c9a735;   /* Goldener Rahmen */
  border-radius: 1em;             /* Runde Ecken am Container */
  box-shadow: 0 0.5vh 1vh rgba(0, 0, 0, 0.5); /* Schatten */
  background-color: #2a2a2a;      /* Dunkler Hintergrund */
  box-sizing: border-box;
  overflow: hidden;               /* Verhindert Überstand vom Bild */
}

.alpaka-image {
  height: 100%;
  width: auto;
  object-fit: cover;              /* Bild schneidet ggf. ab, füllt aber perfekt */
  border-radius: 0;               /* Kein eigener Radius – folgt Containerform */
}

@media (max-width: 768px) {
  .image-section {
    width: 60vw;
    /* height: 30vh; ❌ Entfernen! */
    margin: 2vh auto;
    padding: 0; /* optional */
    overflow: visible; /* optional, falls du später Overlay-Text etc. nutzt */
  }

  .alpaka-image {
    width: 100%;
    height: auto;
    object-fit: contain; /* passt Bild vollständig ein */
    display: block;
  }
}