.full-screen {
    position: relative;
    height: 100vh;
    overflow: hidden;
}

/* iOS Video Fix */
@supports (-webkit-touch-callout: none) {
    /* CSS specific to iOS devices */
    .full-screen video {
        position: absolute;
        -webkit-user-select: none;
        user-select: none;
        -webkit-touch-callout: none;
        object-fit: cover;
        z-index: 0; /* Ensure video is behind content */
        -webkit-user-select: none;
        -webkit-touch-callout: none;
        object-fit: cover;
        z-index: 0; /* Ensure video is behind content */
        width: 100%;
        height: 100%;
        object-fit: cover;
        z-index: 1;
    }
    
    .full-screen::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-image: url('../images/placeholder-poster.jpg'); /* Replace with a still frame from your video */
        background-size: cover;
        background-position: center;
        z-index: 0;
    }
}

/* Hide video controls on iOS */
video::-webkit-media-controls {
    display: none !important;
}

video::-webkit-media-controls-enclosure {
    display: none !important;
}

video::-webkit-media-controls-panel {
    display: none !important;
}

video::-webkit-media-controls-play-button {
    display: none !important;
}

video::-webkit-media-controls-start-playback-button {
    display: none !important;
}

/* Make sure content is above video */
.position-relative .position-relative {
    z-index: 1;
}

/* Make sure text content is above video */
.d-flex.flex-column.justify-content-center.align-items-center.text-center.position-relative {
    z-index: 2;
    position: relative;
}