/* Skip sticky scroll storytelling — jump to adjacent page sections */

.story-skip {
  position: absolute;
  left: 50%;
  bottom: 1rem;
  transform: translateX(-50%);
  z-index: 8;
  display: flex;
  align-items: center;
  gap: 0.55rem;
  padding: 0.35rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid rgba(228, 231, 236, 0.95);
  box-shadow: 0 12px 32px rgba(16, 24, 40, 0.12);
  backdrop-filter: blur(10px);
}

.story-skip__btn {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  min-height: 2.35rem;
  padding: 0.45rem 0.95rem;
  border: 0;
  border-radius: 999px;
  font-family: inherit;
  font-size: 0.82rem;
  font-weight: 700;
  cursor: pointer;
  transition: transform 0.18s ease, background 0.18s ease, color 0.18s ease;
}

.story-skip__btn--prev {
  background: #f2f4f7;
  color: #344054;
}

.story-skip__btn--prev:hover {
  transform: translateY(-1px);
  background: #e4e7ec;
}

.story-skip__btn--next {
  background: #3641f5;
  color: #fff;
  box-shadow: 0 8px 18px rgba(54, 65, 245, 0.28);
}

.story-skip__btn--next:hover {
  transform: translateY(-1px);
  background: #465fff;
}

@media (max-width: 640px) {
  .story-skip {
    bottom: 0.75rem;
    width: min(100% - 1.25rem, 22rem);
    justify-content: space-between;
  }

  .story-skip__btn {
    flex: 1;
    justify-content: center;
    padding-left: 0.7rem;
    padding-right: 0.7rem;
    font-size: 0.75rem;
  }
}