/* Static grain sits behind the content; no animation, script or interaction layer. */
.sutr-footer {
    position: relative;
    isolation: isolate;
    background: #171717;
}
.sutr-footer::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background: url("assets/footer-grain.svg") repeat;
    background-size: 180px 180px;
    opacity: .14;
}
.sutr-footer > .sutr-container {
    position: relative;
    z-index: 1;
}

/* Reuse the original transparent SUTR artwork as an unboxed white lockup. */
.sutr-footer .sutr-footer-brand {
    background: transparent;
    padding: 0;
    border: 0;
    border-radius: 0;
    box-shadow: none;
}
.sutr-footer .sutr-footer-brand img {
    display: block;
    height: auto;
    filter: brightness(0) invert(1);
}

/* Recognizable, compact platform marks with comfortable keyboard/touch targets. */
.sutr-footer .sutr-footer-socials {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    margin-top: 4px;
}
.sutr-footer .sutr-footer-socials a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    padding: 0;
    color: #fff;
    border-radius: 50%;
    text-decoration: none;
}
.sutr-footer .sutr-footer-socials .sutr-social-icon {
    display: block;
    flex: none;
    width: 22px;
    height: 22px;
    fill: currentColor;
    pointer-events: none;
}
.sutr-footer .sutr-footer-socials a:is(:hover, :focus-visible) {
    color: var(--sutr-yellow);
    text-decoration: none;
}
.sutr-footer .sutr-footer-socials a:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 2px;
}
@media (forced-colors: active) {
    .sutr-footer::before { display: none; }
    .sutr-footer .sutr-footer-brand { forced-color-adjust: none; background: #212121; }
}