/* Doctors / Medical Team page. Same system as Home, Contact and Medical Lab; a more human, typographic register. */

.dot { inline-size: .45rem; block-size: .45rem; border-radius: 50%; background: var(--c-cyan); flex: none; }

@keyframes d-line { from { transform: translateY(105%); } }
@keyframes d-fade { from { opacity: 0; transform: translateY(1rem); } }
@keyframes d-draw { from { stroke-dashoffset: 520; } to { stroke-dashoffset: 0; } }
@keyframes d-frame { from { opacity: 0; clip-path: inset(18% 0 0 0 round 999px 999px 0 0); } to { opacity: 1; clip-path: inset(0 0 0 0 round 999px 999px 0 0); } }

/* =========================================================
   1. HERO — disciplines converging on one arch
   ========================================================= */
.d-hero {
  padding-block: calc(var(--header-h) + clamp(3rem, 2rem + 5vw, 6.5rem)) clamp(4rem, 3rem + 4vw, 7rem);
  background: var(--c-cream);
  overflow: hidden;
}
.d-hero__grid { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); gap: clamp(2rem, 5vw, 6rem); align-items: center; }
.d-hero__eyebrow { color: var(--c-ink-2); }
.d-hero__title { margin-block: 1.5rem 1.75rem; font-size: clamp(2.8rem, 1.1rem + 5vw, 6rem); line-height: 1; letter-spacing: -.035em; }
.d-hero__title .line { display: block; overflow: hidden; padding-block-end: .08em; margin-block-end: -.08em; }
.d-hero__title .line > * { display: inline-block; }
.d-hero__title em { color: var(--c-indigo); }
.d-hero__lead { max-inline-size: 30rem; font-size: var(--fs-lead); line-height: 1.6; color: var(--c-ink-2); }

.d-converge { inline-size: 100%; }
.d-converge__svg { inline-size: 100%; block-size: auto; overflow: visible; }
.d-converge__labels text { font: 300 19px var(--font-serif); fill: var(--c-ink-2); text-anchor: end; dominant-baseline: middle; }
.d-converge__lines path { fill: none; stroke: var(--c-indigo); stroke-opacity: .35; stroke-width: 1; stroke-dasharray: 520; }
.d-converge__arch { fill: none; stroke: var(--c-indigo); stroke-width: 1.5; stroke-linecap: round; }
.d-converge__dot { fill: var(--c-cyan); }
.d-hero__disciplines { display: none; }

@media (prefers-reduced-motion: no-preference) {
  .d-hero__title .line > * { animation: d-line 1.1s var(--ease-out) both; }
  .d-hero__title .line:nth-child(2) > * { animation-delay: .12s; }
  .d-hero__eyebrow, .d-hero__lead { animation: d-fade 1s var(--ease-out) both; }
  .d-hero__lead { animation-delay: .3s; }
  .d-converge__labels text { animation: d-fade .9s var(--ease-out) both; }
  .d-converge__lines path { animation: d-draw 1.8s var(--ease-soft) both; }
  .d-converge__labels text:nth-child(1), .d-converge__lines path:nth-child(1) { animation-delay: .2s; }
  .d-converge__labels text:nth-child(2), .d-converge__lines path:nth-child(2) { animation-delay: .28s; }
  .d-converge__labels text:nth-child(3), .d-converge__lines path:nth-child(3) { animation-delay: .36s; }
  .d-converge__labels text:nth-child(4), .d-converge__lines path:nth-child(4) { animation-delay: .44s; }
  .d-converge__labels text:nth-child(5), .d-converge__lines path:nth-child(5) { animation-delay: .52s; }
  .d-converge__labels text:nth-child(6), .d-converge__lines path:nth-child(6) { animation-delay: .6s; }
  .d-converge__labels text:nth-child(7), .d-converge__lines path:nth-child(7) { animation-delay: .68s; }
  .d-converge__arch, .d-converge__dot { animation: d-fade 1s var(--ease-out) 1.3s both; }
}

@media (max-width: 899px) {
  .d-hero__grid { grid-template-columns: 1fr; }
  .d-converge { display: none; }
  .d-hero__disciplines {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem 0;
    margin-block-start: .5rem;
    padding-block-start: 1.5rem;
    border-block-start: 1px solid var(--c-rule-strong);
    font: 300 1.2rem/1.4 var(--font-serif);
    color: var(--c-ink-2);
  }
  .d-hero__disciplines li:not(:last-child)::after { content: "·"; margin-inline: .6rem; color: var(--c-cyan-ink); }
}

/* =========================================================
   2. INTRODUCTION
   ========================================================= */
