/* ============================================
   Full Width Image Section Styles
   ============================================ */

/* Wrapper for section + caption */
.section-full-width-image-wrapper {
    position: relative;
    width: 100%;
    margin: 0;
    padding: 0;
}

/* Section Container */
.section-full-width-image {
    position: relative;
    width: 100%;
    overflow: hidden;
    margin: 0;
    padding: 0;
}

/* Image Container */
.section-full-width-image .image-container {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

/* Full Width Image */
.section-full-width-image .full-width-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.1s ease-out;
}

/* Height Variations */
.section-full-width-image.height-small {
    height: 400px;
}

.section-full-width-image.height-small .image-container {
    height: 400px;
}

.section-full-width-image.height-medium {
    height: 564px;
}

.section-full-width-image.height-medium .image-container {
    height: 564px;
}

.section-full-width-image.height-large {
    height: 700px;
}

.section-full-width-image.height-large .image-container {
    height: 700px;
}

.section-full-width-image.height-extra-large {
    height: 900px;
}

.section-full-width-image.height-extra-large .image-container {
    height: 900px;
}

/* Caption - outside parallax container */
.section-full-width-image-wrapper .image-caption {
    font-family: 'Outfit', sans-serif;
    font-size: 14px;
    line-height: 1.5;
    color: var(--paperwise-dark-green);
    padding: 12px 20px;
    text-align: center;
    background: var(--paperwise-off-white);
    width: 100%;
    position: relative;
    z-index: 10;
}

/* Parallax Effect - alleen afbeelding beweegt, container blijft vaste hoogte */
.section-full-width-image.parallax-enabled .image-container {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.section-full-width-image.parallax-enabled .full-width-image {
    position: absolute;
    top: -20%;
    left: 0;
    width: 100%;
    height: 140%;
    object-fit: cover;
    will-change: transform;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
}

/* Responsive Adjustments */
@media (max-width: 991px) {
    .section-full-width-image.height-small {
        height: 350px;
    }

    .section-full-width-image.height-small .image-container {
        height: 350px;
    }

    .section-full-width-image.height-medium {
        height: 450px;
    }

    .section-full-width-image.height-medium .image-container {
        height: 450px;
    }

    .section-full-width-image.height-large {
        height: 550px;
    }

    .section-full-width-image.height-large .image-container {
        height: 550px;
    }

    .section-full-width-image.height-extra-large {
        height: 700px;
    }

    .section-full-width-image.height-extra-large .image-container {
        height: 700px;
    }
}

@media (max-width: 768px) {
    .section-full-width-image.height-small {
        height: 300px;
    }

    .section-full-width-image.height-small .image-container {
        height: 300px;
    }

    .section-full-width-image.height-medium {
        height: 400px;
    }

    .section-full-width-image.height-medium .image-container {
        height: 400px;
    }

    .section-full-width-image.height-large {
        height: 500px;
    }

    .section-full-width-image.height-large .image-container {
        height: 500px;
    }

    .section-full-width-image.height-extra-large {
        height: 600px;
    }

    .section-full-width-image.height-extra-large .image-container {
        height: 600px;
    }
}

@media (max-width: 576px) {
    .section-full-width-image.height-small {
        height: 250px;
    }

    .section-full-width-image.height-small .image-container {
        height: 250px;
    }

    .section-full-width-image.height-medium {
        height: 350px;
    }

    .section-full-width-image.height-medium .image-container {
        height: 350px;
    }

    .section-full-width-image.height-large {
        height: 450px;
    }

    .section-full-width-image.height-large .image-container {
        height: 450px;
    }

    .section-full-width-image.height-extra-large {
        height: 550px;
    }

    .section-full-width-image.height-extra-large .image-container {
        height: 550px;
    }

    /* Disable parallax on mobile for better performance */
    .section-full-width-image.parallax-enabled .image-container {
        height: 100%;
    }

    .section-full-width-image.parallax-enabled .full-width-image {
        transform: none !important;
    }
}

/* Accessibility - Reduced Motion */
@media (prefers-reduced-motion: reduce) {
    .section-full-width-image.parallax-enabled .full-width-image {
        transform: none !important;
        transition: none;
    }
}

/* Print Styles */
@media print {
    .section-full-width-image {
        page-break-inside: avoid;
    }
}
