/* Meet Dr. John — airy editorial composition (homepage only, CSS only).
   Lines, not ornaments: no numbers, counters or dots (owner rule).
   - The portrait is taller and the text column narrower, so the left side
     breathes: the introduction holds the top edge, the credentials rest on the
     bottom edge, and the space between them is left open.
   - Credentials sit between hairline rules that draw in from the left when the
     group arrives (motion on and no-preference only; complete otherwise).
   - The caption is plain text led by a short gold line over a soft floor shade.
   No scroll-linked image motion: a continuously driven portrait made scrolling
   and the therapy pin measurably less responsive.
   Copy, order and links are unchanged; the h2 keeps the shared section size. */

.elementor-86 .sv-home.sv-home>.sv-doctor{
  --doc-copy:26rem;
  --doc-span:calc(var(--sv-frame,92vw) - var(--sv-gap,48px));
  --doc-rule:var(--sv-rule-on-dark,rgba(247,241,232,.16));
  --doc-draw:1.1s}

/* ---------- Composition ---------- */
.elementor-86 .sv-home.sv-home .sv-doctor-copy-inner,
.elementor-86 .sv-home.sv-home .sv-doctor-facts{max-width:var(--doc-copy)}
@media(min-width:1101px){
  .elementor-86 .sv-home.sv-home>.sv-doctor{row-gap:clamp(48px,5vw,96px)}
  /* Portrait: from a 3:2 landscape toward an upright frame, kept inside the
     screen and capped on very wide displays. Never shorter than before. */
  .elementor-86 .sv-home.sv-home .sv-portrait-wrap{
    min-height:clamp(calc(var(--doc-span) * .48),calc(100svh - 112px),min(calc(var(--doc-span) * .6),820px))}
}
@media(max-width:1100px){
  .elementor-86 .sv-home.sv-home .sv-portrait-wrap{aspect-ratio:10/9}
  .elementor-86 .sv-home.sv-home .sv-doctor-facts{max-width:none}
}
@media(max-width:860px){
  .elementor-86 .sv-home.sv-home .sv-portrait-wrap{aspect-ratio:3/2}
  .elementor-86 .sv-home.sv-home .sv-doctor-copy-inner{max-width:30rem}
}
@media(max-width:560px){
  .elementor-86 .sv-home.sv-home .sv-portrait-wrap{aspect-ratio:5/6}
}

/* ---------- Credentials: hairline rules instead of boxed borders ---------- */
.elementor-86 .sv-home.sv-home .sv-doctor-facts{border-top:0}
.elementor-86 .sv-home.sv-home .sv-doctor .sv-fact{position:relative;border-bottom:0}
.elementor-86 .sv-home.sv-home .sv-doctor .sv-fact::before,
.elementor-86 .sv-home.sv-home .sv-doctor .sv-fact:last-child::after{
  content:"";position:absolute;left:0;right:0;top:0;height:var(--sv-line,1px);
  background:var(--doc-rule);transform-origin:0 50%;pointer-events:none}
.elementor-86 .sv-home.sv-home .sv-doctor .sv-fact:last-child::after{top:auto;bottom:0}
@media(min-width:861px) and (max-width:1100px){
  /* Three columns: each credential opens with its own rule; no closing rule. */
  .elementor-86 .sv-home.sv-home .sv-doctor .sv-fact:last-child::after{content:none}
}

/* ---------- Portrait caption: a line, not a badge ---------- */
.elementor-86 .sv-home.sv-home .sv-portrait-caption{
  z-index:1;display:inline-flex;align-items:center;gap:12px;padding:0;
  border:0;border-radius:0;background:none;-webkit-backdrop-filter:none;backdrop-filter:none;
  color:var(--sv-on-dark);letter-spacing:.01em;text-shadow:0 1px 12px color-mix(in srgb,var(--sv-ink) 60%,transparent)}
.elementor-86 .sv-home.sv-home .sv-portrait-caption::before{
  content:"";flex:none;width:28px;height:var(--sv-line,1px);background:var(--sv-gold);transform-origin:0 50%}
/* A soft floor shade keeps the caption legible on any crop. */
.elementor-86 .sv-home.sv-home .sv-portrait-wrap::after{
  content:"";position:absolute;inset:auto 0 0;height:36%;z-index:0;pointer-events:none;
  background:linear-gradient(to top,color-mix(in srgb,var(--sv-ink) 55%,transparent),transparent)}

/* ---------- Line draw (entrances only, never scroll-linked) ---------- */
@media(prefers-reduced-motion:no-preference){
  /* Transition only on arrival, so collapsing a pending rule is instant. */
  .elementor-86 .sv-home[data-sv-home-motion=on] .sv-doctor-facts[data-sv-enter=entered] .sv-fact::before,
  .elementor-86 .sv-home[data-sv-home-motion=on] .sv-doctor-facts[data-sv-enter=entered] .sv-fact:last-child::after,
  .elementor-86 .sv-home[data-sv-home-motion=on] .sv-portrait-wrap[data-sv-enter=entered] .sv-portrait-caption::before{
    transition:transform var(--doc-draw) var(--sv-ease,cubic-bezier(.22,1,.36,1)) calc(var(--sv-enter-delay,0ms) + var(--doc-i,0) * 120ms)}
  .elementor-86 .sv-home.sv-home .sv-doctor .sv-fact:nth-child(2){--doc-i:1}
  .elementor-86 .sv-home.sv-home .sv-doctor .sv-fact:nth-child(3){--doc-i:2}
  .elementor-86 .sv-home.sv-home .sv-doctor .sv-fact:last-child::after{--doc-i:3}
  .elementor-86 .sv-home.sv-home .sv-doctor .sv-portrait-caption::before{--doc-i:3}
  .elementor-86 .sv-home[data-sv-home-motion=on] .sv-doctor-facts[data-sv-enter=pending] .sv-fact::before,
  .elementor-86 .sv-home[data-sv-home-motion=on] .sv-doctor-facts[data-sv-enter=pending] .sv-fact:last-child::after,
  .elementor-86 .sv-home[data-sv-home-motion=on] .sv-portrait-wrap[data-sv-enter=pending] .sv-portrait-caption::before{transform:scaleX(0)}
}