.page-head { padding: clamp(64px,10vw,120px) 0 clamp(24px,3vw,40px); text-align: center; }
  .page-head .display { max-width: 14ch; margin: 12px auto 0; }

  /* align-items:start so each card sizes to its own content — short quotes no
     longer stretch to the tallest card and leave an empty gap. */
  .tm-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: clamp(26px,3.4vw,42px); align-items: start; }
  @media (max-width: 760px) { .tm-grid { grid-template-columns: 1fr; } }

  /* Each testimonial reads as a chat bubble: one squared corner + a small tail. */
  .tm-card {
    position: relative;
    background: #fff;
    border-radius: 22px 22px 22px 6px;
    padding: clamp(20px,2.4vw,30px);
    box-shadow: var(--shadow);
    display: flex; flex-direction: column; gap: 16px;
    opacity: 0; transition: opacity .6s ease; will-change: transform;
  }
  .tm-card.is-in { opacity: 1; }
  .tm-card:nth-child(3n) { background: var(--accent-soft); }
  .tm-card::after {
    content: ''; position: absolute; left: 2px; bottom: -8px;
    width: 16px; height: 16px; background: inherit;
    clip-path: polygon(0 0, 100% 0, 0 100%);
  }

  /* Conversation emoji sticker, overlapping the top-left of the bubble. */
  .tm-sticker {
    position: absolute; top: -16px; left: -12px;
    width: 46px; height: 46px; border-radius: 50%;
    background: #fff; box-shadow: var(--shadow);
    display: grid; place-items: center; font-size: 23px; line-height: 1;
  }

  /* Reduced, breathable body — reads like a real message, not a headline. */
  .tm-quote {
    margin: 0;
    font-size: clamp(15px,1.35vw,17px);
    line-height: 1.62;
    font-weight: 500;
    color: var(--ink);
  }

  .tm-author { display: flex; align-items: center; gap: 12px; margin-top: auto; }
  .tm-avatar {
    width: 40px; height: 40px; border-radius: 50%;
    background: linear-gradient(135deg,var(--accent),var(--accent-2));
    color: #fff; display: grid; place-items: center; font-weight: 700; flex: none;
  }
  .tm-who { display: flex; flex-direction: column; line-height: 1.25; }
  .tm-name { font-weight: 600; }
  .tm-city { color: var(--muted); font-size: 13px; }

  .tm-empty { text-align: center; padding: 3rem 0; color: var(--muted); }

  @media (prefers-reduced-motion: reduce) {
    .tm-card { opacity: 1; transition: none; transform: none !important; }
  }

  /* Numbered pagination (matches the blog pager) */
  .pager { display: flex; justify-content: center; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: clamp(32px,5vw,56px); }
  .pager a, .pager span { min-width: 44px; height: 44px; padding: 0 6px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid #ddd; border-radius: 999px; text-decoration: none; color: var(--ink); font-weight: 600; }
  .pager a:hover { border-color: var(--ink); }
  .pager .is-current { background: var(--ink); color: #fff; border-color: var(--ink); }
  .pager .is-disabled { opacity: .35; pointer-events: none; }