/* ==========================================================================
   PRO SITE FOOTER STYLES
   ========================================================================== */
.pro-site-footer { 
    background: #ffffff; 
    color: #1e293b; 
    border-top: 1px solid #e2e8f0; 
    margin-top: 60px; 
    font-family: 'Inter', sans-serif; 
    position: relative; 
    z-index: 10; 
}
.footer-main-container { 
    max-width: 1200px; 
    margin: 0 auto; 
    padding: 70px 20px 50px; 
    display: grid; 
    grid-template-columns: 2fr 1fr 1fr; 
    gap: 60px; 
}
.brand-name { 
    font-size: 22px; 
    font-weight: 800; 
    color: #0f172a; 
    margin: 0 0 15px 0; 
    display: flex; 
    align-items: center; 
    gap: 10px; 
}
.brand-desc { 
    font-size: 15px; 
    color: #64748b; 
    line-height: 1.7; 
    margin-bottom: 25px; 
    max-width: 380px; 
}
.brand-desc strong { 
    color: #1e293b; 
    font-weight: 600; 
}
.social-icons { display: flex; gap: 15px; }
.social-icons a { 
    width: 38px; height: 38px; 
    display: flex; justify-content: center; align-items: center; 
    background: #f1f5f9; color: #64748b; 
    border-radius: 50%; font-size: 15px; text-decoration: none; 
    transition: all 0.3s ease; 
}
.social-icons a:hover { 
    background: #10b981; color: #fff; 
    transform: translateY(-3px); 
    box-shadow: 0 5px 15px rgba(16, 185, 129, 0.3); 
}
.footer-heading { 
    font-size: 16px; font-weight: 700; color: #0f172a; 
    margin: 0 0 25px 0; text-transform: uppercase; letter-spacing: 0.5px; 
}
.footer-links { list-style: none; padding: 0; margin: 0; }
.footer-links li { margin-bottom: 16px; }
.footer-links a { 
    text-decoration: none; color: #475569; 
    font-size: 15px; font-weight: 500; 
    display: flex; align-items: center; gap: 10px; 
    transition: all 0.3s ease; 
}
.footer-links a i { width: 20px; text-align: center; color: #cbd5e1; font-size: 14px; transition: color 0.3s ease; }
.footer-links a:hover { color: #10b981; transform: translateX(5px); }
.footer-links a:hover i { color: #10b981; }

.logout-link { color: #ef4444 !important; }
.signup-link { color: #10b981 !important; font-weight: 600 !important; }

/* ==========================================================================
   FOOTER BOTTOM (Redesigned for PC & Mobile)
   ========================================================================== */
.footer-bottom-container { 
    background: #f8fafc; 
    border-top: 1px solid #e2e8f0; 
}
.footer-bottom-inner { 
    max-width: 1200px; 
    margin: 0 auto; 
    display: flex; 
    justify-content: space-between; 
    align-items: center; 
    padding: 25px 20px; 
}
.copyright { 
    font-size: 14px; 
    color: #64748b; 
    margin: 0; 
}
.copyright a {
    color: inherit;
    text-decoration: none;
    transition: color 0.3s ease;
}
.copyright a:hover { color: #10b981; }

.legal-links { 
    display: flex; 
    gap: 30px; 
    list-style: none; 
    padding: 0; 
    margin: 0; 
}
.legal-links a { 
    text-decoration: none; 
    color: #64748b; 
    font-size: 14px; 
    font-weight: 500; 
    transition: color 0.3s ease; 
}
.legal-links a:hover { color: #10b981; }

/* ==========================================================================
   STICKY DOWNLOAD BUTTON
   ========================================================================== */
.sticky-footer { 
    position: fixed; bottom: 0; left: 0; width: 100%; 
    background: rgba(255, 255, 255, 0.85); 
    backdrop-filter: blur(15px); -webkit-backdrop-filter: blur(15px); 
    padding: 15px 40px; border-top: 1px solid rgba(226, 232, 240, 0.8); 
    box-shadow: 0 -10px 40px rgba(0,0,0,0.06); 
    display: flex; justify-content: flex-end; align-items: center;
    z-index: 9999; box-sizing: border-box; 
}
.btn-download { 
    background: linear-gradient(135deg, #10b981 0%, #059669 100%); 
    color: #fff; border: none; padding: 14px 45px; font-size: 17px; 
    font-weight: 700; border-radius: 50px; cursor: pointer; 
    box-shadow: 0 8px 25px rgba(16, 185, 129, 0.4); 
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); 
    display: inline-flex; align-items: center; gap: 12px; 
    font-family: inherit; letter-spacing: 0.5px; 
    animation: pulse-green 2.5s infinite; 
}
.btn-download:hover { 
    transform: translateY(-4px) scale(1.03); 
    box-shadow: 0 12px 30px rgba(16, 185, 129, 0.5); 
    animation: none; background: linear-gradient(135deg, #059669 0%, #047857 100%); 
}
.btn-download i { font-size: 20px; }

@keyframes pulse-green { 
    0% { box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.6); } 
    70% { box-shadow: 0 0 0 15px rgba(16, 185, 129, 0); } 
    100% { box-shadow: 0 0 0 0 rgba(16, 185, 129, 0); } 
}

/* ==========================================================================
   MOBILE RESPONSIVE CSS
   ========================================================================== */
@media (max-width: 950px) {
    .footer-main-container { 
        grid-template-columns: 1fr; gap: 40px; 
        padding: 50px 20px 40px; text-align: center; 
    }
    .brand-name, .social-icons { justify-content: center; }
    .brand-desc { margin: 0 auto 25px; }
    .footer-links a { justify-content: center; }
}

@media (max-width: 768px) {
    /* Mobile Redesign for Footer Bottom */
    .footer-bottom-inner { 
        flex-direction: column; 
        gap: 18px; 
        text-align: center; 
        padding: 30px 20px; 
    }
    .legal-links { 
        justify-content: center; 
        flex-wrap: wrap; 
        gap: 12px 20px; 
    }
    /* Adds a beautiful dot separator between legal links on mobile */
    .legal-links li { position: relative; }
    .legal-links li:not(:last-child)::after {
        content: "•";
        position: absolute;
        right: -13px;
        color: #cbd5e1;
    }
    
    .sticky-footer { padding: 12px 20px; justify-content: center; }
    .btn-download { width: 100%; padding: 14px 25px; justify-content: center; font-size: 16px; }
}