/* =====================================================
   Brand Trust Sections — "Why LBC" + "Support"
   Reusable shared partials. Reuses the .card / .icon-box /
   .card__header system from cards.css; only adds the grid
   wrapper and the supporting note.
   ===================================================== */

.brand-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--gap-md);
}

.brand-grid .card {
    display: flex;
    flex-direction: column;
    gap: var(--gap-sm);
}

.brand-grid .icon-box {
    width: 48px;
    height: 48px;
    margin: 0;
}

.brand-grid .icon-box svg {
    width: 24px;
    height: 24px;
}

.brand-grid h4 {
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--text-heading);
    margin: 0;
}

.brand-grid p {
    color: var(--text-muted);
    font-size: 0.9375rem;
    line-height: 1.6;
    margin: 0;
}

/* Honest hours / inline emphasis inside a card */
.brand-grid .card strong {
    color: var(--text-heading);
    font-weight: 600;
}

/* Closing note under a brand section (e.g. support tiers) */
.brand-note {
    margin: var(--gap-md) 0 0;
    font-size: 0.875rem;
    line-height: 1.6;
    color: var(--text-muted);
}

.brand-note strong {
    color: var(--text-heading);
    font-weight: 600;
}

@media (max-width: 900px) {
    .brand-grid {
        grid-template-columns: 1fr;
    }
}