/* ==========================================================================
   INDEX-EXKLUSIVE STYLES (Nur für die Startseite)
   ========================================================================== */

/* 1. LOGO-ANPASSUNG DESKTOP (Angenehm groß, OBEN LINKS & scrollt nach oben weg) */
.logo-container {
    display: block;  /* Aktiviert das Logo exklusiv auf der Startseite */
    position: absolute; /* ÄNDERUNG: Logo scrollt jetzt auf dem PC mit nach oben weg! */
    top: 25px;
    left: 25px;      
    right: auto;     
    width: 280px !important;  /* Harmonische, deutliche Größe für den PC */
    height: 280px !important; 
    z-index: 10001;
    transition: all 0.3s ease;
}

.logo-container img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

/* Platzhalter oben für den Desktop-Inhalt, damit das Logo nicht über den ersten Texten liegt */
.content {
    padding-top: 320px !important;
}


/* 2. FLOATING BUTTONS STEUERUNG (Basis-Positionierung) */
#floating-notruf, 
#floating-gutachter-group {
    display: none; 
    position: fixed; /* Die Kontakt-Buttons unten links bleiben natürlich fest im Sichtfeld */
    bottom: 25px;
    z-index: 99999 !important;
    transition: all 0.3s ease;
}

/* Erste-Hilfe Notruf-Button (unten links) */
#floating-notruf {
    left: 25px;
}

#floating-notruf.active {
    display: flex !important;
}

/* Gutachter-Gruppe (unten links, vertikal gestapelt) */
#floating-gutachter-group {
    left: 25px;
}

#floating-gutachter-group.active {
    display: flex !important;
    flex-direction: column-reverse;
    gap: 12px;
}

/* Allgemeine Formatierung der runden Buttons (FAB) */
.fab-button {
    width: 65px !important;
    height: 65px !important;
    border-radius: 50% !important;
    display: flex;
    justify-content: center;
    align-items: center;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.4);
    text-decoration: none;
    overflow: hidden;
    border: none !important;
    transition: transform 0.15s ease-in-out;
    -webkit-tap-highlight-color: transparent;
}

.fab-button:active {
    transform: scale(0.9);
}

/* Spezifische Button-Farben und Inhalte */
.emergency-red {
    background-color: #B03133 !important;
    color: white !important;
}

.fab-text {
    font-weight: bold;
    font-size: 0.8rem;
    line-height: 1.2;
    text-align: center;
}

.whatsapp-green {
    background-color: #25d366 !important;
}

.whatsapp-green img {
    width: 35px !important;
    height: 35px !important;
    object-fit: contain;
}

.gutachter-phone {
    background-color: #B03133 !important;
}

.gutachter-phone img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover;
}


/* ==========================================================================
   RESPONSIVE ANPASSUNGEN (Smartphone-Optimierung für die Startseite)
   ========================================================================== */
@media (max-width: 768px) {
    
    /* Mobil-Version: Kompakt und scrollt ebenfalls nach oben weg */
    .logo-container {
        position: absolute !important; 
        top: 20px;
        left: 20px;
        right: auto;
        width: 100px !important;  /* Saubere, dezente Größe auf dem Handy */
        height: 100px !important;
    }

    /* Drückt die Akkordeons auf dem Handy passend nach unten */
    .content {
        padding-top: 140px !important;
    }

    .fab-button {
        width: 58px !important;
        height: 58px !important;
    }
    
    #floating-notruf, 
    #floating-gutachter-group {
        bottom: 20px;
        left: 20px;
    }
}