/**
 * ==========================================================
 * Footer Styles
 * ==========================================================
 *
 * Styles für den gemeinsamen Website-Footer.
 *
 * Enthält:
 * - Footer-Grundlayout
 * - Markenbereich
 * - Kontaktmöglichkeiten
 * - Service-Navigation
 * - rechtliche Navigation
 * - Copyright
 *
 * Diese Datei wird auf allen regulären Seiten geladen.
 * Die Coming-Soon-Seite besitzt einen eigenen Footer und
 * verwendet stattdessen coming-soon.css.
 */

/* ==========================================================
   Footer-Grundlayout
========================================================== */

.site-footer {
    color: #222222;
    background-color: #f5f1e8;

    border-top: 1px solid rgba(34, 34, 34, 0.1);
}

.site-footer__container {
    display: grid;
    grid-template-columns:
        minmax(320px, 1.7fr)
        minmax(190px, 0.7fr);
    gap: 7rem;

    max-width: 1400px;

    margin: 0 auto;
    padding: 25px 24px 58px;
}

/* ==========================================================
   Markenbereich
========================================================== */

.site-footer__brand {
    display: flex;
    align-items: flex-start;
    flex-direction: column;

    min-width: 0;
}

.site-footer__logo {
    display: inline-block;

    margin-bottom: 20px;
}

.site-footer__logo-image {
    display: block;

    width: 145px;
    height: auto;
}

.site-footer__brand-content {
    max-width: 390px;
}

.site-footer__brand-name {
    margin: 0 0 10px;

    color: #222222;

    font-family: "Cormorant Garamond", serif;
    font-size: 1.7rem;
    font-weight: 600;
    line-height: 1.2;
}

.site-footer__description {
    margin: 0;

    color: rgba(34, 34, 34, 0.72);

    font-size: 0.95rem;
    font-weight: 400;
    line-height: 1.75;
}

/* ==========================================================
   Kontakt
========================================================== */

.site-footer__contact {
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    gap: 12px;

    margin-top: 26px;
}

.site-footer__contact-link {
    display: inline-flex;
    align-items: center;
    gap: 0.7rem;

    color: rgba(34, 34, 34, 0.82);

    font-size: 0.93rem;
    font-weight: 500;
    line-height: 1.4;
    text-decoration: none;

    transition:
        color 0.2s ease,
        transform 0.2s ease;
}

.site-footer__contact-link i {
    width: 20px;

    color: #8b6b47;

    font-size: 1.2rem;
    text-align: center;
}

.site-footer__contact-link:hover,
.site-footer__contact-link:focus-visible {
    color: #8b6b47;

    transform: translateX(3px);
}

/* ==========================================================
   Footer-Spalten
========================================================== */

.site-footer__column {
    min-width: 0;
}

.site-footer__column:last-child {
    justify-self: end;

    width: max-content;
}

.site-footer__heading {
    position: relative;

    margin: 0 0 24px;
    padding-bottom: 10px;

    color: #222222;

    font-family: "Cormorant Garamond", serif;
    font-size: 1.35rem;
    font-weight: 600;
    line-height: 1.2;
}

.site-footer__heading::after {
    position: absolute;
    bottom: 0;
    left: 0;

    width: 30px;
    height: 2px;

    background-color: #8b6b47;

    border-radius: 2px;

    content: "";
}

/* ==========================================================
   Footer-Navigation
========================================================== */

.site-footer__menu {
    display: flex;
    flex-direction: column;
    gap: 13px;

    margin: 0;
    padding: 0;

    list-style: none;
}

.site-footer__menu-item {
    margin: 0;
    padding: 0;
}

.site-footer__menu a {
    display: inline-block;

    color: rgba(34, 34, 34, 0.74);

    font-size: 0.93rem;
    font-weight: 400;
    line-height: 1.45;
    text-decoration: none;

    transition:
        color 0.2s ease,
        transform 0.2s ease;
}

.site-footer__menu a:hover,
.site-footer__menu a:focus-visible {
    color: #8b6b47;

    transform: translateX(4px);
}

/* ==========================================================
   Footer-Abschluss
========================================================== */

.site-footer__bottom {
    border-top: 1px solid rgba(34, 34, 34, 0.09);
}

.site-footer__bottom-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;

    max-width: 1400px;

    margin: 0 auto;
    padding: 20px 24px;
}

.site-footer__copyright,
.site-footer__handmade {
    margin: 0;

    color: rgba(34, 34, 34, 0.62);

    font-size: 0.82rem;
    line-height: 1.5;
}

.site-footer__handmade {
    text-align: right;
}