/* Responsive Anpassungen */
@media (max-width: 900px) { /* Angepasste Breakpoints für mobile Ansicht */
    .nav-container {
        flex-direction: column;
        align-items: center;
    }
    .nav-link {
        width: 100%;
        text-align: center;
    }
    .nav-link a {
        display: block;
        padding: 0.8rem 0;
    }

    .hero {
        min-height: 400px;
    }
    .hero-content {
        margin-left: 0;
        text-align: center;
        width: 100%;
        box-sizing: border-box;
        padding: 2rem;
    }
    .hero-text h1 {
        font-size: 2.5rem;
    }
    
    .mkdf-row-background-text-1 {
        font-size: 14vw; /* Angepasst für kleinere Bildschirme */
    }
    
    .mkdf-row-background-text-1 .inner-text {
        font-size: 4vw;
    }

    .image-text-wrapper {
        flex-direction: column; /* Stapelt Bild und Text untereinander */
    }
    
    .founder-text-container h2 {
        text-align: center; /* Überschrift zentrieren, wenn Bild drüber ist */
    }

    .gallery-container {
        grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); /* Kleinere Spalten auf kleineren Bildschirmen */
    }

    /* Responsive Footer */
    .footer-main-content {
        flex-direction: column; /* Spalten untereinander auf kleineren Bildschirmen */
        align-items: center; /* Inhalte zentrieren */
        text-align: center;
    }
    .footer-center,
    .footer-right {
        min-width: unset; /* Mindestbreite aufheben */
        width: 100%; /* Volle Breite */
        margin-bottom: 30px;
    }
    .contact-info, .footer-right ul, .social-links {
        align-items: center; /* Zentriert die Inhalte */
        justify-content: center; /* Bei Bedarf */
    }
    .footer-center-heading::after,
    .footer-right h3::after {
        left: 50%;
        transform: translateX(-50%); /* Zentriert den Unterstrich */
    }
    /* Responsive Services Page */
    .page-hero {
        min-height: 300px;
    }
    .page-hero-content h1 {
        font-size: 2.2rem;
    }
    .page-hero-content p {
        font-size: 1rem;
    }
    .intro-text-section h2 {
        font-size: 2rem;
    }
    .service-text-container h2 {
        font-size: 1.8rem;
    }
    .cta-section h2 {
        font-size: 2.2rem;
    }
    .cta-section p {
        font-size: 1rem;
    }
    .service-detail-item {
        gap: 30px; /* Etwas weniger Abstand auf kleinen Bildschirmen */
    }
    .service-detail-item {
        flex-direction: column; /* Standard auf Mobil: gestapelt */
        text-align: center; /* Für die Textinhalte */
    }
    .service-text-container h2 {
        text-align: center; /* Auch hier zentrieren */
    }
    .service-detail-item.image-left .service-text-container,
    .service-detail-item.image-right .service-text-container {
        padding: 0 20px; /* Einheitlicher Padding auf Mobil */
    }
}

@media (max-width: 480px) {
    .hero-text h1 {
        font-size: 2rem;
    }
    .hero-prev, .hero-next {
        font-size: 16px;
        padding: 10px;
    }
    .mkdf-row-background-text-1 {
        font-size: 18vw;
    }
    .mkdf-row-background-text-1 .inner-text {
        font-size: 6vw;
    }
    .gallery-container {
        grid-template-columns: 1fr; /* Eine Spalte auf sehr kleinen Bildschirmen */
    }
    .page-hero-content h1 {
        font-size: 1.8rem;
    }
    .intro-text-section h2 {
        font-size: 1.8rem;
    }
    .service-detail-item .service-text-container {
        padding: 0; /* Auf sehr kleinen Bildschirmen Ränder entfernen */
    }
    .service-text-container h2 {
        font-size: 1.6rem;
    }
    .service-text-container p, .service-text-container ul li {
        font-size: 0.95rem;
    }
    .cta-section h2 {
        font-size: 1.8rem;
    }
    .cta-section p {
        font-size: 0.9rem;
    }
}

/* Desktop-spezifische Anpassungen (über 900px) */
@media (min-width: 901px) {
    .image-text-wrapper {
        flex-direction: row; /* Nebeneinander für Desktop */
        justify-content: space-between;
        align-items: flex-start;
    }
    
    .image-container {
        width: 50%;
        max-width: 600px;
    }
    
    .founder-text-container {
        width: 50%;
        padding-left: 40px;
    }
    
    .founder-text-container h2 {
        text-align: left; /* Überschrift linksbündig auf Desktop */
    }

    /* Desktop-Anordnung für Service-Details */
    .service-detail-item {
        flex-direction: row; /* Desktop: nebeneinander */
        text-align: left;
    }
    .service-detail-item.image-right {
        flex-direction: row-reverse; /* Bild rechts, Text links */
    }
    .service-detail-item.image-left .service-text-container {
        padding-left: 40px; /* Mehr Abstand links wenn Bild links ist */
    }
    .service-detail-item.image-right .service-text-container {
        padding-right: 0px; /* Mehr Abstand rechts wenn Bild rechts ist */
    }
    .service-text-container h2 {
        text-align: left; /* Links ausgerichtet auf Desktop */
    }
}