@view-transition {
  navigation: auto;
}

@media (prefers-reduced-motion: reduce) {
  @view-transition {
    navigation: none;
  }
}

@media (prefers-reduced-motion: no-preference) {
  header.header {
    view-transition-name: site-header;
  }

  .site-wrapper {
    view-transition-name: page-main;
  }

  .main-hero,
  .about-hero,
  .partner-hero,
  .contacts-page,
  .hero-area-coodiv .shape-1,
  .hero-area-coodiv .shape-2,
  .hero-area-coodiv .shape-3,
  section.why > .container > .row.d-lg-none .why__head,
  section.why .why__head.d-none.d-lg-block,
  section.why .why__decors {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }

  ::view-transition-group(site-header) {
    animation-duration: 0.5s;
    animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  }

  ::view-transition-old(page-main) {
    animation: forcevpsPageOut 0.5s cubic-bezier(0.4, 0, 0.2, 1) both;
  }

  ::view-transition-new(page-main) {
    animation: forcevpsPageIn 0.5s cubic-bezier(0.4, 0, 0.2, 1) both;
  }
}

@keyframes forcevpsPageOut {
  to {
    opacity: 0;
  }
}

@keyframes forcevpsPageIn {
  from {
    opacity: 0;
  }
}