.reference_logos_block {
    background-color: var(--mobino-surface, var(--color-secondary));
}

.reference_logos_heading {
    margin: 0;
    text-align: left;
}

.reference_logos_grid {
    display: flex;
    flex-wrap: wrap;
    gap: 2rem;
    list-style: none;
    margin: 0;
    padding: 0;
}

.reference_logo_slot {
    flex: 0 0 18rem;
    aspect-ratio: 3 / 1.4;
    border: 1px solid transparent;
    border-radius: 1.4rem;
    /* Fixed dark chip, not the flipping surface token — the logo assets
       are white monochrome PNGs and need a dark backdrop regardless of the
       overall page theme. */
    background: var(--mobino-dark-ink, #0B034C);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1.8rem;
}

.reference_logo_slot a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
}

.reference_logo_slot img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

.reference_logo_placeholder {
    color: var(--color-slate-400);
    font-size: 1.4rem;
    text-align: center;
}

@media (max-width: 600px) {
    .reference_logo_slot {
        flex: 1 1 45%;
    }
}
