/* Footer Overall Styling and Overlap Fix */
.site-footer, #colophon, footer, #footer {
    clear: both;
    position: relative;
    z-index: 99;
    margin-top: 50px;
    background: #1a1a2e !important;
}

.site-content, #content, main {
    padding-bottom: 60px;
}

#footer .footer-widget {
    background: #1a1a2e;
    padding: 60px 0 40px;
}

#footer .widget-title {
    color: #d4a853 !important;
    font-size: 16px !important;
    letter-spacing: 2px;
    text-transform: uppercase;
    margin-bottom: 20px;
    font-weight: 500;
}

#footer .widget ul li a {
    color: #e8e0d5 !important;
    font-size: 14px;
    transition: color 0.3s ease;
    text-decoration: none;
}

#footer .widget ul li a:hover {
    color: #b8860b !important;
}

#footer p {
    color: #e8e0d5 !important;
}

#footer a {
    color: #e8e0d5;
    transition: color 0.3s ease;
}

#footer a:hover {
    color: #b8860b;
}

#footer .copywrap {
    background: #0f0f1a !important;
    padding: 20px 0;
    border-top: 1px solid rgba(255,255,255,0.1);
}

#footer .copywrap p {
    color: #e8e0d5;
    font-size: 13px;
    margin: 0;
}

#footer .copywrap a {
    color: #b8860b !important;
}

#footer aside.widget {
    background: transparent;
    border: none;
    padding: 0;
}

.site-footer .widget-area {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}

.site-footer .widget-area .widget {
    flex: 1 1 250px;
    margin-bottom: 20px;
}

@media (max-width: 768px) {
    .site-footer .widget-area {
        flex-direction: column;
    }
}