/* =====================================================================
   Terminprüfung "Ist euer Wunschtermin noch frei?" (Startseite)
   ===================================================================== */
.termin-section {
    padding: 3rem 0 1rem;
    scroll-margin-top: 70px; /* Sprung zu #termin nicht unter der festen Navigation */
}

.termin-box {
    background: #fff;
    border-radius: 14px;
    box-shadow: 0 10px 25px rgba(0, 0, 0, .08);
    border-top: 4px solid #b89c6d;
    padding: 2rem 1.5rem;
    max-width: 960px;
    margin: 0 auto;
    text-align: center;
}

.termin-box h2 {
    font-family: "Playfair Display", serif;
    font-size: 1.9rem;
    margin-bottom: .4rem;
}

.termin-form {
    display: flex;
    gap: .6rem;
    justify-content: center;
    flex-wrap: wrap;
    margin: 1.25rem 0 .5rem;
}
.termin-form input[type=date] {
    max-width: 14rem;
}

#termin-ergebnis:not(:empty) {
    margin-top: 1.5rem;
    padding-top: 1.5rem;
    border-top: 1px solid #eee4d3;
}

.termin-kopf { font-size: 1.05rem; margin-bottom: 1rem; }
.termin-hinweis { color: #666; font-size: .9rem; margin-bottom: .75rem; }
.termin-lade { color: #86693a; }

.termin-auto {
    background: #fbf7ef;
    border-radius: 12px;
    padding: .6rem;
    height: 100%;
    display: flex;
    flex-direction: column;
}
.termin-auto img {
    width: 100%;
    height: auto;
    aspect-ratio: 3 / 2;
    object-fit: cover;
    border-radius: 8px;
}
.termin-auto-name {
    font-weight: 500;
    font-size: .92rem;
    margin: .5rem 0 .6rem;
    flex-grow: 1;
}

@media (max-width: 575.98px) {
    .termin-box { padding: 1.5rem 1rem; }
    .termin-box h2 { font-size: 1.5rem; }
    .termin-form input[type=date], .termin-form .btn { width: 100%; max-width: none; }
}