/* Skip .li-clients / .li-work / .li-compare: content-visibility:auto
   freezes CSS keyframe animations (marquees, compare idle) in Chromium.
   Skip .li-footer too: it owns #contact (reveal + hash scroll). */
.li-services,
.li-process,
.li-reel,
.li-team,
.li-faq {
  content-visibility: auto;
  contain-intrinsic-size: 1px 720px;
}

.li-service-link {
  display: inline-block;
  margin-top: 1.1rem;
  color: #f2f2f2;
  font-size: 0.92rem;
  letter-spacing: 0.04em;
  text-decoration: underline;
  text-underline-offset: 0.22em;
  text-decoration-thickness: 1px;
  opacity: 0.88;
}

.li-service-link:hover,
.li-service-link:focus-visible {
  opacity: 1;
}

button.li-process-step,
.li-work-item[role="button"] {
  width: 100%;
  margin: 0;
  font: inherit;
  color: inherit;
  text-align: left;
  background: transparent;
  -webkit-appearance: none;
  appearance: none;
}

/* display:block must not override .li-work-item--hidden (See more pagination) */
button.li-process-step,
.li-work-item[role="button"]:not(.li-work-item--hidden) {
  display: block;
}

.li-work-item[role="button"].li-work-item--hidden {
  display: none;
}

.li-work-item[role="button"] {
  cursor: pointer;
}

@media (prefers-reduced-motion: reduce) {
  .li-services,
  .li-process,
  .li-reel,
  .li-team,
  .li-faq {
    content-visibility: visible;
    contain-intrinsic-size: none;
  }
}