.hero-scroll{--hero-max-height:680px;--hero-height:680px;--hero-travel:680px;--hero-top:100px;max-width:1456px;margin:24px auto 0}
.hero-scroll .hero{margin:0;max-width:none}
.hero-scene{display:none}
.hero-visual .medical-image{mask-image:radial-gradient(ellipse closest-side,#000 65%,transparent 100%)}
.hero-scroll.is-3d{height:calc(var(--hero-height) + var(--hero-travel))}
.is-3d .hero{position:sticky;top:var(--hero-top);height:var(--hero-height);min-height:0;padding:40px 48px;align-items:center;grid-template-columns:1fr 1.12fr;gap:24px}
.is-3d .hero-content{padding:0}
.is-3d .hero h1{font-size:clamp(36px,3.7vw,48px)}
.is-3d .hero-visual{width:100%;max-width:none;margin:0;padding:0;align-self:center}
.is-3d .hero-scene{display:block;height:min(480px,calc(var(--hero-height) - 160px));width:100%;position:relative}
.hero-scene canvas{display:block;width:100%;height:100%;pointer-events:none}
.is-3d .medical-image{display:none}
.hero-scroll.is-still{height:auto}
.is-still .hero{position:relative;top:auto;height:auto}

.is-3d .hero .button-group{gap:16px 24px}
.is-3d .hero a:focus-visible{outline-color:var(--mint)}
@media(max-width:1490px){.hero-scroll{margin-inline:24px}}
@media(max-width:960px){.hero-scroll{--hero-max-height:800px}.is-3d .hero{grid-template-columns:1fr;gap:16px;padding:32px 40px;align-content:center}.is-3d .hero h1{font-size:40px}.is-3d .hero-scene{height:320px}.is-3d .hero-description{margin-top:16px}.is-3d .hero .button-group{margin-top:20px}.is-3d .hero-visual{max-width:560px}}
@media(max-width:720px){.hero-scroll{margin:12px 12px 0}.is-3d .hero{padding:24px;gap:12px}.is-3d .hero h1{font-size:32px}.is-3d .hero-description{font-size:14px}.is-3d .hero-scene{height:240px}.is-3d .hero .button-group{gap:8px 16px}.is-3d .hero .text-link{font-size:12px}}
