/* Rezensionen – cards untereinander */
.reviews-section { /* nichts globales überschreiben */ }

.reviews-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
    margin-top: 10px;
}

.review-card {
    width: min(100%, 60vw);   /* wird nie breiter als der Parent */
    margin: 0 auto;
    overflow: hidden;         /* Hintergrund sauber clippen */
    background: #f6f8fb;
    background-image: url("images/review_card_bg.jpg");
    background-position: left center;
    background-size: cover;   /* füllt den Bereich */
    background-repeat: no-repeat;
    border-radius: 0px;
    padding: clamp(16px, 2vw, 24px);
    color: #123b5d;
    line-height: 1.2;
    box-shadow: 0 10px 20px rgba(0,0,0,.03);
}

.review-card p {
    font-family: "Henriette", serif;
    font-weight: 400;
    font-style: normal;
    margin: 0 0 12px 0;
    font-size: clamp(1rem, 1vw + 1.2rem, 2.4rem);
    padding:80px;
}

.review-card footer {
    color: #5f7b93;
    font-size: 1.1rem;
    padding:0px 80px 0 80px;
}

/* ===== Responsive ===== */
@media (max-width: 1000px) {

    .review-card p {
        padding:50px;
    }
    .review-card footer {
        padding:0px 50px 0 50px;
    }
}

@media (max-width: 800px) {

    .review-card p {
        padding:30px;
    }
    .review-card footer {
        padding:0px 30px 0 30px;
    }
}

@media (max-width: 700px) {

    .review-card p {
        padding:20px;
    }
    .review-card footer {
        padding:0px 20px 0 20px;
    }

}

/* Weiter zum Rand auf Mobile: Karten so breit wie der Section-Inner (85%) */
@media (max-width: 900px){
    .reviews-grid{
        gap: 14px; /* optional etwas kompakter */
    }
    .review-card{
        width: 100%;   /* statt 60vw -> füllt den .section-inner */
        margin: 0;     /* kein zentrieren nötig */
        /* optional: Bildposition auf kleinen Screens zentrieren */
        background-position: center top;
    }
}