@view-transition {
  navigation: auto;
}

:root {
  --page-transition-duration: 280ms;
  --page-transition-ease: cubic-bezier(0.22, 0.72, 0.18, 1);
  --page-transition-soft-ease: cubic-bezier(0.16, 1, 0.3, 1);
}

html {
  scroll-behavior: smooth;
}

.site-header {
  view-transition-name: shivaan-header;
}

main {
  view-transition-name: shivaan-main;
}

.site-footer,
footer.elementor-location-footer {
  view-transition-name: shivaan-footer;
}

.floating-back-link {
  position: fixed;
  top: 50%;
  right: clamp(14px, 2.2vw, 30px);
  z-index: 60;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.55rem;
  box-sizing: border-box;
  width: 214px;
  min-height: 46px;
  max-width: calc(100vw - 32px);
  padding: 0.78rem 1rem;
  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: 999px;
  background:
    linear-gradient(135deg, rgba(10, 24, 35, 0.94), rgba(16, 52, 65, 0.9)),
    linear-gradient(135deg, rgba(70, 174, 227, 0.18), rgba(64, 182, 89, 0.16));
  box-shadow:
    0 18px 48px rgba(0, 0, 0, 0.28),
    inset 0 1px 0 rgba(255, 255, 255, 0.16);
  color: #ffffff !important;
  font-family: Montserrat, Arial, sans-serif;
  font-size: 0.8rem;
  font-weight: 800;
  letter-spacing: 0;
  line-height: 1;
  text-decoration: none;
  text-transform: uppercase;
  white-space: nowrap;
  transform: translateY(-50%);
  transition:
    background 180ms var(--page-transition-soft-ease),
    border-color 180ms var(--page-transition-soft-ease),
    box-shadow 180ms var(--page-transition-soft-ease),
    color 180ms var(--page-transition-soft-ease),
    transform 180ms var(--page-transition-soft-ease);
}

.floating-back-link .floating-back-icon {
  flex: 0 0 1.5rem;
  display: grid;
  width: 1.5rem;
  height: 1.5rem;
  place-items: center;
  border-radius: 50%;
  background: #40b659;
  color: #ffffff !important;
  font-family: Montserrat, Arial, sans-serif !important;
  font-size: 1rem;
  font-weight: 800;
  line-height: 1;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.22);
}

.floating-back-link .floating-back-icon svg {
  display: block;
  width: 0.92rem;
  height: 0.92rem;
  stroke: currentColor;
  stroke-width: 2.4;
  stroke-linecap: round;
  stroke-linejoin: round;
  transform: translateX(-0.5px);
}

.floating-back-link:hover,
.floating-back-link:focus-visible {
  border-color: rgba(70, 174, 227, 0.72);
  box-shadow:
    0 22px 58px rgba(0, 0, 0, 0.32),
    0 0 0 4px rgba(70, 174, 227, 0.13),
    inset 0 1px 0 rgba(255, 255, 255, 0.2);
  color: #ffffff !important;
  transform: translateY(-50%) translateX(-4px);
}

.floating-back-link:visited,
.floating-back-link:active,
.floating-back-link span {
  color: #ffffff !important;
  font-family: Montserrat, Arial, sans-serif !important;
  font-size: 0.8rem !important;
  font-weight: 800 !important;
  letter-spacing: 0 !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
}

.floating-back-link span:not([aria-hidden="true"]) {
  flex: 0 0 auto;
  width: 8.4rem;
  text-align: left;
}

.floating-back-link .floating-back-icon {
  font-size: 1rem !important;
}

.floating-back-link:focus-visible {
  outline: 3px solid rgba(70, 174, 227, 0.8);
  outline-offset: 4px;
}

.floating-back-link {
  view-transition-name: shivaan-back-link;
}

::view-transition {
  pointer-events: none;
}

::view-transition-group(root),
::view-transition-group(shivaan-main),
::view-transition-group(shivaan-footer) {
  animation-duration: var(--page-transition-duration);
  animation-timing-function: var(--page-transition-ease);
}

::view-transition-old(root) {
  animation: shivaan-root-out 220ms var(--page-transition-ease) both;
}

::view-transition-new(root) {
  animation: shivaan-root-in 320ms var(--page-transition-soft-ease) both;
}

::view-transition-old(shivaan-main) {
  animation: shivaan-main-out 220ms var(--page-transition-ease) both;
}

::view-transition-new(shivaan-main) {
  animation: shivaan-main-in 340ms var(--page-transition-soft-ease) both;
}

::view-transition-group(shivaan-header) {
  z-index: 30;
}

::view-transition-old(shivaan-header),
::view-transition-new(shivaan-header) {
  animation-duration: 180ms;
  animation-timing-function: var(--page-transition-soft-ease);
  mix-blend-mode: normal;
}

@keyframes shivaan-root-out {
  from {
    opacity: 1;
  }
  to {
    opacity: 0.72;
  }
}

@keyframes shivaan-root-in {
  from {
    opacity: 0.86;
  }
  to {
    opacity: 1;
  }
}

@keyframes shivaan-main-out {
  from {
    opacity: 1;
    filter: blur(0);
    transform: translateY(0) scale(1);
  }
  to {
    opacity: 0;
    filter: blur(5px);
    transform: translateY(-10px) scale(0.992);
  }
}

@keyframes shivaan-main-in {
  from {
    opacity: 0;
    filter: blur(7px);
    transform: translateY(18px) scale(0.992);
  }
  to {
    opacity: 1;
    filter: blur(0);
    transform: translateY(0) scale(1);
  }
}

@media (prefers-reduced-motion: no-preference) {
  html.is-navigating main,
  html.is-navigating .site-footer,
  html.is-navigating footer.elementor-location-footer {
    opacity: 0.62;
    filter: blur(3px);
    transform: translateY(-8px) scale(0.996);
    transition:
      opacity 160ms var(--page-transition-ease),
      filter 160ms var(--page-transition-ease),
      transform 160ms var(--page-transition-ease);
  }
}

@media (max-width: 760px) {
  .floating-back-link {
    top: 50%;
    right: 10px;
    bottom: auto;
    width: 184px;
    min-height: 44px;
    max-width: calc(100vw - 20px);
    padding: 0.7rem 0.82rem;
    font-size: 0.68rem;
    transform: translateY(-50%);
  }

  .floating-back-link span {
    font-size: 0.68rem !important;
  }

  .floating-back-link span:not([aria-hidden="true"]) {
    width: 7.65rem;
  }

  .floating-back-link .floating-back-icon {
    font-size: 0.92rem !important;
  }

  .floating-back-link .floating-back-icon svg {
    width: 0.86rem;
    height: 0.86rem;
  }

  .floating-back-link:hover,
  .floating-back-link:focus-visible {
    transform: translateY(-50%) translateX(-3px);
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  ::view-transition-old(root),
  ::view-transition-new(root),
  ::view-transition-old(shivaan-main),
  ::view-transition-new(shivaan-main),
  ::view-transition-old(shivaan-header),
  ::view-transition-new(shivaan-header),
  ::view-transition-old(shivaan-footer),
  ::view-transition-new(shivaan-footer),
  ::view-transition-old(shivaan-back-link),
  ::view-transition-new(shivaan-back-link) {
    animation: none !important;
  }
}
