/* ======================================================================
   Sauce Partner Logo Grid  —  v1.12.0
   Widget: sauce-partner-grid
   Responsive grid of partner logos (5 / 3 / 2). Each logo sits in a fixed-
   height box so the rule under it and the name below line up across a row.
   ====================================================================== */

.sauce-partner-grid {
    --spg-cols:      5;
    --spg-row-gap:   0px;
    --spg-col-gap:   0px;
    --spg-logo-h:    120px;     /* fixed logo-box height -> aligned borders */
    --spg-logo-w:    170px;     /* max logo width */
    --spg-logo-pad:  18px;      /* padding inside the logo box */
    --spg-name-gap:  18px;      /* space between the rule and the name */
    --spg-cell-pad:  20px;      /* horizontal padding inside each cell */
    --spg-border:    var(--sauce-sage, #AABCA2);
    --spg-text:      var(--sauce-sage, #AABCA2);

    width: 100%;
}

.spg__grid {
    display: grid;
    grid-template-columns: repeat(var(--spg-cols), 1fr);
    gap: var(--spg-row-gap) var(--spg-col-gap);
}

.spg__item {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 0 var(--spg-cell-pad);
    box-sizing: border-box;
}

/* Fixed-height logo box with the rule on its bottom edge. */
.spg__logo {
    width: 100%;
    height: var(--spg-logo-h);
    display: flex;
    align-items: center;
    justify-content: center;
    padding-bottom: var(--spg-logo-pad);
    border-bottom: 1px solid var(--spg-border);
    box-sizing: border-box;
}
.spg__logo img {
    max-height: 100%;
    max-width: var(--spg-logo-w);
    width: auto;
    height: auto;
    object-fit: contain;
    display: block;
}

.spg__name {
    margin: var(--spg-name-gap) 0 0;
    color: var(--spg-text);
    line-height: 1.4;
}

/* ── Responsive: 5 / 3 / 2 ───────────────────────────────────────────── */
@media (max-width: 1024px) {
    .sauce-partner-grid { --spg-cols: 3; }
}
@media (max-width: 767px) {
    .sauce-partner-grid { --spg-cols: 2; --spg-logo-h: 96px; --spg-cell-pad: 12px; }
}
