/* Page group: treatments. Scoped to this group's templates: the treatment
   pages (body.single-elite_treatment) and the treatments listing
   (body.post-type-archive-elite_treatment).

   Loads before revision-5.css (the shared design system), so the hero, the
   H1 scale, the facts strip, the section nav and the treatment cards come
   from there. Rules here arrange what is particular to these pages, with the
   body class in front where they must win over the system.

   Revision 11: phone hero column fixed (a long breadcrumb no longer widens
   it), tablet heroes for the listing too, with a tall arch photograph; the
   overview is copy and the "who it suits" panel; one 16px eyebrow gap; the
   specialists' booking panel, review and Google card as their own grid items;
   the listing ends on reviews. */


/* ==========================================================================
   Hero (treatment pages and the listing)
   ========================================================================== */

:is(.single-elite_treatment, .post-type-archive-elite_treatment).premium-inner .ihero__copy h1 { text-wrap: balance; }

/* Phones: one fixed column, so a long breadcrumb cannot push the copy into
   the gutter; the trail shrinks its current item before it would overflow.
   The photograph is one landscape crop for every file. */
@media (max-width: 47.99rem) {
  :is(.single-elite_treatment, .post-type-archive-elite_treatment).premium-inner .ihero__in { grid-template-columns: minmax(0, 1fr); }
  :is(.single-elite_treatment, .post-type-archive-elite_treatment).premium-inner .ihero .breadcrumbs { flex-wrap: nowrap; max-width: 100%; min-width: 0; }
  :is(.single-elite_treatment, .post-type-archive-elite_treatment).premium-inner .ihero .breadcrumbs > * { flex: none; }
  :is(.single-elite_treatment, .post-type-archive-elite_treatment).premium-inner .ihero .breadcrumbs > [aria-current] { flex: 0 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  :is(.single-elite_treatment, .post-type-archive-elite_treatment).premium-inner .ihero .ihero__art { width: 100%; max-width: none; aspect-ratio: 16 / 10; }
  :is(.single-elite_treatment, .post-type-archive-elite_treatment).premium-inner .ihero .ihero__art img { width: 100%; height: 100%; object-fit: cover; object-position: center 30%; }
  /* Focal points belong to the file, so they follow it to any page. */
  .single-elite_treatment.premium-inner .ihero .ihero__art img[src*="/ph-operatory"] { object-position: center 75%; }
  .single-elite_treatment.premium-inner .ihero .ihero__art img[src*="/ph-brushing"] { object-position: center 45%; }
  .single-elite_treatment.premium-inner .ihero .ihero__art img[src*="/ph-toddler"] { object-position: center 50%; }
  .single-elite_treatment.premium-inner .ihero .ihero__art img[src*="/el-hero-emergencies"] { object-position: center 45%; }
}
@media (max-width: 23.99rem) {
  :is(.single-elite_treatment, .post-type-archive-elite_treatment).premium-inner .ihero .breadcrumbs { gap: 0.25rem 0.4rem; padding-inline: 0.7rem; }
}

/* Tablets: the photograph beside the copy as a tall arch, so the first
   screen is filled rather than a small picture in white space. */
@media (min-width: 48rem) and (max-width: 63.99rem) {
  :is(.single-elite_treatment, .post-type-archive-elite_treatment).premium-inner .ihero__in:not(.ihero__in--solo) { grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr); gap: 2rem; align-items: center; }
  :is(.single-elite_treatment, .post-type-archive-elite_treatment).premium-inner .ihero__visual { position: relative; width: 100%; justify-self: stretch; }
  :is(.single-elite_treatment, .post-type-archive-elite_treatment).premium-inner .ihero .ihero__art {
    width: 100%; max-width: none; height: min(56svh, 36rem); aspect-ratio: auto; margin: 0;
    border: 1px solid rgba(255, 255, 255, 0.95); border-radius: 999px 999px 1.75rem 1.75rem;
    box-shadow: 0 40px 80px -48px rgba(26, 18, 54, 0.55);
  }
  :is(.single-elite_treatment, .post-type-archive-elite_treatment).premium-inner .ihero .ihero__art img { width: 100%; height: 100%; object-fit: cover; object-position: center 30%; }
}

