.medical-page .btn,
.medical-page .case-link,
.medical-page .text-link,
.medical-page .offer-band .section-action {
  font-size: 18px;
  line-height: 1.4;
  min-height: 54px;
  white-space: normal;
}
.medical-page .topbar .btn {font-size:16px;min-height:46px;padding-inline:20px}
.medical-page .mobile-call-ai,
.medical-page .mobile-cabinet-login {font-size:15px}
.medical-page .nav-dropdown__trigger {font-size:16px;padding-right:3px}
.medical-page .preset {font-size:15px;min-height:42px}
.medical-page .calc-details summary {font-size:15px;line-height:1.5}

.medical-page .hero-content {width:100%;min-height:480px}
.medical-page .medical-hero__image,
.medical-page .medical-hero::before {height:480px}
.medical-page .hero-copy {max-width:620px}
.medical-page .hero-brand {font-size:15px}
.medical-page .hero-copy h1 {font-size:48px;max-width:600px;line-height:1.14}
.medical-page .hero-subtitle {font-size:21px;max-width:480px;line-height:1.5}
.medical-page .hero-benefits strong {font-size:18px;line-height:1.4}
.medical-page .hero-benefits li {font-size:15px;line-height:1.6}
.medical-page .hero-benefits {gap:24px}

@media(max-width:1100px) {
  .medical-page .hero-copy {max-width:530px}
  .medical-page .hero-copy h1 {font-size:42px;max-width:530px}
  .medical-page .hero-benefits {gap:16px}
  .medical-page .hero-benefits strong {font-size:17px}
}
@media(min-width:901px) {
  .medical-page .medical-hero__image {left:40px;right:auto}
}
@media(min-width:701px) and (max-width:900px) {
  .medical-page .medical-hero__image {height:260px;object-position:center 35%}
  .medical-page .medical-hero::before {display:none}
  .medical-page .hero-content {min-height:0;padding-top:288px}
  .medical-page .hero-copy {max-width:100%}
  .medical-page .hero-copy h1 {max-width:650px}
}
@media(max-width:700px) {
  .medical-page .btn,
  .medical-page .case-link,
  .medical-page .text-link,
  .medical-page .offer-band .section-action {font-size:17px;min-height:52px}
  .medical-page .medical-hero__image {height:190px}
  .medical-page .hero-content {min-height:0;padding-top:214px}
  .medical-page .hero-brand {font-size:14px}
  .medical-page .hero-copy h1 {font-size:34px;max-width:none}
  .medical-page .hero-subtitle {font-size:19px}
  .medical-page .hero-benefits {gap:0}
}
@media(max-width:360px) {
  .medical-page .hero-copy h1 {font-size:30px}
  .medical-page .hero-subtitle {font-size:18px}
  .medical-page .mobile-call-ai {font-size:14px;padding-inline:10px}
}

/* Content stays visible without JavaScript; sequences play only once in view. */
@media(prefers-reduced-motion:no-preference) {
  .medical-page .btn,
  .medical-page .case-link,
  .medical-page .preset {transition:background-color 180ms,color 180ms,border-color 180ms,transform 120ms}
  .medical-page .btn:active,
  .medical-page .case-link:active {transform:translateY(1px)}
  .medical-page .hero-copy {animation:medical-focus-in 550ms ease-out both}
  .medical-page dialog[open] {animation:medical-dialog-in 220ms cubic-bezier(.16,1,.3,1) both}
  .medical-page dialog[open]::backdrop {animation:medical-focus-in 180ms ease-out both}
  .medical-page .launch-steps.motion-played li>span {
    animation:medical-step-focus 650ms ease-out both;
    animation-delay:var(--motion-delay,0ms);
  }
  .medical-page .integration-route.motion-played>.icon {animation:medical-transfer 650ms ease-out both}
  .medical-page .results-primary.motion-played>strong {animation:medical-result-focus 500ms ease-out both}
}
@keyframes medical-focus-in {from{opacity:.55}to{opacity:1}}
@keyframes medical-dialog-in {from{opacity:.4;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@keyframes medical-step-focus {0%{opacity:.55}35%{opacity:1;transform:translateY(-3px)}100%{opacity:1;transform:translateY(0)}}
@keyframes medical-transfer {0%{opacity:.4;transform:translateX(-8px)}65%{opacity:1;transform:translateX(4px)}100%{opacity:1;transform:translateX(0)}}
@keyframes medical-result-focus {from{opacity:.4;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce) {
  .medical-page *, .medical-page *::before, .medical-page *::after {animation:none!important;transition:none!important}
}
