.bg-dark-custom {
            background-color: #222; /* or your preferred dark color */
            color: #fff; /* Light text color for contrast */
        }
        .hero-section {
            height: 80vh;
            display: flex;
            align-items: center;
            justify-content: center;
            text-align: center;
        }
        .text-2xl { font-size: 2rem; }
        .font-bold { font-weight: bold; }

        .text-light {
            color: #ecf0f1; /* Light gray */
            font-family: 'Space Grotesk', sans-serif;
            font-weight: 600; /* Optional: for a modern look */
        }

        .container {
            font-family: 'Space Grotesk', sans-serif;
            font-weight: 600; /* Optional: for a modern look */
        }
        .section-ai-capabilities::before {
            content: "";
            position: absolute;
            inset: 0; /* Covers entire element */
            background: rgba(0, 0, 0, 0.2); /* Adjust opacity as needed */
        }
        .section-ai-capabilities {
        position: relative; /* Important for positioning the video */
        overflow: hidden; /* Hide any video overflow */
        }

        .section-ai-capabilities video {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        object-fit: cover; /*  Important: Makes the video cover the entire area */
        z-index: -1; /* Send the video to the background */
        }

        .section-content { /* Adjust content styling as needed */
        position: relative; /* Ensure content is above the video */
        z-index: 1;
        }
        .swiper {
            width: auto;
            height: 300px; /* Adjust based on your needs */
            display: flex;
            align-items: center;
            justify-content: center;
        }
        .swiper-container {
            width: 100%;
            margin: 20px auto; /* Centers the swiper */
            max-width: 600px; /* Optional: prevents excessive width on large screens */
        }

        .swiper-slide {
            width: auto;
            height: auto; /* Adjust based on your needs */
            display: flex;
            align-items: center;
            justify-content: center;
            /* Critical for loop effect */
            overflow: hidden;
            position: relative;
        }

        .swiper-slide img {
            width: 50%;  /* Or a specific width, e.g., '300px' */
            height: auto; /* Maintain aspect ratio */
            object-fit: cover; /* Ensures the image covers the area without distortion */
        }

        .modal {
            display: none; /* Hidden by default */
            position: fixed; /* Stay in place */
            z-index: 1; /* Sit on top */
            left: 0;
            top: 0;
            width: 100%; /* Full width */
            height: 100%; /* Full height */
            overflow: auto; /* Enable scroll if needed */
            background-color: rgba(0,0,0,0.4); /* Fades the background */
        }

        .modal-content {
        background-color: #fefefe;
            margin: 15% auto; /* Center the content */
            padding: 20px;
            width: 60%; /* Adjust as needed */
            max-width: 800px; /* Maximum width for larger screens */
            position: relative; /* For positioning the close button */
        }

        .close {
            color: #f00404;
            font-size: 28px;
            font-weight: bold;
            position: absolute;
            top: 10px;
            right: 10px;
        }

        .close:hover,
        .close:focus {
            color: rgb(107, 117, 211);
            text-decoration: none;
            cursor: pointer;
        }

        .modal-image {
        width: auto; /* Image takes up full width of content */
        height: auto;
        display: block; /* Removes any default bottom margin */
        margin: auto; /* Centers the image horizontally */
}