.site-footer {
    padding: 80px 30px 40px;
    background: linear-gradient( 90deg, #24160d, #3b2618 );
    color: white;
    border-top: 4px solid var(--gold);
    text-align: center;
}

.footer-content {
    max-width: 900px;
    margin: auto;
}

.site-footer h2 {
    color: var(--gold-light);
    font-size: 45px;
}

.footer-quote {
    font-size: 25px;
    font-style: italic;
    color: #ead9aa;
    margin: 30px auto;
}

.footer-links {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 30px;
    margin: 40px 0;
}

.footer-links a {
    color: white;
    text-decoration: none;
    font-family: var(--title-font);
}

.footer-links a:hover,
.footer-links a:focus-visible {
    color: var(--gold-light);
}

.footer-links a:focus-visible,
.social-button:focus-visible,
.footer-book .button:focus-visible {
    outline: 2px solid var(--gold-light);
    outline-offset: 4px;
}

.footer-links a:focus-visible {
    border-radius: 4px;
}

.copyright {
    opacity: .7;
    font-size: 16px;
}

/* =====================================
   SOCIAL LINKS
===================================== */

.footer-socials {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 14px;
    margin: 35px 0;
}

.social-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 130px;
    padding: 11px 18px;
    border: 1px solid var(--gold);
    border-radius: 30px;
    color: white;
    background: rgba(255,255,255,.06);
    font-family: var(--title-font);
    font-size: 14px;
    text-decoration: none;
    transition: transform .25s ease, background .25s ease, color .25s ease, box-shadow .25s ease;
}

.social-button:hover,
.social-button:focus-visible {
    transform: translateY(-3px);
    background: var(--gold);
    color: var(--dark-leather);
    box-shadow: 0 8px 18px rgba(0,0,0,.25);
}

.social-button.is-placeholder {
    opacity: .58;
    cursor: default;
}

.social-button.is-placeholder:hover {
    transform: none;
    background: rgba(255,255,255,.06);
    color: white;
    box-shadow: none;
}

.social-button {
    gap: 9px;
}

.social-button svg {
    width: 19px;
    height: 19px;
    flex: 0 0 auto;
    fill: currentColor;
}

/* =====================================
   FOOTER BOOK BUTTON
===================================== */

.footer-book {
    margin: 40px 0;
}

.footer-book .button {
    position: relative;
    display: inline-block;
    overflow: hidden;
    padding: 14px 34px;
    border: 2px solid var(--gold);
    border-radius: 50px;
    background: linear-gradient( 135deg, var(--gold), var(--gold-light) );
    color: var(--dark-leather);
    font-family: var(--title-font);
    font-size: 18px;
    text-decoration: none;
    box-shadow: 0 7px 18px rgba(0,0,0,.22);
    transition: transform .25s ease, box-shadow .25s ease;
}

.footer-book .button::after {
    content: "";
    position: absolute;
    top: 0;
    left: -120%;
    width: 80%;
    height: 100%;
    background: linear-gradient( 120deg, transparent, rgba(255,255,255,.55), transparent );
    transform: skewX(-25deg);
    transition: left .6s ease;
}

.footer-book .button:hover,
.footer-book .button:focus-visible {
    transform: translateY(-4px);
    box-shadow: 0 11px 25px rgba(0,0,0,.3);
}

.footer-book .button:hover::after,
.footer-book .button:focus-visible::after {
    left: 130%;
}

@media(max-width: 600px) {
    .footer-socials {
        gap: 10px;
    }

    .social-button {
        min-width: 0;
        flex: 1 1 45%;
        max-width: 180px;
    }

    .footer-book {
        margin: 30px 0;
    }

    .footer-book .button {
        padding: 12px 28px;
        font-size: 16px;
    }
}
