:root {
    --edu-bg: var(--bs-body-bg);
    --edu-ink: var(--bs-body-color);
    --edu-indigo: #4F46E5; /* indigo-600 */
    --edu-teal: #14B8A6; /* teal-500 */
    --edu-sky: #0EA5E9; /* sky-500 */
    --edu-muted: rgba(0,0,0,.06);
}

/* ========== HERO ========== */
.hero {
    max-width:1800px;
    position: relative;
    overflow: hidden;
    background: radial-gradient(1200px 600px at 10% -10%, rgba(79,70,229,.16), transparent 60%), radial-gradient(1200px 600px at 90% 0%, rgba(20,184,166,.14), transparent 60%), var(--edu-bg);
}

.hero-grid:before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: radial-gradient(circle at 1px 1px, rgba(79,70,229,.08) 1px, transparent 0);
    background-size: 22px 22px;
    opacity: .35;
    pointer-events: none;
    transform: translateZ(0);
}

.orb {
    position: absolute;
    width: 46vmax;
    height: 46vmax;
    border-radius: 50%;
    background: radial-gradient(circle at 30% 30%, rgba(14,165,233,.25), rgba(79,70,229,.18) 45%, transparent 70%);
    filter: blur(30px);
    animation: drift 18s ease-in-out infinite alternate;
}

.orb--r {
    right: -15vmax;
    top: -10vmax;
}

.orb--l {
    left: -20vmax;
    bottom: -15vmax;
    animation-delay: -6s;
}

@keyframes drift {
    from {
        transform: translate(0,0) scale(1);
    }

    to {
        transform: translate(-2%,3%) scale(1.05);
    }
}

.typed-marker {
    border-right: 2px solid var(--edu-ink);
}

/* ========== CARDS & HOVERS ========== */
.card-hover {
    transition: transform .35s ease, box-shadow .35s ease;
}

    .card-hover:hover {
        transform: translateY(-6px);
        box-shadow: 0 1rem 2rem rgba(0,0,0,.08);
    }

/* ========== DIVIDER ========== */
.divider {
    position: relative;
    overflow: hidden;
    background: linear-gradient(90deg, rgba(79,70,229,.08), rgba(20,184,166,.08));
}

    .divider .flow {
        position: absolute;
        inset: -40% -10%;
        background: conic-gradient(from 180deg at 50% 50%, rgba(14,165,233,.08), rgba(79,70,229,.08), rgba(20,184,166,.08), rgba(14,165,233,.08));
        filter: blur(30px);
        animation: swirl 28s linear infinite;
    }

@keyframes swirl {
    to {
        transform: rotate(1turn);
    }
}

/* ========== FEATURE ICON BADGES ========== */
.feature-icon {
    width: 3rem;
    height: 3rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: .85rem;
    color: #fff;
    background: linear-gradient(135deg, var(--edu-indigo), var(--edu-teal));
    box-shadow: 0 .5rem 1.25rem rgba(79,70,229,.25);
}

/* ========== CAROUSEL ========== */
.quote {
    font-style: italic;
}

/* ========== CTA BUTTONS ========== */
.btn-cta {
    transition: transform .2s ease;
}

    .btn-cta:hover {
        transform: translateY(-2px);
    }

.btn-dark-edu {
    background: #0B1220;
    border-color: #0B1220;
}

.btn-outline-edu {
    border-color: var(--edu-indigo);
    color: var(--edu-indigo);
}

    .btn-outline-edu:hover {
        background: var(--edu-indigo);
        color: #fff;
    }

/* Reveal fallback (if JS disabled) */
.reveal {
    opacity: 0;
    transform: translateY(12px);
    transition: opacity .6s ease, transform .6s ease;
}

    .reveal.show {
        opacity: 1;
        transform: none;
    }


.standards-hero {
    position: relative;
    overflow: hidden;
}

    .standards-hero .orb {
        position: absolute;
        width: 42vmax;
        height: 42vmax;
        border-radius: 50%;
        background: radial-gradient(circle at 30% 30%, rgba(14,165,233,.18), rgba(79,70,229,.14) 45%, transparent 70%);
        filter: blur(28px);
        animation: drift 18s ease-in-out infinite alternate;
    }

    .standards-hero .orb--l {
        left: -18vmax;
        top: -10vmax;
    }

    .standards-hero .orb--r {
        right: -14vmax;
        bottom: -12vmax;
        animation-delay: -6s;
    }

@keyframes drift {
    from {
        transform: translate(0,0) scale(1);
    }

    to {
        transform: translate(-2%,3%) scale(1.05);
    }
}

.standard-card {
    border: 0;
    box-shadow: 0 .75rem 1.5rem rgba(0,0,0,.06);
    transition: transform .25s ease, box-shadow .25s ease;
    cursor: pointer;
    border-radius: 1rem;
}

    .standard-card:hover {
        transform: translateY(-4px);
        box-shadow: 0 1.25rem 2.5rem rgba(0,0,0,.10);
    }

.ngss-list-item {
    border: 0;
    border-radius: .75rem !important;
    margin-bottom: .5rem;
    box-shadow: 0 .5rem 1rem rgba(0,0,0,.05);
    transition: transform .25s ease, box-shadow .25s;
}

    .ngss-list-item:hover {
        transform: translateY(-2px);
        box-shadow: 0 1rem 2rem rgba(0,0,0,.08);
    }

.typed-marker {
    border-right: 2px solid var(--bs-body-color)
}