/* =============================================================================
   Single Team Member page (Complete Physio) — staging design port
   Self-contained: scoped to .jid-teampage. Shares the visual language of the
   approved clinic single (jid-clinic-single.css) but never depends on it.
   Buttons/header/footer come from jid-core.css; ALL colour from jid-core's
   :root brand tokens (--teal family, --header-bg navy) — no local palette.
   ============================================================================= */
.jid-teampage{
  --tm-r:16px;
  color:var(--ink);
}
.jid-teampage .cp-wrap{max-width:1180px;margin:0 auto;padding:0 24px}
.jid-teampage section{scroll-margin-top:100px}

/* Breadcrumb */
.jid-teampage .cp-crumb{font-size:.82rem;color:var(--slate);padding:24px 0 0;margin-bottom:26px}
.jid-teampage .cp-crumb a{color:var(--slate);text-decoration:none}
.jid-teampage .cp-crumb a:hover{color:var(--teal-ink)}
.jid-teampage .cp-crumb span{margin:0 7px;opacity:.6}

.jid-teampage .cp-kicker{
  display:inline-block;font-size:.74rem;font-weight:700;letter-spacing:.13em;
  text-transform:uppercase;color:var(--teal-ink);margin-bottom:12px
}

/* ── 1. PROFILE HERO ─────────────────────────────────────────────────────── */
/* Photos are CIRCLES everywhere (John, 2026-07-23): many legacy headshots are
   circle-cropped PNGs, so a rectangular frame double-crops them. One shape,
   one crop — a white circular avatar absorbs both circular PNGs and
   rectangular photos cleanly. */
.jid-teampage .tm-hero{padding:0 0 44px}
.jid-teampage .tm-hero__grid{
  display:grid;grid-template-columns:auto minmax(0,1fr);
  gap:52px;align-items:center
}
.jid-teampage .tm-hero__photo{
  width:300px;border-radius:50%;overflow:hidden;border:1px solid var(--line);
  box-shadow:var(--shadow-lift);background:#fff;align-self:center
}
.jid-teampage .tm-hero__photo img{display:block;width:100%;height:auto;aspect-ratio:1/1;object-fit:cover}
.jid-teampage .tm-hero h1{
  font-family:var(--font-display);font-weight:800;color:var(--header-bg);
  font-size:clamp(2rem,4vw,2.9rem);line-height:1.08;margin:0 0 8px
}
.jid-teampage .tm-hero__role{
  font-family:var(--font-display);font-weight:600;color:var(--teal-ink);
  font-size:1.12rem;margin:0 0 6px
}
.jid-teampage .tm-hero__quals{color:var(--slate);font-size:.92rem;margin:0 0 16px}
.jid-teampage .tm-hero__meta{margin:6px 0 20px}
.jid-teampage .tm-hero__label{
  display:inline-flex;gap:6px;align-items:center;font-size:.7rem;font-weight:700;
  letter-spacing:.08em;text-transform:uppercase;color:var(--slate);margin-bottom:8px
}
.jid-teampage .tm-hero__label svg{color:var(--teal-deep)}
.jid-teampage .tm-hero__tags{display:flex;flex-wrap:wrap;gap:8px}
.jid-teampage .tm-tag{
  background:#fff;border:1px solid var(--line);border-radius:999px;
  padding:6px 13px;font-size:.84rem;color:var(--header-bg);font-weight:600;
  text-decoration:none;transition:border-color .15s ease,color .15s ease
}
.jid-teampage a.tm-tag:hover{border-color:var(--teal);color:var(--teal-ink)}
.jid-teampage .tm-tag--muted{font-weight:500;color:var(--slate)}

