/* =====================================================================
   Testimonials page — /testimonials/ singleton.

   Renders a responsive 3-column grid of .mm-quote-card cards (the same
   card BEM block used on the homepage testimonials section). The card
   styles themselves live in homepage.css; this file only owns the grid
   wrapper, page-section affordances, and the empty-state card.

   3 / 2 / 1 column responsive grid matching meet-our-team.css.
===================================================================== */

.mm-testimonials-page {
    /* Section padding + background already applied via block attributes
       (paper bg, section-y top/bottom, 5 inline). This rule just sets
       the mobile scroll-margin so deep-link anchors land below the
       sticky header. */
    scroll-margin-top: 88px;
}

.mm-testimonials-page__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--mm-s-6);
    align-items: stretch;
}

@media (min-width: 768px) {
    .mm-testimonials-page__grid {
        grid-template-columns: repeat(2, 1fr);
        gap: var(--mm-s-5);
    }
}

@media (min-width: 1024px) {
    .mm-testimonials-page__grid {
        grid-template-columns: repeat(3, 1fr);
        gap: var(--mm-s-6);
    }
}

/* Empty-state card — surface a soft notice when no testimonials are
   published. Keeps the same paper-card visual language as the rest of
   the site so the page never reads as broken. */
.mm-testimonials-page__empty {
    max-width: 720px;
    margin-inline: auto;
    padding: var(--mm-s-8) var(--mm-s-6);
    background-color: #fff;
    border: 1px solid var(--mm-line);
    border-radius: 20px;
    text-align: center;
}

.mm-testimonials-page__empty p {
    margin: 0;
    font-family: var(--mm-font-body);
    font-size: 17px;
    line-height: 1.6;
    color: var(--mm-ink-2);
}

.mm-testimonials-page__empty a {
    color: var(--mm-teal-700);
    text-decoration: underline;
    text-underline-offset: 3px;
    text-decoration-thickness: 1.5px;
}