.d-intro { padding-block: clamp(5rem, 3rem + 6vw, 9rem); background: var(--c-paper); }
.d-intro__grid { display: grid; grid-template-columns: minmax(10rem, 1fr) 3fr; gap: 2rem 4rem; align-items: baseline; }
.d-intro__statement { max-inline-size: 30ch; font-size: var(--fs-statement); line-height: 1.22; letter-spacing: -.02em; text-wrap: pretty; }
.d-intro__statement em { color: var(--c-indigo); }
@media (max-width: 1023px) { .d-intro__grid { grid-template-columns: 1fr; } }

/* =========================================================
   3. TEAM — compact roster by default, profile browser on large screens
   ========================================================= */
.d-team { background: var(--c-cream); }
.d-team__head { display: grid; gap: 1.25rem; max-inline-size: 46rem; }
.d-team__head h2 em { color: var(--c-indigo); }
.d-team__hint { display: none; font-size: .9375rem; color: var(--c-ink-3); }

.team-browser { margin-block-start: clamp(2.5rem, 2rem + 3vw, 5rem); }

/* Default: an editorial list (mobile, tablet, no JavaScript). */
.team-browser__list { border-block-start: 1px solid var(--c-rule-strong); }
.team-browser__list > li { border-block-end: 1px solid var(--c-rule); }
.doc { display: grid; grid-template-columns: 4.75rem minmax(0, 1fr); gap: 1.25rem; align-items: center; padding-block: 1.35rem; scroll-margin-block-start: calc(var(--header-h) + 1rem); }
.doc__frame {
  position: relative;
  display: grid;
  place-items: center;
  aspect-ratio: 4 / 5;
  overflow: hidden;
  border-radius: 999px 999px 0 0;
  background:
    radial-gradient(110% 70% at 50% 8%, rgba(255, 255, 255, .75), transparent 60%),
    linear-gradient(180deg, var(--c-stone), var(--c-sand));
}
.doc__frame::before {
  content: "";
  position: absolute;
  inset: 9% 9% 0;
  border: 1px solid rgba(48, 48, 144, .2);
  border-block-end: 0;
  border-radius: 999px 999px 0 0;
}
.doc__mono { position: relative; font: italic 300 1.5rem/1 var(--font-serif); letter-spacing: .03em; color: var(--c-indigo); }
.doc__img { position: absolute; inset: 0; z-index: 1; inline-size: 100%; block-size: 100%; object-fit: cover; }
.doc__text { display: grid; gap: .35rem; }
.doc__index { font: 500 .75rem/1 var(--font-sans); letter-spacing: .06em; color: var(--c-cyan-ink); font-variant-numeric: tabular-nums; }
.doc__index span { color: var(--c-ink-3); }
.doc__name { font-size: clamp(1.45rem, 1.2rem + .9vw, 2rem); line-height: 1.15; }
.doc__spec { display: flex; flex-wrap: wrap; align-items: baseline; gap: .1rem .5rem; font: 600 .6875rem/1.5 var(--font-sans); letter-spacing: .14em; text-transform: uppercase; color: var(--c-ink-2); }
.doc__amp { font: italic 300 1rem/1 var(--font-serif); letter-spacing: 0; text-transform: none; color: var(--c-cyan-ink); }
.doc__more:empty { display: none; }

/* Enhanced: roster + one profile at a time (added by doctors.js on large screens). */
.team-browser.is-browser { display: grid; grid-template-columns: minmax(16rem, 4fr) minmax(0, 8fr); gap: clamp(3rem, 6vw, 7rem); align-items: start; }
.is-browser .team-browser__list { border: 0; }
.is-browser .team-browser__list > li { border: 0; }

.roster-nav { border-block-start: 1px solid var(--c-rule-strong); }
.roster-nav__tab {
  position: relative;
  display: grid;
  grid-template-columns: 2.5rem 1fr;
  row-gap: .25rem;
  inline-size: 100%;
  padding: 1.05rem 0 1.1rem;
  border-block-end: 1px solid var(--c-rule);
  text-align: start;
  color: var(--c-ink);
  transition: color .3s;
}
.roster-nav__tab::before { content: ""; position: absolute; inset-inline-start: 0; inset-block: -1px; inline-size: 2px; background: var(--c-cyan); transform: scaleY(0); transition: transform .5s var(--ease-out); }
.roster-nav__n { grid-row: span 2; padding-inline-start: .8rem; padding-block-start: .4rem; font: 500 .75rem/1 var(--font-sans); letter-spacing: .06em; color: var(--c-cyan-ink); font-variant-numeric: tabular-nums; }
.roster-nav__name { font: 300 clamp(1.2rem, 1.05rem + .45vw, 1.45rem)/1.2 var(--font-serif); transition: color .3s, transform .5s var(--ease-out); }
.roster-nav__spec { font-size: .8125rem; color: var(--c-ink-3); }
.roster-nav__tab:hover .roster-nav__name { color: var(--c-indigo); }
.roster-nav__tab[aria-selected="true"] .roster-nav__name { color: var(--c-indigo); transform: translateX(.35rem); }
[dir="rtl"] .roster-nav__tab[aria-selected="true"] .roster-nav__name { transform: translateX(-.35rem); }
.roster-nav__tab[aria-selected="true"]::before { transform: scaleY(1); }

