/* One quiet motion rhythm across the public catalogue. Existing interactions
   keep their state and semantics; this layer only refines their presentation. */
:root {
    --brand-motion-ease: cubic-bezier(.22, .61, .36, 1);
    --brand-motion-feedback: 180ms;
    --brand-motion-reveal: 480ms;
    --brand-motion-image: 520ms;
}

.storefront :is(.button, .text-link, .card-arrow, .save-button,
    .spotlight-rail-toolbar button, .cert-filter) {
    transition-duration: var(--brand-motion-feedback);
    transition-timing-function: var(--brand-motion-ease);
}
.storefront :is(.product-image-link img, .home-story-frame img,
    .about-archive-card img, .cert-mark-visual > img, .cert-mark-visual > svg) {
    transition-duration: var(--brand-motion-image);
    transition-timing-function: var(--brand-motion-ease);
}

@media (prefers-reduced-motion: no-preference) {
    .storefront .experience-reveal-pending,
    .storefront .home-reveal-pending {
        transform: translateY(10px);
    }
    .storefront .experience-reveal-visible {
        animation-duration: var(--brand-motion-reveal);
        animation-timing-function: var(--brand-motion-ease);
    }
    .storefront .experience-reveal-visible[data-experience-order='1'] {
        animation-delay: 40ms;
    }
    .storefront .experience-reveal-visible[data-experience-order='2'] {
        animation-delay: 80ms;
    }
    .storefront .home-reveal-visible {
        animation-duration: var(--brand-motion-reveal);
        animation-timing-function: var(--brand-motion-ease);
    }
    .storefront .home-story.home-reveal-visible { animation: none; }
    .storefront .home-story.home-reveal-visible :is(.home-story-figure,
        .home-story-heading, .home-story-copy) {
        animation-duration: var(--brand-motion-reveal);
        animation-timing-function: var(--brand-motion-ease);
    }
    .storefront .home-story-heading { --story-delay: 55ms; }
    .storefront .home-story-copy { --story-delay: 100ms; }
    .storefront .cert-marks-section.experience-reveal-visible .cert-mark-card {
        animation-duration: 380ms;
        animation-timing-function: var(--brand-motion-ease);
    }
    .storefront .brand-rail { --brand-rail-duration: 54s; }
    .storefront .home-documents-gallery[data-rail-motion] .home-documents-track {
        animation-duration: 54s;
    }
    /* Pause offscreen motion without changing the visitor's Play/Pause choice
       or restarting the loop. Only one ambient rail is allowed to move. */
    .storefront [data-brand-ambient='paused'] :is(.brand-rail-track, .home-documents-track) {
        animation-play-state: paused !important;
    }
    @keyframes experience-reveal {
        from { opacity: 0; transform: translateY(10px); }
        to { opacity: 1; transform: translateY(0); }
    }
    @keyframes home-reveal {
        from { opacity: 0; transform: translateY(10px); }
        to { opacity: 1; transform: translateY(0); }
    }
}

/* Reveals never obstruct keyboard navigation or remain pending in reduced
   motion mode. No animation is required for reading or using a page. */
.storefront :is(.experience-reveal-pending, .home-reveal-pending):focus-within {
    opacity: 1;
    transform: none;
}
@media (prefers-reduced-motion: reduce) {
    .storefront :is(.experience-reveal-pending, .home-reveal-pending) {
        opacity: 1;
        transform: none;
    }
    .storefront :is(.experience-reveal-visible, .home-reveal-visible),
    .storefront :is(.brand-rail-track, .home-documents-track),
    .storefront .home-story.home-reveal-visible *,
    .storefront .cert-marks-section.experience-reveal-visible .cert-mark-card {
        animation: none !important;
    }
}