/* v0.4.15.2 — Pre-paint preparation. The tiny head bootstrap adds this class before
   first paint so above-the-fold Recommendation and After Checkout content has a real
   hidden -> revealed transition, rather than being enhanced after it was already painted. */
.arf-motion-enabled.arf-motion-prepaint .arf-assessment[data-has-result-state="yes"] .arf-recommendation-hero-composition,
.arf-motion-enabled.arf-motion-prepaint .arf-assessment[data-has-result-state="yes"] .arf-recommendation-section-composition,
.arf-motion-enabled.arf-motion-prepaint .arf-assessment[data-has-result-state="yes"] .arf-question.arf-content-block,
.arf-motion-enabled.arf-motion-prepaint .arf-assessment[data-has-result-state="yes"] .arf-question.arf-recommended-product,
.arf-motion-enabled.arf-motion-prepaint .arf-assessment[data-has-result-state="yes"] .arf-result-choice,
.arf-motion-enabled.arf-motion-prepaint body.woocommerce-order-received .arf-after-checkout__hero,
.arf-motion-enabled.arf-motion-prepaint body.woocommerce-order-received .arf-after-checkout__section-heading,
.arf-motion-enabled.arf-motion-prepaint body.woocommerce-order-received .arf-after-checkout__steps,
.arf-motion-enabled.arf-motion-prepaint body.woocommerce-order-received .arf-after-checkout__help,
.arf-motion-enabled.arf-motion-prepaint body.woocommerce-order-received .arf-after-checkout__closing {
    opacity: 0;
    transform: translate3d(0, var(--arf-motion-distance-md), 0);
}

/* ARF motion foundation. Component-specific motion is layered on in later phases. */
:root {
    --arf-motion-duration-fast: 190ms;
    --arf-motion-duration-base: 360ms;
    --arf-motion-duration-reveal: 560ms;
    --arf-motion-distance-sm: 8px;
    --arf-motion-distance-md: 14px;
    --arf-motion-ease-standard: cubic-bezier(0.2, 0.7, 0.2, 1);
    --arf-motion-ease-emphasized: cubic-bezier(0.16, 1, 0.3, 1);
}

/* Generic one-time reveal primitive. Elements opt in explicitly with data-arf-reveal. */
.arf-motion-enabled [data-arf-reveal] {
    opacity: 0;
    transform: translate3d(0, var(--arf-motion-distance-md), 0);
    transition:
        opacity var(--arf-motion-duration-reveal) var(--arf-motion-ease-standard),
        transform var(--arf-motion-duration-reveal) var(--arf-motion-ease-emphasized);
    will-change: opacity, transform;
}

.arf-motion-enabled [data-arf-reveal].is-arf-revealed {
    opacity: 1;
    transform: translate3d(0, 0, 0);
    will-change: auto;
}

/* Keep the foundation layout-neutral on phones and tablets. */
@media (max-width: 767px) {
    :root {
        --arf-motion-distance-md: 9px;
        --arf-motion-duration-reveal: 500ms;
    }
}

/* Accessibility wins over the dashboard preference. */
@media (prefers-reduced-motion: reduce) {
    :root {
        --arf-motion-duration-fast: 0.01ms;
        --arf-motion-duration-base: 0.01ms;
        --arf-motion-duration-reveal: 0.01ms;
        --arf-motion-distance-sm: 0px;
        --arf-motion-distance-md: 0px;
    }

    .arf-motion-enabled [data-arf-reveal] {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
        will-change: auto !important;
    }
}


/* v0.4.13.2 — Quiz motion: semantic staggering with capped item delays and true progress interpolation. */
.arf-motion-enabled .arf-assessment--quiz .arf-step__progress-fill {
    transition: width 580ms var(--arf-motion-ease-emphasized);
}

