body {
            font-family: 'Inter', sans-serif;
            overflow-x: hidden;
        }

        /* Enhanced animations */
        @keyframes float {
            0%, 100% { transform: translateY(0px); }
            50% { transform: translateY(-10px); }
        }
        
        @keyframes slideInUp {
            from { opacity: 0; transform: translateY(50px); }
            to { opacity: 1; transform: translateY(0); }
        }
        
        @keyframes slideInLeft {
            from { opacity: 0; transform: translateX(-50px); }
            to { opacity: 1; transform: translateX(0); }
        }
        
        @keyframes slideInRight {
            from { opacity: 0; transform: translateX(50px); }
            to { opacity: 1; transform: translateX(0); }
        }
        
        @keyframes fadeInScale {
            from { opacity: 0; transform: scale(0.8); }
            to { opacity: 1; transform: scale(1); }
        }
        
        .animate-float { animation: float 3s ease-in-out infinite; }
        .animate-slide-up { animation: slideInUp 0.8s ease-out forwards; }
        .animate-slide-left { animation: slideInLeft 0.8s ease-out forwards; }
        .animate-slide-right { animation: slideInRight 0.8s ease-out forwards; }
        .animate-fade-scale { animation: fadeInScale 0.6s ease-out forwards; }
        
        /* Custom gradient backgrounds (as defined in original) */
        .bg-gradient-cyber {
            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
        }
        
        .bg-gradient-security {
            background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
        }
        
        .bg-gradient-shield {
            background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);
        }
        
        /* Grid pattern */
        .bg-grid-pattern {
            background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.1'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
        }
        
        /* Threat indicator styles */
        .threat-critical { @apply bg-red-100 border-red-300 text-red-800; }
        .threat-high { @apply bg-orange-100 border-orange-300 text-orange-800; }
        .threat-medium { @apply bg-yellow-100 border-yellow-300 text-yellow-800; }
        .threat-low { @apply bg-green-100 border-green-300 text-green-800; }
        
        /* Interactive hover effects */
        .card-hover {
            transition: transform 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
        }
        .card-hover:hover {
            transform: translateY(-8px);
            box-shadow: 0 20px 40px rgba(0,0,0,0.1);
        }
        
        /* Security badge pulse */
        @keyframes pulse-security {
            0%, 100% { box-shadow: 0 0 0 0 rgba(239, 68, 68, 0.7); }
            70% { box-shadow: 0 0 0 10px rgba(239, 68, 68, 0); }
        }
        
        .security-pulse { animation: pulse-security 2s infinite; }

        /* Initial hidden state for animated elements */
        .animated-element {
            opacity: 0;
            transform: translateY(30px); /* Default for slide-up */
            transition: all 0.6s ease-out; /* Smooth transition for observer animations */
        }
        
        /* Header Specific Styles from previous code */
        .header-animate {
            background-color: rgba(255, 255, 255, 0.95);
            backdrop-filter: blur(8px);
            -webkit-backdrop-filter: blur(8px);
        }
        .dropdown-menu {
            transition: all 0.3s ease-in-out;
            transform-origin: top center;
        }
        .chevron-rotate {
            transition: transform 0.3s ease-in-out;
        }
        .chevron-rotate.rotate-180 {
            transform: rotate(180deg);
        }

        /* Mobile Menu styles from previous code */
        .mobile-overlay {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: rgba(0, 0, 0, 0.5);
            z-index: 55;
            display: none;
        }

        .mobile-menu {
            position: fixed;
            top: 0;
            right: 0;
            width: 100%;
            max-width: 320px;
            height: 100%;
            background-color: white;
            z-index: 60;
            padding: 1.5rem;
            transform: translateX(100%);
            transition: transform 0.3s ease-in-out;
            box-shadow: -4px 0 10px rgba(0, 0, 0, 0.1);
            overflow-y: auto; /* Add scrolling for long menus */
        }

        .mobile-menu.active {
            transform: translateX(0);
        }

        .mobile-menu-header {
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding-bottom: 1rem;
            border-bottom: 1px solid #e5e7eb;
        }

        .mobile-nav-item {
            border-bottom: 1px solid #e5e7eb;
        }

        .mobile-nav-link,
        .mobile-dropdown-toggle {
            display: block;
            padding: 1rem 0;
            font-weight: 500;
            color: #4b5563;
        }

        .mobile-dropdown-toggle {
            display: flex;
            justify-content: space-between;
            align-items: center;
        }

        .mobile-dropdown-menu {
            max-height: 0;
            overflow: hidden;
            transition: max-height 0.3s ease-in-out;
        }

        .mobile-dropdown-menu.open {
            max-height: 500px; /* Arbitrary large value */
        }

        .mobile-dropdown-item {
            display: flex;
            align-items: center;
            padding: 0.75rem 0 0.75rem 1.5rem;
            font-size: 0.875rem;
            color: #6b7280;
            transition: color 0.2s ease-in-out;
        }

        .mobile-dropdown-item:hover {
            color: #2563eb;
        }

        /* Hamburger menu lines */
        .hamburger-line {
            display: block;
            width: 25px;
            height: 3px;
            background-color: #4b5563;
            margin: 5px 0;
            transition: all 0.3s ease-in-out;
        }
        
        .hamburger.active .hamburger-line:nth-child(1) {
            transform: rotate(45deg) translate(5px, 5px);
        }
        
        .hamburger.active .hamburger-line:nth-child(2) {
            opacity: 0;
        }
        
        .hamburger.active .hamburger-line:nth-child(3) {
            transform: rotate(-45deg) translate(5px, -5px);
        }