/*
Author       : theme_ocean
Template Name: Purdue - Education HTML Template
Version      : 1.0
*/
/*=============================================================
    CSS INDEX
    =============================
    01. GENERAL STYLE (body, link color, section-title, preloader btn, overlay, section-padding etc)
    02. START BOOTSTRAP NAVIGATION OVERRIDES
    03. START HOMEPAGE CSS STYLE
    04. START TOP PROMO DESIGN
    05. START ABOUT CSS DESIGN
    06. START COUNTER DESIGN
    07. START FEATURES DESIGN
    08. START COURSE DESIGN
    09. START COURSE PROMOTION DESIGN
    10. START TOPIC DESIGN
    11. START REVIEWS DESIGN
    12. START TEAM DESIGN
    13. START BLOG DESIGN
    14. START FOOTER DESIGN
    15. START PARTNER DESIGN
    16. START SECTION TOP DESIGN
    17. START PRICING DESIGN
    18. START EVENTS DESIGN
    19. START FAQ DESIGN
    20. START ERROR DESIGN
    21. START LOGIN AND REGISTER DESIGN
    22. START CONTACT DESIGN
    23. START ABOUT PAGE DESIGN
    23. START NEWSLETTER DESIGN
    24. START FREE COURSE+INSTRUCTOR DESIGN
  =============================================================*/
/*
* ----------------------------------------------------------------------------------------
* 01.GENERAL STYLE
* ----------------------------------------------------------------------------------------
*/

body { font-family: 'Inter', sans-serif; overflow-x: hidden; }
        h1, h2, h3, .font-heading { font-family: 'Outfit', sans-serif; }
        .font-code { font-family: 'Fira Code', monospace; }
        .glass-card {
            background: rgba(17, 24, 39, 0.75);
            backdrop-filter: blur(12px);
            border: 1px solid rgba(255, 255, 255, 0.1);
        }
        @keyframes float {
            0%, 100% { transform: translateY(0px) rotate(0deg); }
            50% { transform: translateY(-12px) rotate(1deg); }
        }
        @keyframes pulseGlow {
            0%, 100% { opacity: 0.3; transform: scale(1); }
            50% { opacity: 0.7; transform: scale(1.1); }
        }
        @keyframes codeStream {
            0% { transform: translateY(0%); }
            100% { transform: translateY(-50%); }
        }
        @keyframes scanline {
            0% { transform: translateY(-100%); }
            100% { transform: translateY(1000%); }
        }
        @keyframes gridMove {
            0% { background-position: 0 0; }
            100% { background-position: 40px 40px; }
        }
        @keyframes particleFloat {
            0% { transform: translateY(0px) translateX(0px); opacity: 0; }
            50% { opacity: 0.8; }
            100% { transform: translateY(-150px) translateX(40px); opacity: 0; }
        }
        @keyframes pulseSlow {
            0%, 100% { transform: scale(1); opacity: 0.2; }
            50% { transform: scale(1.08); opacity: 0.4; }
        }
        .animate-float { animation: float 5s ease-in-out infinite; }
        .animate-pulse-glow { animation: pulseGlow 4s ease-in-out infinite; }
        .animate-code-scroll { animation: codeStream 10s linear infinite; }
        .animate-scan { animation: scanline 3s linear infinite; }
        .animate-pulse-slow { animation: pulseSlow 6s ease-in-out infinite; }
        .bg-grid-pattern {
            background-image: linear-gradient(to right, rgba(255, 255, 255, 0.03) 1px, transparent 1px),
                              linear-gradient(to bottom, rgba(255, 255, 255, 0.03) 1px, transparent 1px);
            background-size: 40px 40px;
            animation: gridMove 20s linear infinite;
        }
        .particle {
            position: absolute;
            background: rgba(249, 115, 22, 0.6);
            border-radius: 50%;
            pointer-events: none;
            animation: particleFloat 6s ease-in-out infinite;
        }
        /* Custom scrollbar for horizontal scrolling courses */
        .no-scrollbar::-webkit-scrollbar { display: none; }
        .no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }