/* Custom CSS for Future AI - Dark Theme */

:root {
    --primary-color: #007bff;
    --primary-dark: #0056b3;
    --secondary-color: #6c757d;
    --dark-bg: #0a0a0a;
    --darker-bg: #000000;
    --card-bg: #1a1a1a;
    --border-color: #333333;
    --text-light: #e9ecef;
    --text-muted: #9ca3af;
    --gradient-primary: linear-gradient(135deg, #007bff 0%, #0056b3 100%);
    --gradient-dark: linear-gradient(135deg, #1a1a1a 0%, #000000 100%);
}

/* Global Styles */
* {
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), 
                opacity 0.3s cubic-bezier(0.4, 0, 0.2, 1), 
                background-color 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Smooth scrolling */
html {
    scroll-behavior: smooth;
}

/* Reduce motion for accessibility */
@media (prefers-reduced-motion: reduce) {
    * {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}

body {
    font-family: 'SF Pro Display', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
    background: var(--gradient-dark);
    color: var(--text-light);
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

/* Apple-style font */
.apple-font {
    font-family: 'SF Pro Display', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif !important;
    font-weight: 600;
    letter-spacing: -0.02em;
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'SF Pro Display', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
    font-weight: 600;
}

/* Custom Scrollbar */
::-webkit-scrollbar {
    width: 8px;
}

::-webkit-scrollbar-track {
    background: var(--dark-bg);
}

::-webkit-scrollbar-thumb {
    background: var(--primary-color);
    border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
    background: var(--primary-dark);
}

/* Navigation */
.custom-navbar {
    background: rgba(0, 0, 0, 0.95) !important;
    backdrop-filter: blur(10px);
    border-bottom: 1px solid var(--border-color);
    padding: 1rem 0;
}

.navbar-brand {
    font-family: 'SF Pro Display', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
    font-size: 1.5rem;
    color: var(--text-light) !important;
}

.navbar-nav .nav-link {
    color: var(--text-muted) !important;
    font-weight: 500;
    padding: 0.5rem 1rem !important;
    position: relative;
    border: 1px solid transparent;
    border-radius: var(--radius-lg);
    transition: color .2s ease, background .2s ease, box-shadow .25s ease, border-color .2s ease, transform .2s ease;
}

.navbar-nav .nav-link:hover {
    color: var(--primary-color) !important;
    transform: translateY(-2px);
}

.navbar-nav .nav-link::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 0;
    height: 2px;
    background: var(--gradient-primary);
    transition: all 0.3s ease;
    transform: translateX(-50%);
}

/* Disable underline effect to avoid conflict with blue box */
.navbar-nav .nav-link::after { display: none !important; }

/* Subtle glow/raise on hover for nav items */
.navbar-nav .nav-link:hover,
.navbar-nav .nav-link:focus-visible {
    color: var(--text-light) !important;
    background: rgba(0, 123, 255, 0.08);
    border-color: rgba(0, 123, 255, 0.35);
    box-shadow: var(--shadow-primary);
    transform: translateY(-2px);
}

/* Gradient sweep accent on hover */
.navbar-nav .nav-link::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: linear-gradient(90deg, transparent, rgba(0,123,255,0.18), transparent);
    opacity: 0;
    transform: translateY(4px);
    transition: opacity .25s ease, transform .25s ease;
    pointer-events: none;
}
.navbar-nav .nav-link:hover::before,
.navbar-nav .nav-link:focus-visible::before { opacity: 1; transform: translateY(0); }

/* Active nav link indicator with animation */
.navbar-nav .nav-link.active-link {
    color: var(--text-light) !important;
    font-weight: 600;
    background: rgba(0, 123, 255, 0.08);
    border: 1px solid rgba(0, 123, 255, 0.35);
    box-shadow: var(--shadow-primary);
}
/* No underline for active links */
.navbar-nav .nav-link.active-link::after { display: none !important; }

/* Signature blue effect for Our Missions toggle (keeps dropdown) */
#missionsDropdown.active-link {
    color: var(--text-light) !important;
    background: rgba(0, 123, 255, 0.10);
    border: 1px solid rgba(0, 123, 255, 0.4);
    box-shadow: var(--shadow-primary);
}

/* Caret color for dropdown toggle when active/hover */
#missionsDropdown.dropdown-toggle::after {
    transition: transform .2s ease, border-top-color .2s ease;
}
#missionsDropdown.active-link.dropdown-toggle::after {
    border-top-color: var(--primary-color);
}

/* Buttons */
.btn {
    border-radius: 8px;
    font-weight: 500;
    text-transform: none;
    transition: all 0.3s ease;
    border: none;
}

.btn-primary {
    background: var(--gradient-primary);
    color: white;
    box-shadow: 0 4px 15px rgba(0, 123, 255, 0.3);
}

.btn-primary:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(0, 123, 255, 0.4);
}

.btn-outline-primary {
    border: 2px solid var(--primary-color);
    color: var(--primary-color);
    background: transparent;
}

.btn-outline-primary:hover {
    background: var(--primary-color);
    color: white;
    transform: translateY(-2px);
}

.btn-outline-light {
    border: 2px solid var(--text-light);
    color: var(--text-light);
    background: transparent;
}

.btn-outline-light:hover {
    background: var(--text-light);
    color: var(--dark-bg);
    transform: translateY(-2px);
}

/* ===== CLEAN PROFESSIONAL HERO SECTION ===== */
.hero-section {
    background: linear-gradient(135deg, #0a0a0a 0%, #1a1a2e 50%, #16213e 100%);
    position: relative;
    overflow: hidden;
    min-height: 100vh;
    display: flex;
    align-items: center;
}

/* Subtle background pattern */
.hero-bg-effects {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    pointer-events: none;
    background: 
        radial-gradient(circle at 20% 20%, rgba(0, 123, 255, 0.03) 0%, transparent 50%),
        radial-gradient(circle at 80% 80%, rgba(0, 86, 179, 0.03) 0%, transparent 50%);
}

/* Clean grid pattern */
.neural-network {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: 
        linear-gradient(rgba(255, 255, 255, 0.02) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.02) 1px, transparent 1px);
    background-size: 50px 50px;
    opacity: 0.3;
}

/* Disabled glitchy effects */
.holographic-grid,
.particle-field,
.energy-waves {
    display: none;
}

/* Hero Content Styling */
.hero-content {
    position: relative;
    z-index: 10;
    animation: hero-slide-in 1.5s cubic-bezier(0.4, 0, 0.2, 1);
}

.hero-text-container {
    position: relative;
}

/* Advanced Title Animations */
.hero-title {
    position: relative;
    overflow: hidden;
}

