/* Enhancement is opt-in: without JS every element remains visible. */
#suradnja .sh-sticky-stage {
  min-height: 0;
  height: 100vh;
  height: 100svh;
  display: flex;
  flex-direction: column;
}
#suradnja:not(.sh-scroll-ready) .sh-sticky-stage { height: auto; }
#suradnja .sh-stage-content { flex-shrink: 0; transform-origin: top center; }
#suradnja.sh-scroll-ready .sh-scroll-track { height: 250vh; height: 250svh; }
#suradnja.sh-scroll-ready .sh-sticky-stage {
  position: sticky;
  top: 0;
  height: 100vh;
  height: 100svh;
}
#suradnja.sh-scroll-ready .sh-component,
#suradnja.sh-scroll-ready .sh-wire { transition: none; }
#suradnja.sh-fade-ready .sh-hub,
#suradnja.sh-fade-ready .sh-component,
#suradnja.sh-fade-ready .sh-bottom,
#suradnja.sh-fade-ready .sh-scope {
  opacity: 0;
  transform: translateY(16px);
  transition: opacity 400ms ease, transform 400ms ease;
}
#suradnja.sh-fade-ready .sh-in-view,
#suradnja.sh-fade-ready .sh-component:focus-within {
  opacity: 1;
  transform: none;
}
@media (prefers-reduced-motion: reduce) {
  #suradnja .sh-scroll-track { height: auto !important; }
  #suradnja .sh-sticky-stage { position: static !important; height: auto !important; }
  #suradnja .sh-stage-content,
  #suradnja .sh-hub,
  #suradnja .sh-component,
  #suradnja .sh-bottom,
  #suradnja .sh-scope { opacity: 1 !important; transform: none !important; transition: none !important; }
  #suradnja .sh-wire { stroke-dashoffset: 0 !important; }
}
@media (max-width: 767px) {
  #suradnja .sh-stage-content .sh-map { display: flex; flex-direction: column; align-items: stretch; }
  #suradnja .sh-hub { order: 0; }
  #suradnja .sh-meta { order: 1; }
  #suradnja .sh-web { order: 2; }
  #suradnja .sh-inquiries { order: 3; }
  #suradnja .sh-automation { order: 4; }
  #suradnja .sh-reviews { order: 5; }
}

/* Once played, remove the extra scroll runway in both directions. */
#suradnja.sh-scroll-finished .sh-scroll-track { height: auto; overflow-anchor: none; }
#suradnja.sh-scroll-finished .sh-sticky-stage { position: relative; top: auto; }

/* Keep the heading outside the animated content's clipping area. */
#suradnja .sh-heading-band {
  flex: 0 0 auto;
  width: 100%;
  padding-top: 24px;
  padding-bottom: 16px;
  position: relative;
  z-index: 1;
}
#suradnja .sh-title { font-size: 44px; line-height: 1.15; }
#suradnja .sh-description { font-size: 18px; max-width: 620px; }
#suradnja .sh-description-first,
#suradnja .sh-description-second { display: inline; }
#suradnja .sh-content-viewport { width: 100%; }
#suradnja.sh-scroll-ready .sh-content-viewport {
  flex: 1 1 0;
  min-height: 0;
  overflow: hidden;
  padding-top: 12px;
}
@media (min-width: 768px) and (max-width: 991px) {
  #suradnja .sh-title { font-size: 32px; }
}
@media (max-width: 767px) {
  #suradnja .sh-title { font-size: 28px; }
  #suradnja .sh-description { font-size: 16px; }
  #suradnja .sh-sticky-stage { position: static; height: auto; }
}