/* Mobile expertise cards and continuously scrolling patient comparisons. */
/* Override the legacy fixed-length connectors only after image layout is known. */
.bodymap--placement .hotspot.hotspot--anchored .hotspot__line {
  position: absolute; left: var(--connector-x); right: auto; top: var(--connector-y);
  width: var(--connector-length); height: 1px; margin: 0;
  transform-origin: 0 50%; transform: rotate(var(--connector-angle));
  pointer-events: none;
}
.bodymap--placement .hotspot.hotspot--anchored .hotspot__dot {
  position: absolute; left: var(--anchor-x); right: auto; top: var(--anchor-y);
  width: 10px; height: 10px; margin: 0; transform: translate(-50%, -50%);
  pointer-events: none;
}
.bodymap--placement .hotspot.hotspot--anchored .hotspot__card::after { display: none; }
@media (max-width: 640px) {
  .bodymap--placement .bodymap__viz { height: 225px; }
  .bodymap--placement .bodymap__img { position: absolute; width: 340px; top: -16px; }
  .bodymap--placement .bodymap__mobile-card { position: relative; padding: 13px 76px 15px 16px; border: 0; border-radius: 9px; box-shadow: 0 6px 16px #5c392010; }
  .bodymap--placement .bodymap__mobile-card > span:first-child { font-size: 12px; }
  .bodymap--placement .bodymap__mobile-card h3 { font-size: 12px; margin: 3px 0 6px; line-height: 1.35; }
  .bodymap--placement .bodymap__mobile-card p { font-size: 11px; line-height: 1.35; }
  .bodymap--placement .expertise-icon { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); width: 50px; height: 50px; display: grid; place-items: center; border-radius: 50%; background: #f7f0e9; color: #92734f; box-shadow: inset 0 0 0 1px #b28e6226; }
  .expertise-icon svg { display: block; width: 32px; height: 32px; fill: none; stroke: currentColor; stroke-width: 1.45; stroke-linecap: round; stroke-linejoin: round; }
}
@media (min-width: 641px) { .expertise-icon { display: none; } }
.results.results--loop { padding: 52px 28px 32px; }
.results--loop .results__head { max-width: 760px; margin: 0 auto 40px; }
.results--loop .results__head h2 { font-size: clamp(32px, 3.6vw, 50px); max-width: 22ch; margin: 0 auto 18px; line-height: 1.05; }
.results--loop .results__head > p:not(.eyebrow) { max-width: 49ch; margin: 0 auto; font-size: 14px; line-height: 1.5; }
.results--loop .results__carousel { max-width: 1320px; margin: auto; padding: 0; height: auto; overflow: hidden; }
.results--loop .results__track { position: relative; inset: auto; display: flex; align-items: stretch; gap: 16px; width: max-content; padding: 0; animation: none; will-change: transform; transform: translate3d(var(--gallery-offset, 0px), 0, 0) !important; }
.results--loop .pcard { position: relative; width: var(--gallery-card-width, 240px); flex: 0 0 var(--gallery-card-width, 240px); height: 450px; aspect-ratio: auto; margin: 0; border: 1px solid #bca58b42; border-radius: 9px; background: #111; overflow: hidden; box-shadow: none; }
.results--loop .pcard::before, .results--loop .pcard::after { display: none; }
.loop-comparison { position: absolute; inset: 0 0 64px; overflow: hidden; }
.loop-comparison__image { position: absolute; inset: 0; background-repeat: no-repeat; background-size: var(--source-width) 100%; }
.loop-comparison__image--before { background-position: calc(50% + var(--source-quarter)) center; clip-path: inset(0 calc(100% - var(--split, 50%)) 0 0); }
.loop-comparison__image--after { background-position: calc(50% - var(--source-quarter)) center; clip-path: inset(0 0 0 var(--split, 50%)); }
.loop-comparison::after { content: ''; position: absolute; inset: 0; background: linear-gradient(transparent 52%, #0a0a0a); pointer-events: none; }
.results--loop .pcard__chip { top: 12px; left: 12px; font-size: 9px; padding: 4px 7px; letter-spacing: .04em; }
.results--loop .pcard__chip--right { left: auto; right: 12px; }
.results--loop .pcard__label { bottom: 60px; left: 8px; right: 8px; font-size: 21px; line-height: 1.1; }
.results--loop .pcard__sub { bottom: 21px; left: 16px; right: 16px; font-size: 11px; line-height: 1.35; }
.comparison-control { position: absolute; z-index: 5; inset: 0 0 85px; --split: 50%; }
.comparison-control::before { content: ''; position: absolute; left: var(--split); top: 0; bottom: 0; width: 1px; background: #ffffff70; pointer-events: none; }
.comparison-control__handle { position: absolute; left: var(--split); top: 50%; width: 34px; height: 34px; transform: translate(-50%, -50%); border: 1px solid #ffffffe0; border-radius: 50%; background: #0a0a0a; color: white; display: grid; place-items: center; font: 15px/1 sans-serif; pointer-events: none; }
.comparison-control input { position: absolute; inset: 0; margin: 0; width: 100%; height: 100%; opacity: 0; cursor: ew-resize; }
.comparison-control:focus-within .comparison-control__handle { outline: 3px solid #b08d5b; outline-offset: 3px; }
.gallery-pause { display: block; margin: 18px auto 0; padding: 8px 16px; border: 1px solid #ffffff55; border-radius: 24px; color: #f8e2db; font: inherit; font-size: 12px; }
.gallery-pause:focus-visible { outline: 2px solid #b08d5b; outline-offset: 4px; }
@media (max-width: 640px) {
  .results.results--loop { padding: 48px 18px 28px; }
  .results--loop .results__head { padding: 0; margin-bottom: 28px; }
  .results--loop .pcard { height: 390px; }
  .results--loop .pcard__label { font-size: 20px; }
}
