/**
 * Testimonials Wall block. Self-contained styles.
 * Three columns of award badge + review card. Badges pair with the review
 * below them; single column on mobile so the flow reads badge, review,
 * badge, review, badge, review.
 */

.testimonials-wall {
    padding-top: 48px;
    padding-bottom: 48px;
}

.testimonials-wall__heading {
    margin: 0 0 32px;
    font-size: 30px;
    font-weight: 700;
}

/* Review columns: equal-height, bordered cards. */
.testimonials-wall__reviews {
    display: grid;
    grid-template-columns: 1fr;
    gap: 20px;
    align-items: stretch;
}

/* One badge + review pairing. The review grows so cards stay equal height
   even when badge heights differ. */
.testimonials-wall__item {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.testimonials-wall__item-badge {
    display: flex;
    justify-content: center;
}

.testimonials-wall__badge {
    max-width: 135px;
    height: auto;
}

.review-embed {
    flex: 1 1 auto;
    overflow: hidden;
}

.review-embed iframe {
    display: block;
    /* The Gartner snippet has internal side padding; widen + offset the iframe so
       its content runs to the bordered edges (clipped by the wrapper's overflow). */
    width: calc(100% + 48px);
    max-width: none;
    margin-left: -24px;
    height: 420px;
    border: 0;
}

@media (min-width: 768px) {
    .testimonials-wall__reviews {
        grid-template-columns: repeat(3, 1fr);
    }

    /* Align card tops across columns: the badge row is shared via subgrid so
       it sizes to the tallest badge, and every review starts on the same line.
       Badges sit at the bottom of that row, just above their cards. */
    .testimonials-wall__item {
        display: grid;
        grid-template-rows: subgrid;
        grid-row: span 2;
    }

    .testimonials-wall__item-badge {
        align-self: end;
    }
}

@media (min-width: 992px) {
    .testimonials-wall {
        padding-top: 80px;
        padding-bottom: 80px;
    }

    .testimonials-wall__heading {
        font-size: 38px;
    }

    .testimonials-wall__badge {
        max-width: 160px;
    }
}