/* ============================
   SITE FOOTER
   ============================ */
.site-footer {
    position: relative;
    margin-top: 3rem;
    padding: 1.5rem 1rem;
    color: var(--color-cream, #f7f2d8);
    text-align: center;
    background: var(--color-navy, #071f4a);
    border-top: 3px solid var(--color-gold, #f6cc4f);
    box-shadow: 0 -4px 16px rgb(7 31 74 / 0.1);
}

.site-footer-text {
    margin: 0;
    color: var(--color-cream, #f7f2d8);
    font-size: 0.875rem;
    line-height: 1.5;
}

/* ============================
   FOOTER LINKS
   ============================ */
.site-footer-links {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 0.5rem 1rem;
    margin-top: 0.65rem;
}

.site-footer-links a,
.cookie-settings-button {
    position: relative;
    padding: 0.2rem 0;
    color: var(--color-white, #ffffff);
    background: transparent;
    border: 0;
    font: inherit;
    font-size: 0.85rem;
    line-height: 1.5;
    text-decoration-color: rgb(246 204 79 / 0.65);
    text-decoration-line: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 0.25rem;
    cursor: pointer;
    transition:
        color var(--duration-fast, 0.2s) ease,
        text-decoration-color var(--duration-fast, 0.2s) ease;
}

.site-footer-links a:hover,
.cookie-settings-button:hover {
    color: var(--color-gold, #f6cc4f);
    text-decoration-color: var(--color-gold, #f6cc4f);
}

.site-footer-links a:focus-visible,
.cookie-settings-button:focus-visible {
    color: var(--color-gold, #f6cc4f);
    outline: 3px solid rgb(246 204 79 / 0.55);
    outline-offset: 4px;
    border-radius: var(--radius-xs, 0.25rem);
}

/* ============================
   WIDER SCREENS
   ============================ */
@media (min-width: 40rem) {
    .site-footer {
        padding-block: 1.75rem;
    }

    .site-footer-text {
        font-size: 0.925rem;
    }
}