:root{
    --motion-ease-out: cubic-bezier(.22, 1, .36, 1);
    --motion-ease-bounce: cubic-bezier(.18, .89, .32, 1.28);
    --motion-fast: 180ms;
    --motion-medium: 320ms;
    --motion-slow: 520ms;
}

@media (prefers-reduced-motion: reduce){
    html{
        scroll-behavior:auto;
    }

    *,
    *::before,
    *::after{
        animation-duration:.01ms !important;
        animation-iteration-count:1 !important;
        transition-duration:.01ms !important;
        scroll-behavior:auto !important;
    }
}

html.motion-enhanced{
    scroll-behavior:smooth;
}

html.motion-enhanced :where(.btn, .icon-btn, .drawer__link, .drawer__quickLink, .pp-tablink, .lang-switcher__trigger, .lang-switcher__option, .filtersPanel__clear, .policyToggle, .policyPanel__close, .footer__contact){
    transition:
        transform var(--motion-fast) var(--motion-ease-out),
        box-shadow var(--motion-medium) var(--motion-ease-out),
        background-color var(--motion-medium) ease,
        border-color var(--motion-medium) ease,
        color var(--motion-medium) ease,
        opacity var(--motion-fast) ease,
        filter var(--motion-fast) ease;
    backface-visibility:hidden;
    transform:translateZ(0);
}

html.motion-enhanced :where(.btn:hover, .footer__contact:hover){
    transform:translateY(-2px) scale(1.01);
}

html.motion-enhanced :where(.btn:active, .footer__contact:active){
    transform:translateY(0) scale(.985);
}

html.motion-enhanced :where(.icon-btn:hover, .lang-switcher__trigger:hover, .lang-switcher__option:hover){
    transform:translateY(-2px) scale(1.04);
}

html.motion-enhanced :where(.icon-btn:active, .lang-switcher__trigger:active, .lang-switcher__option:active){
    transform:translateY(0) scale(.97);
}

html.motion-enhanced :where(.drawer__link:hover, .drawer__quickLink:hover, .pp-tablink:hover){
    transform:translateX(6px);
}

html.motion-enhanced :where(.card, .pp-card, .filtersPanel, .policyPanel, .cart-page__itemRow, .cart-page__summaryCard, .cart-page__itemsCard, .checkout-page__card, .checkout-page__guestCard, .pd__panel, .pd__galleryCard, .card--auth, .card--notice, .shopify-page__panel, .vault-statCard, .vault-tierCard, .vault-metaCard, .vault-progressCard){
    transition:
        transform calc(var(--motion-medium) + 80ms) var(--motion-ease-out),
        box-shadow calc(var(--motion-medium) + 80ms) var(--motion-ease-out),
        border-color var(--motion-medium) ease,
        background-color var(--motion-medium) ease,
        filter var(--motion-medium) ease;
    backface-visibility:hidden;
    transform:translateZ(0);
}

html.motion-enhanced :where(.cart-page__itemRow:hover, .cart-page__summaryCard:hover, .cart-page__itemsCard:hover, .checkout-page__card:hover, .checkout-page__guestCard:hover, .pd__panel:hover, .pd__galleryCard:hover, .card--auth:hover, .card--notice:hover, .shopify-page__panel:hover, .vault-statCard:hover, .vault-tierCard:hover, .vault-metaCard:hover, .vault-progressCard:hover){
    transform:translateY(-4px);
}

html.motion-enhanced :where(.filtersPanel:hover){
    transform:translateY(-3px);
}

html.motion-enhanced :where(input, textarea, select, .input, .filtersPanel__input, .contact-textarea, .codeInput){
    transition:
        transform var(--motion-fast) var(--motion-ease-out),
        box-shadow var(--motion-medium) ease,
        border-color var(--motion-medium) ease,
        background-color var(--motion-medium) ease;
}

html.motion-enhanced :where(input:focus, textarea:focus, select:focus, .input:focus, .filtersPanel__input:focus, .contact-textarea:focus, .codeInput:focus){
    transform:translateY(-1px);
}

html.motion-enhanced .backdrop{
    transition:
        opacity 240ms ease,
        backdrop-filter 360ms ease;
}

html.motion-enhanced .drawer__panel{
    opacity:.52;
    transition:
        transform 420ms var(--motion-ease-out),
        opacity 220ms ease,
        box-shadow 360ms var(--motion-ease-out);
}

html.motion-enhanced .modal__card{
    opacity:.88;
    transform:translate3d(0, 18px, 0) scale(.965);
    transition:
        transform 420ms var(--motion-ease-out),
        opacity 240ms ease,
        box-shadow 360ms var(--motion-ease-out);
}

#navToggle:checked ~ .drawer--left .drawer__panel,
#favToggle:checked ~ #wishlistDrawer .drawer__panel,
#favToggle:checked ~ .drawer--fav .drawer__panel,
#cartToggle:checked ~ #cartDrawer .drawer__panel,
#cartToggle:checked ~ .drawer--cart .drawer__panel{
    opacity:1;
}

#profileToggle:checked ~ #profileModal .modal__card,
#vaultToggle:checked ~ #vaultModal .modal__card,
#catModalToggle:checked ~ #catModal .modal__card,
#contactModalToggle:checked ~ #contactModal .modal__card,
#addProductToggle:checked ~ #addProductModal .modal__card,
#editProductToggle:checked ~ #editProductModal .modal__card{
    opacity:1;
    transform:translate3d(0, 0, 0) scale(1);
}

@keyframes motionFloatSoft{
    0%, 100%{
        transform:translate3d(0, 0, 0);
    }
    50%{
        transform:translate3d(0, -6px, 0);
    }
}

@keyframes motionPulseHalo{
    0%, 100%{
        box-shadow:0 0 0 0 rgba(239,138,116,0);
        opacity:1;
    }
    50%{
        box-shadow:0 0 0 12px rgba(239,138,116,.08);
        opacity:.88;
    }
}

html.motion-enhanced :where(.heroBrand__logo, .brand__logo, .brand__mark, .vault-badge__logo){
    animation:none !important;
    transform:none !important;
}

html.motion-enhanced :where(.heroBrand__spark){
    animation:motionPulseHalo 3.4s ease-in-out infinite;
}

html.motion-enhanced :where(.screen_img__content, .screen_img__overlay > div, .section__head, .page__head, .heroBrand, .card--auth, .card--notice, .brand--notice, .filtersPanel, .pp-tabs, .vault-head, .vault-tierCard, .vault-metaCard, .vault-progressCard, .cart-page__head, .checkout-page__head, .shopify-page__intro, .policyPanel, .resend, .below, .successBox, .errorBox, .alert){
    will-change:transform, opacity, filter;
}