.morphing-text {
    display: inline-block;
    background: linear-gradient(45deg, #007bff, #00d4ff, #ff6b6b, #4ecdc4, #45b7d1, #96ceb4, #feca57, #ff9ff3);
    background-size: 400% 400%;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    animation: morphing-gradient 8s ease infinite, text-glow 3s ease-in-out infinite alternate;
    position: relative;
}

.morphing-text::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(45deg, #007bff, #00d4ff, #ff6b6b, #4ecdc4);
    background-size: 400% 400%;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    animation: morphing-gradient 8s ease infinite reverse;
    opacity: 0.5;
    filter: blur(1px);
}

/* Advanced Typing Animation */
.typed-container {
    position: relative;
    display: inline-block;
}

.typed-word {
    background: linear-gradient(45deg, #007bff, #00d4ff, #ff6b6b, #4ecdc4);
    background-size: 400% 400%;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    animation: morphing-gradient 4s ease infinite;
}

.typing-cursor {
    display: inline-block;
    width: 3px;
    height: 1.2em;
    background: #007bff;
    animation: advanced-blink 1.5s infinite;
    margin-left: 2px;
    border-radius: 2px;
}

/* Hero Subtitle */
.hero-subtitle {
    position: relative;
    animation: subtitle-fade-in 2s ease-out 0.5s both;
    text-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
}

/* Hero CTA Buttons */
.hero-cta-container {
    animation: cta-slide-up 2s ease-out 1s both;
}

.hero-btn-primary {
    position: relative;
    overflow: hidden;
    background: linear-gradient(45deg, #007bff, #0056b3);
    border: none;
    box-shadow: 0 8px 25px rgba(0, 123, 255, 0.4);
    transition: all 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    animation: button-pulse 2s ease-in-out infinite;
}

.hero-btn-primary::before {
    display: none;
}

.hero-btn-primary:hover {
    transform: translateY(-3px) scale(1.05);
    box-shadow: 0 15px 35px rgba(0, 123, 255, 0.6);
    animation: none;
}

.hero-btn-secondary {
    position: relative;
    overflow: hidden;
    border: 2px solid rgba(255, 255, 255, 0.3);
    backdrop-filter: blur(10px);
    background: rgba(255, 255, 255, 0.1);
    transition: all 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.hero-btn-secondary::before {
    display: none;
}

.hero-btn-secondary:hover {
    transform: translateY(-3px) scale(1.05);
    border-color: rgba(0, 123, 255, 0.8);
    box-shadow: 0 15px 35px rgba(0, 123, 255, 0.3);
}

/* Advanced AI Visualization */
.hero-visual {
    position: relative;
    z-index: 10;
    animation: visual-slide-in 2s cubic-bezier(0.4, 0, 0.2, 1);
}

.advanced-ai-visualization {
    position: relative;
    width: 100%;
    height: 500px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.holographic-brain {
    position: relative;
    width: 300px;
    height: 300px;
    animation: brain-float 6s ease-in-out infinite;
}

.brain-core {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 120px;
    height: 120px;
    background: linear-gradient(45deg, #007bff, #00d4ff, #ff6b6b, #4ecdc4);
    background-size: 400% 400%;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    animation: morphing-gradient 8s ease infinite, core-pulse 2s ease-in-out infinite;
    box-shadow: 
        0 0 50px rgba(0, 123, 255, 0.6),
        inset 0 0 30px rgba(255, 255, 255, 0.2);
    z-index: 3;
}

.brain-core i {
    font-size: 3rem;
    color: white;
    animation: icon-spin 4s linear infinite;
    text-shadow: 0 0 20px rgba(0, 0, 0, 0.5);
}

/* Neural Connections */
.neural-connections {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.connection {
    position: absolute;
    background: linear-gradient(45deg, #007bff, #00d4ff);
    border-radius: 2px;
    animation: connection-pulse 3s ease-in-out infinite;
}

.connection-1 {
    top: 20%;
    left: 20%;
    width: 60px;
    height: 2px;
    transform: rotate(45deg);
    animation-delay: 0s;
}

.connection-2 {
    top: 20%;
    right: 20%;
    width: 60px;
    height: 2px;
    transform: rotate(-45deg);
    animation-delay: 0.5s;
}

.connection-3 {
    bottom: 20%;
    left: 20%;
    width: 60px;
    height: 2px;
    transform: rotate(-45deg);
    animation-delay: 1s;
}

.connection-4 {
    bottom: 20%;
    right: 20%;
    width: 60px;
    height: 2px;
    transform: rotate(45deg);
    animation-delay: 1.5s;
}

.connection-5 {
    top: 50%;
    left: 10%;
    width: 80px;
    height: 2px;
    transform: rotate(90deg);
    animation-delay: 2s;
}

.connection-6 {
    top: 50%;
    right: 10%;
    width: 80px;
    height: 2px;
    transform: rotate(90deg);
    animation-delay: 2.5s;
}

/* Data Streams */
.data-streams {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.stream {
    position: absolute;
    width: 2px;
    height: 100px;
    background: linear-gradient(to bottom, transparent, #007bff, transparent);
    animation: stream-flow 2s linear infinite;
}

.stream-1 {
    top: 10%;
    left: 30%;
    animation-delay: 0s;
}

.stream-2 {
    top: 10%;
    right: 30%;
    animation-delay: 0.7s;
}

.stream-3 {
    top: 10%;
    left: 50%;
    animation-delay: 1.4s;
}

/* Floating Elements */
.floating-elements {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.element {
    position: absolute;
    background: linear-gradient(45deg, #007bff, #00d4ff);
    color: white;
    padding: 8px 16px;
    border-radius: 20px;
    font-size: 0.9rem;
    font-weight: bold;
    animation: element-float 4s ease-in-out infinite;
    box-shadow: 0 4px 15px rgba(0, 123, 255, 0.4);
}

.element-1 {
    top: 15%;
    left: 10%;
    animation-delay: 0s;
}

.element-2 {
    top: 25%;
    right: 15%;
    animation-delay: 1s;
}

.element-3 {
    bottom: 25%;
    left: 15%;
    animation-delay: 2s;
}

.element-4 {
    bottom: 15%;
    right: 10%;
    animation-delay: 3s;
}

/* Holographic Overlay - Removed glitchy effects */
.holographic-overlay {
    display: none;
}

.gradient-text {
    background: var(--gradient-primary);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* Remove trailing spacing inside hero */
.hero-section .container { margin-bottom: 0; padding-bottom: 0; }
.hero-section .row { margin-bottom: 0; }

/* AI Cube Animation */
.ai-cube-container {
    position: relative;
    display: inline-block;
}

.ai-cube {
    animation: float 6s ease-in-out infinite;
    position: relative;
    z-index: 2;
}

.floating-particles {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 200px;
    height: 200px;
    transform: translate(-50%, -50%);
    opacity: 0.3;
}

.floating-particles::before,
.floating-particles::after {
    content: '';
    position: absolute;
    width: 4px;
    height: 4px;
    background: var(--primary-color);
    border-radius: 50%;
    animation: particle-float 8s infinite linear;
}

.floating-particles::before {
    top: 20%;
    left: 20%;
    animation-delay: -2s;
}

.floating-particles::after {
    bottom: 20%;
    right: 20%;
    animation-delay: -4s;
}

@keyframes float {
    0%, 100% { transform: translateY(0px); }
    50% { transform: translateY(-20px); }
}

@keyframes particle-float {
    0% { transform: translateY(0px) rotate(0deg); opacity: 0; }
    25% { opacity: 1; }
    75% { opacity: 1; }
    100% { transform: translateY(-100px) rotate(360deg); opacity: 0; }
}

/* Feature Cards */
.feature-card,
.value-card,
.product-card {
    background: var(--card-bg);
    border: 1px solid var(--border-color);
    border-radius: 12px;
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
}

.feature-card::before,
.value-card::before,
.product-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(0, 123, 255, 0.1), transparent);
    transition: left 0.5s ease;
}

.feature-card:hover::before,
.value-card:hover::before,
.product-card:hover::before {
    left: 100%;
}

.feature-card:hover,
.value-card:hover,
.product-card:hover {
    transform: translateY(-8px);
    border-color: var(--primary-color);
    box-shadow: 0 15px 35px rgba(0, 123, 255, 0.25);
    will-change: transform;
}

.feature-icon,
.value-icon,
.product-icon {
    transition: all 0.3s ease;
}

.feature-card:hover .feature-icon,
.value-card:hover .value-icon,
.product-card:hover .product-icon {
    transform: scale(1.1);
}

/* Stats Counter */
.stat-item {
    padding: 2rem 1rem;
}

.counter {
    font-family: 'Space Grotesk', sans-serif;
}

/* Page Headers */
.page-header {
    background: var(--gradient-dark);
    position: relative;
}

.page-header::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: radial-gradient(ellipse at center, rgba(0, 123, 255, 0.05) 0%, transparent 70%);
}

/* Executive Cards */
.executive-card {
    position: relative;
    padding: 2rem;
    background: var(--card-bg);
    border: 1px solid var(--border-color);
    border-radius: 12px;
    transition: all 0.3s ease;
}

.executive-image {
    position: relative;
    width: 200px;
    height: 200px;
    margin: 0 auto;
    overflow: hidden;
    border-radius: 50%;
}

.executive-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: all 0.3s ease;
}

.executive-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 123, 255, 0.9);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: all 0.3s ease;
    border-radius: 50%;
}

.executive-card:hover .executive-overlay {
    opacity: 1;
}

.executive-card:hover {
    transform: translateY(-8px);
    border-color: var(--primary-color);
    box-shadow: 0 20px 45px rgba(0, 123, 255, 0.25);
    will-change: transform;
}

.social-links a {
    display: inline-block;
    width: 40px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.2);
    transition: all 0.3s ease;
}

.social-links a:hover {
    background: rgba(255, 255, 255, 0.3);
    transform: scale(1.1);
}

/* Executive Placeholders */
.add-executive-placeholder {
    padding: 3rem 2rem;
    background: var(--card-bg);
    border: 2px dashed var(--border-color);
    border-radius: 12px;
    transition: all 0.3s ease;
}

.add-executive-placeholder:hover {
    border-color: var(--primary-color);
    background: rgba(0, 123, 255, 0.05);
}

/* Contact Form */
.contact-form {
    background: var(--card-bg);
    padding: 3rem;
    border-radius: 12px;
    border: 1px solid var(--border-color);
}

.form-control {
    background: var(--dark-bg);
    border: 1px solid var(--border-color);
    color: var(--text-light);
    border-radius: 8px;
    padding: 0.75rem 1rem;
}

.form-control:focus {
    background: var(--dark-bg);
    border-color: var(--primary-color);
    color: var(--text-light);
    box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
}

.form-label {
    color: var(--text-light);
    font-weight: 500;
    margin-bottom: 0.5rem;
}

.form-select {
    background: var(--dark-bg);
    border: 1px solid var(--border-color);
    color: var(--text-light);
}

.form-select:focus {
    background: var(--dark-bg);
    border-color: var(--primary-color);
    color: var(--text-light);
    box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
}

/* Contact Info */
.contact-info {
    background: var(--card-bg);
    padding: 3rem;
    border-radius: 12px;
    border: 1px solid var(--border-color);
    height: fit-content;
}

.contact-item {
    padding: 1.5rem 0;
    border-bottom: 1px solid var(--border-color);
}

.contact-item:last-child {
    border-bottom: none;
}

.contact-icon {
    width: 40px;
    height: 40px;
    background: rgba(0, 123, 255, 0.1);
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Office Cards */
.office-card {
    background: var(--card-bg);
    border: 1px solid var(--border-color);
    border-radius: 12px;
    transition: all 0.3s ease;
}

.office-card:hover {
    transform: translateY(-5px);
    border-color: var(--primary-color);
}

/* Category Items */
.category-item {
    background: var(--card-bg);
    border: 1px solid var(--border-color);
    border-radius: 12px;
    transition: all 0.3s ease;
}

.category-item:hover {
    transform: translateY(-5px);
    border-color: var(--primary-color);
    background: rgba(0, 123, 255, 0.05);
}

/* Tech Items */
.tech-item {
    transition: all 0.3s ease;
}

.tech-item:hover {
    transform: translateY(-5px);
}

.tech-item:hover i {
    transform: scale(1.2);
}

/* Animations */
.fade-in {
    animation: fadeIn 1s ease-out;
}

.slide-in-right {
    animation: slideInRight 1s ease-out;
}

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes slideInRight {
    from {
        opacity: 0;
        transform: translateX(50px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

/* Responsive Design */
@media (max-width: 768px) {
    .hero-section {
        padding: 3rem 0;
    }
    
    .display-3 {
        font-size: 2.5rem;
    }
    
    .display-4 {
        font-size: 2rem;
    }
    
    .display-5 {
        font-size: 1.75rem;
    }
    
    .contact-form,
    .contact-info {
        padding: 2rem;
    }
    
    .executive-image {
        width: 150px;
        height: 150px;
    }
}

/* Bootstrap Dark Theme Overrides */
.bg-dark {
    background-color: var(--card-bg) !important;
}

.bg-black {
    background-color: var(--darker-bg) !important;
}

.text-muted {
    color: var(--text-muted) !important;
}

.border-secondary {
    border-color: var(--border-color) !important;
}

/* Badge Styling */
.badge {
    border-radius: 20px;
    padding: 0.5em 1em;
    font-weight: 500;
}

.badge.bg-primary {
    background: var(--gradient-primary) !important;
}

/* Enhanced Animation Classes */
.navbar-scrolled {
    background: rgba(0, 0, 0, 0.98) !important;
    box-shadow: 0 2px 20px rgba(0, 123, 255, 0.2) !important;
    backdrop-filter: blur(15px);
}

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

.reveal-on-scroll.revealed {
    opacity: 1;
    transform: translateY(0);
}

/* Staggered reveal animation */
.stagger-animation {
    opacity: 0;
    transform: translateY(20px) scale(0.95);
    transition: all 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}

.stagger-animation.animate-in {
    opacity: 1;
    transform: translateY(0) scale(1);
}

/* Floating animation for icons */
@keyframes float-gentle {
    0%, 100% { transform: translateY(0px) rotate(0deg); }
    33% { transform: translateY(-8px) rotate(2deg); }
    66% { transform: translateY(8px) rotate(-2deg); }
}

.floating-icon {
    animation: float-gentle 4s ease-in-out infinite;
}

/* Pulse animation for CTA buttons */
@keyframes pulse-glow {
    0%, 100% { box-shadow: none; }
    50% { box-shadow: none; }
}

.btn-primary:not(:disabled):not(.disabled) {
    animation: pulse-glow 3s ease-in-out infinite;
}

.btn-primary:hover {
    animation: none;
}

/* Text gradient animation */
@keyframes gradient-shift {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

/* ===== ADVANCED HERO ANIMATIONS ===== */

/* Background Effects */
@keyframes neural-pulse {
    0%, 100% { opacity: 0.3; transform: scale(1); }
    50% { opacity: 0.6; transform: scale(1.1); }
}

@keyframes grid-move {
    0% { transform: translate(0, 0); }
    100% { transform: translate(50px, 50px); }
}

@keyframes particle-drift {
    0% { transform: translate(0, 0); }
    100% { transform: translate(-200px, -200px); }
}

@keyframes energy-pulse {
    0%, 100% { opacity: 0.1; transform: scale(1); }
    50% { opacity: 0.3; transform: scale(1.2); }
}

/* Hero Content Animations */
@keyframes hero-slide-in {
    0% { 
        opacity: 0; 
        transform: translateX(-100px) translateY(50px); 
    }
    100% { 
        opacity: 1; 
        transform: translateX(0) translateY(0); 
    }
}

@keyframes morphing-gradient {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

@keyframes text-glow {
    0%, 100% { text-shadow: none; }
}

@keyframes advanced-blink {
    0%, 50% { opacity: 1; }
    51%, 100% { opacity: 0; }
}

@keyframes cursor-glow {
    0%, 100% { box-shadow: none; }
}

@keyframes subtitle-fade-in {
    0% { 
        opacity: 0; 
        transform: translateY(30px); 
    }
    100% { 
        opacity: 1; 
        transform: translateY(0); 
    }
}

@keyframes cta-slide-up {
    0% { 
        opacity: 0; 
        transform: translateY(50px); 
    }
    100% { 
        opacity: 1; 
        transform: translateY(0); 
    }
}

@keyframes button-pulse {
    0%, 100% { 
        transform: scale(1); 
    }
    50% { 
        transform: scale(1.02); 
    }
}

/* AI Visualization Animations */
@keyframes visual-slide-in {
    0% { 
        opacity: 0; 
        transform: translateX(100px) translateY(50px) rotateY(45deg); 
    }
    100% { 
        opacity: 1; 
        transform: translateX(0) translateY(0) rotateY(0deg); 
    }
}

@keyframes brain-float {
    0%, 100% { transform: translateY(0px) rotateZ(0deg); }
    25% { transform: translateY(-20px) rotateZ(2deg); }
    50% { transform: translateY(-10px) rotateZ(0deg); }
    75% { transform: translateY(-30px) rotateZ(-2deg); }
}

@keyframes core-pulse {
    0%, 100% { 
        transform: translate(-50%, -50%) scale(1); 
        box-shadow: 
            0 0 50px rgba(0, 123, 255, 0.6),
            inset 0 0 30px rgba(255, 255, 255, 0.2);
    }
    50% { 
        transform: translate(-50%, -50%) scale(1.1); 
        box-shadow: 
            0 0 80px rgba(0, 123, 255, 0.8),
            inset 0 0 50px rgba(255, 255, 255, 0.4);
    }
}

@keyframes icon-spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

@keyframes connection-pulse {
    0%, 100% { 
        opacity: 0.3; 
        transform: scaleX(1); 
    }
    50% { 
        opacity: 1; 
        transform: scaleX(1.2); 
    }
}

@keyframes stream-flow {
    0% { 
        transform: translateY(-100px); 
        opacity: 0; 
    }
    10% { opacity: 1; }
    90% { opacity: 1; }
    100% { 
        transform: translateY(400px); 
        opacity: 0; 
    }
}

@keyframes element-float {
    0%, 100% { 
        transform: translateY(0px) rotateZ(0deg); 
        opacity: 0.7; 
    }
    25% { 
        transform: translateY(-15px) rotateZ(5deg); 
        opacity: 1; 
    }
    50% { 
        transform: translateY(-10px) rotateZ(0deg); 
        opacity: 0.8; 
    }
    75% { 
        transform: translateY(-25px) rotateZ(-5deg); 
        opacity: 1; 
    }
}

@keyframes overlay-pulse {
    0%, 100% { opacity: 0.1; }
    50% { opacity: 0.3; }
}

/* ===== UNIFIED PROFESSIONAL ANIMATIONS ===== */

/* Single, clean reveal animation for all elements - Much faster */
.reveal-on-scroll,
.stagger-reveal,
.slide-in-left,
.slide-in-right,
.slide-in-up,
.scale-rotate-reveal,
.blur-reveal,
.glitch-reveal,
.morph-reveal,
.flip-reveal,
.wave-reveal,
.neon-reveal,
.holographic-reveal,
.particle-burst-reveal {
    opacity: 0;
    transform: translateY(20px);
    transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.reveal-on-scroll.animate-in,
.stagger-reveal.animate-in,
.slide-in-left.animate-in,
.slide-in-right.animate-in,
.slide-in-up.animate-in,
.scale-rotate-reveal.animate-in,
.blur-reveal.animate-in,
.glitch-reveal.animate-in,
.morph-reveal.animate-in,
.flip-reveal.animate-in,
.wave-reveal.animate-in,
.neon-reveal.animate-in,
.holographic-reveal.animate-in,
.particle-burst-reveal.animate-in {
    opacity: 1;
    transform: translateY(0);
}

/* All individual animation classes now use the unified style above */

/* ===== UNIFIED HOVER EFFECTS ===== */

/* Clean, professional hover effect for all interactive elements - Snappier */
.magnetic-hover,
.glassmorphism,
.liquid-morph {
    transition: all 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    background: rgba(255, 255, 255, 0.05);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.1);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
}

.magnetic-hover:hover,
.glassmorphism:hover,
.liquid-morph:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.15);
    background: rgba(255, 255, 255, 0.08);
}

/* ===== FLOATING AI ELEMENTS ===== */
.floating-ai-elements {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
}

.ai-element {
    position: absolute;
    background: linear-gradient(45deg, #007bff, #00d4ff);
    color: white;
    padding: 8px 16px;
    border-radius: 20px;
    font-size: 0.9rem;
    font-weight: bold;
    animation: ai-float 6s ease-in-out infinite;
    box-shadow: 0 4px 15px rgba(0, 123, 255, 0.4);
    z-index: 2;
}

.ai-element.element-1 {
    top: 10%;
    left: 5%;
    animation-delay: 0s;
}

.ai-element.element-2 {
    top: 20%;
    right: 10%;
    animation-delay: 1.5s;
}

.ai-element.element-3 {
    bottom: 20%;
    left: 10%;
    animation-delay: 3s;
}

.ai-element.element-4 {
    bottom: 10%;
    right: 5%;
    animation-delay: 4.5s;
}

@keyframes ai-float {
    0%, 100% { 
        transform: translateY(0px) rotateZ(0deg) scale(1); 
        opacity: 0.7; 
    }
    25% { 
        transform: translateY(-20px) rotateZ(5deg) scale(1.1); 
        opacity: 1; 
    }
    50% { 
        transform: translateY(-10px) rotateZ(0deg) scale(0.9); 
        opacity: 0.8; 
    }
    75% { 
        transform: translateY(-30px) rotateZ(-5deg) scale(1.05); 
        opacity: 1; 
    }
}

/* ===== ENERGY RINGS ===== */
.energy-rings {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 200px;
    height: 200px;
    pointer-events: none;
}

.ring {
    position: absolute;
    border: 2px solid rgba(0, 123, 255, 0.3);
    border-radius: 50%;
    animation: ring-pulse 4s ease-in-out infinite;
}

.ring-1 {
    width: 120px;
    height: 120px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    animation-delay: 0s;
}

.ring-2 {
    width: 160px;
    height: 160px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    animation-delay: 1.3s;
}

.ring-3 {
    width: 200px;
    height: 200px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    animation-delay: 2.6s;
}

@keyframes ring-pulse {
    0%, 100% { 
        opacity: 0.3; 
        transform: translate(-50%, -50%) scale(1); 
    }
    50% { 
        opacity: 0.8; 
        transform: translate(-50%, -50%) scale(1.1); 
    }
}

/* ===== IMAGE OVERLAY EFFECTS - Removed blue overlays ===== */
.image-overlay {
    display: none;
}

.overlay-content {
    display: none;
}

/* ===== SUSTAINABILITY VISUAL EFFECTS ===== */
.sustainability-visual {
    position: relative;
    width: 300px;
    height: 300px;
    margin: 0 auto;
}

.leaf-icon {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 3;
}

.eco-particles {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
}

.particle {
    position: absolute;
    font-size: 2rem;
    animation: eco-float 8s ease-in-out infinite;
    z-index: 2;
}

.particle-1 {
    top: 15%;
    left: 20%;
    animation-delay: 0s;
}

.particle-2 {
    top: 25%;
    right: 15%;
    animation-delay: 2s;
}

.particle-3 {
    bottom: 25%;
    left: 15%;
    animation-delay: 4s;
}

.particle-4 {
    bottom: 15%;
    right: 20%;
    animation-delay: 6s;
}

@keyframes eco-float {
    0%, 100% { 
        transform: translateY(0px) rotateZ(0deg) scale(1); 
        opacity: 0.7; 
    }
    25% { 
        transform: translateY(-25px) rotateZ(10deg) scale(1.2); 
        opacity: 1; 
    }
    50% { 
        transform: translateY(-15px) rotateZ(0deg) scale(0.8); 
        opacity: 0.8; 
    }
    75% { 
        transform: translateY(-35px) rotateZ(-10deg) scale(1.1); 
        opacity: 1; 
    }
}

.eco-rings {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 250px;
    height: 250px;
    pointer-events: none;
}

.eco-ring {
    position: absolute;
    border: 2px solid rgba(34, 197, 94, 0.3);
    border-radius: 50%;
    animation: eco-ring-pulse 6s ease-in-out infinite;
}

.eco-ring.ring-1 {
    width: 100px;
    height: 100px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    animation-delay: 0s;
}

.eco-ring.ring-2 {
    width: 150px;
    height: 150px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    animation-delay: 2s;
}

.eco-ring.ring-3 {
    width: 200px;
    height: 200px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    animation-delay: 4s;
}

@keyframes eco-ring-pulse {
    0%, 100% { 
        opacity: 0.2; 
        transform: translate(-50%, -50%) scale(1); 
    }
    50% { 
        opacity: 0.6; 
        transform: translate(-50%, -50%) scale(1.15); 
    }
}

.animated-gradient {
    background: linear-gradient(-45deg, #007bff, #0056b3, #20c997, #007bff);
    background-size: 400% 400%;
    animation: gradient-shift 8s ease infinite;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* Loading shimmer effect */
@keyframes shimmer {
    0% { transform: translateX(-100%); }
    100% { transform: translateX(100%); }
}

.shimmer::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.1), transparent);
    transform: translateX(-100%);
    animation: shimmer 2s infinite;
}

/* Enhanced card animations */
.mission-card {
    background: var(--card-bg);
    border: 1px solid var(--border-color);
    border-radius: 15px;
    padding: 2rem;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    overflow: hidden;
}

.mission-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(135deg, rgba(0, 123, 255, 0.05), transparent);
    opacity: 0;
    transition: opacity 0.4s ease;
}

.mission-card:hover::before {
    opacity: 1;
}

.mission-card:hover {
    transform: translateY(-12px) rotateX(5deg);
    border-color: var(--primary-color);
    box-shadow: 0 25px 50px rgba(0, 123, 255, 0.3);
}

/* ===== Global Hover Utilities for bolder interactions ===== */
.hover-rise {
    transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease;
}
.hover-rise:hover {
    transform: translateY(-8px);
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.5);
}

.hover-border-primary { transition: border-color .3s ease; }
.hover-border-primary:hover { border-color: var(--primary-color) !important; }

.hover-glow-primary { transition: box-shadow .3s ease; }
.hover-glow-primary:hover { box-shadow: var(--shadow-primary); }

.hover-tilt {
    transition: transform .25s cubic-bezier(0.4, 0, 0.2, 1);
    transform-style: preserve-3d;
}
.hover-tilt:hover {
    transform: perspective(800px) rotateX(3deg) rotateY(-3deg) translateY(-6px);
}

.hover-scale-sm { transition: transform .25s ease; }
.hover-scale-sm:hover { transform: scale(1.025); }

.hover-bg-primary-10:hover { background: rgba(0, 123, 255, 0.10) !important; }
.hover-bg-card-raise:hover { background: rgba(255,255,255,0.02); }

/* Link underline grow on hover for inline links */
.link-underline {
    position: relative;
}
.link-underline::after {
    content: '';
    position: absolute;
    left: 0; bottom: -2px;
    width: 0; height: 2px;
    background: var(--gradient-primary);
    transition: width .25s ease;
}
.link-underline:hover::after { width: 100%; }

/* Icon lift */
.icon-lift i { transition: transform .25s ease; }
.icon-lift:hover i { transform: translateY(-3px) scale(1.08); }

/* List group item hover */
.list-hover-contrast .list-group-item {
    transition: background .2s ease, color .2s ease;
}
.list-hover-contrast .list-group-item:hover {
    background: rgba(255,255,255,0.04);
    color: var(--text-light);
}

/* Icon rotation on hover */
.rotating-icon {
    transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.mission-card:hover .rotating-icon {
    transform: rotate(360deg) scale(1.1);
}

/* AI Projects Layout */
.project-content {
    padding: 2rem 0;
}

.project-icon {
    width: 60px;
    height: 60px;
    background: linear-gradient(135deg, var(--primary-color), var(--primary-dark));
    border-radius: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 8px 25px rgba(0, 123, 255, 0.3);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.project-icon:hover {
    transform: translateY(-3px) scale(1.05);
    box-shadow: 0 12px 35px rgba(0, 123, 255, 0.4);
}

.project-image-container {
    position: relative;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.project-image-container:hover {
    transform: translateY(-8px);
    box-shadow: 0 30px 60px rgba(0, 0, 0, 0.4);
}

.project-image {
    width: 100%;
    height: 400px;
    object-fit: cover;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.project-image-container:hover .project-image {
    transform: scale(1.05);
}

.project-details {
    margin-top: 1.5rem;
}

.project-details .d-flex {
    margin-bottom: 0.5rem;
}

.project-details i {
    width: 20px;
    text-align: center;
}

/* Responsive adjustments for projects */
@media (max-width: 991.98px) {
    .project-content {
        padding: 1.5rem 0;
        text-align: center;
    }
    
    .project-icon {
        margin: 0 auto 1rem;
    }
    
    .project-image {
        height: 300px;
    }
}

@media (max-width: 767.98px) {
    .project-image {
        height: 250px;
    }
    
    .project-details .row .col-sm-6 {
        margin-bottom: 0.5rem;
    }
}

/* Enhanced Product Cards */
.product-card-enhanced {
    background: var(--card-bg);
    border: 1px solid var(--border-color);
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
}

.product-card-enhanced::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(135deg, rgba(0, 123, 255, 0.1), rgba(0, 86, 179, 0.05));
    opacity: 0;
    transition: opacity 0.3s ease;
    pointer-events: none;
}

.product-card-enhanced:hover::before {
    opacity: 1;
}

.product-card-enhanced:hover {
    transform: translateY(-8px);
    border-color: var(--primary-color);
    box-shadow: 0 20px 50px rgba(0, 123, 255, 0.2);
}

.product-card-enhanced .product-image-container {
    position: relative;
    overflow: hidden;
    height: 100%;
    min-height: 200px;
}

.product-card-enhanced .product-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.product-card-enhanced:hover .product-image {
    transform: scale(1.05);
}

.product-card-enhanced .product-content {
    padding: 2rem;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
}

.product-card-enhanced .product-icon {
    width: 50px;
    height: 50px;
    background: linear-gradient(135deg, var(--primary-color), var(--primary-dark));
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 15px rgba(0, 123, 255, 0.3);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.product-card-enhanced:hover .product-icon {
    transform: translateY(-2px) scale(1.05);
    box-shadow: 0 8px 25px rgba(0, 123, 255, 0.4);
}

.product-card-enhanced .product-features {
    margin: 1.5rem 0;
}

.product-card-enhanced .product-features .d-flex {
    margin-bottom: 0.75rem;
}

.product-card-enhanced .product-features i {
    width: 20px;
    text-align: center;
    flex-shrink: 0;
}

.product-card-enhanced .product-pricing {
    font-size: 1.1rem;
}

/* Responsive adjustments for enhanced products */
@media (max-width: 991.98px) {
    .product-card-enhanced .product-content {
        padding: 1.5rem;
    }
    
    .product-card-enhanced .row {
        flex-direction: column;
    }
    
    .product-card-enhanced .col-md-4 {
        order: -1;
    }
    
    .product-card-enhanced .product-image-container {
        min-height: 250px;
    }
}

@media (max-width: 767.98px) {
    .product-card-enhanced .product-content {
        padding: 1.25rem;
    }
    
    .product-card-enhanced .product-image-container {
        min-height: 200px;
    }
    
    .product-card-enhanced .product-features .row .col-sm-6 {
        margin-bottom: 0.5rem;
    }
    
}

/* Typed container for positioning */
.typed-container {
    position: relative;
    display: inline-block;
    min-width: 120px;
}

/* Typed Word Effect - Only the changing word */
.typed-word {
    color: #888;
    font-weight: 700;
    display: inline-block;
    text-align: left;
}

/* Typing Cursor Animation - Fluid positioning */
.typing-cursor {
    display: inline-block;
    background-color: #888;
    width: 4px;
    height: 1.1em;
    animation: blink 1.2s infinite;
    color: transparent;
    position: absolute;
    left: 0;
    top: 0;
    transition: none;
    vertical-align: top;
    font-weight: 700;
}

@keyframes blink {
    0%, 50% { opacity: 1; }
    51%, 100% { opacity: 0; }
}

/* Typed text animation */
.typed-text {
    overflow: hidden;
    display: inline-block;
}

@keyframes type {
    from { width: 0; }
    to { width: 100%; }
}

@keyframes delete {
    from { width: 100%; }
    to { width: 0; }
}

/* Apple-style smooth animations */
.apple-font * {
    transition: all 0.3s cubic-bezier(0.4, 0.0, 0.2, 1);
}

/* ===== Enhanced Theme Additions (rounded corners, shadows, navbar/menu) ===== */
:root {
    --radius-sm: 8px;
    --radius-md: 12px;
    --radius-lg: 16px;
    --radius-xl: 24px;
    --shadow-sm: 0 6px 18px rgba(0, 0, 0, 0.35);
    --shadow-md: 0 12px 30px rgba(0, 0, 0, 0.45);
    --shadow-primary: 0 18px 45px rgba(0, 123, 255, 0.28);
}

/* Navbar enhancements */
.custom-navbar {
    box-shadow: var(--shadow-sm);
}
.navbar .navbar-nav {
    gap: 0.25rem;
    background: rgba(255, 255, 255, 0.02);
    padding: 0.25rem;
    border-radius: var(--radius-xl);
    border: 1px solid rgba(255, 255, 255, 0.04);
}
.navbar-nav .nav-link {
    border-radius: var(--radius-lg);
}

/* Dropdown styling */
.dropdown-menu {
    border-radius: var(--radius-lg) !important;
    border: 1px solid var(--border-color) !important;
    background: rgba(10, 10, 10, 0.98) !important;
    box-shadow: var(--shadow-md);
    overflow: hidden;
}
.dropdown-menu { opacity: 0; transform: translateY(8px); transition: opacity .2s ease, transform .2s ease; }
.dropdown.show .dropdown-menu, .dropdown-menu.show { opacity: 1; transform: translateY(0); }
.dropdown-item {
    padding: 0.6rem 1rem;
    border-radius: var(--radius-md);
}
.dropdown-item:hover {
    background: rgba(0, 123, 255, 0.08) !important;
    color: var(--text-light) !important;
}

/* Rounded and shadow utilities */
.rounded-xl { border-radius: var(--radius-xl) !important; }
.rounded-lg { border-radius: var(--radius-lg) !important; }
.shadow-primary { box-shadow: var(--shadow-primary) !important; }
.glass {
    background: rgba(255, 255, 255, 0.03) !important;
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.06) !important;
}

/* Elevated radii overrides */
.btn { border-radius: var(--radius-lg); }
.feature-card, .value-card, .product-card { border-radius: var(--radius-xl); }
.executive-card { border-radius: var(--radius-xl); }
.contact-form { border-radius: var(--radius-xl); }
.form-control { border-radius: var(--radius-md); }
.contact-info { border-radius: var(--radius-xl); }
.office-card { border-radius: var(--radius-xl); }
.category-item { border-radius: var(--radius-xl); }

/* Mobile navbar sheet style */
@media (max-width: 991.98px) {
    .navbar .collapse {
        background: rgba(10, 10, 10, 0.98);
        border-top: 1px solid var(--border-color);
        padding: 0.75rem 1rem;
        border-bottom-left-radius: var(--radius-xl);
        border-bottom-right-radius: var(--radius-xl);
        box-shadow: var(--shadow-md);
    }
    .navbar .navbar-nav { background: transparent; border: 0; padding: 0; gap: 0; }
    .navbar-nav .nav-link { padding: 0.75rem 0.85rem !important; }
}

/* Hover to open dropdowns on desktop */
@media (min-width: 992px) {
    .navbar .dropdown:hover > .dropdown-menu {
        display: block;
        opacity: 1;
        transform: translateY(0);
    }
}

/* ========================================
   ENHANCED HERO ANIMATIONS & EFFECTS
   ======================================== */

/* Floating Particles */
.floating-particles {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 1;
}

.particle {
    position: absolute;
    width: 4px;
    height: 4px;
    background: linear-gradient(45deg, #007bff, #00d4ff);
    border-radius: 50%;
    animation: particle-float 8s infinite linear;
    opacity: 0.6;
}

.particle:nth-child(1) { top: 20%; left: 10%; animation-delay: 0s; animation-duration: 6s; }
.particle:nth-child(2) { top: 40%; left: 20%; animation-delay: 1s; animation-duration: 8s; }
.particle:nth-child(3) { top: 60%; left: 15%; animation-delay: 2s; animation-duration: 7s; }
.particle:nth-child(4) { top: 30%; left: 80%; animation-delay: 3s; animation-duration: 9s; }
.particle:nth-child(5) { top: 70%; left: 85%; animation-delay: 4s; animation-duration: 6s; }
.particle:nth-child(6) { top: 50%; left: 90%; animation-delay: 5s; animation-duration: 8s; }
.particle:nth-child(7) { top: 80%; left: 30%; animation-delay: 6s; animation-duration: 7s; }
.particle:nth-child(8) { top: 10%; left: 70%; animation-delay: 7s; animation-duration: 9s; }

@keyframes particle-float {
    0% {
        transform: translateY(100vh) translateX(0) rotate(0deg);
        opacity: 0;
    }
    10% {
        opacity: 0.6;
    }
    90% {
        opacity: 0.6;
    }
    100% {
        transform: translateY(-100px) translateX(50px) rotate(360deg);
        opacity: 0;
    }
}

/* Data Streams */
.data-streams {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 1;
}

.stream {
    position: absolute;
    width: 2px;
    height: 100px;
    background: linear-gradient(to bottom, transparent, #007bff, transparent);
    animation: stream-flow 4s infinite linear;
    opacity: 0.4;
}

.stream:nth-child(1) { left: 20%; top: -100px; animation-delay: 0s; }
.stream:nth-child(2) { left: 60%; top: -100px; animation-delay: 1.5s; }
.stream:nth-child(3) { left: 80%; top: -100px; animation-delay: 3s; }

@keyframes stream-flow {
    0% {
        transform: translateY(0);
        opacity: 0;
    }
    50% {
        opacity: 0.4;
    }
    100% {
        transform: translateY(100vh);
        opacity: 0;
    }
}

/* ========================================
   TECHNOLOGY SHOWCASE STYLES
   ======================================== */

.tech-card {
    background: rgba(255, 255, 255, 0.03);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: var(--radius-xl);
    padding: 2rem;
    text-align: center;
    transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    position: relative;
    overflow: hidden;
}

.tech-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(0, 123, 255, 0.1), transparent);
    transition: left 0.5s;
}

.tech-card:hover::before {
    left: 100%;
}

.tech-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 40px rgba(0, 123, 255, 0.15);
    border-color: rgba(0, 123, 255, 0.2);
}

.tech-icon {
    width: 80px;
    height: 80px;
    margin: 0 auto 1.5rem;
    background: linear-gradient(135deg, #007bff, #00d4ff);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2rem;
    color: white;
    animation: tech-pulse 3s infinite;
}

@keyframes tech-pulse {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.05); }
}

.tech-progress {
    margin-top: 1.5rem;
}

.progress-bar {
    width: 100%;
    height: 6px;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 3px;
    overflow: hidden;
    position: relative;
}

.progress-bar::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    background: linear-gradient(90deg, #007bff, #00d4ff);
    border-radius: 3px;
    width: 0;
    transition: width 2s ease-out;
    animation: progress-glow 2s infinite;
}

@keyframes progress-glow {
    0%, 100% { box-shadow: 0 0 5px rgba(0, 123, 255, 0.5); }
    50% { box-shadow: 0 0 20px rgba(0, 123, 255, 0.8); }
}

.progress-text {
    display: block;
    margin-top: 0.5rem;
    font-size: 0.9rem;
    color: var(--text-muted);
    font-weight: 500;
}

/* ========================================
   TESTIMONIALS STYLES
   ======================================== */

.testimonial-card {
    background: rgba(255, 255, 255, 0.03);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: var(--radius-xl);
    padding: 2rem;
    transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    position: relative;
    height: 100%;
}

.testimonial-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 30px rgba(0, 123, 255, 0.1);
    border-color: rgba(0, 123, 255, 0.15);
}

.testimonial-content {
    position: relative;
    z-index: 2;
}

.quote-icon {
    font-size: 2rem;
    color: #007bff;
    margin-bottom: 1rem;
    opacity: 0.7;
}

.testimonial-text {
    font-style: italic;
    font-size: 1.1rem;
    line-height: 1.6;
    margin-bottom: 1.5rem;
    color: var(--text-light);
}

.testimonial-author {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.author-info h6 {
    color: var(--text-light);
    margin: 0;
}

.author-info small {
    color: var(--text-muted);
}

/* ========================================
   ENHANCED FLOATING ICONS
   ======================================== */

.floating-icon {
    animation: float-gentle 3s ease-in-out infinite;
}

@keyframes float-gentle {
    0%, 100% { transform: translateY(0px); }
    50% { transform: translateY(-10px); }
}

/* ========================================
   ENHANCED SCROLL ANIMATIONS
   ======================================== */

.reveal-on-scroll {
    opacity: 0;
    transform: translateY(30px);
    transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.reveal-on-scroll.animate-in {
    opacity: 1;
    transform: translateY(0);
}

.stagger-animation {
    opacity: 0;
    transform: translateY(20px);
    transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.stagger-animation.animate-in {
    opacity: 1;
    transform: translateY(0);
}

/* ========================================
   ENHANCED HOVER EFFECTS
   ======================================== */

.magnetic-hover {
    transition: all 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.magnetic-hover:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 30px rgba(0, 123, 255, 0.15);
}

.glassmorphism {
    background: rgba(255, 255, 255, 0.05);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.1);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
}

.glassmorphism:hover {
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(0, 123, 255, 0.2);
}

/* ========================================
   MORPHING TEXT ENHANCEMENT
   ======================================== */

.morphing-text {
    background: linear-gradient(45deg, #007bff, #00d4ff, #ff6b6b, #4ecdc4, #45b7d1, #96ceb4, #feca57, #ff9ff3);
    background-size: 400% 400%;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    animation: morphing-gradient 4s ease-in-out infinite;
}

@keyframes morphing-gradient {
    0%, 100% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
}

/* ========================================
   TIMELINE STYLES
   ======================================== */

.timeline {
    position: relative;
    max-width: 800px;
    margin: 0 auto;
}

.timeline::before {
    content: '';
    position: absolute;
    left: 50%;
    top: 0;
    bottom: 0;
    width: 2px;
    background: linear-gradient(to bottom, #007bff, #00d4ff);
    transform: translateX(-50%);
}

.timeline-item {
    position: relative;
    margin-bottom: 3rem;
    display: flex;
    align-items: center;
}

.timeline-item:nth-child(odd) {
    flex-direction: row-reverse;
}

.timeline-item:nth-child(odd) .timeline-content {
    text-align: right;
    margin-right: 2rem;
}

.timeline-item:nth-child(even) .timeline-content {
    text-align: left;
    margin-left: 2rem;
}

.timeline-marker {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    width: 60px;
    height: 60px;
    background: linear-gradient(135deg, #007bff, #00d4ff);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    color: white;
    z-index: 2;
    box-shadow: 0 4px 20px rgba(0, 123, 255, 0.3);
    animation: timeline-pulse 3s infinite;
}

@keyframes timeline-pulse {
    0%, 100% { transform: translateX(-50%) scale(1); }
    50% { transform: translateX(-50%) scale(1.1); }
}

.timeline-content {
    background: rgba(255, 255, 255, 0.03);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: var(--radius-xl);
    padding: 1.5rem;
    max-width: 300px;
    transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.timeline-content:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 30px rgba(0, 123, 255, 0.1);
    border-color: rgba(0, 123, 255, 0.2);
}

/* ========================================
   LEADER CARD STYLES
   ======================================== */

.leader-card {
    background: rgba(255, 255, 255, 0.03);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: var(--radius-xl);
    padding: 1.5rem;
    text-align: center;
    transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    height: 100%;
}

.leader-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 15px 40px rgba(0, 123, 255, 0.15);
    border-color: rgba(0, 123, 255, 0.2);
}

.leader-image {
    margin-bottom: 1rem;
}

.leader-placeholder {
    width: 80px;
    height: 80px;
    background: linear-gradient(135deg, #007bff, #00d4ff);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2rem;
    color: white;
    margin: 0 auto;
    animation: leader-pulse 3s infinite;
}

@keyframes leader-pulse {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.05); }
}

.leader-info h5 {
    color: var(--text-light);
    margin-bottom: 0.5rem;
}

.leader-info .text-primary {
    font-weight: 600;
}

/* ========================================
   ENHANCED TECH ITEM STYLES
   ======================================== */

.tech-item {
    background: rgba(255, 255, 255, 0.03);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: var(--radius-xl);
    padding: 2rem;
    transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    height: 100%;
}

.tech-item:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 30px rgba(0, 123, 255, 0.1);
    border-color: rgba(0, 123, 255, 0.2);
}

.tech-item i {
    transition: all 0.3s ease;
}

.tech-item:hover i {
    transform: scale(1.1);
    color: #00d4ff !important;
}

/* ========================================
   IMPACT CARD STYLES
   ======================================== */

.impact-card {
    background: rgba(255, 255, 255, 0.03);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: var(--radius-xl);
    padding: 2rem;
    display: flex;
    align-items: center;
    gap: 1.5rem;
    transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    height: 100%;
}

.impact-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 40px rgba(0, 123, 255, 0.15);
    border-color: rgba(0, 123, 255, 0.2);
}

.impact-icon {
    width: 80px;
    height: 80px;
    background: linear-gradient(135deg, #007bff, #00d4ff);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2rem;
    color: white;
    flex-shrink: 0;
    animation: impact-pulse 3s infinite;
}

@keyframes impact-pulse {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.05); }
}

.impact-content h4 {
    color: var(--text-light);
    margin-bottom: 1rem;
}

.impact-stats {
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
    margin-top: 1rem;
}

.stat-number {
    font-size: 2rem;
    font-weight: bold;
    color: #007bff;
}

.stat-label {
    color: var(--text-muted);
    font-size: 0.9rem;
}

/* ========================================
   METHODOLOGY CARD STYLES
   ======================================== */

.methodology-card {
    background: rgba(255, 255, 255, 0.03);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: var(--radius-xl);
    padding: 2rem;
    text-align: center;
    transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    height: 100%;
    position: relative;
    overflow: hidden;
}

.methodology-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(0, 123, 255, 0.1), transparent);
    transition: left 0.5s;
}

.methodology-card:hover::before {
    left: 100%;
}

.methodology-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 40px rgba(0, 123, 255, 0.15);
    border-color: rgba(0, 123, 255, 0.2);
}

.method-number {
    width: 60px;
    height: 60px;
    background: linear-gradient(135deg, #007bff, #00d4ff);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    font-weight: bold;
    color: white;
    margin: 0 auto 1.5rem;
    animation: method-pulse 3s infinite;
}

@keyframes method-pulse {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.1); }
}

.methodology-card h5 {
    color: var(--text-light);
    margin-bottom: 1rem;
}

/* ========================================
   CUSTOM CURSOR STYLES
   ======================================== */

/* NUCLEAR CURSOR HIDING - NO EXCEPTIONS */
*, *::before, *::after, *:hover, *:focus, *:active, *:visited, *:link, *:target, *:checked, *:disabled, *:enabled, *:required, *:optional, *:valid, *:invalid, *:in-range, *:out-of-range, *:read-only, *:read-write, *:placeholder-shown, *:not(:placeholder-shown), *:autofill, *:not(:autofill) {
    cursor: none !important;
}

html, body, div, span, h1, h2, h3, h4, h5, h6, p, a, img, ul, ol, li, form, input, textarea, select, button, table, tr, td, th, nav, header, footer, main, section, article, aside, canvas, svg, iframe, embed, object, video, audio, source, track, map, area, base, meta, link, script, noscript, style, title, head {
    cursor: none !important;
}

/* Force cursor hiding on ALL elements and states */
a, button, input, textarea, select, [role="button"], [tabindex], .btn, .nav-link, .dropdown-item, .card, .feature-card, .value-card, .product-card, .executive-card, .navbar, .navbar-brand, .navbar-nav, .navbar-toggler, .dropdown, .dropdown-menu, .modal, .modal-content, .modal-header, .modal-body, .modal-footer, .btn-primary, .btn-secondary, .btn-success, .btn-danger, .btn-warning, .btn-info, .btn-light, .btn-dark, .btn-outline-primary, .btn-outline-secondary, .btn-outline-success, .btn-outline-danger, .btn-outline-warning, .btn-outline-info, .btn-outline-light, .btn-outline-dark {
    cursor: none !important;
}

/* Hide cursor on ALL form elements and input types */
input, textarea, select, input[type="text"], input[type="email"], input[type="password"], input[type="search"], input[type="url"], input[type="tel"], input[type="number"], input[type="date"], input[type="time"], input[type="datetime-local"], input[type="month"], input[type="week"], input[type="color"], input[type="file"], input[type="range"], input[type="checkbox"], input[type="radio"], input[type="submit"], input[type="reset"], input[type="button"], input[type="image"], input[type="hidden"] {
    cursor: none !important;
}

/* Override any external CSS that might show cursor */
*[style*="cursor"] {
    cursor: none !important;
}

/* OPTIMIZED CUSTOM CURSOR */
.custom-cursor {
    position: fixed;
    top: 0;
    left: 0;
    width: 12px;
    height: 12px;
    background: #007bff;
    border-radius: 50%;
    pointer-events: none;
    z-index: 9999;
    transform: translate(-50%, -50%);
    transition: transform 0.1s ease-out, width 0.1s ease-out, height 0.1s ease-out;
    will-change: transform;
    contain: layout style paint;
}

/* Optimized cursor dot for smooth movement */
.cursor-dot {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 12px;
    height: 12px;
    background: #007bff;
    border-radius: 50%;
    transform: translate(-50%, -50%);
    transition: all 0.1s ease-out;
    box-shadow: 0 0 15px rgba(0, 123, 255, 0.6);
    will-change: transform;
}

/* Simple outline for smooth movement */
.cursor-outline {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 32px;
    height: 32px;
    border: 2px solid rgba(0, 123, 255, 0.4);
    border-radius: 50%;
    transform: translate(-50%, -50%);
    transition: all 0.15s ease-out;
    opacity: 0.6;
    will-change: transform;
}

/* Removed heavy animations for better performance */

/* Simple hover states for better performance */
.custom-cursor.hover .cursor-dot {
    width: 16px;
    height: 16px;
    background: #00d4ff;
    box-shadow: 0 0 20px rgba(0, 212, 255, 0.7);
    transform: translate(-50%, -50%);
}

.custom-cursor.hover .cursor-outline {
    width: 36px;
    height: 36px;
    border-color: rgba(0, 212, 255, 0.6);
    border-width: 2px;
    opacity: 0.8;
    transform: translate(-50%, -50%);
}

/* Removed heavy hover animations for better performance */

/* Navbar specific hover state */
.custom-cursor.navbar-hover .cursor-dot {
    width: 12px;
    height: 12px;
    background: #ff6b6b;
    box-shadow: 0 0 0 6px rgba(255, 107, 107, 0.2);
    transform: translate(-50%, -50%);
}

.custom-cursor.navbar-hover .cursor-outline {
    width: 35px;
    height: 35px;
    border-color: rgba(255, 107, 107, 0.4);
    border-width: 2px;
    opacity: 0.8;
    transform: translate(-50%, -50%);
}

/* SIMPLIFIED click state for better performance */
.custom-cursor.clicking .cursor-dot {
    width: 6px;
    height: 6px;
    background: #ff6b6b;
    box-shadow: 0 0 20px rgba(255, 107, 107, 0.8);
    transform: translate(-50%, -50%) scale(0.9);
    animation: click-dot-simple 0.3s ease-out;
}

.custom-cursor.clicking .cursor-outline {
    width: 50px;
    height: 50px;
    border-color: rgba(255, 107, 107, 0.8);
    border-width: 2px;
    opacity: 1;
    transform: translate(-50%, -50%) scale(1.2);
    animation: click-outline-simple 0.4s ease-out;
}

/* Simplified click animations for better performance */
@keyframes click-dot-simple {
    0% { transform: translate(-50%, -50%) scale(1); }
    50% { transform: translate(-50%, -50%) scale(0.8); }
    100% { transform: translate(-50%, -50%) scale(0.9); }
}

@keyframes click-outline-simple {
    0% { transform: translate(-50%, -50%) scale(1); }
    50% { transform: translate(-50%, -50%) scale(1.3); }
    100% { transform: translate(-50%, -50%) scale(1.2); }
}

/* Click pop ring animation */
@keyframes ultra-slow-click-ring {
    0% { 
        width: 0;
        height: 0;
        opacity: 1;
    }
    20% { 
        width: 4px;
        height: 4px;
        opacity: 0.8;
    }
    40% { 
        width: 6px;
        height: 6px;
        opacity: 0.6;
    }
    60% { 
        width: 8px;
        height: 8px;
        opacity: 0.4;
    }
    80% { 
        width: 10px;
        height: 10px;
        opacity: 0.2;
    }
    100% { 
        width: 12px;
        height: 12px;
        opacity: 0;
    }
}

/* Fallback animation in case the above doesn't work */
@keyframes click-ring-fallback {
    0% { 
        width: 0;
        height: 0;
        opacity: 0.4;
    }
    100% { 
        width: 12px;
        height: 12px;
        opacity: 0;
    }
}

/* Ripple expand animation for click effects */
@keyframes ripple-expand {
    0% { 
        width: 0;
        height: 0;
        opacity: 1;
    }
    100% { 
        width: 100px;
        height: 100px;
        opacity: 0;
    }
}

/* Text selection state - only for actual text selection */
.custom-cursor.text-selecting .cursor-dot {
    width: 2px;
    height: 20px;
    border-radius: 1px;
    background: #007bff;
    box-shadow: 0 0 8px rgba(0, 123, 255, 0.6);
    animation: text-blink 1s infinite;
}

.custom-cursor.text-selecting .cursor-outline {
    opacity: 0;
}

@keyframes text-blink {
    0%, 50% { opacity: 1; }
    51%, 100% { opacity: 0.3; }
}

/* Button specific hover state */
.custom-cursor.button-hover .cursor-dot {
    width: 12px;
    height: 12px;
    background: #20c997;
    box-shadow: 0 0 0 5px rgba(32, 201, 151, 0.2);
    transform: translate(-50%, -50%);
}

.custom-cursor.button-hover .cursor-outline {
    width: 35px;
    height: 35px;
    border-color: rgba(32, 201, 151, 0.4);
    border-width: 2px;
    opacity: 0.8;
    transform: translate(-50%, -50%);
}

/* Card specific hover state */
.custom-cursor.card-hover .cursor-dot {
    width: 10px;
    height: 10px;
    background: #feca57;
    box-shadow: 0 0 0 4px rgba(254, 202, 87, 0.2);
    transform: translate(-50%, -50%);
}

.custom-cursor.card-hover .cursor-outline {
    width: 30px;
    height: 30px;
    border-color: rgba(254, 202, 87, 0.4);
    border-width: 2px;
    opacity: 0.7;
    transform: translate(-50%, -50%);
}

/* Link specific hover state */
.custom-cursor.link-hover .cursor-dot {
    width: 8px;
    height: 8px;
    background: #ff6b6b;
    box-shadow: 0 0 0 3px rgba(255, 107, 107, 0.2);
    transform: translate(-50%, -50%);
}

.custom-cursor.link-hover .cursor-outline {
    width: 25px;
    height: 25px;
    border-color: rgba(255, 107, 107, 0.4);
    border-width: 1px;
    opacity: 0.6;
    transform: translate(-50%, -50%);
}

/* Loading state */
.custom-cursor.loading .cursor-dot {
    animation: cursor-pulse 1s ease-in-out infinite;
}

.custom-cursor.loading .cursor-outline {
    animation: cursor-rotate 2s linear infinite;
}

@keyframes cursor-pulse {
    0%, 100% { 
        transform: translate(-50%, -50%) scale(1);
        opacity: 1;
    }
    50% { 
        transform: translate(-50%, -50%) scale(1.3);
        opacity: 0.7;
    }
}

@keyframes cursor-rotate {
    0% { transform: translate(-50%, -50%) rotate(0deg); }
    100% { transform: translate(-50%, -50%) rotate(360deg); }
}

/* Mobile-specific optimizations */
@media (max-width: 768px) {
    /* Disable cursor on mobile devices */
    * {
        cursor: auto !important;
    }
    
    .custom-cursor {
        display: none !important;
    }
    
    /* Mobile typography */
    .display-3 {
        font-size: 2.2rem;
        line-height: 1.2;
    }
    
    .display-4 {
        font-size: 1.8rem;
        line-height: 1.3;
    }
    
    .display-5 {
        font-size: 1.6rem;
        line-height: 1.3;
    }
    
    .lead {
        font-size: 0.95rem;
        line-height: 1.5;
    }
    
    /* Mobile navigation */
    .navbar-nav {
        background: rgba(26, 26, 26, 0.95);
        border-radius: 0.5rem;
        margin-top: 0.5rem;
        padding: 1rem;
    }
    
    .nav-link {
        padding: 0.6rem 1rem;
        font-size: 1rem;
        border-radius: 0.25rem;
        margin: 0.2rem 0;
    }
    
    .nav-link:hover {
        background: rgba(0, 123, 255, 0.1);
    }
    
    /* Mobile dropdown fixes */
    .dropdown-menu {
        position: static !important;
        transform: none !important;
        box-shadow: none;
        background: rgba(0, 0, 0, 0.9);
        border: 1px solid rgba(255, 255, 255, 0.1);
        margin-top: 0.5rem;
        border-radius: 0.5rem;
        display: none;
        width: 100%;
        z-index: 1000;
    }
    
    .dropdown-menu.show {
        display: block !important;
        opacity: 1;
        visibility: visible;
    }
    
    .dropdown-item {
        padding: 0.6rem 1rem;
        font-size: 0.95rem;
        color: var(--text-light) !important;
        border-radius: 0.25rem;
        margin: 0.1rem 0.5rem;
        display: block;
        width: calc(100% - 1rem);
        text-decoration: none;
        transition: background-color 0.2s ease;
    }
    
    .dropdown-item:hover,
    .dropdown-item:focus {
        background: rgba(0, 123, 255, 0.2) !important;
        color: var(--text-light) !important;
        text-decoration: none;
    }
    
    .dropdown-item:active {
        background: rgba(0, 123, 255, 0.3) !important;
        color: var(--text-light) !important;
    }
    
    /* Ensure dropdown toggle works properly */
    .dropdown-toggle::after {
        display: inline-block;
        margin-left: 0.255em;
        vertical-align: 0.255em;
        content: "";
        border-top: 0.3em solid;
        border-right: 0.3em solid transparent;
        border-bottom: 0;
        border-left: 0.3em solid transparent;
    }
    
    .dropdown-toggle[aria-expanded="true"]::after {
        transform: rotate(180deg);
    }
    
    /* Disable heavy animations on mobile only */
    .reveal-on-scroll,
    .slide-in-left,
    .slide-in-right,
    .fade-in,
    .scale-rotate-reveal,
    .flip-reveal,
    .morph-reveal,
    .wave-reveal {
        opacity: 1 !important;
        transform: none !important;
    }
    
    .magnetic-hover {
        transform: none !important;
    }
    
    .magnetic-hover:hover {
        transform: none !important;
    }
    
    /* Mobile layout fixes */
    .product-card-enhanced .row {
        flex-direction: column;
    }
    
    .product-card-enhanced .col-md-4 {
        order: 1;
        margin-bottom: 1rem;
    }
    
    .product-card-enhanced .col-md-8 {
        order: 2;
    }
    
    .product-image {
        height: 200px;
        object-fit: cover;
    }
    
    .product-content {
        padding: 1rem;
    }
    
    .product-features .row {
        margin: 0;
    }
    
    .product-features .col-sm-6 {
        margin-bottom: 0.5rem;
    }
    
    /* Mobile spacing */
    .py-5 {
        padding-top: 1.5rem !important;
        padding-bottom: 1.5rem !important;
    }
    
    .mb-5 {
        margin-bottom: 1.5rem !important;
    }
    
    .container {
        padding-left: 0.75rem;
        padding-right: 0.75rem;
    }
    
    .hero-section {
        min-height: 60vh;
        padding: 2rem 0;
    }
    
    /* Hero typed elements mobile fix */
    .hero-title {
        font-size: 2.2rem !important;
        line-height: 1.3 !important;
        margin-bottom: 1rem !important;
    }
    
    .typed-container {
        display: inline-block !important;
        min-height: 2.8rem !important;
        vertical-align: top !important;
        position: relative !important;
        overflow: visible !important;
    }
    
    .typed-word {
        font-size: 2.2rem !important;
        line-height: 1.3 !important;
        display: inline-block !important;
        vertical-align: top !important;
        position: relative !important;
        background: linear-gradient(45deg, #007bff, #00d4ff, #ff6b6b, #4ecdc4) !important;
        background-size: 400% 400% !important;
        -webkit-background-clip: text !important;
        -webkit-text-fill-color: transparent !important;
        background-clip: text !important;
        animation: morphing-gradient 4s ease infinite !important;
    }
    
    .typing-cursor {
        font-size: 2.2rem !important;
        line-height: 1.3 !important;
        display: inline-block !important;
        vertical-align: top !important;
        width: 3px !important;
        height: 1.3em !important;
        background: #007bff !important;
        animation: advanced-blink 1.5s infinite !important;
        margin-left: 2px !important;
        position: relative !important;
    }
    
    .hero-subtitle {
        font-size: 0.95rem !important;
        line-height: 1.5 !important;
        margin-bottom: 1.5rem !important;
    }
    
    .hero-cta-container {
        flex-direction: column !important;
        gap: 0.8rem !important;
        width: 100% !important;
    }
    
    .hero-btn-primary,
    .hero-btn-secondary {
        width: 100% !important;
        font-size: 0.95rem !important;
        padding: 0.6rem 1.2rem !important;
        margin-bottom: 0.5rem !important;
    }
    
    /* Fix hero section positioning */
    .hero-section {
        min-height: 70vh !important;
        padding: 3rem 0 !important;
        display: flex !important;
        align-items: center !important;
    }
    
    .hero-content {
        width: 100% !important;
        text-align: center !important;
    }
    
    .hero-text-container {
        width: 100% !important;
        position: relative !important;
        margin-top: 2rem !important;
    }
    
    /* Ensure hero content stays within viewport */
    .hero-content {
        padding-top: 2rem !important;
        padding-bottom: 2rem !important;
    }
    
    /* Fix navbar spacing on mobile */
    .hero-section {
        margin-top: 4rem !important;
    }
    
    /* Ensure typed elements are properly contained */
    .morphing-text {
        display: block !important;
        margin-bottom: 0.5rem !important;
    }
    
    .typed-container {
        display: block !important;
        margin-top: 0.5rem !important;
        margin-bottom: 0.5rem !important;
    }
    
    /* Executive cards mobile */
    .executive-card .row {
        flex-direction: column;
        text-align: center;
    }
    
    .executive-card .col-md-3 {
        margin-bottom: 1rem;
    }
    
    /* Timeline mobile */
    .timeline-item {
        flex-direction: column;
        text-align: left;
    }
    
    .timeline-marker {
        position: absolute;
        left: 20px;
        top: 0;
    }
    
    /* Stats mobile */
    .stats-grid {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    /* Testimonial mobile */
    .testimonial-card {
        text-align: center;
    }
    
    /* Contact form mobile */
    .contact-form .row {
        margin: 0;
    }
    
    .contact-form .col-md-6 {
        margin-bottom: 1rem;
    }
}

/* Extra small mobile devices */
@media (max-width: 576px) {
    .display-3 {
        font-size: 1.8rem;
    }
    
    .display-4 {
        font-size: 1.5rem;
    }
    
    .display-5 {
        font-size: 1.3rem;
    }
    
    .container {
        padding-left: 0.5rem;
        padding-right: 0.5rem;
    }
    
    .btn-lg {
        padding: 0.5rem 1rem;
        font-size: 0.9rem;
    }
    
    .card, .feature-card, .value-card, .product-card, .executive-card {
        padding: 0.8rem;
    }
    
    .navbar-brand {
        font-size: 1.1rem;
    }
    
    .nav-link {
        padding: 0.5rem 0.8rem;
        font-size: 0.95rem;
    }
}

/* Performance optimization class */
.transition-all {
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), 
                opacity 0.3s cubic-bezier(0.4, 0, 0.2, 1), 
                background-color 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

/* Accessibility: Respect reduced motion preference */
@media (prefers-reduced-motion: reduce) {
    .custom-cursor,
    .cursor-dot,
    .cursor-outline {
        transition: none !important;
        animation: none !important;
    }
    
    * {
        transition: none !important;
        animation: none !important;
    }
}

/* ========================================
   RESPONSIVE DESIGN ENHANCEMENTS
   ======================================== */

@media (max-width: 768px) {
    .timeline::before {
        left: 30px;
    }
    
    .timeline-item {
        flex-direction: row !important;
        padding-left: 60px;
    }
    
    .timeline-item .timeline-content {
        text-align: left !important;
        margin: 0 !important;
    }
    
    .timeline-marker {
        left: 30px !important;
        transform: translateX(-50%);
    }
    
    .impact-card {
        flex-direction: column;
        text-align: center;
    }
    
    .impact-icon {
        margin-bottom: 1rem;
    }
}
