body, html {
    margin: 0;
    padding: 0;
    font-family: 'Roboto', sans-serif;
    scroll-behavior: smooth; /* Smooth scrolling for anchor links */
}

.swiper-container {
    width: 100%;
}

.swiper-slide {
    position: relative;
    text-align: center;
    font-size: 18px;
    background: #fff;
    height: 600px; /* Adjust based on your preference */
    overflow: hidden;
}

.swiper-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.description-overlay {
    position: absolute;
    bottom: 0;
    background: rgba(0, 0, 0, 0.3); /* Semi-transparent black background */
    color: #fff; /* White text color */
    width: 100%;
    padding: 20px; /* Adjust based on your preference for padding */
    box-sizing: border-box;
    font-family: 'Roboto', sans-serif; /* Example font, adjust as needed */
    font-size: 16px; /* Adjust based on your preference */
    letter-spacing: 0.06em; /* Good spacing between letters */
    word-spacing: 0.2em; /* Good spacing between words */
}

.description-overlay p {
    margin: 0; /* Removes default paragraph margin */
}



.swiper-description {
    text-align: center;
    margin-top: 10px;
}



@media (max-width: 768px) {
    .description-overlay {
        padding: 10px; /* Less padding on mobile */
        font-size: 14px; /* Smaller text on mobile */
    }

    .swiper-slide {
        height: auto; /* Or a smaller fixed height */
    }

    .swiper-slide img {
        height: auto; /* Adjust height for mobile, if necessary */
    }
}


/* Navbar Customization */
.bg-custom {
    background-color: #ffffff; /* Pure white background */
    box-shadow: 0 2px 4px rgba(0,0,0,0.1); /* Subtle shadow for depth */
}

.navbar-light .navbar-nav .nav-link {
    color: #0d0d0d; /* Soft gray for text */
    font-weight: 700; /* Medium weight for a bit of emphasis */
    letter-spacing: 0.05em; /* Spacing for a clean look */
    transition: color 0.3s; /* Smooth transition for hover effects */
}

.navbar-light .navbar-nav .nav-link:hover, .navbar-light .navbar-nav .nav-item.active .nav-link {
    color: #007bff; /* Bright blue for interactivity */
}

/* Sticky Navbar */
.sticky-top {
    position: -webkit-sticky; /* For Safari */
    position: sticky;
    top: 0;
    z-index: 1020; /* Ensure it stays above other content */
}

/* Toggler and Collapse Customizations for a Unified Look */
.navbar-toggler {
    border-color: rgba(0, 123, 255, 0.1);
}

.navbar-toggler-icon {
    /* Customize if needed */
}

.navbar-collapse {
    background-color: #ffffff;
}

.content-container {
    max-width: 800px; /* Adjust based on your preference */
    margin: auto;
    padding: 20px;
}

/* Base styles for the content sections */
section {
    padding: 40px 15px; /* Adds padding inside each section for spacing around the text */
    margin: auto; /* Centers the section */
    max-width: 800px; /* Limits the width of the content for better readability */
}

/* Enhancing readability with better spacing and alignment */
section h2 {
    font-size: 28px; /* Slightly larger font size for section headers */
    margin-bottom: 20px; /* Adds more space below the headers */
    text-align: center; /* Centers the headers */
}

section p, section ul {
    text-align: justify; /* Justifies the paragraph and list text for a smooth flow */
    margin-bottom: 15px; /* Adds bottom margin for spacing between paragraphs/lists */
}

section ul {
    padding-left: 20px; /* Proper indentation for list items */
}

section li {
    margin-bottom: 10px; /* Adds spacing between list items */
}

/* Responsive adjustments for smaller screens */
@media (max-width: 768px) {
    section {
        padding: 20px 10px; /* Reduced padding for smaller screens */
    }
    section h2 {
        font-size: 24px; /* Adjusts header size for mobile devices */
    }
}