.arf-motion-enabled .arf-assessment--quiz .arf-option,
.arf-motion-enabled .arf-assessment--quiz .arf-image-option,
.arf-motion-enabled .arf-assessment--quiz .arf-step__next,
.arf-motion-enabled .arf-assessment--quiz .arf-step__previous,
.arf-motion-enabled .arf-assessment--quiz .arf-assessment-form__submit {
    transition:
        border-color var(--arf-motion-duration-fast) var(--arf-motion-ease-standard),
        background-color var(--arf-motion-duration-fast) var(--arf-motion-ease-standard),
        color var(--arf-motion-duration-fast) var(--arf-motion-ease-standard),
        box-shadow var(--arf-motion-duration-fast) var(--arf-motion-ease-standard),
        transform var(--arf-motion-duration-fast) var(--arf-motion-ease-standard);
}

.arf-motion-enabled .arf-assessment--quiz .arf-step--motion-enter .arf-step__header {
    animation: arfQuizEnter 350ms var(--arf-motion-ease-emphasized) both;
}

.arf-motion-enabled .arf-assessment--quiz .arf-step--motion-enter .arf-step__intro {
    animation: arfQuizEnter 370ms var(--arf-motion-ease-emphasized) 70ms both;
}

.arf-motion-enabled .arf-assessment--quiz .arf-step--motion-enter .arf-question:not([hidden]) {
    animation: arfQuizEnter 370ms var(--arf-motion-ease-emphasized) both;
    animation-delay: calc(125ms + (var(--arf-motion-group-index, 0) * 55ms));
}

.arf-motion-enabled .arf-assessment--quiz .arf-step--motion-enter .arf-option:not([hidden]),
.arf-motion-enabled .arf-assessment--quiz .arf-step--motion-enter .arf-image-option:not([hidden]) {
    animation: arfQuizOptionEnter 340ms var(--arf-motion-ease-emphasized) both;
    animation-delay: calc(185ms + (var(--arf-motion-item-index, 0) * 42ms));
}

.arf-motion-enabled .arf-assessment--quiz .arf-step--motion-enter .arf-step__actions {
    animation: arfQuizEnter 340ms var(--arf-motion-ease-emphasized) 300ms both;
}

@keyframes arfQuizEnter {
    from { opacity: 0; transform: translate3d(0, var(--arf-motion-distance-sm), 0); }
    to { opacity: 1; transform: translate3d(0, 0, 0); }
}

@keyframes arfQuizOptionEnter {
    from { opacity: 0; transform: translate3d(0, 6px, 0); }
    to { opacity: 1; transform: translate3d(0, 0, 0); }
}

@media (max-width: 767px) {
    .arf-motion-enabled .arf-assessment--quiz .arf-step__progress-fill {
        transition-duration: 520ms;
    }

    .arf-motion-enabled .arf-assessment--quiz .arf-step--motion-enter .arf-step__intro {
        animation-delay: 50ms;
    }

    .arf-motion-enabled .arf-assessment--quiz .arf-step--motion-enter .arf-question:not([hidden]) {
        animation-delay: calc(95ms + (var(--arf-motion-group-index, 0) * 42ms));
    }

    .arf-motion-enabled .arf-assessment--quiz .arf-step--motion-enter .arf-option:not([hidden]),
    .arf-motion-enabled .arf-assessment--quiz .arf-step--motion-enter .arf-image-option:not([hidden]) {
        animation-duration: 290ms;
        animation-delay: calc(140ms + (var(--arf-motion-item-index, 0) * 34ms));
    }

    .arf-motion-enabled .arf-assessment--quiz .arf-step--motion-enter .arf-step__actions {
        animation-delay: 250ms;
    }
}

@media (prefers-reduced-motion: reduce) {
    .arf-motion-enabled .arf-assessment--quiz .arf-step__progress-fill,
    .arf-motion-enabled .arf-assessment--quiz .arf-option,
    .arf-motion-enabled .arf-assessment--quiz .arf-image-option,
    .arf-motion-enabled .arf-assessment--quiz .arf-step__next,
    .arf-motion-enabled .arf-assessment--quiz .arf-step__previous,
    .arf-motion-enabled .arf-assessment--quiz .arf-assessment-form__submit {
        transition: none !important;
    }

    .arf-motion-enabled .arf-assessment--quiz .arf-step--motion-enter *,
    .arf-motion-enabled .arf-assessment--quiz .arf-step--motion-enter .arf-option,
    .arf-motion-enabled .arf-assessment--quiz .arf-step--motion-enter .arf-image-option {
        animation: none !important;
    }
}


