/* Revision 10: final polish (team). Loaded after revision-5.css and r6-shared.css.
   /our-team/, the clinician profiles and /reviews/, plus the team group's
   components (staff-card.php, review-wall.php). Every rule is scoped to an
   inner template's body class, so the home page is untouched.

   1. Our team: doctor rows      4. Profile: booking card
   2. Our team: care team tiles  5. Profile: phone portrait frame
   3. Our team: biography card   6. Reviews: hero and level wall
   7. Short laptop screens (1280 x 720 and similar)
   ========================================================================== */


/* --------------------------------------------------------------------------
   1. Doctor rows: every row's copy starts on the content edge. The even row
   used to push its copy against the photograph, which left the section's
   left edge ragged; the gap to the photograph simply grows instead.
   -------------------------------------------------------------------------- */
@media (min-width: 64rem) {
  .premium-inner.post-type-archive-elite_clinician .dcard--row:nth-child(even) > .dcard__body { justify-self: start; }
}
/* On a phone the doctor's name link is a 44px tap target, with no change to the layout. */
@media (max-width: 47.99rem) {
  .premium-inner.post-type-archive-elite_clinician .dcard--row .dcard__name a { display: inline-block; margin-block: -0.5rem; padding-block: 0.5rem; }
}


/* --------------------------------------------------------------------------
   2. Care team: the photographed people only, four to a row (7 = 4 + 3) on
   a desktop and a tablet, two on a phone. Anyone waiting for a portrait is
   named in one quiet line under the grid.
   -------------------------------------------------------------------------- */
.premium-inner.post-type-archive-elite_clinician .tstaff-grid { --cols: 4; --gap-x: 1.75rem; row-gap: 2.5rem; max-width: 62rem; margin-inline: auto; }
.premium-inner.post-type-archive-elite_clinician .tstaff { scroll-margin-top: calc(var(--header-h, 81px) + 2rem); }
@media (min-width: 48rem) and (max-width: 63.99rem) {
  .premium-inner.post-type-archive-elite_clinician .tstaff-grid { --cols: 4; --gap-x: 1rem; row-gap: 2rem; }
  .premium-inner.post-type-archive-elite_clinician .tstaff__name { font-size: 0.98rem; }
  .premium-inner.post-type-archive-elite_clinician .tstaff__role { font-size: 0.82rem; }
}
@media (max-width: 47.99rem) {
  .premium-inner.post-type-archive-elite_clinician .tstaff-grid { --cols: 2; --gap-x: 0.9rem; row-gap: 1.75rem; }
}

/* "About Litsa": a small pill under the role, only on the tiles of people
   who wrote a biography. */