.is-browser .doc {
  grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
  gap: clamp(2.5rem, 5vw, 5rem);
  align-items: end;
  padding: 0;
}
.is-browser .doc:focus-visible { outline-offset: 1.25rem; }
.is-browser .doc__frame { max-inline-size: 27rem; box-shadow: 0 2.5rem 5rem -3rem rgba(26, 29, 58, .3); }
.is-browser .doc__frame::after { content: ""; position: absolute; inset-block-start: 9%; inset-inline-start: 50%; inline-size: .5rem; aspect-ratio: 1; border-radius: 50%; background: var(--c-cyan); translate: -50% -50%; }
[dir="rtl"] .is-browser .doc__frame::after { translate: 50% -50%; }
.is-browser .doc__mono { font-size: clamp(5.5rem, 3rem + 7vw, 10rem); }
.is-browser .doc__text { gap: 1.25rem; padding-block-end: 1rem; }
.is-browser .doc__index { font: 300 1.5rem/1 var(--font-serif); letter-spacing: 0; color: var(--c-indigo); }
.is-browser .doc__name { font-size: clamp(2.5rem, 1.4rem + 3vw, 4.4rem); line-height: 1.02; letter-spacing: -.03em; }
.is-browser .doc__spec { padding-block-start: 1.25rem; border-block-start: 1px solid var(--c-rule-strong); font-size: .75rem; color: var(--c-ink); }
.is-browser .doc__amp { font-size: 1.15rem; }

.doc__step { display: flex; flex-wrap: wrap; gap: .75rem 2rem; margin-block-start: 1.5rem; }
.doc__step button { display: inline-flex; align-items: center; gap: .5rem; font-size: .875rem; color: var(--c-ink-2); transition: color .3s; }
.doc__step button:hover { color: var(--c-indigo); }
.doc__step .icon { transition: transform .45s var(--ease-out); }
.doc__step button:hover .icon { transform: translateX(var(--nudge, .2rem)); }
.doc__step button[data-dir="prev"] { --nudge: -.2rem; }

@media (prefers-reduced-motion: no-preference) {
  .doc.is-entering .doc__frame { animation: d-frame .9s var(--ease-out) both; }
  .doc.is-entering .doc__mono { animation: d-fade .9s var(--ease-out) .15s both; }
  .doc.is-entering .doc__index, .doc.is-entering .doc__spec, .doc.is-entering .doc__step { animation: d-fade .8s var(--ease-out) .2s both; }
  .doc.is-entering .doc__name { animation: d-fade .8s var(--ease-out) .1s both; }
}

@media (min-width: 1024px) {
  .js .d-team__hint { display: block; }
}
@media (max-width: 599px) {
  .doc { grid-template-columns: 3.75rem minmax(0, 1fr); gap: 1rem; padding-block: 1.15rem; }
  .doc__mono { font-size: 1.2rem; }
  .doc__name { font-size: 1.35rem; }
  .doc__spec { font-size: .625rem; }
}

/* =========================================================
   4. DISCIPLINES — dot matrix built from the supplied specialties
   ========================================================= */
.d-map { background: var(--c-paper); }
.d-map__head { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: 1.5rem clamp(2rem, 6vw, 7rem); align-items: end; }
.d-map__head > div { display: grid; gap: 1.5rem; }
.d-map__head h2 em { color: var(--c-indigo); }
.d-map__intro { max-inline-size: 30rem; padding-block-end: .4rem; color: var(--c-ink-2); }