/* v0.4.14 — Recommendation motion. Semantic sections reveal once in the viewport;
   cards stagger within their own group and modals animate without changing layout. */
.arf-motion-enabled .arf-assessment[data-has-result-state="yes"] [data-arf-reveal] .arf-recommended-product__item,
.arf-motion-enabled .arf-assessment[data-has-result-state="yes"] [data-arf-reveal] .arf-recommendation-offer,
.arf-motion-enabled .arf-assessment[data-has-result-state="yes"] [data-arf-reveal] .arf-result-choice__option {
    opacity: 0;
    transform: translate3d(0, 8px, 0);
    transition:
        opacity 520ms var(--arf-motion-ease-standard),
        transform 540ms var(--arf-motion-ease-emphasized),
        border-color var(--arf-motion-duration-fast) var(--arf-motion-ease-standard),
        background-color var(--arf-motion-duration-fast) var(--arf-motion-ease-standard),
        box-shadow var(--arf-motion-duration-fast) var(--arf-motion-ease-standard);
    transition-delay: calc(110ms + (var(--arf-motion-item-index, 0) * 70ms));
}

.arf-motion-enabled .arf-assessment[data-has-result-state="yes"] [data-arf-reveal].is-arf-revealed .arf-recommended-product__item,
.arf-motion-enabled .arf-assessment[data-has-result-state="yes"] [data-arf-reveal].is-arf-revealed .arf-recommendation-offer,
.arf-motion-enabled .arf-assessment[data-has-result-state="yes"] [data-arf-reveal].is-arf-revealed .arf-result-choice__option {
    opacity: 1;
    transform: translate3d(0, 0, 0);
}

.arf-motion-enabled .arf-recommended-product__item,
.arf-motion-enabled .arf-recommendation-offer,
.arf-motion-enabled .arf-recommended-product__select-button,
.arf-motion-enabled .arf-product-detail-modal__select {
    transition-property: border-color, background-color, color, box-shadow, transform, opacity;
    transition-duration: var(--arf-motion-duration-fast);
    transition-timing-function: var(--arf-motion-ease-standard);
}

.arf-motion-enabled .arf-product-detail-modal:not([hidden]) {
    opacity: 0;
    transition: opacity 260ms var(--arf-motion-ease-standard);
}

.arf-motion-enabled .arf-product-detail-modal:not([hidden]) .arf-product-detail-modal__panel {
    opacity: 0;
    transform: translate3d(0, 10px, 0) scale(.99);
    transition:
        opacity 270ms var(--arf-motion-ease-standard),
        transform 290ms var(--arf-motion-ease-emphasized);
}

.arf-motion-enabled .arf-product-detail-modal.is-arf-modal-open:not([hidden]) {
    opacity: 1;
}

.arf-motion-enabled .arf-product-detail-modal.is-arf-modal-open:not([hidden]) .arf-product-detail-modal__panel {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
}

.arf-motion-enabled .arf-product-detail-modal.is-arf-modal-closing:not([hidden]) {
    opacity: 0;
}

.arf-motion-enabled .arf-product-detail-modal.is-arf-modal-closing:not([hidden]) .arf-product-detail-modal__panel {
    opacity: 0;
    transform: translate3d(0, 6px, 0) scale(.995);
}

@media (max-width: 767px) {
    .arf-motion-enabled .arf-assessment[data-has-result-state="yes"] [data-arf-reveal] .arf-recommended-product__item,
    .arf-motion-enabled .arf-assessment[data-has-result-state="yes"] [data-arf-reveal] .arf-recommendation-offer,
    .arf-motion-enabled .arf-assessment[data-has-result-state="yes"] [data-arf-reveal] .arf-result-choice__option {
        transform: translate3d(0, 6px, 0);
        transition-duration: 460ms;
        transition-delay: calc(80ms + (var(--arf-motion-item-index, 0) * 52ms));
    }
}

