.elementor-3261 .elementor-element.elementor-element-052d5da{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-3261 .elementor-element.elementor-element-f6eacf4{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-3261 .elementor-element.elementor-element-05f820b{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-3261 .elementor-element.elementor-element-1147c6b{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-3261 .elementor-element.elementor-element-d106b04{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}/* Start custom CSS *//* ============================================
   BUSY BEING HEALTHY LANDING PAGE
   Individuelles CSS für die gesamte Seite
   ============================================ */

/* ========== BUTTON FIX ========== */
/* Überschreibt Theme-Orange mit deinen Farben */
a[href*="calendly"],
.hero-button,
.cta-button,
.primary-button,
button[type="submit"] {
    background-color: #5A2E32 !important;
    color: #FDFCF9 !important;
    border: none !important;
    padding: 18px 50px !important;
    border-radius: 100px !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    transition: all 0.4s ease !important;
}

a[href*="calendly"]:hover,
.hero-button:hover,
.cta-button:hover,
.primary-button:hover,
button[type="submit"]:hover {
    background-color: #D5B4AC !important;
    transform: translateY(-4px) !important;
}

/* ========== RESPONSIVE FIXES ========== */
/* Stelle sicher, dass alles responsiv ist */
@media (max-width: 768px) {
    /* Buttons auf Mobile volle Breite */
    a[href*="calendly"],
    .hero-button,
    .cta-button,
    .primary-button {
        width: 100% !important;
        display: block !important;
        text-align: center !important;
        padding: 15px 36px !important;
        font-size: 16px !important;
    }
    
    /* Text-Größen anpassen */
    h1, h2 {
        font-size: 28px !important;
        line-height: 1.3 !important;
    }
    
    h3 {
        font-size: 20px !important;
    }
    
    p {
        font-size: 16px !important;
    }
    
    /* Container Padding */
    .container,
    section {
        padding-left: 20px !important;
        padding-right: 20px !important;
    }
}

/* ========== TESTIMONIALS STYLING ========== */
.testimonial-card {
    background: white !important;
    padding: 40px 32px !important;
    border-radius: 24px !important;
    box-shadow: 0 10px 40px rgba(90, 46, 50, 0.08) !important;
    border: 1px solid rgba(213, 180, 172, 0.2) !important;
}

.testimonial-text {
    font-style: italic !important;
    color: #485248 !important;
    line-height: 1.7 !important;
}

.testimonial-avatar {
    background: linear-gradient(135deg, #D5B4AC 0%, #5A2E32 100%) !important;
    color: white !important;
    border-radius: 50% !important;
}

.testimonial-name {
    color: #5A2E32 !important;
    font-weight: 600 !important;
}

/* ========== FAQ STYLING ========== */
.faq-item {
    background: white !important;
    border-radius: 20px !important;
    padding: 32px !important;
    margin-bottom: 24px !important;
    box-shadow: 0 4px 20px rgba(90, 46, 50, 0.06) !important;
    border: 1px solid rgba(213, 180, 172, 0.2) !important;
}

.faq-question {
    color: #5A2E32 !important;
    font-weight: 600 !important;
    font-size: 20px !important;
    margin-bottom: 16px !important;
}

.faq-answer {
    color: #485248 !important;
    line-height: 1.7 !important;
}

/* ========== TIMELINE STYLING ========== */
.qualifications-timeline::before {
    background: linear-gradient(180deg, #D5B4AC 0%, #5A2E32 100%) !important;
}

.timeline-dot {
    border-color: #5A2E32 !important;
}

.timeline-title {
    color: #5A2E32 !important;
    font-weight: 600 !important;
}

/* ========== GRADIENT SECTIONS ========== */
.gradient-bg-primary {
    background: linear-gradient(135deg, #5A2E32 0%, #7A4E52 100%) !important;
}

.gradient-bg-secondary {
    background: linear-gradient(135deg, #D5B4AC 0%, #5A2E32 100%) !important;
}

/* ========== ICON CIRCLES ========== */
.goal-icon,
.icon-circle {
    background: linear-gradient(135deg, #D5B4AC 0%, #5A2E32 100%) !important;
    border-radius: 50% !important;
}

/* ========== CARDS & BOXES ========== */
.card,
.goal-card,
.forwho-item,
.included-item {
    background: white !important;
    border-radius: 16px !important;
    box-shadow: 0 4px 16px rgba(90, 46, 50, 0.06) !important;
}

.forwho-item {
    border-left: 4px solid #5A2E32 !important;
}

/* ========== VIDEO CONTAINER ========== */
.video-container,
.video-placeholder {
    border-radius: 24px !important;
    overflow: hidden !important;
    box-shadow: 0 20px 60px rgba(90, 46, 50, 0.15) !important;
    max-width: 900px !important;
    margin: 0 auto !important;
}

/* Video Wrapper für korrektes 16:9 Aspect Ratio */
.video-wrapper {
    position: relative !important;
    width: 100% !important;
    padding-bottom: 56.25% !important; /* 16:9 Aspect Ratio */
    height: 0 !important;
    overflow: hidden !important;
}

.video-wrapper iframe {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    border: none !important;
}

/* Falls Video direkt eingebettet ist ohne Wrapper */
iframe[src*="youtube"],
iframe[src*="vimeo"] {
    width: 100% !important;
    aspect-ratio: 16/9 !important;
    height: auto !important;
    display: block !important;
}

@media (max-width: 768px) {
    .video-container {
        border-radius: 16px !important;
        max-width: 100% !important;
    }
    
    .video-wrapper {
        border-radius: 16px !important;
    }
}

@media (max-width: 480px) {
    .video-container {
        border-radius: 12px !important;
    }
}

/* ========== HOVER EFFECTS ========== */
.card:hover,
.goal-card:hover,
.testimonial-card:hover,
.faq-item:hover {
    transform: translateY(-4px) !important;
    box-shadow: 0 8px 24px rgba(90, 46, 50, 0.12) !important;
}

/* ========== FORMS FIX ========== */
/* Verhindert iPhone Auto-Zoom */
input[type="text"],
input[type="email"],
input[type="tel"],
textarea {
    font-size: 16px !important;
}

/* ========== SPACING FIXES ========== */
/* Stelle sicher, dass Sections genug Abstand haben */
section {
    margin-bottom: 80px !important;
}

@media (max-width: 768px) {
    section {
        margin-bottom: 60px !important;
    }
}

/* ========== TEXT ALIGNMENT ========== */
.text-center {
    text-align: center !important;
}

/* ========== HERO FIXES ========== */
/* Stelle sicher dass Hero responsive ist */
.hero {
    min-height: 100vh !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    position: relative !important;
    background: transparent !important;
    padding: 0 !important;
}

/* Hero Background Bild */
.hero-background,
.hero img {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    z-index: 0 !important;
}

/* Hero Text Lesbarkeit */
.hero h1,
.hero-headline {
    color: white !important;
    text-shadow: 0 4px 20px rgba(0, 0, 0, 0.9), 
                 0 2px 8px rgba(0, 0, 0, 0.7) !important;
    background: transparent !important;
}

.hero p,
.hero-subheadline,
.hero-description {
    color: white !important;
    text-shadow: 0 2px 12px rgba(0, 0, 0, 0.8), 
                 0 1px 4px rgba(0, 0, 0, 0.6) !important;
    background: transparent !important;
}

/* Entferne alle Hintergründe im Hero */
.hero *:not(img):not(.hero-background):not(a):not(button):not(.hero-button):not(.cta-button) {
    background: transparent !important;
}

/* Buttons im Hero behalten ihre Farbe */
.hero .hero-button,
.hero .cta-button,
.hero a[href*="calendly"] {
    background-color: #5A2E32 !important;
    color: #FDFCF9 !important;
}

/* Optional: Dunkles Overlay über Bild für bessere Lesbarkeit */
.hero::before {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    background: linear-gradient(135deg, 
                rgba(0, 0, 0, 0.4) 0%, 
                rgba(0, 0, 0, 0.3) 100%) !important;
    z-index: 1 !important;
    pointer-events: none !important;
}

.hero-content {
    position: relative !important;
    z-index: 2 !important;
    background: transparent !important;
}

@media (max-width: 768px) {
    .hero {
        min-height: 85vh !important;
        padding: 60px 20px !important;
    }
    
    .hero h1,
    .hero-headline {
        font-size: 30px !important;
        line-height: 1.2 !important;
    }
    
    .hero::before {
        background: linear-gradient(135deg, 
                    rgba(0, 0, 0, 0.5) 0%, 
                    rgba(0, 0, 0, 0.4) 100%) !important;
    }
}

/* ========== PREVENT HORIZONTAL SCROLL ========== */
body, html {
    overflow-x: hidden !important;
    max-width: 100vw !important;
}

* {
    max-width: 100% !important;
}

/* Außer für diese Elemente */
img, video, iframe {
    max-width: 100% !important;
    height: auto !important;
}

/* ========== BEKANNT AUS LOGOS ========== */
.bekannt-logos img {
    filter: grayscale(100%) opacity(0.6) !important;
    transition: all 0.3s ease !important;
    max-height: 60px !important;
    height: 60px !important;
    width: auto !important;
    object-fit: contain !important;
}

.bekannt-logos img:hover {
    filter: grayscale(0%) opacity(1) !important;
    transform: scale(1.05) !important;
}

@media (max-width: 768px) {
    .bekannt-logos img {
        max-height: 40px !important;
        height: 40px !important;
    }
}

/* ========== PRICE SECTION ========== */
.price-section {
    background: linear-gradient(135deg, #D5B4AC 0%, #5A2E32 100%) !important;
    color: white !important;
    border-radius: 24px !important;
    padding: 60px 40px !important;
}

.price-section h3,
.price-section p {
    color: white !important;
}

/* ========== ANIMATIONS ========== */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ========== PRINT STYLES ========== */
@media print {
    .hero-button,
    .cta-button,
    button {
        display: none !important;
    }
}/* End custom CSS */