body {
            font-family: 'Plus Jakarta Sans', sans-serif;
            background-color: #f8fafc;
            overflow-x: hidden;
        }

        .bg-onip-blue {
            background-color: #003066;
        }

        .text-onip-blue {
            color: #003066;
        }

        .reveal {
            opacity: 0;
            transform: translateY(30px);
            transition: all 0.8s cubic-bezier(0.4, 0, 0.2, 1);
        }

        .reveal.active {
            opacity: 1;
            transform: translateY(0);
        }

        .carousel-item {
            display: none;
            animation: fadeIn 1.5s ease-in-out;
        }

        .carousel-item.active {
            display: block;
        }

        @keyframes fadeIn {
            from {
                opacity: 0;
            }

            to {
                opacity: 1;
            }
        }

        .hero-overlay {
            background: linear-gradient(to right, rgba(0, 48, 102, 0.8), rgba(0, 0, 0, 0.4));
        }

        .dot.active {
            background-color: #eab308;
            width: 1.5rem;
        }

        .card-shadow {
            transition: all 0.3s ease;
        }

        .card-shadow:hover {
            transform: translateY(-8px);
            box-shadow: 0 20px 40px rgba(0, 48, 102, 0.1);
        }

        .stat-bar-bg {
            height: 8px;
            background: #e2e8f0;
            border-radius: 99px;
            overflow: hidden;
        }

        .stat-bar-fill {
            height: 100%;
            background: #eab308;
            width: 0;
            transition: width 2s cubic-bezier(0.1, 0, 0.2, 1);
        }

        /* FAQ Accordion */
        .faq-item button i {
            transition: transform 0.3s ease;
        }

        .faq-item.active button i {
            transform: rotate(180deg);
        }

        .faq-content {
            max-height: 0;
            overflow: hidden;
            transition: max-height 0.3s ease-out;
        }

        .faq-item.active .faq-content {
            max-height: 300px;
        }