/* ===================================
   NAVBAR - Sticky Glassmorphism
   =================================== */

.navbar {
    transition: background-color 0.3s ease,
                backdrop-filter 0.3s ease,
                box-shadow 0.3s ease,
                border-color 0.3s ease;
}

.navbar:not(.scrolled) {
    background: transparent !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    border-bottom-color: transparent !important;
    box-shadow: none !important;
}

.navbar:not(.scrolled) > :first-child a,
.navbar:not(.scrolled) > :first-child span {
    color: white !important;
}

.navbar-logo-container {
    display: block;
    position: relative;
    width: 120px;
    height: 32px;
}

@media (min-width: 640px) {
    .navbar-logo-container {
        width: 150px;
        height: 40px;
    }
}

.navbar-logo-white,
.navbar-logo-color {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
    transition: opacity 0.3s ease;
}

.navbar-logo-white {
    opacity: 1;
}

.navbar-logo-color {
    opacity: 0;
}

.navbar.scrolled .navbar-logo-white {
    opacity: 0;
}

.navbar.scrolled .navbar-logo-color {
    opacity: 1;
}

.navbar:not(.scrolled) .gradient-text {
    background: linear-gradient(135deg, #a78bfa 0%, #c4b5fd 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.navbar:not(.scrolled) .hamburger-line {
    background-color: white;
}

.navbar.scrolled {
    background: rgba(255, 255, 255, 0.95) !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    border-bottom: 1px solid rgba(147, 51, 234, 0.1) !important;
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.08) !important;
}

.navbar.scrolled > :first-child a:not(.bg-gradient-to-r):not([href*="register"]):not(.btn-cta),
.navbar.scrolled > :first-child span {
    color: inherit !important;
}

.navbar .btn-cta,
.navbar a[href*="register"],
.navbar a.bg-gradient-to-r {
    color: #FFFFFF !important;
    -webkit-text-fill-color: #FFFFFF !important;
}

.navbar.scrolled .btn-cta,
.navbar.scrolled a[href*="register"],
.navbar.scrolled a.bg-gradient-to-r {
    color: #FFFFFF !important;
    -webkit-text-fill-color: #FFFFFF !important;
}

.navbar.scrolled .gradient-text {
    background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.navbar.scrolled .hamburger-line {
    background-color: #111827;
}

.navbar.scrolled.violet-tint {
    background: rgba(250, 245, 255, 0.9);
    border-bottom: 1px solid rgba(147, 51, 234, 0.15);
}

.navbar.scrolled .mobile-menu {
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

@supports not (backdrop-filter: blur(12px)) {
    .navbar:not(.scrolled) {
        background: rgba(0, 0, 0, 0.3) !important;
    }

    .navbar.scrolled {
        background: rgba(255, 255, 255, 0.98) !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .navbar {
        transition: none;
    }
}

/* ===================================
   FOOTER - Premium Style
   =================================== */

.footer-link {
    color: #9ca3af;
    transition: color 0.2s ease;
}

.footer-link:hover {
    color: #a78bfa;
}

.newsletter-input {
    transition: box-shadow 0.2s ease, border-color 0.2s ease;
}

.newsletter-input:focus {
    box-shadow: 0 0 0 3px rgba(167, 139, 250, 0.3);
}

.newsletter-input.ring-red-500 {
    box-shadow: 0 0 0 2px rgba(239, 68, 68, 0.5);
}

.social-icon {
    transition: background-color 0.2s ease, transform 0.2s ease;
}

.social-icon:hover {
    transform: translateY(-2px);
}

.footer-trust-badge {
    transition: transform 0.2s ease;
}

.footer-trust-badge:hover {
    transform: scale(1.05);
}

.footer-column {
    opacity: 1;
}

@media (max-width: 768px) {
    .footer-columns {
        text-align: center;
    }

    .footer-social {
        justify-content: center;
    }

    .footer-logo-section {
        text-align: center;
        display: flex;
        flex-direction: column;
        align-items: center;
    }
}

@media (prefers-reduced-motion: reduce) {
    .social-icon,
    .footer-trust-badge,
    .footer-link,
    .newsletter-input {
        transition: none;
    }

    .social-icon:hover {
        transform: none;
    }

    .footer-trust-badge:hover {
        transform: none;
    }
}

/* ===================================
   MOBILE MENU
   =================================== */

.mobile-overlay {
    transition: opacity 0.3s ease, visibility 0.3s ease;
}

.mobile-panel {
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    background-color: #ffffff;
}

.navbar .mobile-panel a { color: rgb(55, 65, 81) !important; }
.navbar .mobile-panel p { color: rgb(107, 114, 128) !important; }
.navbar .mobile-panel a.text-primary-600 { color: rgb(147, 51, 234) !important; }
.navbar .mobile-panel a.bg-gradient-to-r { color: #ffffff !important; }

.hamburger-line {
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

@media (max-width: 640px) {
    .footer-columns {
        gap: 2rem;
    }

    .footer-column h4 {
        font-size: 0.9375rem;
        margin-bottom: 0.75rem;
    }

    .footer-column ul {
        gap: 0.5rem;
    }

    .footer-link {
        font-size: 0.875rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .animate-bounce-slow,
    .mobile-overlay,
    .mobile-panel,
    .hamburger-line {
        animation: none;
        transition: none;
    }
}