.psm-container {
    display: flex;
    flex-wrap: wrap;
    gap: 80px; /* Erhöhter Abstand zwischen den Spalten */
}

.psm-left-column,
.psm-right-column {
    width: 100%;
    box-sizing: border-box; /* Sicherstellen, dass Padding und Border in der Breite enthalten sind */
}

@media (min-width: 768px) {
    .psm-left-column,
    .psm-right-column {
        width: calc(50% - 40px); /* Angepasst, um den erhöhten Gap zu berücksichtigen */
    }
}

@media (max-width: 768px) {
.psm-container {
    flex-direction: column-reverse;
}
}

.psm-slider {
    position: relative;
    width: 100%;
    /* Entfernen Sie die feste Höhe */
    /* height: 300px; */ 
    /* aspect-ratio: 1 / 1;  Erzwingt ein quadratisches Seitenverhältnis */
    overflow: hidden;
}

.psm-slide {
    width: 100%;
    height: 100%;
    display: none;
}

.psm-slide[style*="display: block;"] {
    display: block;
}

.psm-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* Stellt sicher, dass das Bild das Container vollständig ausfüllt */
    object-position: center; /* Zentriert das Bild im Container */
    border-radius: 30px;
}

.psm-pagination {
    text-align: center;
    margin-top: 40px;
}

.psm-dot {
    display: inline-block;
    width: 12px;
    height: 12px;
    background: #fff;
    border-radius: 50%;
    margin: 0 5px;
    cursor: pointer;
    transition: background 0.3s;
}

.psm-dot.active {
    background: var(--awb-color5);
}

/* Entfernte Styles für die Navigationsbuttons */
.psm-prev,
.psm-next {
    display: none;
}

.psm-right-column .psm-category {
    font-size: 18px;
    margin-bottom: 10px;
}

.psm-right-column .psm-terms {
    margin-top: 30px;
    margin-bottom: 10px;
    display: flex;
    flex-direction: column;
}

.psm-right-column .psm-term {
    display: block;
    margin-bottom: 5px;
    padding: 5px 0px;
    background: transparent;
    cursor: pointer;
    transition: background 0.3s, color 0.3s;
    color: #fff;
    font-size: 40px;
}

.psm-right-column .psm-term:hover {
    color: var(--awb-color5);
}

.psm-right-column .psm-term.active {
    color: var(--awb-color5);
}

.psm-right-column .psm-text {
    margin-bottom: 40px;
    margin-top: 40px;
}

/* Optional: Weitere Anpassungen basierend auf image_position */
@media (max-width: 768px) {
.psm-container.psm-image-right {
    flex-direction: column;
}
