@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&display=swap');

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

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

#hero {
    background: linear-gradient(135deg, #05002a 0%, #0f0555 100%);
}

.btn-primary {
    background: linear-gradient(90deg, #1800ad 0%, #4d2bff 100%);
    transition: all 0.3s ease;
}

.btn-primary:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 20px -10px rgba(24, 0, 173, 0.8);
}

.feature-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 30px -10px rgba(0, 0, 0, 0.1);
}

/* Dark Mode Styles */
.dark body {
    background-color: #000000 !important;
    color: #ffffff !important;
}

.dark #hero {
    background: linear-gradient(135deg, #000000 0%, #1a1a1a 50%, #2d2d2d 100%) !important;
}

.dark nav {
    background-color: #000000 !important;
    border-bottom: 1px solid #333333 !important;
}

.dark section {
    background-color: #000000 !important;
}

.dark .bg-gradient-to-br {
    background: linear-gradient(135deg, #000000 0%, #1a1a1a 50%, #2d2d2d 100%) !important;
}

.dark .bg-gradient-to-b {
    background: linear-gradient(to bottom, #000000, #1a1a1a) !important;
}

.dark .bg-gradient-to-r {
    background: linear-gradient(to right, #000000, #1a1a1a) !important;
}

.dark .bg-slate-50,
.dark .bg-gray-50,
.dark .bg-light-blue,
.dark .bg-white {
    background-color: #000000 !important;
}

.dark .bg-gray-100 {
    background-color: #1a1a1a !important;
}

.dark .bg-gray-200 {
    background-color: #2d2d2d !important;
}

.dark footer {
    background-color: #000000 !important;
}

.dark .feature-card,
.dark .testimonial-card,
.dark .benefits-card {
    background-color: #1a1a1a !important;
    border: 1px solid #333333 !important;
}

.dark .text-gray-900,
.dark .text-black {
    color: #ffffff !important;
}

.dark .text-gray-800 {
    color: #f0f0f0 !important;
}

.dark .text-gray-700 {
    color: #e0e0e0 !important;
}

.dark .text-gray-600 {
    color: #cccccc !important;
}

.dark .text-gray-500 {
    color: #aaaaaa !important;
}

.dark .text-gray-400 {
    color: #888888 !important;
}

.dark .text-gray-300 {
    color: #666666 !important;
}

.dark .text-gray-200 {
    color: #444444 !important;
}

.dark .text-gray-100 {
    color: #222222 !important;
}

.dark .text-white {
    color: #ffffff !important;
}

.dark .text-blue-700,
.dark .text-blue-600 {
    color: #60a5fa !important;
}

.dark .text-purple-700,
.dark .text-purple-600,
.dark .text-purple-400 {
    color: #a855f7 !important;
}

.dark .text-pink-600,
.dark .text-pink-400 {
    color: #f472b6 !important;
}

.dark .text-indigo-600 {
    color: #818cf8 !important;
}

.dark .text-green-600 {
    color: #4ade80 !important;
}

.dark .text-orange-600 {
    color: #fb923c !important;
}

.dark .text-red-600 {
    color: #f87171 !important;
}

.dark .text-blue-400 {
    color: #60a5fa !important;
}

.dark .text-green-400 {
    color: #4ade80 !important;
}

.dark .text-orange-400 {
    color: #fb923c !important;
}

.dark .border-gray-100,
.dark .border-gray-200 {
    border-color: #333333 !important;
}

.dark .border-gray-300 {
    border-color: #444444 !important;
}

.dark .border-white {
    border-color: #ffffff !important;
}

.dark .shadow-xl,
.dark .shadow-2xl {
    box-shadow: 0 25px 50px -12px rgba(255, 255, 255, 0.1) !important;
}

.dark .shadow-lg {
    box-shadow: 0 10px 15px -3px rgba(255, 255, 255, 0.1) !important;
}

.dark input,
.dark select,
.dark textarea {
    background-color: #1a1a1a !important;
    border-color: #333333 !important;
    color: #ffffff !important;
}

.dark input::placeholder,
.dark textarea::placeholder {
    color: #888888 !important;
}

.dark button {
    background-color: #1a1a1a !important;
    border-color: #333333 !important;
    color: #ffffff !important;
}

.dark a {
    color: #cccccc !important;
}

.dark a:hover {
    color: #ffffff !important;
}


.dark .fixed.inset-0 {
    background-color: rgba(0, 0, 0, 0.9) !important;
}

.dark .benefits-section {
    background-color: #000000 !important;
}

.dark .bg-gradient-to-br.from-slate-50,
.dark .bg-gradient-to-br.from-purple-50,
.dark .bg-gradient-to-br.from-pink-50 {
    background: linear-gradient(135deg, #000000 0%, #1a1a1a 50%, #2d2d2d 100%) !important;
}

.dark .bg-gradient-to-br.from-slate-900 {
    background: linear-gradient(135deg, #000000 0%, #1a1a1a 100%) !important;
}

.dark .bg-gradient-to-r.from-purple-400.to-pink-400 {
    background: linear-gradient(to right, #a855f7, #f472b6) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}

/* Removed global color override to preserve custom colors */

/* Color preservation classes - these colors should remain the same in both modes */
.preserve-red-600 {
    color: #dc2626 !important;
}

.preserve-blue-600 {
    color: #2563eb !important;
}

.preserve-green-600 {
    color: #16a34a !important;
}

.preserve-purple-600 {
    color: #9333ea !important;
}

.preserve-orange-600 {
    color: #ea580c !important;
}

.preserve-yellow-600 {
    color: #ca8a04 !important;
}

.preserve-indigo-600 {
    color: #4f46e5 !important;
}

.preserve-teal-600 {
    color: #0d9488 !important;
}

.preserve-cyan-600 {
    color: #0891b2 !important;
}

.preserve-emerald-600 {
    color: #059669 !important;
}

.preserve-pink-600 {
    color: #db2777 !important;
}

.preserve-rose-600 {
    color: #e11d48 !important;
}

.preserve-violet-600 {
    color: #7c3aed !important;
}

.preserve-sky-600 {
    color: #0284c7 !important;
}

.preserve-lime-600 {
    color: #65a30d !important;
}

/* Only apply white color to headings that don't have custom colors */
.dark h1:not([class*="text-"]):not([class*="preserve-"]):not([class*="fixed-"]), 
.dark h2:not([class*="text-"]):not([class*="preserve-"]):not([class*="fixed-"]), 
.dark h3:not([class*="text-"]):not([class*="preserve-"]):not([class*="fixed-"]), 
.dark h4:not([class*="text-"]):not([class*="preserve-"]):not([class*="fixed-"]), 
.dark h5:not([class*="text-"]):not([class*="preserve-"]):not([class*="fixed-"]), 
.dark h6:not([class*="text-"]):not([class*="preserve-"]):not([class*="fixed-"]) {
    color: #ffffff !important;
}

/* Only apply gray color to text elements that don't have custom colors */
.dark p:not([class*="text-"]):not([class*="preserve-"]):not([class*="fixed-"]), 
.dark span:not([class*="text-"]):not([class*="preserve-"]):not([class*="fixed-"]), 
.dark div:not([class*="text-"]):not([class*="preserve-"]):not([class*="fixed-"]) {
    color: #cccccc !important;
}

/* Fixed blue color for specific elements */
.fixed-blue-color {
    color: #1800ad !important;
    text-shadow: 0 0 8px rgba(24, 0, 173, 0.3) !important;
}

.dark .fixed-blue-color {
    color: #1800ad !important;
    text-shadow: 0 0 12px rgba(24, 0, 173, 0.8), 0 0 24px rgba(24, 0, 173, 0.4), 0 0 36px rgba(24, 0, 173, 0.2) !important;
}

/* Dark mode navbar hover contrast */
.dark nav a:hover {
    color: #000000 !important;
}

.dark nav a:hover span {
    color: #000000 !important;
}
