/* Additional & Custom Styles for Mebelburg Responsive Site */

/* Smooth scroll margin offset for fixed header */
[id] {
    scroll-margin-top: 96px;
}

@media (max-width: 1179px) {
    [id] {
        scroll-margin-top: 80px;
    }
}

/* Floating Sticky CTA visibility helper */
#floating-cta.is-visible {
    opacity: 1 !important;
    transform: translateY(0) !important;
    pointer-events: auto !important;
}

/* Thin Border Utilities */
.thin-line {
    border-bottom: 1px solid rgba(47, 52, 56, 0.2);
}

.thin-line-top {
    border-top: 1px solid rgba(47, 52, 56, 0.2);
}

.material-symbols-outlined {
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

/* FAQ Accordion Transitions */
.accordion-content {
    transition: max-height 0.4s ease-in-out, opacity 0.4s ease-in-out, padding 0.4s ease-in-out;
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    padding-bottom: 0;
}

.accordion-item.active .accordion-content {
    max-height: 500px;
    opacity: 1;
    padding-bottom: 1.5rem;
}

.accordion-item.active .material-symbols-outlined {
    transform: rotate(180deg);
}

/* Lightbox Modal */
#lightbox-modal.active {
    opacity: 1;
    pointer-events: auto;
}

#lightbox-modal.active .modal-content {
    transform: scale(1);
}

/* Mobile Side Nav & Overlay */
.nav-overlay.active {
    opacity: 1;
    pointer-events: auto;
}

.side-nav.active {
    transform: translateX(0);
}

/* Shimmer Effect on Buttons */
.btn-shimmer {
    position: relative;
    overflow: hidden;
}

.btn-shimmer::after {
    content: '';
    position: absolute;
    top: -50%;
    left: -50%;
    width: 200%;
    height: 200%;
    background: linear-gradient(to right, transparent, rgba(255, 255, 255, 0.3), transparent);
    transform: rotate(45deg) translateX(-100%);
    transition: transform 0.7s ease;
}

.btn-shimmer:hover::after {
    transform: rotate(45deg) translateX(100%);
}

/* Scroll Animations & Reduced Motion */
@media (prefers-reduced-motion: no-preference) {
    .motion-ready .reveal-up {
        opacity: 0;
        transform: translateY(40px);
        transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1), transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
    }
    
    .motion-ready .reveal-up.is-visible {
        opacity: 1;
        transform: translateY(0);
    }
    
    .delay-100 { transition-delay: 100ms; }
    .delay-200 { transition-delay: 200ms; }
    .delay-300 { transition-delay: 300ms; }
    .delay-400 { transition-delay: 400ms; }
    .delay-500 { transition-delay: 500ms; }
    
    .motion-ready .hero-text-enter {
        animation: slideDownFade 1.2s cubic-bezier(0.16, 1, 0.3, 1) forwards;
        opacity: 0;
    }
    
    .motion-ready .hero-text-enter:nth-child(1) { animation-delay: 0.1s; }
    .motion-ready .hero-text-enter:nth-child(2) { animation-delay: 0.3s; }
    .motion-ready .hero-text-enter:nth-child(3) { animation-delay: 0.5s; }
    
    @keyframes slideDownFade {
        from { opacity: 0; transform: translateY(-30px); }
        to { opacity: 1; transform: translateY(0); }
    }
    
    .bg-breathe { transition: transform 0.8s cubic-bezier(0.16, 1, 0.3, 1); }
}

@media (prefers-reduced-motion: reduce) {
    .reveal-up {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
    }
    
    .hero-text-enter {
        opacity: 1 !important;
        transform: none !important;
        animation: none !important;
    }
    
    .bg-breathe {
        animation: none !important;
    }
    
    .btn-shimmer::after {
        display: none !important;
    }

    *, *::before, *::after { scroll-behavior: auto !important; animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; }
}

.contact-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.contact-card { min-height: 190px; padding: clamp(1.25rem, 3vw, 2rem); border: 1px solid rgba(255,255,255,.16); border-radius: .75rem; background: rgba(255,255,255,.045); display: flex; flex-direction: column; align-items: flex-start; }
.contact-card-wide { grid-column: span 2; }
.contact-label { margin-bottom: 1rem; color: rgba(255,255,255,.58); font-size: .75rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.contact-primary { color: #fff; font-size: clamp(1.15rem, 2.5vw, 1.6rem); line-height: 1.25; }
.contact-secondary { margin-top: .5rem; color: rgba(255,255,255,.76); }
.contact-action { margin-top: auto; padding-top: 1.25rem; color: #fff; font-weight: 700; text-decoration: underline; text-decoration-color: #E71B22; text-underline-offset: .3em; }
.contact-primary:hover, .contact-action:hover, .footer-contacts a:hover { color: #ff5a5f; }
.footer-contacts a { color: #2F3438; font-size: .875rem; transition: color .2s ease; }
@media (max-width: 639px) { .contact-grid { grid-template-columns: 1fr; } .contact-card-wide { grid-column: auto; } .contact-card { min-height: 170px; } }