/* Short desktop screens (a 1366x768 laptop): a tighter rhythm keeps the
   facts strip centred on the fold; the listing (two lane buttons) also
   takes a little less padding. */
@media (min-width: 64rem) and (max-height: 50rem) {
  .single-elite_treatment.premium-inner .ihero__copy { gap: 0.8rem; }
  .post-type-archive-elite_treatment.premium-inner .ihero { --hero-pad: 2rem; }
  .post-type-archive-elite_treatment.premium-inner .ihero__copy { gap: 0.7rem; }
  .post-type-archive-elite_treatment.premium-inner .ihero .hero-book { gap: 0.5rem; }
}


/* ==========================================================================
   Facts strip on the narrowest phones (under 384px): a smaller icon and
   tighter padding keep labels on one line and values within two.
   ========================================================================== */
@media (max-width: 23.99rem) {
  :is(.single-elite_treatment, .post-type-archive-elite_treatment).premium-inner .facts > .fact { grid-template-columns: 1.9rem minmax(0, 1fr); column-gap: 0.5rem; padding: 0 0.55rem; }
  :is(.single-elite_treatment, .post-type-archive-elite_treatment).premium-inner .facts .fact__icon { width: 1.9rem; height: 1.9rem; border-radius: 0.6rem; }
  :is(.single-elite_treatment, .post-type-archive-elite_treatment).premium-inner .facts .fact__icon svg { width: 16px; height: 16px; }
}


/* ==========================================================================
   Section nav: space between the facts strip and the bar; in-page links land
   with the section's top edge right under the header plus the bar.
   ========================================================================== */
