/*
 * Phase-18 footer depth and shared static state gallery.
 */

.site-footer {
    position: relative;
    overflow: hidden;
    background:
        linear-gradient(135deg, var(--bhw-color-surface-warm), var(--bhw-color-background-secondary) 58%),
        var(--bhw-color-background-secondary);
}

.site-footer::before {
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 15% 50%, var(--bhw-color-gold-wash), transparent 24rem);
    content: "";
    pointer-events: none;
}

.site-footer__grid,
.site-footer__meta {
    position: relative;
}

.bhw-footer__brand {
    display: flex;
    gap: var(--bhw-space-3);
}

.bhw-footer__brand img {
    width: 4.5rem;
    height: 4.5rem;
    flex: 0 0 auto;
    object-fit: contain;
}

.bhw-footer__brand h2 {
    margin-block-end: var(--bhw-space-2);
}

.site-footer__meta {
    display: flex;
    justify-content: space-between;
    gap: var(--bhw-space-3);
}

.bhw-footer__preview {
    text-align: end;
}

.bhw-state-gallery {
    display: grid;
    gap: var(--bhw-space-4);
    margin-block-start: var(--bhw-space-7);
}

.bhw-state-gallery > div {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--bhw-layout-grid-gap);
}

.bhw-spinner {
    display: block;
    width: 2rem;
    height: 2rem;
    border: 0.2rem solid var(--bhw-color-border);
    border-block-start-color: var(--bhw-color-accent);
    border-radius: 50%;
    animation: bhw-spin 0.8s linear infinite;
}

@keyframes bhw-spin {
    to {
        transform: rotate(1turn);
    }
}