@keyframes pulse { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.12); } } @keyframes sidebar-dot-pulse { 0%, 100% { transform: scale(1); box-shadow: 0 0 0 0.1875rem var(--color-bg), 0 0 0 0.3125rem rgba(74, 161, 219, 0.35); } 50% { transform: scale(1.12); box-shadow: 0 0 0 0.1875rem var(--color-bg), 0 0 0 0.4375rem rgba(74, 161, 219, 0.55); } } .pulse { animation: pulse 1.4s ease-in-out infinite; transform-origin: center; } /* reveal — progressive enhancement: hidden only when .js is on */ :root { --reveal-duration: 0.6s; --reveal-ease: cubic-bezier(0.22, 1, 0.36, 1); --reveal-offset: 1.25rem; --reveal-base-delay: 0.1s; --reveal-stagger-step: 0.1s; --reveal-stagger-max: 0.45s; } .js .reveal { opacity: 0; transform: translate3d(0, var(--reveal-offset), 0); transition: opacity var(--reveal-duration) var(--reveal-ease), transform var(--reveal-duration) var(--reveal-ease); will-change: opacity, transform; } .js .reveal.is-visible { opacity: 1; transform: none; transition-delay: var(--reveal-base-delay); } .js .reveal--fade { transform: none; } .js .reveal--left { transform: translate3d(calc(var(--reveal-offset) * -1), 0, 0); } .js .reveal--right { transform: translate3d(var(--reveal-offset), 0, 0); } .js .reveal--scale { transform: scale(0.96); } .js .reveal--slow { transition-duration: 0.85s; } .js .reveal--delay-1 { transition-delay: calc(var(--reveal-base-delay) + 0.1s); } .js .reveal--delay-2 { transition-delay: calc(var(--reveal-base-delay) + 0.2s); } .js .reveal--delay-3 { transition-delay: calc(var(--reveal-base-delay) + 0.3s); } .js .reveal--delay-4 { transition-delay: calc(var(--reveal-base-delay) + 0.4s); } .js .reveal-stagger > * { opacity: 0; transform: translate3d(0, var(--reveal-offset), 0); transition: opacity var(--reveal-duration) var(--reveal-ease), transform var(--reveal-duration) var(--reveal-ease); will-change: opacity, transform; } .js .reveal-stagger.is-visible > * { opacity: 1; transform: none; } .js .reveal-stagger.is-visible > *:nth-child(1) { transition-delay: calc(var(--reveal-base-delay) + var(--reveal-stagger-step) * 0); } .js .reveal-stagger.is-visible > *:nth-child(2) { transition-delay: calc(var(--reveal-base-delay) + var(--reveal-stagger-step) * 1); } .js .reveal-stagger.is-visible > *:nth-child(3) { transition-delay: calc(var(--reveal-base-delay) + var(--reveal-stagger-step) * 2); } .js .reveal-stagger.is-visible > *:nth-child(4) { transition-delay: calc(var(--reveal-base-delay) + var(--reveal-stagger-step) * 3); } .js .reveal-stagger.is-visible > *:nth-child(5) { transition-delay: calc(var(--reveal-base-delay) + var(--reveal-stagger-step) * 4); } .js .reveal-stagger.is-visible > *:nth-child(n+6) { transition-delay: calc(var(--reveal-base-delay) + var(--reveal-stagger-max)); } .js .reveal-stagger--fast { --reveal-stagger-step: 0.05s; --reveal-stagger-max: 0.25s; } .js .reveal-stagger--slow { --reveal-stagger-step: 0.12s; --reveal-stagger-max: 0.55s; } @media (prefers-reduced-motion: reduce) { .pulse, .sidebar__link--active .sidebar__dot { animation: none; } .journey-line__mask-path { stroke-dashoffset: 0 !important; } .js .reveal, .js .reveal-stagger > * { opacity: 1; transform: none; transition: none; will-change: auto; } }