.single-elite_treatment.premium-inner .wrap:has(> .facts) + .subnav { margin-top: clamp(1.5rem, 3vw, 2.5rem); }
.single-elite_treatment.premium-inner :is(#quick, #visit, #alternatives, #specialists, #questions) { scroll-margin-top: calc(3.3rem - 0.75rem); }
.single-elite_treatment.premium-inner #suits { scroll-margin-top: calc(3.3rem + 1.25rem); }
@media (max-width: 47.99rem) {
  .single-elite_treatment.premium-inner :is(#quick, #visit, #alternatives, #specialists, #questions) { scroll-margin-top: calc(2.95rem - 0.75rem); }
  .single-elite_treatment.premium-inner #suits { scroll-margin-top: calc(2.95rem + 1rem); }
}


/* ==========================================================================
   One eyebrow rhythm: every section eyebrow sits 16px above its heading.
   ========================================================================== */
.single-elite_treatment.premium-inner :is(.tr-ov__copy, .tr-alt-head, .landing-head, .faq-layout > div:first-child, .spx__head .sect-head__copy) > .eyebrow { margin: 0 0 1rem; }
.single-elite_treatment.premium-inner :is(.tr-ov__copy, .tr-alt-head, .landing-head, .faq-layout > div:first-child, .spx__head .sect-head__copy) > .eyebrow + h2 { margin-top: 0; }
.post-type-archive-elite_treatment.premium-inner .sect-head__copy > .eyebrow { margin: 0 0 1rem; }
.post-type-archive-elite_treatment.premium-inner .sect-head__copy > .eyebrow + h2 { margin-top: 0; }


/* ==========================================================================
   Overview: the copy, and the "who it suits" panel beside it with its top
   on the copy's top. Only an urgent treatment has an action row here.
   ========================================================================== */
.single-elite_treatment .tr-ov { display: grid; grid-template-columns: minmax(0, 1fr); }
.single-elite_treatment .tr-ov__copy { min-width: 0; }
.single-elite_treatment .tr-ov__copy > h2 { margin-bottom: 0; text-wrap: balance; }
.single-elite_treatment .tr-ov__copy > .lede { max-width: 46ch; margin: 1.25rem 0 0; }
.single-elite_treatment.premium-inner .tr-ov > .fit-panel { max-width: 44rem; margin-top: 2rem; }
.single-elite_treatment.premium-inner .fit-panel .micro-label { display: block; }
.single-elite_treatment.premium-inner .fit-panel h3 { text-wrap: balance; }
.single-elite_treatment.premium-inner .tr-ov > .tr-cta { margin-top: 1.75rem; }
@media (min-width: 64rem) {
  .single-elite_treatment .tr-ov {
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr); grid-template-areas: "copy fit";
    column-gap: clamp(3rem, 6vw, 6.5rem); align-items: start;
  }
  .single-elite_treatment .tr-ov--call { grid-template-rows: auto 1fr; grid-template-areas: "copy fit" "cta fit"; }
  .single-elite_treatment .tr-ov--solo { grid-template-columns: minmax(0, 46rem); grid-template-areas: "copy" "cta"; }
  .single-elite_treatment .tr-ov__copy { grid-area: copy; }
  .single-elite_treatment.premium-inner .tr-ov > .fit-panel { grid-area: fit; max-width: none; margin-top: 0.35rem; padding: 2rem 2.1rem; }
  .single-elite_treatment.premium-inner .tr-ov > .tr-cta { grid-area: cta; }
  .single-elite_treatment .tr-ov__copy > .lede { font-size: 1.14rem; }
}


/* ==========================================================================
   Action rows: the lane button, then a go-to-page link.
   ========================================================================== */
.single-elite_treatment .tr-cta { margin-top: 2rem; }
.single-elite_treatment .tr-cta .go-link { min-width: 15rem; }
.single-elite_treatment[data-lane="ped"] .go-link__ic { background: var(--ped-tint); color: var(--ped); }
.single-elite_treatment[data-lane="ped"] .go-link:hover { border-color: var(--ped); color: var(--ped); }
.single-elite_treatment[data-lane="ped"] .go-link:hover .go-link__ic { background: var(--ped); color: #fff; }
.single-elite_treatment .faq-layout .tr-cta { margin-top: 1.5rem; }


/* ==========================================================================
   Alternatives: treatment cards (.tcard). Two cards sit beside the heading;
   three or four run under it as a card grid.
   ========================================================================== */
.single-elite_treatment .tr-alt-layout { display: grid; gap: 2.25rem; }
.single-elite_treatment .tr-alt-head { display: flex; flex-direction: column; align-items: flex-start; gap: 0; min-width: 0; }
.single-elite_treatment .tr-alt-head > * { margin: 0; }
.single-elite_treatment .tr-alt-head h2 { text-wrap: balance; }
.single-elite_treatment .tr-alt-head .lede { max-width: 36ch; margin-top: 1.1rem; }
.single-elite_treatment .tr-alt-head .tr-alt-go { min-width: 15rem; margin-top: 1.6rem; }
@media (min-width: 64rem) {
  .single-elite_treatment .tr-alt-layout--split { grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); column-gap: 1.25rem; align-items: center; }
  .single-elite_treatment .tr-alt-layout--split > .tr-alt-head { padding-right: clamp(1.5rem, 3vw, 3rem); }
  .single-elite_treatment.premium-inner .tr-alt-layout--split .grid--svc.tr-alts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 48rem) and (max-width: 63.99rem) {
  .single-elite_treatment .tr-alt-layout { gap: 2rem; }
}
@media (max-width: 47.99rem) {
  /* The page link closes the block under the cards on a phone. */
  .single-elite_treatment .tr-alt-layout { display: flex; flex-direction: column; gap: 0; }
  .single-elite_treatment .tr-alt-head { display: contents; }
  .single-elite_treatment .tr-alt-head > .eyebrow { order: 0; }
  .single-elite_treatment .tr-alt-head > h2 { order: 1; }
  .single-elite_treatment .tr-alt-head > .lede { order: 2; margin-top: 0.9rem; }
  .single-elite_treatment .tr-alts { order: 3; margin-top: 1.5rem; }
  .single-elite_treatment .tr-alt-head > .tr-alt-go { order: 4; width: 100%; min-width: 0; margin-top: 1.25rem; }
}


/* ==========================================================================
   Your specialists (template-parts/components/specialists.php): the doctors,
   the booking panel, and the proof row (a real review and the Google card).
   ========================================================================== */
.spx .spx__head { margin-bottom: clamp(2rem, 3.5vw, 3rem); }
.spx .spx__head .lede { max-width: 42ch; }
.spx__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.25rem; align-items: stretch; }