.dmap-wrap { position: relative; margin-block-start: clamp(3rem, 2rem + 3vw, 5rem); }
.dmap { inline-size: 100%; border-collapse: collapse; table-layout: fixed; }
.dmap thead th { padding-block-end: 1.5rem; vertical-align: bottom; font-weight: 400; }
.dmap thead th:first-child { inline-size: 30%; }
.dmap__init { display: block; font: italic 300 1.6rem/1 var(--font-serif); color: var(--c-indigo); }
.dmap__who { display: block; margin-block-start: .5rem; padding-inline: .25rem; font-size: .75rem; line-height: 1.35; color: var(--c-ink-3); }
.dmap tbody tr { border-block-start: 1px solid var(--c-rule); }
.dmap tbody tr:last-child { border-block-end: 1px solid var(--c-rule); }
.dmap tbody th { padding-block: 1.15rem; text-align: start; font: 300 clamp(1.25rem, 1.05rem + .6vw, 1.7rem)/1.2 var(--font-serif); color: var(--c-ink); }
.dmap td { position: relative; text-align: center; }
.dmap__dot { position: relative; z-index: 1; display: inline-block; inline-size: .8rem; aspect-ratio: 1; border-radius: 50%; background: var(--c-indigo); box-shadow: 0 0 0 5px var(--c-paper); transition: transform .4s var(--ease-out), background-color .3s; }
.dmap tbody tr:hover th { color: var(--c-indigo); }
.dmap tbody tr:hover .dmap__dot { background: var(--c-cyan); transform: scale(1.25); }
/* Vertical connector for a person with two disciplines (drawn by doctors.js). */
.dmap-link { position: absolute; inline-size: 1px; background: var(--c-cyan); pointer-events: none; transform-origin: top; }
.js .dmap-wrap:not(.is-in) .dmap-link { transform: scaleY(0); }
.dmap-link { transition: transform 1.2s var(--ease-soft) .4s; }
.d-map__note { max-inline-size: 44rem; margin-block-start: 2rem; font-size: .875rem; color: var(--c-ink-3); }

@media (max-width: 899px) {
  .d-map__head { grid-template-columns: 1fr; }
  .dmap-link { display: none; }
  .dmap, .dmap tbody, .dmap tr, .dmap th, .dmap td { display: block; }
  .dmap thead { display: none; }
  .dmap tbody tr { display: grid; gap: .35rem; padding-block: 1.1rem; }
  .dmap tbody th { padding: 0; }
  .dmap td { display: none; text-align: start; }
  .dmap td.is-on { display: block; font-size: .9375rem; color: var(--c-ink-2); }
  .dmap td.is-on::after { content: attr(data-name); }
  .dmap td.is-on .dmap__dot { inline-size: .45rem; margin-inline-end: .6rem; box-shadow: none; vertical-align: middle; }
}

/* =========================================================
   5. SHARED PRINCIPLES — small
   ========================================================= */
.d-principles { padding-block: clamp(4.5rem, 3rem + 4vw, 7rem); background: var(--c-cream); }
.d-principles__grid { display: grid; grid-template-columns: minmax(10rem, 1fr) 3fr; gap: 1.5rem 4rem; align-items: baseline; }
.d-principles__grid > div { display: grid; gap: 1.75rem; justify-items: start; }
.d-principles__statement { max-inline-size: 26ch; font-size: clamp(1.8rem, 1.3rem + 1.8vw, 3rem); line-height: 1.2; }
.d-principles__statement em { color: var(--c-indigo); }
@media (max-width: 1023px) { .d-principles__grid { grid-template-columns: 1fr; } }

/* =========================================================
   6. CONTACT BRIDGE
   ========================================================= */
.d-cta { padding-block: var(--section); background: var(--c-paper); }
.d-cta__grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 3rem clamp(3rem, 7vw, 8rem); align-items: start; }
.d-cta__grid > div { display: grid; gap: 1.5rem; }
.d-cta h2 em { color: var(--c-indigo); }
.d-cta__list { border-block-start: 1px solid var(--c-rule-strong); }
.d-cta__list li:nth-child(2) { --reveal-delay: .06s; }
.d-cta__list li:nth-child(3) { --reveal-delay: .12s; }
.d-cta__list li:nth-child(4) { --reveal-delay: .18s; }
.d-cta__item { display: grid; grid-template-columns: minmax(9rem, 12rem) minmax(0, 1fr) auto; gap: .5rem 1.5rem; align-items: baseline; padding-block: 1.4rem; border-block-end: 1px solid var(--c-rule); }
.d-cta__k { font: 600 .6875rem/1.4 var(--font-sans); letter-spacing: .14em; text-transform: uppercase; color: var(--c-ink-3); }
.d-cta__v { font: 300 clamp(1.35rem, 1.1rem + .8vw, 1.85rem)/1.2 var(--font-serif); transition: color .3s, transform .5s var(--ease-out); }
.d-cta__item:hover .d-cta__v { color: var(--c-indigo); transform: translateX(.35rem); }
[dir="rtl"] .d-cta__item:hover .d-cta__v { transform: translateX(-.35rem); }
@media (max-width: 1023px) { .d-cta__grid { grid-template-columns: 1fr; } }
@media (max-width: 559px) {
  .d-cta__item { grid-template-columns: 1fr auto; }
  .d-cta__k { grid-column: 1 / -1; }
}