/* General Page Styles */
body, html {
    margin: 0;
    padding: 0;
    height: 100%;
    overflow: hidden; /* Prevent default scrolling outside the container */
}

/* Scrollable Container */
.scroll-container {
    height: 100vh; /* Full viewport height */
    overflow-y: scroll; /* Allow vertical scrolling */
    scroll-snap-type: y mandatory; /* Enable vertical snap behavior */
    scroll-behavior: smooth; /* Smooth scrolling */
    -webkit-overflow-scrolling: touch; /* Smooth scrolling on touch devices */
}

/* Individual Sections */
.section {
    height: 100vh; /* Each section takes up the full viewport */
    scroll-snap-align: start; /* Snap to the start of each section */
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    font-family: Arial, sans-serif;
    font-size: 24px;
    color: #0c5345;
}

/* Background Colors for Visual Differentiation */
#section-1 {
    background-color: #ADD8E6; /* Light Blue */
}

#section-2 {
    background-color: #3df084; /* Light Green */
}

#section-3 {
    background-color: #f03d3d; /* Light Red */
}