/* =========================================================
   SITE FOOTER

   COMPACT   < 610       location + email + meta
   WIDE      610–779     location + sitemap
   EDITORIAL 780–1199    larger / wider map
   MAX       1200+       max-width editorial composition
   ========================================================= */

.site-footer {
    width: 100%;

    /*
       Visible footer background.
       NOTE: this paints the footer itself; the Safari bottom browser
       canvas is painted by BODY in layout.css.
    */
    background-color: var(--surface-footer);
    font-family: var(--secondary-font);
    color: var(--secondary-color);
}

.site-footer-legal-surface {
    width: 100%;
    background: var(--bg-color);
}

.site-footer-surface {
    width: 100%;
    background-color: var(--surface-footer);
    /*background-color: var(--primary-color);*/
    /*background-color: #191919;*/
}

.site-footer a {
    color: inherit;
    text-decoration: none;
}

.site-footer a:hover {
    color: var(--primary-color);
}

.site-footer-legal {
    /*
      The page's own bottom spacing reaches the first footer element.
      When legal content exists, that first element is the legal notice.
      Only the smaller internal gap to the grey footer surface lives here.
    */
    padding-top: 0;
    padding-bottom: 40px;
}

.site-footer-main {
    padding-top: 40px;
    padding-bottom: 40px;
}

/* ---------- TOP ---------- */

.site-footer-top {
    display: grid;
    grid-template-columns: 1fr;
    margin-bottom: -24px;
}

.site-footer-location {
    display: grid;
    grid-template-columns: 72px minmax(0, 1fr);
    gap: 30px;
    align-items: start;
}

.site-footer-map {
    position: relative;
    width: 72px;
    height: 72px;
    overflow: hidden;
}

/* COMPACT — static thumbnail */

.site-footer-map-static {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
}

.site-footer-map-static::after {
    content: "📍";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 30px;
    line-height: 1;
    pointer-events: none;
    filter: drop-shadow(0 2px 5px rgba(0, 0, 0, 0.18));
}

.site-footer-map-static img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}


/* WIDE+ — interactive Google Map */

.site-footer-map-live {
    display: none;
    position: relative;
    width: 100%;
    height: 100%;
}

.site-footer-map-live iframe {
    display: block;
    width: 100%;
    height: 100%;
    border: 0;
    pointer-events: none;
}

.site-footer-map-link {
    position: absolute;
    inset: 0;
    z-index: 2;
    cursor: pointer;
}

.site-footer-address {
    font-size: var(--font-size-XS);
    line-height: 1.45;
    color: var(--primary-color);
}

.site-footer-address p {
    margin: 0;
    font-family: var(--secondary-font);
    font-size: inherit;
}

.site-footer-address p + p {
    margin-top: 16px;
}

/* ---------- SITEMAP ---------- */

.site-footer-sitemap {
    display: none;
}

.site-footer-nav-group + .site-footer-nav-group {
    margin-top: 22px;
}

.site-footer-nav-title {
    margin: 0 0 10px;
    padding-bottom: 10px;
    border-bottom: 1px solid #00000060;

    font-size: 11px;
    font-weight: var(--weight-semibold);
    line-height: 1.2;
    height: auto;
    color: var(--secondary-color);
    opacity: 0.7;
    text-transform: uppercase;
    letter-spacing: 0.01em;
}

.site-footer-nav-links {
    display: flex;
    flex-direction: column;
    gap: 7px;
}

.site-footer-nav-link {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 16px;

    font-size: var(--font-size-XS);
    line-height: 1.3;
}

.site-footer-nav-year {
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
    font-size: 11px;
}

/* ---------- EMAIL ---------- */

.site-footer-email {
    margin-top: 38px;
    padding-bottom: 14px;
    border-bottom: 1px solid #00000030;
}

.site-footer-email-link {
    display: block;
    width: 100%;
    line-height: 0;
}

.site-footer-email-image {
    display: none;
    width: 100%;
    height: auto;
}

/* ---------- META ---------- */

.site-footer-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding-top: 22px;
}

.site-footer-copyright,
.site-footer-copyright a {
    font-size: var(--font-size-XS);
    line-height: 1.3;
}

/*
   COMPACT:
   the text email replaces the author copyright in the meta row.
*/
.site-footer-copyright-email {
    display: inline;
}

.site-footer-copyright-author {
    display: none;
}

.footer-language {
    display: flex;
    align-items: center;
    gap: 10px;

    font-family: var(--secondary-font);
    font-size: var(--font-size-XS);
    font-weight: var(--weight-regular);
}

.footer-language-current {
    color: var(--primary-color);
    font-weight: var(--weight-semibold);
}

.footer-language-link {
    color: var(--secondary-color);
}

.footer-language-separator {
    color: var(--secondary-color);
}

/* =========================================================
   WIDE
   ========================================================= */

@media (min-width: 610px) {
    .site-footer-main {
        padding-top: 82px;
        padding-bottom: 60px;
    }

    .site-footer-top {
        grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
        gap: 60px;
        align-items: start;
    }

    .site-footer-location {
        display: block;
    }

    .site-footer-map {
        width: 100%;
        height: auto;
        aspect-ratio: 1.43 / 1;
    }

    .site-footer-map-static {
        display: none;
    }

    .site-footer-map-live {
        display: block;
    }

    .site-footer-address {
        margin-top: 24px;
    }

    .site-footer-sitemap {
        display: block;
    }

    .site-footer-email {
        margin-top: 72px;
        padding-bottom: 18px;
    }

    /*
       WIDE+:
       the large email.svg returns, and the meta row goes back
       to the author copyright.
    */
    .site-footer-email-image {
        display: block;
    }

    .site-footer-copyright-email {
        display: none;
    }

    .site-footer-copyright-author {
        display: inline;
    }
}

/* =========================================================
   EDITORIAL
   ========================================================= */

@media (min-width: 780px) {
    .site-footer-top {
        grid-template-columns: minmax(0, 1.9fr) minmax(0, 1fr);
        gap: 55px;
    }

    .site-footer-map {
        aspect-ratio: 2.25 / 1;
    }
}

/* =========================================================
   MAX
   ========================================================= */

@media (min-width: 1200px) {
    .site-footer-main {
        padding-top: 80px;
        padding-bottom: 80px;
    }

    .site-footer-top {
        grid-template-columns: minmax(0, 2fr) minmax(230px, 1fr);
        gap: 60px;
    }

    .site-footer-map {
        aspect-ratio: 2.65 / 1;
    }

    .site-footer-email {
        margin-top: 76px;
    }
}
