/* 
 * FKK Point Bruchsal - Text Spacing & Styling Fixes
 * Dieses Stylesheet korrigiert Probleme mit Textabständen und verbessert die Typografie
 */

/* ==========================================================================
   Text Spacing & Typografie
   ========================================================================== */

/* Grundlegende Textabstände für alle Textinhalte */
body {
    line-height: 1.6 !important;
    letter-spacing: 0.01em !important;
    word-spacing: 0.05em !important;
}

/* Spezifische Textformatierung für verschiedene Elementtypen */
p, .section-subtitle, .service-description, .hero-subtitle,
.testimonial-text, .contact-text p, .footer-about, .price-description {
    margin-bottom: 1.2em !important;
    line-height: 1.7 !important;
    letter-spacing: 0.02em !important;
    word-spacing: 0.08em !important;
    white-space: normal !important;
    text-rendering: optimizeLegibility !important;
}

/* Überschriften */
h1, h2, h3, h4, h5, h6, .section-title {
    line-height: 1.3 !important;
    letter-spacing: 0.02em !important;
    word-spacing: 0.05em !important;
    margin-bottom: 0.8em !important;
}

/* Verbesserung der Lesbarkeit für speziellen Text */
.section-title {
    margin-bottom: 0.7em !important;
    letter-spacing: 0.03em !important;
}

.hero-subtitle {
    letter-spacing: 0.04em !important;
    word-spacing: 0.12em !important;
}

/* Text innerhalb von Karten und Containern */
.service-card p, .event-card p, .offer-card p,
.testimonial-card p, .gallery-subtitle, .contact-item p {
    line-height: 1.6 !important;
    margin-bottom: 15px !important;
}

/* Listen und Navigationstext */
li, nav a {
    letter-spacing: 0.02em !important;
    word-spacing: 0.05em !important;
}

/* ==========================================================================
   Layoutverbesserungen
   ========================================================================== */

/* Verbessere Innenabstände für bessere Lesbarkeit */
.service-card, .event-card, .offer-card, .gallery-item,
.testimonial-card, .contact-info-card, .team-card {
    padding: 25px !important;
}

/* Bessere Ausrichtung der Textblöcke */
.about-text, .contact-info, .service-content {
    padding-right: 25px !important;
}

/* Wichtige Container haben genügend Raum */
.section-header, .about-container, .services-container,
.gallery-container, .contact-container, .footer-container {
    padding: 0 25px !important;
}

/* ==========================================================================
   Animation Anpassungen
   ========================================================================== */

/* Verbesserung der Animation für Text-Reveal */
.text-revealed span {
    display: inline !important;
    opacity: 1 !important;
}

/* Verhindere, dass Animationen den Text beschädigen */
@keyframes fixedFadeIn {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
}

.fadeIn {
    animation: fixedFadeIn 1s ease forwards !important;
    white-space: normal !important;
}

/* ==========================================================================
   Responsives Design Verbesserungen
   ========================================================================== */

@media (max-width: 768px) {
    /* Verbesserte Lesbarkeit auf mobilen Geräten */
    body {
        word-spacing: 0.08em !important;
    }
    
    p, .section-subtitle, .service-description {
        font-size: 16px !important;
    }
    
    /* Mehr Platz für mobile Darstellung */
    .section-header, .about-container, .services-container,
    .gallery-container, .contact-container, .footer-container {
        padding: 0 15px !important;
    }
}

/* ==========================================================================
   Spezifische Seitenelemente
   ========================================================================== */

/* About-Sektion */
.about-text p {
    margin-bottom: 20px !important;
}

/* Footer-Bereich */
.footer-about {
    margin-top: 20px !important;
    line-height: 1.6 !important;
}

.footer-title {
    margin-bottom: 20px !important;
}

/* Service-Beschreibungen */
.service-description {
    margin-bottom: 20px !important;
}

/* Preistabellen */
.price-amount {
    letter-spacing: 0.02em !important;
    margin: 15px 0 !important;
}

/* ==========================================================================
   Hilfsbezogene Klassen
   ========================================================================== */

/* Klasse, die auf bereits fixierte Elemente angewendet wird */
.spacing-fixed {
    letter-spacing: 0.02em !important;
    word-spacing: 0.05em !important;
    white-space: normal !important;
}

/* Verhindere, dass andere Skripte die Textabstände beeinflussen */
.preserve-spacing {
    white-space: normal !important;
    word-spacing: inherit !important;
    letter-spacing: inherit !important;
}