/* Troutman's Construction - Custom CSS */

/* Full-width content override */
.wp-block-group.alignfull {
    padding-left: max(var(--wp--style--root--padding-left), 2rem);
    padding-right: max(var(--wp--style--root--padding-right), 2rem);
}

@media (min-width: 782px) {
    .wp-block-group.alignfull {
        margin-left: calc(50% - 50vw);
        margin-right: calc(50% - 50vw);
        padding-left: max(var(--wp--style--root--padding-left), 4rem);
        padding-right: max(var(--wp--style--root--padding-right), 4rem);
    }
}

/* Parallax hero sections */
.is-style-parallax-hero {
    position: relative;
    overflow: hidden;
}

.is-style-parallax-hero .wp-block-cover__image-background {
    attachment: fixed;
    background-attachment: fixed !important;
    transition: transform 0.6s ease-out, opacity 0.8s ease;
}

@media (prefers-reduced-motion: reduce) {
    .is-style-parallax-hero .wp-block-cover__image-background {
        background-attachment: scroll !important;
    }
}

/* Smooth fade-in animation for content sections */
.wp-block-group.alignfull {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}

.wp-block-group.alignfull.in-view {
    opacity: 1;
    transform: translateY(0);
}

/* Cover block parallax transitions */
.wp-block-cover {
    position: relative;
}

.wp-block-cover__image-background {
    transition: transform 0.5s ease-out;
    will-change: transform;
}

/* Button styles - professional gold/dark palette */
.wp-block-button__link {
    border-radius: 6px !important;
    font-weight: 600 !important;
    letter-spacing: 0.02em !important;
    transition: all 0.3s ease !important;
}

.wp-block-button.is-style-fill .wp-block-button__link {
    background-color: #8B6914 !important;
    color: #fff !important;
    border: 2px solid #8B6914 !important;
}

.wp-block-button.is-style-fill .wp-block-button__link:hover {
    background-color: #A07B23 !important;
    border-color: #A07B23 !important;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(139, 105, 20, 0.3);
}

.wp-block-button.is-style-outline .wp-block-button__link {
    background-color: transparent !important;
    color: #f0e6d3 !important;
    border: 2px solid #f0e6d3 !important;
}

.wp-block-button.is-style-outline .wp-block-button__link:hover {
    background-color: rgba(240, 230, 211, 0.1) !important;
    transform: translateY(-2px);
}

/* Heading styles */
h1, h2, h3 {
    font-weight: 700;
    letter-spacing: -0.01em;
}

/* Column animations on scroll */
.wp-block-columns .wp-block-column {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.5s ease-out, transform 0.5s ease-out;
}

.wp-block-columns.animate-in .wp-block-column:nth-child(1) { transition-delay: 0.1s; }
.wp-block-columns.animate-in .wp-block-column:nth-child(2) { transition-delay: 0.2s; }
.wp-block-columns.animate-in .wp-block-column:nth-child(3) { transition-delay: 0.3s; }
.wp-block-columns.animate-in .wp-block-column:nth-child(4) { transition-delay: 0.4s; }

.wp-block-columns.animate-in .wp-block-column {
    opacity: 1;
    transform: translateY(0);
}

/* Image hover effects */
figure.wp-block-image:hover img {
    transform: scale(1.02);
    transition: transform 0.4s ease-out;
}

figure.wp-block-image img {
    transition: transform 0.4s ease-out;
}

/* Custom JavaScript for scroll animations */
<script>
(function() {
    'use strict';
    
    // Intersection Observer for fade-in animations
    const observer = new IntersectionObserver((entries) => {
        entries.forEach(entry => {
            if (entry.isIntersecting) {
                entry.target.classList.add('in-view');
                if (entry.target.classList.contains('wp-block-columns')) {
                    entry.target.classList.add('animate-in');
                }
            }
        });
    }, { threshold: 0.1, rootMargin: '0px 0px -50px 0px' });

    // Observe all full-width groups and columns
    document.querySelectorAll('.wp-block-group.alignfull, .wp-block-columns').forEach(el => {
        observer.observe(el);
    });

    // Parallax effect for cover blocks on scroll
    let ticking = false;
    window.addEventListener('scroll', function() {
        if (!ticking) {
            window.requestAnimationFrame(function() {
                const covers = document.querySelectorAll('.wp-block-cover__image-background');
                covers.forEach(cover => {
                    const rect = cover.parentElement.getBoundingClientRect();
                    const scrollPercent = rect.top / window.innerHeight;
                    const offset = scrollPercent * 30;
                    cover.style.transform = 'translateY(' + offset + 'px) scale(1.1)';
                });
                ticking = false;
            });
            ticking = true;
        }
    });
})();
</script>
