@keyframes scrollLine {
    0%   { top: -100%; }
    50%  { top: 100%; }
    100% { top: 100%; }
}

@keyframes dividerPulse {
    0%, 100% { opacity: 0.2; }
    50%      { opacity: 0.6; }
}

@keyframes spacerPulse {
    0%, 100% { opacity: 0.25; transform: scale(1); }
    50%      { opacity: 0.6; transform: scale(1.5); }
}

@keyframes badgePulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(200, 132, 158, 0.3); }
    50%      { box-shadow: 0 0 12px 4px rgba(200, 132, 158, 0.15); }
}

.reveal-story {
    opacity: 0;
    transform: translateY(12px);
    filter: blur(4px);
    transition:
        opacity 0.8s var(--ease-out-expo),
        transform 0.8s var(--ease-out-expo),
        filter 0.8s var(--ease-out-expo);
}

.reveal-story.visible {
    opacity: 1;
    transform: translateY(0);
    filter: blur(0);
}

.reveal-story:nth-child(1) { transition-delay: 0s; }
.reveal-story:nth-child(2) { transition-delay: 0.1s; }
.reveal-story:nth-child(3) { transition-delay: 0.25s; }
.reveal-story:nth-child(4) { transition-delay: 0.4s; }

.story-pain .reveal-story {
    transform: translateX(-16px);
}
.story-pain .reveal-story.visible {
    transform: translateX(0);
}

.story-attempts .reveal-story {
    transform: translateX(16px);
}
.story-attempts .reveal-story.visible {
    transform: translateX(0);
}

.story-root .reveal-story {
    transform: scale(0.95);
    filter: blur(4px);
}
.story-root .reveal-story.visible {
    transform: scale(1);
    filter: blur(0);
}

.story-pivot .reveal-story {
    transform: translateY(20px);
    filter: none;
}
.story-pivot .reveal-story.visible {
    transform: translateY(0);
}

.reveal-up {
    opacity: 0;
    transform: translateY(16px);
    transition:
        opacity var(--dur-reveal) var(--ease-out-expo),
        transform var(--dur-reveal) var(--ease-out-expo);
}

.reveal-up.visible {
    opacity: 1;
    transform: translateY(0);
}

.slide-in-left {
    opacity: 0;
    transform: translateX(-20px);
    transition:
        opacity var(--dur-reveal) var(--ease-out-expo),
        transform var(--dur-reveal) var(--ease-out-expo);
}

.slide-in-left.visible {
    opacity: 1;
    transform: translateX(0);
}

.slide-in-right {
    opacity: 0;
    transform: translateX(20px);
    transition:
        opacity var(--dur-reveal) var(--ease-out-expo),
        transform var(--dur-reveal) var(--ease-out-expo);
}

.slide-in-right.visible {
    opacity: 1;
    transform: translateX(0);
}

.features-grid .parallax-card.reveal-up:nth-child(1) { transition-delay: 0s; }
.features-grid .parallax-card.reveal-up:nth-child(2) { transition-delay: 0.12s; }
.features-grid .parallax-card.reveal-up:nth-child(3) { transition-delay: 0.24s; }

.phases-grid .phase-card.reveal-up:nth-child(1) { transition-delay: 0s; }
.phases-grid .phase-card.reveal-up:nth-child(2) { transition-delay: 0.15s; }
.phases-grid .phase-card.reveal-up:nth-child(3) { transition-delay: 0.3s; }

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }

    .reveal-story,
    .reveal-up,
    .slide-in-left,
    .slide-in-right {
        opacity: 1;
        transform: none;
        filter: none;
        transition: none;
    }

    .scroll-line::after {
        animation: none;
    }

    .spacer-dot {
        animation: none !important;
        opacity: 0.4;
    }

    .phase-badge-reco {
        animation: none !important;
    }

    .scroll-progress {
        display: none;
    }

    body.is-loading {
        opacity: 1 !important;
    }
}