dentapix-orbit { display: block; width: 100%; }
.hero-orbit { align-self: start; margin: 0; min-width: 0; height: calc(var(--orbit-height, 480px) + 85svh); }
.hero-orbit dentapix-orbit { position: sticky; top: 24px; }
.klinik .hero:has(.hero-orbit) { align-items: start; }
@media (min-width: 901px) {
  .hero:has(.hero-orbit) .hero-copy { position: sticky; top: 80px; margin-top: 80px; }
}
.orbit-viewport { position: relative; width: 100%; aspect-ratio: 600 / 420; overflow: hidden; }
.orbit-stage { position: absolute; width: 600px; height: 420px; transform-origin: top left; }
/* Keep the entire 3D scene above the capture pulse, even on the rear orbit. */
.orbit-world { position: absolute; inset: 0; z-index: 1; perspective: 950px; transform-style: preserve-3d; }
.orbit-tooth { position: absolute; left: 192px; top: 112px; width: 216px; height: 216px; object-fit: contain; transform: translateZ(0); }
.orbit-track { position: absolute; left: 69px; top: 288px; width: 462px; height: 80px; border: 1px solid #dce9e8; border-radius: 50%; }
.orbit-phone { position: absolute; left: 240px; top: 90px; width: 120px; height: 248px; transform-style: preserve-3d; will-change: transform; }
.orbit-phone-shell { position: absolute; inset: 1px; border-radius: 19px; background: linear-gradient(110deg,#5b5f62,#151719 20%,#25292c 85%,#6b7074); border: 1px solid #363a3d; }
.orbit-phone-back, .orbit-phone-front { position: absolute; inset: 0; backface-visibility: hidden; }
.orbit-phone-back { transform: translateZ(4px); }
.orbit-phone-front { transform: rotateY(180deg) translateZ(4px); }
.orbit-phone-back img, .orbit-phone-front img { position: absolute; max-width: none; height: 102%; top: -1%; object-fit: fill; }
.orbit-phone-back img { width: 112%; left: -6%; }
.orbit-phone-front img { width: 105%; left: -2.5%; }
.orbit-focus { position: absolute; z-index: 0; left: 217px; top: 138px; width: 166px; height: 171px; border: 1px solid #287e80; border-radius: 22px; opacity: 0; pointer-events: none; }
.orbit-film { display: flex; gap: 9px; justify-content: center; margin: -8px 0 20px; }
.orbit-shot { position: relative; display: block; width: 54px; height: 62px; border: 1px solid #e0e8e7; border-radius: 6px; background: #fafcfc; overflow: hidden; }
.orbit-shot img { width: 100%; height: 48px; object-fit: contain; opacity: var(--reveal, 0); clip-path: inset(calc((1 - var(--reveal, 0)) * 100%) 0 0); }
.orbit-shot small { position: absolute; left: 5px; bottom: 3px; color: #738685; font-size: 9px; line-height: 1; }
.orbit-shot b { position: absolute; right: 4px; bottom: 3px; color: #287e80; font-size: 10px; opacity: 0; line-height: 1; }
.orbit-shot.is-captured { border-color: #90b4b0; }
.orbit-shot.is-current { background: #edf5f4; border-color: #287e80; }
.orbit-shot.is-captured b { opacity: 1; }
.orbit-caption { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 8px 16px; color: #637777; font-size: 12px; }
.orbit-toggle { appearance: none; border: 0; border-bottom: 1px solid #a5c0bd; background: transparent; color: #287e80; font: inherit; padding: 7px 0; cursor: pointer; }
.orbit-toggle:hover { color: #154e50; border-color: currentColor; }
.orbit-toggle:focus-visible { outline: 2px solid #287e80; outline-offset: 5px; border-radius: 2px; }
@media (prefers-reduced-motion: reduce) { .orbit-shot img { transition: none; } }