


.site-footer.em-footer {
    position: relative;
    isolation: isolate;
    overflow: hidden;
}

/* Keep footer content above the illustration */
.site-footer.em-footer .em-footer-content {
    position: relative;
    z-index: 2;
}

/* SVG landscape positioning */
.site-footer.em-footer > .em-footer-landscape {
    position: absolute;
    z-index: 0;
    left: 0;
    bottom: 0;

    display: block;
    width: 100%;
    height: clamp(160px, 19vw, 255px);

    color: #D4AF37;
    opacity: .19;

    pointer-events: none;
    user-select: none;
    overflow: visible;
}

/* Distant mountain movement */
.em-footer-ridge-back {
    transform-origin: center;
    animation: emFooterMountainBack 24s ease-in-out infinite alternate;
}

/* Main mountain movement */
.em-footer-ridge-main {
    transform-origin: center;
    animation: emFooterMountainMain 19s ease-in-out infinite alternate;
}

/* Foreground contour */
.em-footer-ridge-front {
    animation: emFooterMountainFront 28s ease-in-out infinite alternate;
}

/* Gentle sun breathing effect */
.em-footer-sun {
    transform-box: fill-box;
    transform-origin: center;
    animation: emFooterSunGlow 9s ease-in-out infinite;
}

/* Snow details */
.em-footer-snowcaps {
    transition: opacity .6s ease;
}


@keyframes emFooterMountainBack {
    from {
        transform: translate3d(-4px, 2px, 0);
    }

    to {
        transform: translate3d(5px, -2px, 0);
    }
}

@keyframes emFooterMountainMain {
    from {
        transform: translate3d(2px, 1px, 0);
    }

    to {
        transform: translate3d(-4px, -2px, 0);
    }
}

@keyframes emFooterMountainFront {
    from {
        transform: translateX(-3px);
    }

    to {
        transform: translateX(4px);
    }
}

@keyframes emFooterSunGlow {
    0%, 100% {
        opacity: .42;
        transform: scale(.98);
    }

    50% {
        opacity: .72;
        transform: scale(1.025);
    }
}



@media (max-width: 768px) {
    .site-footer.em-footer > .em-footer-landscape {
        height: clamp(130px, 29vw, 190px);
        opacity: .16;
    }
}

@media (max-width: 480px) {
    .site-footer.em-footer > .em-footer-landscape {
        height: 145px;
        opacity: .14;
    }
}
