.experience-motion-ready [data-reveal].reveal-in {
  animation: none !important;
}

.experience-reading-progress {
  position: fixed;
  inset: 0 0 auto;
  height: 2px;
  z-index: 999;
  overflow: hidden;
  pointer-events: none;
  contain: strict;
}
.experience-reading-progress > span {
  display: block;
  height: 100%;
  width: 100%;
  background: linear-gradient(90deg, #004392 0%, #245bff 82%, #20d9d2 100%);
  transform: scaleX(0);
  transform-origin: left center;
}

.experience-process {
  position: relative;
}
.experience-process-track {
  position: absolute;
  left: 0;
  right: 0;
  top: -12px;
  height: 1px;
  overflow: hidden;
  pointer-events: none;
  background: #00439218;
}
.experience-process-fill {
  display: block;
  width: 100%;
  height: 100%;
  transform: scaleX(0);
  transform-origin: left center;
  background: linear-gradient(90deg, #004392, #245bff 75%, #20d9d2);
}
.layout-process.experience-process::before {
  animation: none;
  opacity: .16;
}
.experience-process > article {
  transition: border-color 480ms ease, box-shadow 480ms ease, transform 350ms cubic-bezier(.22,1,.36,1);
}
.experience-process > .experience-step-active {
  border-color: #245bff85;
  box-shadow: 0 14px 38px -26px #00439265, inset 0 2px 0 #245bff;
}
.tone-ink .experience-process-track {
  background: #c0d4f126;
}
.tone-ink .experience-process > .experience-step-active {
  border-color: #739dff;
  box-shadow: 0 16px 40px -28px #004392, inset 0 2px 0 #739dff;
}

.hero.concept-hero .experience-parallax-image {
  will-change: translate;
}
.experience-flow-line {
  position: absolute;
  inset: 0;
  z-index: -1;
  width: 100%;
  height: 100%;
  overflow: hidden;
  pointer-events: none;
  user-select: none;
  opacity: .52;
}
.experience-flow-pulse {
  opacity: .52;
  animation: experience-flow-route 15s linear infinite;
  animation-play-state: paused;
}
.experience-in-view .experience-flow-pulse {
  animation-play-state: running;
}
@keyframes experience-flow-route {
  from { stroke-dashoffset: 0; }
  to { stroke-dashoffset: -100; }
}

.experience-toggle {
  display: inline-grid;
  place-items: center;
  width: 44px;
  min-width: 44px;
  height: 44px;
  border: 1px solid #00439230;
  border-radius: 50%;
  background: #ffffffe6;
  color: #004392;
  cursor: pointer;
  font: inherit;
  font-size: 13px;
}
.experience-toggle[hidden] {
  display: none;
}
.experience-toggle:hover {
  background: #f2f6fa;
  border-color: #004392;
}
.experience-toggle:focus-visible {
  outline: 2px solid #245bff;
  outline-offset: 4px;
}

@media (hover: hover) and (pointer: fine) {
  .experience-motion-ready .text-link {
    position: relative;
    transition: color 220ms ease, border-color 220ms ease;
  }
  .experience-motion-ready .text-link::after {
    content: '';
    position: absolute;
    inset: auto 0 -1px;
    height: 1px;
    background: linear-gradient(90deg, #004392 0%, #245bff 88%, #20d9d2 100%);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 380ms cubic-bezier(.22,1,.36,1);
    pointer-events: none;
  }
  .experience-motion-ready .text-link:hover::after,
  .experience-motion-ready .text-link:focus-visible::after {
    transform: scaleX(1);
  }
  .experience-motion-ready :is(.text-link, .button, .hero-link, .nav-contact) > :is(span, b) {
    transition: translate 280ms cubic-bezier(.22,1,.36,1);
  }
  .experience-motion-ready :is(.text-link, .button, .hero-link, .nav-contact):hover > :is(span, b) {
    translate: 3px -1px;
  }
  .experience-motion-ready .button {
    transition: background-color 240ms ease, border-color 240ms ease, box-shadow 280ms ease;
  }
  .experience-motion-ready .button:hover {
    box-shadow: 0 9px 25px -18px #00439299;
  }
}

.experience-paused .experience-flow-pulse,
.experience-document-hidden .experience-flow-pulse,
.experience-motion-static .experience-flow-pulse,
.experience-paused .scope-line::before,
.experience-paused .contact-bottom::before,
.experience-paused .layout-process::before,
.experience-document-hidden .scope-line::before,
.experience-document-hidden .contact-bottom::before,
.experience-document-hidden .layout-process::before,
.experience-motion-static .scope-line::before,
.experience-motion-static .contact-bottom::before,
.experience-motion-static .layout-process::before {
  animation-play-state: paused !important;
}
.experience-paused .experience-parallax-image,
.experience-motion-static .experience-parallax-image {
  will-change: auto;
}
.experience-motion-static .experience-flow-line,
.experience-motion-static .experience-process-track {
  display: none;
}
.experience-paused .experience-process > article,
.experience-motion-static .experience-process > article {
  transition: none;
}
.experience-paused :is(.text-link, .button, .hero-link, .nav-contact) > :is(span, b),
.experience-motion-static :is(.text-link, .button, .hero-link, .nav-contact) > :is(span, b) {
  translate: none !important;
  transition: none !important;
}
.experience-paused .text-link::after,
.experience-motion-static .text-link::after {
  transition: none;
}
.experience-paused .approach-steps article:hover,
.experience-motion-static .approach-steps article:hover {
  transform: none;
}

@media (prefers-reduced-motion: reduce), (pointer: coarse) {
  .experience-flow-line,
  .experience-process-track,
  .experience-toggle {
    display: none;
  }
  .experience-motion-ready [data-reveal] {
    animation: none !important;
  }
  .experience-reading-progress > span {
    transition: none;
  }
}
@media print {
  .experience-reading-progress,
  .experience-flow-line,
  .experience-process-track,
  .experience-toggle {
    display: none !important;
  }
}