/* ===============================================
   SIMPLE COMPACT FOOTER
   =============================================== */

/* Homepage: pin footer to bottom on desktop */
@media (min-width: 992px) {
    body.home #footer.modern-footer {
        position: fixed;
        bottom: 0;
        left: 0;
        width: 100%;
    }
}

/* Base Footer Styles */
.modern-footer {
    background: transparent;
    color: #000000;
    font-family: 'VAA', Arial, "Helvetica Neue", Helvetica, sans-serif;
    -webkit-font-smoothing: subpixel-antialiased;
    -moz-osx-font-smoothing: auto;
    text-rendering: geometricPrecision;
    margin-bottom: 0;
    width: 100%;
    padding: 20px 40px;
    position: relative;
    z-index: 2;
}

.modern-footer .container {
    max-width: 1980px;
    width: 100%;
    padding-left: 15px;
    padding-right: 15px;
    margin-left: auto;
    margin-right: auto;
}

.footer-content {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 20px;
    width: 100%;
}

/* Left Section */
.footer-left {
    display: flex;
    align-items: center;
    gap: 30px;
    flex-wrap: wrap;
}

.footer-copyright {
    color: #000000;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.4;
    margin: 0;
    font-family: 'VAA', Arial, "Helvetica Neue", Helvetica, sans-serif;
}

.footer-links {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    gap: 20px;
    flex-wrap: wrap;
}

.footer-links li {
    position: relative;
}

.footer-links li:not(:last-child):after {
    content: '|';
    position: absolute;
    right: -12px;
    color: rgba(0, 0, 0, 0.3);
}

.footer-links a {
    color: #000000;
    text-decoration: none;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.4;
    transition: color 0.3s ease;
    font-family: 'VAA', Arial, "Helvetica Neue", Helvetica, sans-serif;
}

.footer-links a:hover {
    color: #666666;
}

/* Right Section */
.footer-right {
    display: flex;
    align-items: center;
    gap: 25px;
    flex-wrap: wrap;
}

.footer-social {
    display: flex;
    gap: 12px;
}

.footer-social a {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: transparent;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #000000;
    font-size: 20px;
    transition: all 0.3s ease;
    text-decoration: none;
}

.footer-social a:hover {
    color: #666666;
    transform: translateY(-2px);
}

.footer-phone {
    color: #000000;
    text-decoration: none;
    font-size: 15px;
    font-weight: 400;
    transition: color 0.3s ease;
    white-space: nowrap;
    font-family: 'VAA', Arial, "Helvetica Neue", Helvetica, sans-serif;
}

.footer-phone:hover {
    color: #666666;
}

.footer-hours {
    color: #000000;
    text-decoration: none;
    font-size: 15px;
    font-weight: 400;
    white-space: nowrap;
    font-family: 'VAA', Arial, "Helvetica Neue", Helvetica, sans-serif;
}

.footer-hours i,
.footer-phone i {
    margin-right: 8px;
}

/* Homepage: off-white text over dark hero */
body.home .modern-footer,
body.home .modern-footer *,
body.home .footer-copyright,
body.home .footer-links a,
body.home .footer-social a,
body.home .footer-phone,
body.home .footer-hours {
    color: #e0dcd4 !important;
}

body.home .footer-links li:not(:last-child):after {
    color: rgba(224, 220, 212, 0.6);
}

/* Tablet/Laptop: 992px-1200px - Centered layout */
@media (min-width: 992px) and (max-width: 1200px) {
    .modern-footer {
        padding: 18px 25px;
    }
    
    .modern-footer .container {
        padding-left: 20px;
        padding-right: 20px;
    }
    
    .footer-content {
        justify-content: center;
        gap: 15px;
        text-align: center;
    }
    
    .footer-left,
    .footer-right {
        width: 100%;
        justify-content: center;
        gap: 15px;
    }
    
    .footer-links {
        justify-content: center;
        gap: 15px;
    }
    
    .footer-hours {
        white-space: normal;
        line-height: 1.3;
    }
    
    .footer-copyright,
    .footer-links a,
    .footer-phone,
    .footer-hours {
        font-size: 14px;
    }
    
    .footer-social a {
        width: 34px;
        height: 34px;
        font-size: 19px;
    }
}

/* Tablet Portrait: 768px-991px - Horizontal layout */
@media (min-width: 768px) and (max-width: 991px) {
    .modern-footer {
        padding: 20px 25px;
    }
    
    .modern-footer .container {
        padding-left: 15px;
        padding-right: 15px;
    }
    
    .footer-content {
        flex-direction: row;
        justify-content: space-between;
        text-align: left;
    }
    
    .footer-left {
        flex: 1 1 auto;
        width: auto;
    }
    
    .footer-right {
        flex: 0 1 auto;
        width: auto;
        justify-content: flex-end;
    }
    
    .footer-links {
        gap: 12px;
        justify-content: flex-start;
    }
    
    .footer-copyright,
    .footer-links a,
    .footer-phone,
    .footer-hours {
        font-size: 14px;
    }
    
    .footer-social a {
        width: 34px;
        height: 34px;
        font-size: 19px;
    }
}

/* Mobile: max-width 991px - Vertical stacked */
@media (max-width: 991px) {
    .modern-footer {
        padding: 25px 20px;
    }
    
    .modern-footer .container {
        padding-left: 0;
        padding-right: 0;
    }
    
    .footer-content {
        flex-direction: column;
        text-align: center;
    }
    
    .footer-left {
        flex-direction: column;
        width: 100%;
    }
    
    .footer-right {
        width: 100%;
        justify-content: center;
    }
    
    .footer-links {
        justify-content: center;
    }
}

/* Small Mobile: max-width 767px */
@media (max-width: 767px) {
    .modern-footer {
        padding: 25px 16px;
    }
    
    .footer-copyright,
    .footer-links a,
    .footer-phone {
        font-size: 14px;
    }
    
    .footer-hours {
        font-size: 13px;
    }
    
    .footer-social a {
        width: 32px;
        height: 32px;
        font-size: 18px;
    }
}

/* Extra Small Mobile: max-width 480px */
@media (max-width: 480px) {
    .modern-footer {
        padding: 20px 12px;
    }
    
    .footer-links {
        flex-direction: column;
        gap: 10px;
    }
    
    .footer-links li:not(:last-child):after {
        display: none;
    }
    
    .footer-right {
        flex-direction: column;
        gap: 12px;
    }
    
    .footer-hours {
        font-size: 12px;
        white-space: normal;
    }
}

/* Remove tap highlights */
.modern-footer a {
    -webkit-tap-highlight-color: transparent;
}
