/* SPREENOVA — professional motion system */

@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;
    }
    [data-spree-reveal], [data-aos] {
        opacity: 1 !important;
        transform: none !important;
        filter: none !important;
    }
}

/* Page enter */
body.spree-ready {
    animation: spree-page-in 0.6s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}
@keyframes spree-page-in {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Scroll reveal base */
[data-spree-reveal],
[data-aos] {
    will-change: opacity, transform, filter;
    transition:
        opacity 0.85s cubic-bezier(0.22, 1, 0.36, 1),
        transform 0.85s cubic-bezier(0.22, 1, 0.36, 1),
        filter 0.85s cubic-bezier(0.22, 1, 0.36, 1);
}
[data-spree-reveal]:not(.spree-visible),
[data-aos]:not(.spree-visible) {
    opacity: 0;
    pointer-events: none;
}
[data-spree-reveal].spree-visible,
[data-aos].spree-visible {
    opacity: 1;
    pointer-events: auto;
}

/* Reveal variants */
[data-spree-reveal="fade-up"],
[data-aos="fade-up"] { transform: translateY(48px); }
[data-spree-reveal="fade-down"] { transform: translateY(-32px); }
[data-spree-reveal="fade-left"] { transform: translateX(-48px); }
[data-spree-reveal="fade-right"] { transform: translateX(48px); }
[data-spree-reveal="zoom-in"] { transform: scale(0.92); }
[data-spree-reveal="blur-in"] { transform: translateY(24px); filter: blur(8px); }

[data-spree-reveal="fade-up"].spree-visible,
[data-spree-reveal="fade-down"].spree-visible,
[data-spree-reveal="fade-left"].spree-visible,
[data-spree-reveal="fade-right"].spree-visible,
[data-spree-reveal="zoom-in"].spree-visible,
[data-spree-reveal="blur-in"].spree-visible,
[data-aos="fade-up"].spree-visible {
    transform: none;
    filter: none;
}

/* Stagger children */
[data-spree-stagger] > * {
    transition:
        opacity 0.7s cubic-bezier(0.22, 1, 0.36, 1),
        transform 0.7s cubic-bezier(0.22, 1, 0.36, 1);
}
[data-spree-stagger]:not(.spree-visible) > * {
    opacity: 0;
    transform: translateY(28px);
}
[data-spree-stagger].spree-visible > * {
    opacity: 1;
    transform: none;
}

/* Nav scroll state */
#spree-nav {
    transition:
        background-color 0.4s ease,
        box-shadow 0.4s ease,
        border-color 0.4s ease,
        padding 0.35s ease;
}
#spree-nav.spree-nav-scrolled {
    background-color: rgba(19, 19, 20, 0.92) !important;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.45), 0 0 0 1px rgba(255, 177, 195, 0.06);
    border-color: rgba(255, 177, 195, 0.12) !important;
}
#spree-nav .spree-nav-logo {
    transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1), text-shadow 0.35s ease;
}
#spree-nav.spree-nav-scrolled .spree-nav-logo {
    transform: scale(0.96);
    text-shadow: 0 0 24px rgba(255, 177, 195, 0.35);
}

/* Nav link underline slide */
.spree-nav-link {
    position: relative;
}
.spree-nav-link::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: -2px;
    width: 100%;
    height: 2px;
    background: linear-gradient(90deg, #ffb1c3, #d0bcff);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1);
}
.spree-nav-link:hover::after,
.spree-nav-link.spree-active::after {
    transform: scaleX(1);
}

/* Search overlay */
.search-overlay {
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.4s ease, visibility 0.4s ease;
}
.search-overlay.is-open {
    opacity: 1;
    visibility: visible;
    animation: spree-overlay-in 0.45s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}
.search-overlay.is-closing {
    animation: spree-overlay-out 0.3s ease forwards;
}
@keyframes spree-overlay-in {
    from { opacity: 0; backdrop-filter: blur(0); }
    to   { opacity: 1; backdrop-filter: blur(16px); }
}
@keyframes spree-overlay-out {
    from { opacity: 1; }
    to   { opacity: 0; }
}
.search-overlay.is-open .search-input-wrapper {
    animation: spree-slide-up 0.55s cubic-bezier(0.22, 1, 0.36, 1) 0.08s both;
}
.search-item {
    animation: spree-fade-in 0.35s ease both;
}