/* Trustpilot chip — filled green (director-approved contrast fix) */
.jid-teampage .cp-trust{
  display:inline-flex;align-items:center;gap:9px;background:#00b67a;
  border:1px solid #00b67a;border-radius:999px;padding:8px 16px;margin-bottom:24px
}
.jid-teampage .cp-trust__stars{color:#fff;letter-spacing:2px;font-size:.95rem}
.jid-teampage .cp-trust__txt{font-size:.85rem;color:#fff;font-weight:700}
.jid-teampage .tm-hero__cta{display:flex;flex-wrap:wrap;gap:12px}

/* ── 2. BIO + STICKY SIDEBAR ─────────────────────────────────────────────── */
.jid-teampage .tm-body{padding:8px 0 56px}
.jid-teampage .tm-body__grid{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:48px;align-items:start}
.jid-teampage .cp-prose h2{
  font-family:var(--font-display);font-weight:800;color:var(--header-bg);
  font-size:1.55rem;margin:0 0 14px
}
.jid-teampage .cp-prose h3{
  font-family:var(--font-display);font-weight:700;color:var(--header-bg);
  font-size:1.12rem;margin:30px 0 8px
}
.jid-teampage .cp-prose p{color:var(--body);line-height:1.7;margin:0 0 14px;font-size:1rem}
.jid-teampage .cp-prose ul{color:var(--body);line-height:1.7;margin:0 0 14px;padding-left:22px}

.jid-teampage .tm-side{position:sticky;top:96px}
.jid-teampage .tm-card{background:var(--card);border:1px solid var(--line);
  border-radius:var(--tm-r);padding:22px 24px 24px;box-shadow:var(--shadow-lift)}
.jid-teampage .tm-card__label{font-size:.72rem;font-weight:700;letter-spacing:.05em;
  text-transform:uppercase;color:var(--slate);margin:0 0 8px}
.jid-teampage .tm-card__txt{color:var(--body);font-size:.94rem;line-height:1.55;margin:0 0 16px}
.jid-teampage .tm-card .jid-btn--block{margin-bottom:10px}
.jid-teampage .tm-card__ins{margin-top:16px;padding-top:16px;border-top:1px solid var(--line)}
.jid-teampage .tm-card__ins .tm-tag{font-size:.78rem;padding:5px 11px}

/* ── 3. REVIEWS band ─────────────────────────────────────────────────────── */
.jid-teampage .cp-reviews{padding:0 0 48px}
.jid-teampage .cp-reviews__inner{background:linear-gradient(120deg,var(--header-bg),#1d3742);
  border-radius:var(--tm-r);padding:38px;text-align:center;color:#fff}
.jid-teampage .cp-reviews__stars{color:#00b67a;font-size:1.5rem;letter-spacing:4px}
.jid-teampage .cp-reviews__inner h2{font-family:var(--font-display);font-weight:800;
  font-size:1.8rem;margin:10px 0 6px;color:#fff}
.jid-teampage .cp-reviews__inner p{color:rgba(255,255,255,.86);margin:0 0 20px}

/* ── 4. COLLEAGUES grid ──────────────────────────────────────────────────── */
.jid-teampage .tm-colleagues{padding:8px 0 56px}
.jid-teampage .cp-sec-head{margin-bottom:22px}
.jid-teampage .cp-sec-head .cp-kicker{margin-bottom:8px}
.jid-teampage .cp-sec-head h2{font-family:var(--font-display);font-weight:800;color:var(--header-bg);
  font-size:1.55rem;margin:0}
.jid-teampage .tm-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.jid-teampage .tm-member{display:block;text-decoration:none;background:#fff;
  border:1px solid var(--line);border-radius:var(--tm-r);padding:24px 16px 4px;
  text-align:center;
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.jid-teampage .tm-member:hover{transform:translateY(-4px);box-shadow:var(--shadow-lift);border-color:var(--teal)}
.jid-teampage .tm-member__photo{width:140px;aspect-ratio:1/1;margin:0 auto;
  border-radius:50%;overflow:hidden;background:#fff;border:1px solid var(--line)}
.jid-teampage .tm-member__photo img{display:block;width:100%;height:100%;
  object-fit:cover;transition:transform .3s ease}
.jid-teampage .tm-member:hover .tm-member__photo img{transform:scale(1.05)}
.jid-teampage .tm-member__initials{display:flex;align-items:center;justify-content:center;
  width:100%;height:100%;font-family:var(--font-display);font-weight:800;font-size:2.6rem;
  color:var(--teal-ink);background:linear-gradient(160deg,var(--bg),#e7f6fb)}
.jid-teampage .tm-member__body{padding:14px 0 16px}
.jid-teampage .tm-member__name{display:block;font-family:var(--font-display);font-weight:700;
  color:var(--header-bg);font-size:1rem;margin-bottom:3px}
.jid-teampage .tm-member__role{display:block;color:var(--slate);font-size:.82rem;line-height:1.35}
.jid-teampage .tm-more{text-align:center;margin-top:26px}

/* ── 5. CTA band — matches the approved /clinics/ "Ready to Book?" band ──── */
.jid-teampage .cp-cta{position:relative;z-index:1;margin-top:8px;
  background:linear-gradient(120deg,var(--header-bg),#1d3742)}
.jid-teampage .cp-cta__inner{max-width:var(--maxw);margin:0 auto;padding:52px 28px;
  display:flex;align-items:center;justify-content:space-between;gap:28px;flex-wrap:wrap}
.jid-teampage .cp-cta__copy h2{font-family:var(--font-display);font-weight:800;
  font-size:clamp(1.6rem,3vw,2.2rem);color:#fff;margin:0 0 8px;letter-spacing:-.01em}
.jid-teampage .cp-cta__copy p{margin:0;font-size:1.05rem;color:rgba(255,255,255,.86);max-width:540px}
.jid-teampage .cp-cta__actions{display:flex;gap:14px;flex-wrap:wrap}
.jid-teampage .jid-btn--outline-light{background:transparent;color:#fff;border-color:rgba(255,255,255,.4)}
.jid-teampage .jid-btn--outline-light:hover{background:rgba(255,255,255,.1);border-color:#fff}

/* preview ribbon (only while the new design is preview-gated) */
.jid-teampage .cp-ribbon{background:#fff4d6;border-bottom:1px solid #f0dfa6;color:#7a5c12;
  font-size:.8rem;text-align:center;padding:8px 16px;font-weight:600}

/* ── responsive ──────────────────────────────────────────────────────────── */
@media (max-width:900px){
  /* Mobile first fold, mirroring the approved clinic pattern:
     kicker → H1 → role → trust → PHOTO → stacked full-width buttons. */
  .jid-teampage .tm-hero__grid{grid-template-columns:1fr;gap:0}
  .jid-teampage .tm-hero__info{display:contents}
  .jid-teampage .cp-kicker{order:1;text-align:center;margin-bottom:8px}
  .jid-teampage .tm-hero h1{order:2;text-align:center;margin-bottom:6px}
  .jid-teampage .tm-hero__role{order:3;text-align:center;margin-bottom:4px}
  .jid-teampage .tm-hero__quals{order:4;text-align:center;margin-bottom:12px}
  .jid-teampage .cp-trust{order:5;background:transparent;border:0;padding:0;
    display:flex;flex-direction:column;align-items:center;gap:2px;margin:0 0 18px;width:100%}
  .jid-teampage .cp-trust__stars{color:#00b67a;font-size:1.05rem;letter-spacing:3px}
  .jid-teampage .cp-trust__txt{color:var(--slate);font-size:.8rem}
  .jid-teampage .tm-hero__photo{order:6;width:210px;margin:0 auto 18px}
  .jid-teampage .tm-hero__meta{order:7;text-align:center;margin:0 0 18px}
  .jid-teampage .tm-hero__tags{justify-content:center}
  .jid-teampage .tm-hero__cta{order:8;flex-direction:column;gap:10px;width:100%}
  .jid-teampage .tm-hero__cta .jid-btn{width:100%;text-align:center}
  .jid-teampage .tm-body__grid{grid-template-columns:1fr;gap:32px}
  .jid-teampage .tm-side{position:static}
  .jid-teampage .tm-grid{grid-template-columns:repeat(2,1fr)}
  .jid-teampage .cp-cta__inner{padding:40px 18px}
  .jid-teampage .cp-cta__actions{width:100%}
  .jid-teampage .cp-cta__actions .jid-btn{flex:1 1 auto}
}
@media (max-width:600px){
  .jid-teampage .tm-grid{grid-template-columns:1fr 1fr;gap:12px}
  .jid-teampage .tm-hero h1{font-size:1.9rem}
  .jid-teampage .cp-reviews__inner{padding:28px 20px}
  .jid-teampage .tm-member__body{padding:11px 12px 13px}
  .jid-teampage .tm-member__name{font-size:.92rem}
}
