/* Tailwind CSS Reset and Base Styles */
        *, ::before, ::after {
            box-sizing: border-box;
            border-width: 0;
            border-style: solid;
            border-color: #e5e7eb;
        }
        
        html {
            line-height: 1.5;
            -webkit-text-size-adjust: 100%;
            -moz-tab-size: 4;
            tab-size: 4;
            font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
            scroll-behavior: smooth;
        }
        
        body {
            margin: 0;
            line-height: inherit;
        }
        
        /* Tailwind Utilities */
        .container { max-width: 1200px; margin-left: auto; margin-right: auto; }
        .mx-auto { margin-left: auto; margin-right: auto; }
        .mb-2 { margin-bottom: 0.5rem; }
        .mb-4 { margin-bottom: 1rem; }
        .mb-6 { margin-bottom: 1.5rem; }
        .mb-8 { margin-bottom: 2rem; }
        .mb-12 { margin-bottom: 3rem; }
        .mb-20 { margin-bottom: 5rem; }
        .mr-2 { margin-right: 0.5rem; }
        .mt-2 { margin-top: 0.5rem; }
        .mt-3 { margin-top: 0.75rem; }
        .px-1 { padding-left: 0.25rem; padding-right: 0.25rem; }
        .px-4 { padding-left: 1rem; padding-right: 1rem; }
        .px-5 { padding-left: 1.25rem; padding-right: 1.25rem; }
        .px-6 { padding-left: 1.5rem; padding-right: 1.5rem; }
        .py-2 { padding-top: 0.5rem; padding-bottom: 0.5rem; }
        .py-3 { padding-top: 0.75rem; padding-bottom: 0.75rem; }
        .py-4 { padding-top: 1rem; padding-bottom: 1rem; }
        .py-8 { padding-top: 2rem; padding-bottom: 2rem; }
        .p-1 { padding: 0.25rem; }
        .p-4 { padding: 1rem; }
        .p-6 { padding: 1.5rem; }
        .p-8 { padding: 2rem; }
        .pt-6 { padding-top: 1.5rem; }
        .pt-32 { padding-top: 8rem; }
        .pb-20 { padding-bottom: 5rem; }
        .w-8 { width: 2rem; }
        .w-10 { width: 2.5rem; }
        .w-12 { width: 3rem; }
        .w-16 { width: 4rem; }
        .w-40 { width: 10rem; }
        .w-64 { width: 16rem; }
        .w-80 { width: 20rem; }
        .w-full { width: 100%; }
        .h-8 { height: 2rem; }
        .h-10 { height: 2.5rem; }
        .h-12 { height: 3rem; }
        .h-16 { height: 4rem; }
        .h-40 { height: 10rem; }
        .h-64 { height: 16rem; }
        .h-80 { height: 20rem; }
        .h-full { height: 100%; }
        .min-h-screen { min-height: 100vh; }
        .max-w-2xl { max-width: 42rem; }
        .max-w-4xl { max-width: 56rem; }
        .flex { display: flex; }
        .grid { display: grid; }
        .hidden { display: none; }
        .block { display: block; }
        .inline { display: inline; }
        .flex-col { flex-direction: column; }
        .flex-shrink-0 { flex-shrink: 0; }
        .items-center { align-items: center; }
        .justify-center { justify-content: center; }
        .justify-between { justify-content: space-between; }
        .gap-1 { gap: 0.25rem; }
        .gap-2 { gap: 0.5rem; }
        .gap-3 { gap: 0.75rem; }
        .gap-4 { gap: 1rem; }
        .gap-5 { gap: 1.25rem; }
        .gap-6 { gap: 1.5rem; }
        .overflow-x-hidden { overflow-x: hidden; }
        .rounded-lg { border-radius: 0.5rem; }
        .rounded-xl { border-radius: 0.75rem; }
        .rounded-2xl { border-radius: 1rem; }
        .rounded-3xl { border-radius: 1.5rem; }
        .rounded-full { border-radius: 9999px; }
        .border { border-width: 1px; }
        .border-4 { border-width: 4px; }
        .border-t { border-top-width: 1px; }
        .bg-white { background-color: rgb(255 255 255); }
        .text-white { color: rgb(255 255 255); }
        .text-lg { font-size: 1.125rem; line-height: 1.75rem; }
        .text-xl { font-size: 1.25rem; line-height: 1.75rem; }
        .text-sm { font-size: 0.875rem; line-height: 1.25rem; }
        .text-xs { font-size: 0.75rem; line-height: 1rem; }
        .font-bold { font-weight: 700; }
        .font-medium { font-weight: 500; }
        .font-sans { font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif; }
        .leading-tight { line-height: 1.25; }
        .text-center { text-align: center; }
        .text-left { text-left: left; }
        .shadow-lg { box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1); }
        .shadow-2xl { box-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25); }
        .transition-all { transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; }
        .transition-colors { transition-property: color, background-color, border-color, text-decoration-color, fill, stroke; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; }
        .duration-300 { transition-duration: 300ms; }
        .fixed { position: fixed; }
        .absolute { position: absolute; }
        .relative { position: relative; }
        .inset-0 { inset: 0px; }
        .top-20 { top: 5rem; }
        .left-10 { left: 2.5rem; }
        .bottom-6 { bottom: 1.5rem; }
        .bottom-10 { bottom: 2.5rem; }
        .right-6 { right: 1.5rem; }
        .right-10 { right: 2.5rem; }
        .z-50 { z-index: 50; }
        .-z-10 { z-index: -10; }
        .blur-3xl { filter: blur(64px); }
        .backdrop-blur-lg { backdrop-filter: blur(16px); }
        .opacity-0 { opacity: 0; }
        .opacity-100 { opacity: 1; }
        .invisible { visibility: hidden; }
        .visible { visibility: visible; }
        
        /* Custom Colors */
        .bg-primary { background-color: #3B82F6; }
        .bg-secondary { background-color: #10B981; }
        .text-white\/50 { color: rgb(255 255 255 / 0.5); }
        .text-white\/70 { color: rgb(255 255 255 / 0.7); }
        .text-white\/80 { color: rgb(255 255 255 / 0.8); }
        .bg-white\/10 { background-color: rgb(255 255 255 / 0.1); }
        .bg-white\/15 { background-color: rgb(255 255 255 / 0.15); }
        .bg-white\/20 { background-color: rgb(255 255 255 / 0.2); }
        .bg-primary\/10 { background-color: rgb(59 130 246 / 0.1); }
        .bg-primary\/30 { background-color: rgb(59 130 246 / 0.3); }
        .bg-secondary\/20 { background-color: rgb(16 185 129 / 0.2); }
        .border-white\/10 { border-color: rgb(255 255 255 / 0.1); }
        .border-white\/20 { border-color: rgb(255 255 255 / 0.2); }
        .border-white\/30 { border-color: rgb(255 255 255 / 0.3); }
        .bg-slate-800\/30 { background-color: rgb(30 41 59 / 0.3); }
        .border-slate-800\/20 { border-color: rgb(30 41 59 / 0.2); }
        
        /* Responsive */
        @media (min-width: 640px) {
            .sm\:px-2 { padding-left: 0.5rem; padding-right: 0.5rem; }
            .sm\:gap-2 { gap: 0.5rem; }
            .sm\:w-\[31\%\] { width: 31%; }
            .sm\:flex-row { flex-direction: row; }
        }
        
        @media (min-width: 768px) {
            .md\:px-4 { padding-left: 1rem; padding-right: 1rem; }
            .md\:p-10 { padding: 2.5rem; }
            .md\:gap-5 { gap: 1.25rem; }
            .md\:w-\[29\%\] { width: 29%; }
            .md\:max-w-\[260px\] { max-width: 260px; }
            .md\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
            .md\:flex-row { flex-direction: row; }
            .md\:w-auto { width: auto; }
            .md\:block { display: block; }
            .md\:hidden { display: none; }
        }
        
        /* Custom Styles */
        .gradient-bg {
            background: linear-gradient(135deg, #3B82F6 0%, #8B5CF6 100%);
        }
        
        a {
            text-decoration: none;
            color: inherit; /* Ensure links inherit color from parent */
        }
        
        .glass {
            background-color: rgb(255 255 255 / 0.1);
            backdrop-filter: blur(16px);
            border: 1px solid rgb(255 255 255 / 0.2);
            box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
        }
        
        .glass-dark {
            background-color: rgb(30 41 59 / 0.3);
            backdrop-filter: blur(16px);
            border: 1px solid rgb(30 41 59 / 0.2);
        }
        
        .hover-lift {
            transition: transform 0.3s ease, box-shadow 0.3s ease;
        }
        
        .hover-lift:hover {
            transform: translateY(-3px);
            box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
        }
        
        /* Animations */
        @keyframes float {
            0% { transform: translateY(0px); }
            50% { transform: translateY(-10px); }
            100% { transform: translateY(0px); }
        }
        
        .animate-float {
            animation: float 5s ease-in-out infinite;
        }
        
        .animate-float-delay-1 {
            animation: float 5s ease-in-out 0.5s infinite;
        }
        
        .animate-float-delay-2 {
            animation: float 5s ease-in-out 1s infinite;
        }
        
        /* Responsive Text */
        .text-hero {
            font-size: clamp(2rem, 5vw, 3.5rem);
        }
        
        .text-section {
            font-size: clamp(1.5rem, 3vw, 2.5rem);
        }
        
        /* Mobile specific */
        .w-mobile-33 { width: 33%; }
        .max-w-mobile-220 { max-width: 220px; }
        
        /* Icon styles */
        .icon {
            width: 1.25rem;
            height: 1.25rem;
            fill: currentColor;
        }
        
        .icon-lg {
            width: 2rem;
            height: 2rem;
            fill: currentColor;
        }
        
        .social-icon {
            width: 1.25rem; /* 20px */
            height: 1.25rem; /* 20px */
            fill: currentColor;
        }
        
        /* For image icons in buttons */
        .button-icon-img {
            width: 2rem; /* Match icon-lg size */
            height: 2rem; /* Match icon-lg size */
            object-fit: contain;
            filter: brightness(0) invert(1); /* Make image white */
        }