/* Mobile nav */
#mobile-nav-panel {
    opacity: 0;
    transform: translateY(-12px);
    transition:
        opacity 0.35s ease,
        transform 0.4s cubic-bezier(0.22, 1, 0.36, 1),
        visibility 0.35s ease;
    visibility: hidden;
}
#mobile-nav-panel.spree-mobile-open {
    opacity: 1;
    transform: translateY(0);
    visibility: visible;
}
#mobile-nav-panel.spree-mobile-open > a {
    animation: spree-slide-up 0.5s cubic-bezier(0.22, 1, 0.36, 1) both;
}
#mobile-nav-panel.spree-mobile-open > a:nth-child(1) { animation-delay: 0.05s; }
#mobile-nav-panel.spree-mobile-open > a:nth-child(2) { animation-delay: 0.1s; }
#mobile-nav-panel.spree-mobile-open > a:nth-child(3) { animation-delay: 0.15s; }
#mobile-nav-panel.spree-mobile-open > a:nth-child(4) { animation-delay: 0.2s; }
#mobile-nav-panel.spree-mobile-open > a:nth-child(5) { animation-delay: 0.25s; }

/* Hero */
.spree-hero-line {
    display: inline-block;
    opacity: 0;
    transform: translateY(100%);
    animation: spree-hero-line 0.9s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}
.spree-hero-line:nth-child(2) { animation-delay: 0.12s; }
@keyframes spree-hero-line {
    to { opacity: 1; transform: translateY(0); }
}
.spree-hero-fade {
    opacity: 0;
    animation: spree-fade-in 0.8s cubic-bezier(0.22, 1, 0.36, 1) 0.35s forwards;
}
.spree-hero-buttons {
    opacity: 0;
    animation: spree-slide-up 0.75s cubic-bezier(0.22, 1, 0.36, 1) 0.55s forwards;
}
@keyframes spree-slide-up {
    from { opacity: 0; transform: translateY(32px); }
    to   { opacity: 1; transform: translateY(0); }
}
@keyframes spree-fade-in {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Floating orb */
.spree-float {
    animation: spree-float 6s ease-in-out infinite;
}
@keyframes spree-float {
    0%, 100% { transform: translateY(0) scale(1); }
    50%      { transform: translateY(-20px) scale(1.04); }
}

/* Scroll hint */
.spree-scroll-hint {
    animation: spree-scroll-bounce 2.2s ease-in-out infinite;
}
@keyframes spree-scroll-bounce {
    0%, 100% { transform: translate(-50%, 0); opacity: 0.45; }
    50%      { transform: translate(-50%, 8px); opacity: 0.85; }
}

/* Cards & panels */
.spree-card-lift {
    transition:
        transform 0.45s cubic-bezier(0.22, 1, 0.36, 1),
        box-shadow 0.45s ease,
        border-color 0.35s ease;
}
.spree-card-lift:hover {
    transform: translateY(-6px);
    box-shadow: 0 20px 48px rgba(0, 0, 0, 0.35), 0 0 32px rgba(255, 75, 137, 0.12);
}

/* Button shine */
.spree-btn-shine {
    position: relative;
    overflow: hidden;
}
.spree-btn-shine::after {
    content: '';
    position: absolute;
    top: 0;
    left: -120%;
    width: 60%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.22), transparent);
    transform: skewX(-18deg);
    transition: left 0.55s ease;
}
.spree-btn-shine:hover::after {
    left: 140%;
}

/* Pulse glow for CTAs */
.spree-pulse-glow {
    animation: spree-pulse-glow 3s ease-in-out infinite;
}
@keyframes spree-pulse-glow {
    0%, 100% { box-shadow: 0 0 20px rgba(255, 75, 137, 0.25); }
    50%      { box-shadow: 0 0 36px rgba(255, 75, 137, 0.45), 0 0 64px rgba(208, 188, 255, 0.15); }
}

/* Counter */
[data-spree-count] {
    font-variant-numeric: tabular-nums;
}

/* Toast */
#toast.spree-toast-show {
    animation: spree-toast-in 0.45s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}
@keyframes spree-toast-in {
    from { opacity: 0; transform: translateY(16px) scale(0.96); }
    to   { opacity: 1; transform: translateY(0) scale(1); }
}

/* Parallax layer */
[data-spree-parallax] {
    will-change: transform;
    transition: transform 0.1s linear;
}

/* Ambient background drift */
.spree-aura-drift {
    animation: spree-aura-drift 12s ease-in-out infinite alternate;
}
@keyframes spree-aura-drift {
    from { transform: translate(0, 0) scale(1); }
    to   { transform: translate(24px, -16px) scale(1.08); }
}

/* Spin rings (hero orb) */
.spree-spin-slow { animation: spree-spin 10s linear infinite; }
.spree-spin-reverse { animation: spree-spin 15s linear infinite reverse; }
@keyframes spree-spin {
    to { transform: rotate(360deg); }
}

/* Add-to-cart micro-bounce */
.spree-cart-pop {
    animation: spree-cart-pop 0.45s cubic-bezier(0.22, 1, 0.36, 1);
}
@keyframes spree-cart-pop {
    0%   { transform: scale(1); }
    40%  { transform: scale(1.35); }
    100% { transform: scale(1); }
}