/* ==========================================================================
   Thiruthanigai Footer Styles (Pixel-Matched to Design)
   ========================================================================== */

.site-footer {
    width: 100%;
    background-color: #ffffff;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    position: relative;
    padding-top: 0;
    box-sizing: border-box;
}

/* 1. Top Decorative Accent Borders */
.footer-top-border {
    width: 100%;
}
.footer-top-border .border-blue {
    height: 10px;
    background-color: #0d47a1; /* Darker Primary Navy */
}
.footer-top-border .border-yellow {
    height: 5px;
    background-color: #fbc02d; /* Gold/Yellow Accent */
}

/* 2. Main Footer Container */
.footer-container {
    max-width: 1000px;
    margin: 0 auto;
    padding: 30px 20px 35px;
}

/* 3. Centered Brand Logo */
.footer-logo-wrapper {
    text-align: center;
    margin-bottom: 25px;
}
.footer-logo-wrapper img {
    max-height: 65px;
    width: auto;
    display: inline-block;
}

/* 4. 3-Column Grid Layout (Centrally Grouped) */
.footer-grid {
    display: grid;
    grid-template-columns: 1fr 1.8fr 1fr;
    gap: 20px;
    align-items: start;
    max-width: 800px; /* Pulls left and right columns close to center */
    margin: 0 auto;
}

/* Common Column Headings */
.footer-heading {
    font-size: 1.15rem;
    font-weight: 800;
    color: #0f172a;
    margin-top: 0;
    margin-bottom: 12px;
    line-height: 1.2;
}

/* Common Navigation Links */
.footer-links {
    list-style: none;
    padding: 0;
    margin: 0;
}
.footer-links li {
    margin-bottom: 8px;
}
.footer-links a {
    color: #64748b;
    text-decoration: none;
    font-size: 0.95rem;
    font-weight: 500;
    transition: color 0.2s ease;
}
.footer-links a:hover {
    color: #0d47a1;
}

/* Column 1: Left Column (Company) */
.footer-col-left {
    text-align: right !important; /* Aligns text towards center */
    padding-right: 15px;
}

/* Column 2: Center Column (Address, Contact & Socials) */
.footer-col-center {
    text-align: center;
}

.footer-address {
    color: #64748b;
    font-size: 0.95rem;
    line-height: 1.5;
    margin: 0 0 16px 0;
    font-weight: 500;
}

.footer-contact-info {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    margin-bottom: 20px;
}

.contact-item {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    color: #64748b;
}

.contact-item svg {
    flex-shrink: 0;
    color: #64748b;
}

.contact-item a {
    color: #64748b;
    text-decoration: none;
    font-size: 0.95rem;
    font-weight: 500;
    transition: color 0.2s ease;
}
.contact-item a:hover {
    color: #0d47a1;
}

/* Social Icons Section */
.footer-socials {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
}

.socials-title {
    font-size: 0.8rem;
    font-weight: 700;
    color: #0f172a;
}

.social-icons {
    display: flex;
    gap: 14px;
    align-items: center;
    justify-content: center;
}

.social-icons a {
    color: #0284c7; /* Cyan blue for social icons */
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.2s ease, color 0.2s ease;
}
.social-icons a:hover {
    color: #0d47a1;
    transform: translateY(-2px);
}

/* Column 3: Right Column (Quick Links) */
.footer-col-right {
    text-align: left; /* Aligns text towards center */
    padding-left: 15px;
}

/* 5. Bottom Dark Blue Legal Bar */
.footer-bottom-bar {
    background-color: #0d47a1;
    padding: 8px 20px;
    width: 100%;
    box-sizing: border-box;
}

.legal-links {
    max-width: 1000px;
    margin: 0 auto;
    display: flex;
    justify-content: flex-end;
    gap: 20px;
}

.legal-links a {
    color: #93c5fd;
    text-decoration: none;
    font-size: 0.75rem;
    transition: color 0.2s ease;
}

.legal-links a:hover {
    color: #ffffff;
}

/* ==========================================================================
   Mobile Responsive Footer Overrides
   ========================================================================== */

@media (max-width: 768px) {
    /* Container Adjustments */
    .footer-container {
        padding: 24px 16px 28px;
    }

    .footer-logo-wrapper {
        margin-bottom: 20px;
    }

    .footer-logo-wrapper img {
        max-height: 50px; /* Slightly smaller logo on mobile */
    }

    /* Grid Layout: Stack into a single neat column */
    .footer-grid {
        grid-template-columns: 1fr;
        gap: 28px;
        text-align: center !important;
        max-width: 100%;
    }

    /* Force all columns to align center on mobile */
    .footer-col-left,
    .footer-col-center,
    .footer-col-right {
        text-align: center !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    /* Column Headings */
    .footer-heading {
        font-size: 1.1rem;
        margin-bottom: 10px;
    }

    /* Links: Increase touch area for mobile taps */
    .footer-links li {
        margin-bottom: 10px;
    }

    .footer-links a {
        display: inline-block;
        padding: 4px 0; /* Larger tap target */
        font-size: 0.95rem;
    }

    /* Address & Contacts */
    .footer-address {
        font-size: 0.9rem;
        max-width: 320px;
        margin: 0 auto 16px;
    }

    .footer-contact-info {
        gap: 12px;
    }

    .contact-item a {
        padding: 4px 0;
    }

    /* Social Icons: Increase touch size and spacing */
    .social-icons {
        gap: 18px;
    }

    .social-icons a {
        padding: 6px; /* Tap buffer */
        font-size: 1.2rem;
    }

    /* Bottom Legal Bar */
    .footer-bottom-bar {
        padding: 12px 16px;
    }

    .legal-links {
        justify-content: center !important;
        flex-wrap: wrap;
        gap: 12px 16px;
    }

    .legal-links a {
        font-size: 0.78rem;
        padding: 2px 4px;
    }
}