.spx__card {
  display: flex; flex-direction: column; min-width: 0; overflow: hidden;
  border: 1px solid var(--line-soft, #e5e1ea); border-radius: 1.25rem; background: #fff;
  box-shadow: 0 24px 50px -40px rgba(26, 18, 54, 0.45);
}
.spx__photo {
  position: relative; display: block; margin: 0.6rem 0.6rem 0; overflow: hidden; aspect-ratio: 5 / 4;
  border-radius: 999px 999px 0.9rem 0.9rem; background: linear-gradient(160deg, #efe9fa, #e3f4f3);
}
.spx--ped .spx__photo { background: linear-gradient(160deg, #e5f5f6, #f3eefb); }
.spx__photo img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center 12%; transition: transform 0.6s cubic-bezier(0.2, 0.8, 0.2, 1); }
.spx__card:hover .spx__photo img { transform: scale(1.03); }
.spx__body { display: flex; flex: 1; flex-direction: column; align-items: flex-start; gap: 0.6rem; padding: 1.35rem 1.5rem 1.5rem; }
.spx__body > * { margin: 0; }
.spx__name { font-size: clamp(1.3rem, 1.1rem + 0.6vw, 1.6rem); line-height: 1.15; letter-spacing: -0.025em; }
.spx__name a { color: var(--ink); text-decoration: none; }
.spx__name a:hover { color: var(--ortho); }
.spx--ped .spx__name a:hover { color: var(--ped); }
.spx__bio { color: var(--body); font-size: 0.95rem; line-height: 1.6; }
.spx__creds { display: grid; gap: 0.5rem; width: 100%; margin: 0.2rem 0 0; padding: 0.9rem 0 0; border-top: 1px solid var(--line-soft, #e5e1ea); }
.spx__creds li { font-size: 0.88rem; line-height: 1.5; }
.spx__body > .spx__go { margin-top: auto; min-width: 14rem; }
.spx--ped .spx__go .go-link__ic { background: var(--ped-tint); color: var(--ped); }

/* Booking panel. */
.spx__book {
  display: flex; flex-direction: column; align-items: flex-start; gap: 0.75rem; min-width: 0; padding: 1.6rem;
  border-radius: 1.25rem; background: var(--ink, #1a1236); color: #fff;
  box-shadow: 0 30px 60px -40px rgba(26, 18, 54, 0.7);
}
.spx__book > * { margin: 0; }
.spx__book-icon { display: grid; place-items: center; width: 2.75rem; height: 2.75rem; border-radius: 0.85rem; background: rgba(255, 255, 255, 0.1); color: #fff; }
.spx__book-k { font-family: var(--display); font-size: 1.3rem; font-weight: 700; line-height: 1.2; letter-spacing: -0.02em; color: #fff; text-wrap: balance; }
.spx__book-text { color: rgba(255, 255, 255, 0.74); font-size: 0.95rem; line-height: 1.6; }
.spx__hours { display: grid; gap: 0.4rem; width: 100%; margin: 0.35rem 0 0.5rem !important; padding-top: 0.9rem; border-top: 1px solid rgba(255, 255, 255, 0.14); font-size: 0.88rem; }
.spx__hours-k { margin-bottom: 0.15rem; color: rgba(255, 255, 255, 0.6); font-size: 0.66rem; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; }
.spx__hours dd { display: flex; justify-content: space-between; gap: 1rem; margin: 0; color: rgba(255, 255, 255, 0.86); }
.spx__hours dd > span { white-space: nowrap; }
.spx__hours dd > span:first-child { color: #fff; font-weight: 600; }
.spx__hours dd > span:last-child { font-variant-numeric: tabular-nums; text-align: right; }
.spx__book .spx__btn { width: 100%; margin-top: auto; justify-content: center; padding-inline: 1rem; font-size: 0.95rem; text-align: center; white-space: nowrap; }
.spx--ortho .spx__book .spx__btn { background: #fff; border-color: #fff; color: var(--ink); }
.spx--ortho .spx__book .spx__btn:hover { background: var(--ortho-tint, #eee9f7); border-color: var(--ortho-tint, #eee9f7); color: var(--ortho); }
.spx--ped .spx__book { background: var(--ped, #0f7a7d); }
.spx--ped .spx__book .spx__btn { background: #fff; border-color: #fff; color: var(--ped); }
.spx--ped .spx__book .spx__btn:hover { background: var(--ped-tint, #e5f5f6); border-color: var(--ped-tint, #e5f5f6); }

/* A stretched panel (beside taller cards) centres the hours between its
   heading and its button rather than leaving one empty band. */
@media (min-width: 48rem) {
  .spx__book .spx__hours { margin-block: auto !important; }
  .spx__book .spx__btn { margin-top: 0; }
}

/* Proof: the review, then the Google card (business name and address). */
.spx__proof { display: flex; flex-direction: column; gap: 1.25rem; min-width: 0; }
.spx__proof > .quote { flex: 1; }
.spx__proof .gbadge--card { max-width: none; box-shadow: 0 24px 50px -40px rgba(26, 18, 54, 0.45); }
.spx--ped .gbadge--card .gbadge__cta { color: var(--ped); }
.spx--ped .gbadge--card .gbadge__cta .go-link__ic { background: var(--ped-tint); color: var(--ped); }

/* A review on a light surface (the base quote card is drawn for dark ones). */
:is(.spx__proof, .tr-proof__grid) > .quote {
  min-width: 0; margin: 0; padding: 1.6rem 1.75rem 1.5rem;
  border: 1px solid var(--line-soft, #e5e1ea); border-radius: 1.25rem; background: #fff;
  box-shadow: 0 24px 50px -40px rgba(26, 18, 54, 0.45);
}
:is(.spx__proof, .tr-proof__grid) > .quote .quote__mark { color: var(--ortho); font-size: 3.2rem; line-height: 0.7; }
:is(.spx__proof, .tr-proof__grid) > .quote blockquote { margin: 0.85rem 0 0; color: var(--ink); font-size: clamp(1.12rem, 1rem + 0.45vw, 1.38rem); line-height: 1.42; letter-spacing: -0.012em; }
:is(.spx__proof, .tr-proof__grid) > .quote figcaption { padding-top: 1.25rem; color: var(--muted, #6b6478); }
:is(.spx__proof, .tr-proof__grid) > .quote .quote__who { color: var(--ink); font-weight: 700; }
:is(.spx__proof, .tr-proof__grid) > .quote .quote__avatar { background: var(--ortho-tint, #eee9f7); color: var(--ortho); }
.spx--ped .spx__proof > .quote .quote__mark,
.tr-proof__grid > .quote + .quote .quote__mark { color: var(--ped); }
.spx--ped .spx__proof > .quote .quote__avatar,
.tr-proof__grid > .quote + .quote .quote__avatar { background: var(--ped-tint, #e5f5f6); color: var(--ped); }

/* Wide desktop: the panel beside the doctors, the proof row under them. */
@media (min-width: 80rem) {
  .spx--n2 .spx__grid { grid-template-columns: repeat(2, minmax(0, 1fr)) minmax(0, 0.92fr); }
  .spx--n1 .spx__grid { grid-template-columns: minmax(0, 2fr) minmax(0, 0.92fr); }
  .spx--n3 .spx__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .spx:is(.spx--n1, .spx--n2) .spx__book { grid-row: 1; grid-column: -2 / -1; }
  .spx__proof { grid-column: 1 / -1; display: grid; grid-template-columns: subgrid; }
  .spx__proof > .quote { grid-column: 1 / -2; }
  .spx__proof > .gbadge--card { grid-column: -2 / -1; }
  .spx--n3 .spx__book { grid-column: 1; }
  .spx--n3 .spx__proof { grid-column: 2 / -1; }
  .spx__proof > .quote { display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: 1.25rem; align-content: center; padding: 2rem 2.25rem; }
  .spx__proof > .quote .quote__mark { grid-row: 1 / 3; font-size: 4.5rem; }
  .spx__proof > .quote blockquote { margin-top: 0; font-size: 1.5rem; }
  .spx__proof > .quote figcaption { margin-top: 0; }
}
/* Doctor card on its side, portrait left (one doctor, and the n3 odd one). */
@media (min-width: 48rem) {
  .spx--n1 .spx__card { flex-direction: row; }
  .spx--n1 .spx__photo { flex: 0 0 40%; aspect-ratio: auto; min-height: 22rem; margin: 0.6rem; }
  .spx--n1 .spx__body { justify-content: center; padding: 1.75rem 1.75rem 1.75rem 1rem; }
  .spx--n1 .spx__body > .spx__go { margin-top: 0.6rem; }
  .spx--n1 .spx__photo img { object-position: center 10%; }
}
@media (min-width: 80rem) {
  .spx--n1 .spx__photo { flex-basis: 42%; min-height: 26rem; }
  .spx--n1 .spx__body { padding: 2rem 2.25rem 2rem 1.25rem; }
}
/* Tablet and small desktop: two columns; the panel and the proof share a row. */
@media (min-width: 48rem) and (max-width: 79.99rem) {
  .spx__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .spx--n1 .spx__card, .spx--n3 .spx__card:last-of-type:nth-of-type(odd) { grid-column: 1 / -1; }
  .spx__proof > .quote { display: flex; flex-direction: column; justify-content: center; }
}
@media (min-width: 48rem) and (max-width: 63.99rem) {
  .spx__book { padding: 1.4rem 1.25rem; }
  .spx__book .spx__btn { font-size: 0.92rem; }
  .spx__proof > .quote { padding: 1.4rem 1.5rem; }
  .spx__proof .gbadge--card { padding: 1.35rem 1.4rem; }
}
@media (max-width: 47.99rem) {
  .spx .spx__head { margin-bottom: 1.5rem; }
  .spx__grid { gap: 0.85rem; }
  /* Phone: portrait beside role and name, credentials and the profile link under them. */
  .spx__card {
    display: grid; grid-template-columns: 5.75rem minmax(0, 1fr); grid-template-rows: 1fr 1fr auto auto;
    grid-template-areas: "photo tag" "photo name" "creds creds" "go go";
    column-gap: 1rem; padding: 0.85rem 0.85rem 1rem; border-radius: 1.1rem;
  }
  .spx__photo { grid-area: photo; width: 5.75rem; margin: 0; aspect-ratio: 1 / 1.12; border-radius: 999px 999px 0.7rem 0.7rem; }
  .spx__body { display: contents; }
  .spx__body > .tag { grid-area: tag; align-self: end; justify-self: start; }
  .spx__name { grid-area: name; align-self: start; margin-top: 0.4rem !important; font-size: 1.12rem; }
  .spx__bio { display: none; }
  .spx__creds { grid-area: creds; margin-top: 0.9rem !important; padding-top: 0.8rem; gap: 0.4rem; }
  .spx__creds li { font-size: 0.84rem; line-height: 1.45; }
  .spx__body > .spx__go { grid-area: go; width: 100%; min-width: 0; margin-top: 0.9rem !important; }
  .spx__proof { gap: 0.85rem; }
  .spx__book { padding: 1.3rem 1.25rem; }
  .spx__book-k { font-size: 1.15rem; }
  .spx__book-text { font-size: 0.9rem; }
  .spx__book .spx__btn { font-size: 0.9rem; padding-inline: 0.75rem; }
  .spx__proof .gbadge--card { padding: 1.25rem; }
  :is(.spx__proof, .tr-proof__grid) > .quote { padding: 1.3rem 1.25rem 1.25rem; }
}
@media (max-width: 23.99rem) {
  .spx__book .spx__btn { font-size: 0.86rem; padding-inline: 0.6rem; }
}


/* ==========================================================================
   Phones: the fit panel folds behind its chevron; action rows stack.
   ========================================================================== */
@media (max-width: 47.99rem) {
  .single-elite_treatment.premium-inner .tr-ov > .fit-panel { margin-top: 1.5rem; padding: 1rem 1.1rem 1rem 1.25rem; }
  .single-elite_treatment .fit-panel .fold-head > h3 { margin: 0; font-size: 1.2rem; }
  .single-elite_treatment .fit-panel .fold-panel { margin-top: 0.6rem; }
  .single-elite_treatment .fit-panel .micro-label { margin-bottom: 0.25rem; }
  .single-elite_treatment[data-lane="ped"] .fit-panel .fold-btn { color: var(--ped); }
  .single-elite_treatment .tr-ov__copy > .lede { margin-top: 1rem; }

  .single-elite_treatment .tr-cta { flex-direction: column; align-items: stretch; gap: 0.6rem; margin-top: 1.5rem; }
  .single-elite_treatment .tr-cta :is(.btn, .go-link) { width: 100%; min-width: 0; }
  .single-elite_treatment .faq-layout .tr-cta { margin-top: 1.25rem; }
}

/* Questions on a phone or tablet (one column): the heading over the first
   question, "See all questions" under the list. */
@media (max-width: 63.99rem) {
  .single-elite_treatment #questions .faq-layout { display: flex; flex-direction: column; align-items: stretch; gap: 0; }
  .single-elite_treatment #questions .faq-layout > div:first-child { display: contents; }
  .single-elite_treatment #questions .faq-layout > .faq { order: 1; margin-top: 2.5rem; }
  .single-elite_treatment #questions .faq-layout > div:first-child > .tr-cta--faq { order: 2; margin-top: 1.5rem; }
}
@media (max-width: 47.99rem) {
  .single-elite_treatment #questions .faq-layout > .faq { margin-top: 1.5rem; }
}


/* ==========================================================================
   Treatments listing
   ========================================================================== */

/* The follow-on treatment (retainers) is the treatment card on its side,
   under the even grid; on a phone it is the same compact row as every
   other card (revision-5.css). */
.post-type-archive-elite_treatment .tr-rows { display: grid; gap: 1.25rem; margin-top: 1.25rem; }
.tcard__label { color: var(--ortho); font-size: 0.68rem; font-weight: 700; letter-spacing: 0.14em; line-height: 1.3; text-transform: uppercase; }
.tcard--ped .tcard__label { color: var(--ped); }
@media (min-width: 48rem) {
  .tcard.tcard--wide { flex-direction: row; align-items: stretch; }
  .tcard--wide .tcard__media { flex: 0 0 calc((100% - 1.25rem) / 2); aspect-ratio: auto; min-height: 12.5rem; }
  .tcard--wide .tcard__body { justify-content: center; gap: 0.5rem; padding: 1.75rem 2rem; }
  .tcard--wide .tcard__title { font-size: clamp(1.3rem, 1.1rem + 0.6vw, 1.6rem); }
  .tcard--wide .tcard__text { max-width: 52ch; font-size: 0.95rem; }
  .tcard--wide .tcard__more { margin-top: 0.4rem; }
}
@media (min-width: 64rem) {
  .tcard--wide .tcard__media { flex-basis: calc((100% - 2 * 1.25rem) / 3); }
  .tcard--wide .tcard__body {
    display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "label more" "title more" "text more";
    align-content: center; column-gap: 2.5rem; row-gap: 0.5rem; padding: 2rem 2.5rem;
  }
  .tcard--wide .tcard__label { grid-area: label; }
  .tcard--wide .tcard__title { grid-area: title; }
  .tcard--wide .tcard__text { grid-area: text; }
  .tcard--wide .tcard__more { grid-area: more; align-self: center; margin: 0; padding: 0; }
}
@media (max-width: 47.99rem) {
  .post-type-archive-elite_treatment .tr-rows { gap: 0.6rem; margin-top: 0.6rem; }
  .tcard--wide .tcard__label { font-size: 0.6rem; }
}

/* The lane's closing row: booking button, then the specialty page. */
.post-type-archive-elite_treatment .tr-rows + .book-cta { margin-top: 2rem; }
@media (max-width: 47.99rem) {
  .post-type-archive-elite_treatment .tr-lane .book-cta { flex-direction: column; align-items: stretch; gap: 0.6rem; margin-top: 1.5rem; }
  .post-type-archive-elite_treatment .tr-lane .book-cta :is(.btn, .go-link) { width: 100%; min-width: 0; }
}

/* Reviews: the Google card beside one review from each specialty. */
.tr-proof__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.25rem; margin-top: clamp(1.75rem, 3vw, 2.5rem); align-items: stretch; }
.tr-proof__grid > .gbadge--card { max-width: none; justify-content: center; }
.tr-proof__grid > .quote { display: flex; flex-direction: column; }
@media (min-width: 64rem) {
  .tr-proof__grid { grid-template-columns: minmax(0, 0.8fr) repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 48rem) and (max-width: 63.99rem) {
  .tr-proof__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .tr-proof__grid > .quote + .quote { grid-column: 1 / -1; }
}
@media (max-width: 47.99rem) {
  .tr-proof__grid { gap: 0.85rem; margin-top: 1.5rem; }
}