@media (prefers-reduced-motion: reduce) {
    .arf-motion-enabled .arf-assessment[data-has-result-state="yes"] [data-arf-reveal] *,
    .arf-motion-enabled .arf-product-detail-modal,
    .arf-motion-enabled .arf-product-detail-modal__panel {
        animation: none !important;
        transition: none !important;
        transform: none !important;
    }
}


/* v0.4.15.1 — Motion timing polish: slower, more legible timing across Quiz, Recommendation, and After Checkout. */

/* v0.4.15 — After Checkout motion. Calm one-time section reveals reuse the shared
   reveal engine; onboarding steps stagger as semantic cards without affecting layout. */
.arf-motion-enabled body.woocommerce-order-received [data-arf-reveal] .arf-after-checkout__step {
    opacity: 0;
    transform: translate3d(0, 7px, 0);
    transition:
        opacity 560ms var(--arf-motion-ease-standard),
        transform 580ms var(--arf-motion-ease-emphasized),
        border-color var(--arf-motion-duration-fast) var(--arf-motion-ease-standard),
        background-color var(--arf-motion-duration-fast) var(--arf-motion-ease-standard);
    transition-delay: calc(110ms + (var(--arf-motion-item-index, 0) * 75ms));
}

.arf-motion-enabled body.woocommerce-order-received [data-arf-reveal].is-arf-revealed .arf-after-checkout__step {
    opacity: 1;
    transform: translate3d(0, 0, 0);
}

.arf-motion-enabled body.woocommerce-order-received .arf-after-checkout__button {
    transition:
        border-color var(--arf-motion-duration-fast) var(--arf-motion-ease-standard),
        background-color var(--arf-motion-duration-fast) var(--arf-motion-ease-standard),
        color var(--arf-motion-duration-fast) var(--arf-motion-ease-standard),
        transform var(--arf-motion-duration-fast) var(--arf-motion-ease-standard);
}

@media (max-width: 767px) {
    .arf-motion-enabled body.woocommerce-order-received [data-arf-reveal] .arf-after-checkout__step {
        transform: translate3d(0, 5px, 0);
        transition-duration: 490ms;
        transition-delay: calc(75ms + (var(--arf-motion-item-index, 0) * 52ms));
    }
}

@media (prefers-reduced-motion: reduce) {
    .arf-motion-enabled body.woocommerce-order-received [data-arf-reveal] .arf-after-checkout__step {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
    }

    .arf-motion-enabled body.woocommerce-order-received .arf-after-checkout__button {
        transition: none !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .arf-motion-enabled.arf-motion-prepaint .arf-assessment[data-has-result-state="yes"] .arf-recommendation-hero-composition,
    .arf-motion-enabled.arf-motion-prepaint .arf-assessment[data-has-result-state="yes"] .arf-recommendation-section-composition,
    .arf-motion-enabled.arf-motion-prepaint .arf-assessment[data-has-result-state="yes"] .arf-question.arf-content-block,
    .arf-motion-enabled.arf-motion-prepaint .arf-assessment[data-has-result-state="yes"] .arf-question.arf-recommended-product,
    .arf-motion-enabled.arf-motion-prepaint .arf-assessment[data-has-result-state="yes"] .arf-result-choice,
    .arf-motion-enabled.arf-motion-prepaint body.woocommerce-order-received .arf-after-checkout__hero,
    .arf-motion-enabled.arf-motion-prepaint body.woocommerce-order-received .arf-after-checkout__section-heading,
    .arf-motion-enabled.arf-motion-prepaint body.woocommerce-order-received .arf-after-checkout__steps,
    .arf-motion-enabled.arf-motion-prepaint body.woocommerce-order-received .arf-after-checkout__help,
    .arf-motion-enabled.arf-motion-prepaint body.woocommerce-order-received .arf-after-checkout__closing {
        opacity: 1 !important;
        transform: none !important;
    }
}