/* Remove global overflow: hidden */
body, html {
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%;
    font-family: 'Poppins', Arial, sans-serif;
    background-color: #f7f8fc;
    color: #333;
    overflow-x: hidden; /* Prevent horizontal scrolling */
}

/* Welcome Section */
.welcome-section {
    position: relative;
    height: 100vh; /* Full viewport height */
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    overflow: hidden; /* Ensure video stays contained */
}

/* Background Video */
#background-video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover; /* Ensures the video fills the section */
    z-index: -1; /* Sends video to the background */
    display: block; /* Ensures it's visible */
    background-color: #000; /* Fallback for unsupported browsers */
    pointer-events: none; /* Prevent interactions with the video */
}
/* Additional Video Section */
.extra-video-section {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #000; /* Background in case video doesn't load */
    padding: 20px 0; /* Adjust spacing above and below */
    overflow: hidden; /* Prevents scrollbars */
}

/* Video Styling - Smaller & Fully Visible */
.extra-video {
    width: 80%; /* Adjust to make the video smaller (Try 60% if needed) */
    max-width: 900px; /* Limits max width for better responsiveness */
    height: 400px; /* Set a smaller height (Adjust to your liking) */
    object-fit: contain; /* Ensures the entire video fits without cropping */
}