.premium-inner .tstaff__more {
  display: inline-flex; align-items: center; gap: 0.45rem; min-height: 2.5rem; margin-top: 0.7rem; padding: 0 0.55rem 0 0.95rem;
  border: 1px solid var(--line-soft, #e7e3ee); border-radius: 999px; background: #fff; cursor: pointer;
  color: var(--ink); font: inherit; font-size: 0.84rem; font-weight: 650; line-height: 1;
  transition: border-color 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
}
.premium-inner .tstaff__more-ic {
  display: grid; place-items: center; width: 1.6rem; height: 1.6rem; border-radius: 50%;
  background: var(--ortho-tint, #efeaf8); color: var(--ortho);
  transition: background-color 0.2s ease, color 0.2s ease;
}
.premium-inner .tstaff__more:hover { border-color: color-mix(in srgb, var(--ortho) 35%, #e7e3ee); color: var(--ortho); box-shadow: 0 10px 24px -18px rgba(26, 18, 54, 0.5); }
.premium-inner .tstaff__more:hover .tstaff__more-ic { background: var(--ortho); color: #fff; }
.premium-inner .tstaff__more:focus-visible { outline: 2px solid var(--ortho); outline-offset: 3px; }

.premium-inner .tstaff-also {
  display: flex; flex-wrap: wrap; justify-content: center; align-items: baseline; gap: 0.3rem 0.65rem;
  width: fit-content; max-width: 100%; margin: 2.75rem auto 0; padding: 0.85rem 1.4rem;
  border: 1px solid var(--line-soft, #e7e3ee); border-radius: 999px; background: rgba(255, 255, 255, 0.7);
  color: var(--body); font-size: 0.92rem; line-height: 1.5; text-align: center;
}
.premium-inner .tstaff-also__k { color: var(--ink); font-family: var(--display); font-weight: 700; letter-spacing: -0.01em; }
@media (max-width: 47.99rem) {
  .premium-inner .tstaff-also { flex-direction: column; align-items: center; gap: 0.2rem; margin-top: 2rem; padding: 0.9rem 1.1rem; border-radius: 1.1rem; font-size: 0.88rem; }
}


/* --------------------------------------------------------------------------
   3. The biography card (a popover: Esc or a click outside closes it).
   -------------------------------------------------------------------------- */
.premium-inner .tbio {
  inset: 0; width: min(36rem, calc(100vw - 2rem)); max-height: min(86svh, 44rem); height: fit-content; margin: auto; padding: 0;
  overflow: auto; overscroll-behavior: contain;
  border: 1px solid rgba(225, 219, 235, 0.95); border-radius: 1.5rem; background: #fff;
  box-shadow: 0 50px 100px -40px rgba(26, 18, 54, 0.6); color: var(--body); text-align: left;
}
.premium-inner .tbio::backdrop { background: rgba(22, 15, 44, 0.46); -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); }
.premium-inner .tbio:popover-open { animation: tbio-in 0.24s cubic-bezier(0.2, 0.8, 0.2, 1); }
@keyframes tbio-in { from { opacity: 0; transform: translateY(0.75rem) scale(0.985); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .premium-inner .tbio:popover-open { animation: none; } }
.premium-inner .tbio__head {
  position: sticky; top: 0; z-index: 1; display: grid; grid-template-columns: 4.25rem minmax(0, 1fr) auto; align-items: center; gap: 1.1rem;
  padding: 1.5rem 1.5rem 1.25rem 1.75rem; border-bottom: 1px solid var(--line-soft, #efedf5); background: #fff;
}
.premium-inner .tbio__photo {
  display: block; overflow: hidden; aspect-ratio: 561 / 635; border-radius: 999px 999px 0.8rem 0.8rem;
  background: linear-gradient(145deg, #eee8f8, #e4f4f4);
}
.premium-inner .tbio__photo img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center 12%; mix-blend-mode: multiply; }
.premium-inner .tbio__who { display: flex; flex-direction: column; gap: 0.25rem; min-width: 0; }
.premium-inner .tbio__name { color: var(--ink); font-family: var(--display); font-size: 1.35rem; font-weight: 700; letter-spacing: -0.025em; line-height: 1.15; }
.premium-inner .tbio__role { color: var(--ortho); font-size: 0.78rem; font-weight: 700; letter-spacing: 0.12em; line-height: 1.3; text-transform: uppercase; }
.premium-inner .tbio__close {
  display: grid; place-items: center; align-self: start; width: 2.75rem; height: 2.75rem; padding: 0;
  border: 1px solid var(--line-soft, #e7e3ee); border-radius: 50%; background: #fff; color: var(--ink); cursor: pointer;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.premium-inner .tbio__close:hover { border-color: var(--ink); background: var(--ink); color: #fff; }
.premium-inner .tbio__close:focus-visible { outline: 2px solid var(--ortho); outline-offset: 3px; }
.premium-inner .tbio__body { padding: 1.4rem 1.75rem 1.75rem; }
.premium-inner .tbio__body p { margin: 0; color: var(--body-strong, #3c3450); font-size: 1rem; line-height: 1.72; }
.premium-inner .tbio__body p + p { margin-top: 1rem; }
@media (max-width: 47.99rem) {
  .premium-inner .tbio { width: calc(100vw - 1.5rem); border-radius: 1.25rem; }
  .premium-inner .tbio__head { grid-template-columns: 3.5rem minmax(0, 1fr) auto; gap: 0.85rem; padding: 1.1rem 1rem 1rem 1.15rem; }
  .premium-inner .tbio__name { font-size: 1.15rem; }
  .premium-inner .tbio__body { padding: 1.1rem 1.15rem 1.35rem; }
  .premium-inner .tbio__body p { font-size: 0.97rem; line-height: 1.68; }
}


/* --------------------------------------------------------------------------
   4. Profile: the aside is this doctor's booking card. The lane button that
   names the doctor, the phone, the office, the hours, then one line of
   Google rating with the business name.
   -------------------------------------------------------------------------- */
.premium-inner.single-elite_clinician .pbook {
  padding: 1.75rem 1.6rem 1.5rem; border: 1px solid rgba(225, 219, 235, 0.95); border-radius: 1.5rem; background: #fff;
  box-shadow: 0 40px 80px -52px rgba(26, 18, 54, 0.55);
}
.premium-inner.single-elite_clinician .pbook .eyebrow { margin: 0 0 0.7rem; }
.premium-inner.single-elite_clinician .pbook__title { margin: 0 0 1.35rem; font-size: clamp(1.5rem, 1.1rem + 0.8vw, 1.85rem); letter-spacing: -0.03em; line-height: 1.12; }
.premium-inner.single-elite_clinician .pbook__btn .btn { width: 100%; }
.premium-inner.single-elite_clinician .pbook__btn .btn span > span:first-child { white-space: nowrap; }

/* The aside is wide enough for the hero's lane button at its own size. */
@media (min-width: 80rem) {
  .premium-inner.single-elite_clinician .pbio { grid-template-columns: minmax(0, 40rem) minmax(0, 25rem); }
}
@media (min-width: 64rem) and (max-width: 79.99rem) {
  .premium-inner.single-elite_clinician .pbio { grid-template-columns: minmax(0, 1fr) minmax(0, 24.25rem); gap: 2.5rem; }
  .premium-inner.single-elite_clinician .pbook { padding: 1.6rem 1.4rem 1.4rem; }
}

/* The review under the biography, in full: a calmer size for a longer quote. */
.premium-inner.single-elite_clinician .pbio__quote blockquote p { font-size: 1.15rem; font-weight: 500; line-height: 1.55; letter-spacing: -0.01em; }
@media (max-width: 47.99rem) {
  .premium-inner.single-elite_clinician .pbio__quote blockquote p { font-size: 1.04rem; }
}
.premium-inner.single-elite_clinician .pbook__lines { display: grid; gap: 0.85rem; margin: 1.4rem 0 0; padding: 0; list-style: none; }
.premium-inner.single-elite_clinician .pbook__lines li { display: flex; align-items: center; gap: 0.75rem; min-width: 0; color: var(--body); font-size: 0.93rem; line-height: 1.4; }
.premium-inner.single-elite_clinician .pbook__lines a { display: inline-flex; align-items: center; min-height: 2.25rem; color: var(--ink); font-weight: 600; text-decoration: none; }
.premium-inner.single-elite_clinician .pbook__lines a:hover { color: var(--lane, var(--ortho)); text-decoration: underline; text-underline-offset: 3px; }
.premium-inner.single-elite_clinician .pbook__ic {
  display: grid; flex: none; place-items: center; width: 2.25rem; height: 2.25rem; border-radius: 0.7rem;
  background: var(--lane-tint-2, #f7f4fb); color: var(--lane, var(--ortho));
}
.premium-inner.single-elite_clinician .pbook__rating {
  display: flex; align-items: center; gap: 0.8rem; margin-top: 1.35rem; padding-top: 1.2rem;
  border-top: 1px solid var(--line-soft, #efedf5); color: var(--body); text-decoration: none;
}
.premium-inner.single-elite_clinician .pbook__rating .gbadge__g { flex: none; }
.premium-inner.single-elite_clinician .pbook__rating-copy { display: flex; flex-direction: column; gap: 0.2rem; min-width: 0; }
.premium-inner.single-elite_clinician .pbook__rating-line { display: flex; flex-wrap: wrap; align-items: center; gap: 0.2rem 0.5rem; font-size: 0.84rem; line-height: 1.3; }
.premium-inner.single-elite_clinician .pbook__rating-line strong { color: var(--ink); font-family: var(--display); font-size: 1.05rem; font-weight: 700; }
.premium-inner.single-elite_clinician .pbook__stars .stars { gap: 2px; }
/* The site's one star colour (r6-shared.css). */
.premium-inner.single-elite_clinician .pbook__stars .stars, .premium-inner.single-elite_clinician .pbook__stars svg { color: var(--star); }
.premium-inner.single-elite_clinician .pbook__biz { color: var(--ink); font-size: 0.8rem; font-weight: 600; line-height: 1.35; }
.premium-inner.single-elite_clinician a.pbook__rating:hover .pbook__biz { text-decoration: underline; text-underline-offset: 3px; }

/* Tablet: the card at the column's full width, the button at its own size
   and the three contact lines side by side under it. */
@media (min-width: 48rem) and (max-width: 63.99rem) {
  .premium-inner.single-elite_clinician .pbook { padding: 1.75rem 1.9rem 1.5rem; }
  .premium-inner.single-elite_clinician .pbook__btn .btn { width: auto; }
  .premium-inner.single-elite_clinician .pbook__lines { display: flex; flex-wrap: wrap; gap: 0.75rem 2rem; }
}
@media (max-width: 47.99rem) {
  .premium-inner.single-elite_clinician .pbook { padding: 1.35rem 1.2rem 1.2rem; border-radius: 1.25rem; box-shadow: none; }
  .premium-inner.single-elite_clinician .pbook__title { margin-bottom: 1.1rem; font-size: 1.45rem; }
  .premium-inner.single-elite_clinician .pbook__lines { gap: 0.6rem; margin-top: 1.15rem; }
  .premium-inner.single-elite_clinician .pbook__lines a { min-height: 2.75rem; }
}


/* --------------------------------------------------------------------------
   5. Profile on a phone: the portrait in the same 16:10 frame as every other
   hero photograph (it was 4:3, taller than the rest), framed on the head and
   shoulders so the hair keeps clear of the top edge.
   -------------------------------------------------------------------------- */
@media (max-width: 47.99rem) {
  .premium-inner.single-elite_clinician .ihero--profile .ihero__visual .ihero__art {
    aspect-ratio: 16 / 10; background: linear-gradient(100deg, #ebe4f7 0%, #f3f0f8 48%, #e2f3f2 100%);
  }
  .premium-inner.single-elite_clinician .ihero--ped.ihero--profile .ihero__visual .ihero__art { background: linear-gradient(100deg, #e6f4f6 0%, #f1f7f7 48%, #e0f2ef 100%); }
  .premium-inner.single-elite_clinician .ihero--profile .ihero__visual .ihero__art img {
    width: 100%; height: 100%; object-fit: contain; object-position: center bottom;
    -webkit-mask-image: linear-gradient(90deg, transparent 22%, #000 34%, #000 66%, transparent 78%);
    mask-image: linear-gradient(90deg, transparent 22%, #000 34%, #000 66%, transparent 78%);
  }
}


/* --------------------------------------------------------------------------
   6. Reviews: the shared hero (photograph, small Google badge, facts strip)
   and the wall in three columns that end level (review-wall.php deals the
   cards by height; the last few pixels are shared between a column's cards).
   -------------------------------------------------------------------------- */
/* The photograph mirrored, as before, so the child faces the copy. */
.premium-inner.post-type-archive-elite_review .rhero__art img { object-position: 40% 30%; transform: scaleX(-1); }
.premium-inner.post-type-archive-elite_review .ihero__visual:hover .rhero__art img { transform: scaleX(-1) scale(1.025); }
@media (min-width: 64rem) {
  .post-type-archive-elite_review.premium-inner .revwall.revwall--cols {
    display: grid; grid-template-columns: repeat(var(--cols, 3), minmax(0, 1fr)); align-items: stretch; gap: 1.5rem; columns: auto;
  }
  .post-type-archive-elite_review.premium-inner .revwall--cols .revwall__col { display: flex; flex-direction: column; gap: 1.5rem; min-width: 0; }
  .post-type-archive-elite_review.premium-inner .revwall--cols .revwall__col > .rev { flex: 1 1 auto; height: auto; margin: 0; }
  .post-type-archive-elite_review.premium-inner .revwall--cols .rev .rev__who { margin-top: auto; }
  .post-type-archive-elite_review.premium-inner .revwall--cols .rev .rev__text { margin-bottom: 0.3rem; }
}
/* Below a desktop the columns dissolve: two flowing columns on a tablet
   (r4-about.css), one on a phone. */
@media (max-width: 63.99rem) {
  .post-type-archive-elite_review.premium-inner .revwall--cols .revwall__col { display: contents; }
}


/* --------------------------------------------------------------------------
   7. Short laptop screens (under 820px tall: 1280 x 720, 1366 x 657,
   1536 x 730). The team wall scales with the screen's height, so the hero
   stays no taller than its copy and the whole facts strip is in the first
   view; the office line is left to the facts strip ("One office"). The
   profile arch follows the shared frame height (r6-shared.css).
   -------------------------------------------------------------------------- */
@media (min-width: 64rem) and (max-height: 820px) {
  .premium-inner.post-type-archive-elite_clinician .ihero--team .team-card { width: clamp(24rem, 62svh, 33rem); max-width: none; padding: 1rem 1.05rem 0.95rem; }
  .premium-inner.post-type-archive-elite_clinician .team-card__wall { gap: 0.55rem; }
  .premium-inner.post-type-archive-elite_clinician .team-card__face { aspect-ratio: 10 / 11; }
  .premium-inner.post-type-archive-elite_clinician .team-card__foot { flex-wrap: nowrap; gap: 0.75rem; margin-top: 0.85rem; padding-top: 0.75rem; }
  .premium-inner.post-type-archive-elite_clinician .team-card__count { flex: 1 1 auto; }
  .premium-inner.post-type-archive-elite_clinician .team-card__count strong { font-size: 0.98rem; }
  .premium-inner.post-type-archive-elite_clinician .team-card__count span { display: none; }
}

/* ------------------------------------------------ Final QA (revision 10) */
/* W1: the biography column never grows wider than the phone. */
@media (max-width: 63.99rem) {
  .premium-inner.single-elite_clinician .pbio { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 47.99rem) {
  .premium-inner.single-elite_clinician .pbook__btn .btn span > span:first-child { white-space: normal; }
}
/* G4: the other doctors' short bios in full on desktop. */
@media (min-width: 48rem) {
  .dcard--mini .dcard__text { display: block; -webkit-line-clamp: unset; overflow: visible; max-width: 52ch; }
}