/* Testimonials page (testimonials.php) — page-only layout on top of theme.css.
   .ph-crumbs and .ph-pagehero h1 em are shared with about/faqs: candidates for theme.css. */

/* ---------- breadcrumb + hero type ---------- */
.ph-pagehero .ph-crumbs { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem; margin: 0 0 var(--ph-s-4) !important; font-size: var(--ph-fs-sm); color: var(--ph-on-red-soft); }
.ph-pagehero .ph-crumbs a { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; min-width: 44px; color: #fff !important; font-weight: 600; text-decoration: underline; text-decoration-color: rgba(255,255,255,.45); text-underline-offset: 4px; }
.ph-pagehero .ph-crumbs i { font-size: .7rem; opacity: .8; }
.ph-pagehero .ph-hero__eyebrow { font-size: var(--ph-fs-xs); max-width: none; }
.ph-pagehero h1 { font-variation-settings: "SOFT" 50, "WONK" 1; line-height: 1.02; letter-spacing: -0.025em; }
.ph-pagehero h1 em { font-style: italic; font-weight: 500; color: #fff; position: relative; white-space: nowrap; }
.ph-pagehero h1 em::after {
    content: ""; position: absolute; left: 0; right: 0; bottom: -.04em; height: .13em;
    border-top: .055em solid currentColor; border-bottom: .022em solid currentColor; opacity: .85;
}

/* ---------- hero ---------- */
.ph-tm-hero__grid { display: grid; gap: var(--ph-s-7); align-items: center; }
@media (min-width: 992px) { .ph-tm-hero__grid { grid-template-columns: 1.15fr .85fr; gap: var(--ph-s-8); } }
.ph-tm-hero .ph-btn-row { margin-top: var(--ph-s-6); }

/* stacked "review cards" visual */
.ph-tm-stack { position: relative; max-width: 420px; width: 100%; margin-inline: auto; padding: 18px 18px 0 0; }
.ph-tm-stack::before {
    content: "";
    position: absolute;
    inset: 0 0 18px 18px;
    border-radius: var(--ph-r-xl);
    background: rgba(255,255,255,.14);
    border: 1.5px solid rgba(255,255,255,.35);
    transform: rotate(4deg);
}
.ph-tm-badge {
    position: relative;
    background: var(--ph-paper);
    color: var(--ph-ink-2);
    border-radius: var(--ph-r-xl);
    padding: clamp(1.5rem, 1.1rem + 1.6vw, 2.25rem);
    box-shadow: var(--ph-shadow-lg);
}
.ph-tm-badge__logo { width: 140px; height: auto; margin: -.5rem 0 .5rem -.4rem; }
.ph-tm-badge .ph-stars { font-size: 1.15rem; gap: 4px; margin-bottom: var(--ph-s-3); }
.ph-tm-badge__title { font-family: var(--ph-font-display); font-size: 1.6rem; font-weight: 700; line-height: 1.15; color: var(--ph-ink); margin: 0 0 .35rem !important; }
.ph-tm-badge__text { font-size: var(--ph-fs-sm) !important; color: var(--ph-muted); margin: 0 0 var(--ph-s-5) !important; max-width: none !important; }
.ph-tm-faces { display: flex; align-items: center; }
.ph-tm-faces span {
    width: 44px; height: 44px;
    display: grid; place-items: center;
    margin-left: -10px;
    border-radius: 50%;
    border: 3px solid var(--ph-paper);
    background: var(--ph-tint);
    color: var(--ph-red-700);
    font-weight: 700;
    font-size: .85rem;
}
.ph-tm-faces span:first-child { margin-left: 0; }
.ph-tm-faces span:nth-child(2n) { background: var(--ph-red); color: #fff; }
.ph-tm-faces span:last-child { background: var(--ph-ink); color: var(--ph-on-ink); }

/* ---------- featured quote ---------- */
.ph-tm-feature { display: grid; gap: var(--ph-s-5); }
@media (min-width: 992px) { .ph-tm-feature { grid-template-columns: 220px 1fr; gap: var(--ph-s-8); align-items: start; } }
.ph-tm-feature__mark {
    font-family: var(--ph-font-display);
    font-size: clamp(7rem, 5rem + 8vw, 13rem);
    line-height: 1;
    font-weight: 700;
    color: var(--ph-red);
    margin: 0 !important;
    height: .5em;
}
@media (max-width: 991.98px) { .ph-tm-feature__mark { display: none; } .ph-tm-feature .ph-eyebrow { margin-bottom: 0; } }
.ph-tm-feature blockquote { margin: 0; padding: 0; }
.ph-tm-feature blockquote p {
    font-family: var(--ph-font-display);
    font-size: clamp(1.35rem, 1rem + 1.5vw, 2.15rem);
    line-height: 1.35;
    font-weight: 500;
    letter-spacing: -0.01em;
    color: var(--ph-ink);
    margin: 0 0 var(--ph-s-5);
    max-width: 34ch;
    font-variation-settings: "SOFT" 60, "WONK" 0;
}
.ph-tm-feature .ph-quote__avatar { width: 52px; height: 52px; background: var(--ph-red); color: #fff; }
.ph-tm-feature .ph-quote__name { font-size: 1.1rem; }
.ph-tm-feature .ph-rule { max-width: 120px; margin-bottom: var(--ph-s-5); }

/* ---------- filter ---------- */
.ph-tm-filter { display: flex; flex-wrap: wrap; gap: .5rem; margin: 0 0 var(--ph-s-6) !important; }
.ph-tm-filter[hidden] { display: none; }
.ph-tm-filter button {
    display: inline-flex; align-items: center; gap: .5em;
    min-height: 44px;
    padding: .4em 1.1em;
    border: 1.5px solid var(--ph-line);
    border-radius: var(--ph-r-pill);
    background: var(--ph-cream);
    color: var(--ph-ink);
    font-weight: 700;
    cursor: pointer;
    transition: background-color .2s, color .2s, border-color .2s;
}
.ph-tm-filter button:hover { border-color: var(--ph-red); color: var(--ph-red-700); }
.ph-tm-filter button[aria-pressed="true"] { background: var(--ph-ink); border-color: var(--ph-ink); color: var(--ph-on-ink); }
.ph-tm-filter__count {
    display: inline-grid; place-items: center;
    min-width: 24px; height: 24px; padding: 0 6px;
    border-radius: var(--ph-r-pill);
    background: var(--ph-tint);
    color: var(--ph-red-900);
    font-size: .8rem;
}
.ph-tm-filter button[aria-pressed="true"] .ph-tm-filter__count { background: rgba(255,255,255,.14); color: #fff; }
.ph-quote[hidden] { display: none; }
.ph-section--paper .ph-quote { background: var(--ph-cream); }
.ph-quote__role--tutor { color: var(--ph-red-700); }

/* ---------- in their words ---------- */
.ph-tm-words { display: grid; gap: 0; }
@media (min-width: 768px) { .ph-tm-words { grid-template-columns: 1fr 1fr; column-gap: var(--ph-s-7); } }
.ph-tm-word { padding-block: var(--ph-s-5); border-top: 1px solid rgba(255,255,255,.14); margin: 0; }
.ph-tm-word blockquote { margin: 0 0 .5rem; }
.ph-tm-word blockquote p {
    margin: 0;
    font-family: var(--ph-font-display);
    font-style: italic;
    font-weight: 500;
    font-size: clamp(1.5rem, 1.1rem + 1.8vw, 2.4rem);
    line-height: 1.15;
    color: #fff;
}
.ph-tm-word blockquote p::before { content: "\201C"; color: #F08A84; }
.ph-tm-word blockquote p::after { content: "\201D"; color: #F08A84; }
.ph-tm-word figcaption { font-size: var(--ph-fs-sm); color: var(--ph-on-ink-soft); }

/* ---------- CTA extras ---------- */
.ph-tm-cta__tutor { margin: var(--ph-s-5) 0 0 !important; font-size: var(--ph-fs-sm) !important; }
.ph-tm-cta__tutor a { display: inline-flex; align-items: center; min-height: 44px; color: #fff !important; font-weight: 700; text-decoration: underline; text-decoration-color: rgba(255,255,255,.5); text-underline-offset: 4px; }
