.sf-page-home .sf-frontend-shell,
.sf-page-home .sf-home-page {
    background: transparent !important;
}

.sf-page-menu .sf-frontend-shell,
.sf-page-menu .sf-shop-page {
    background: transparent !important;
}

.sf-page-home .sf-home-page {
    position: relative;
    overflow: clip;
}

.sf-page-menu .sf-shop-page {
    position: relative;
    overflow: clip;
    isolation: isolate;
}

.sf-page-home .sf-home-live {
    position: relative;
    isolation: isolate;
}

.sf-page-home .sf-home-live::before,
.sf-page-home .sf-home-live::after {
    content: none !important;
    display: none !important;
}

.sf-page-home .sf-home-live > :not(.sf-home-live-bg) {
    position: relative;
    z-index: 1;
}

.sf-page-menu .sf-shop-page > :not(.sf-menu-live-bg) {
    position: relative;
    z-index: 1;
}

.sf-page-home .sf-home-live > .sf-home-live-bg {
    position: fixed;
    inset: 0;
    z-index: 0;
    overflow: clip;
    pointer-events: none;
    background:
        radial-gradient(circle at 50% 8%, rgba(255, 138, 48, 0.08), transparent 24rem),
        linear-gradient(180deg, #08111d 0%, #060d17 48%, #040913 100%);
}

.sf-page-menu .sf-shop-page > .sf-menu-live-bg {
    position: fixed;
    inset: 0;
    z-index: 0;
    overflow: clip;
    pointer-events: none;
    background:
        radial-gradient(circle at 50% 8%, rgba(255, 138, 48, 0.08), transparent 24rem),
        linear-gradient(180deg, #08111d 0%, #060d17 48%, #040913 100%);
}

.sf-home-live-bg::before,
.sf-home-live-bg::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.sf-menu-live-bg::before,
.sf-menu-live-bg::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.sf-home-live-bg::before {
    background:
        radial-gradient(circle at 50% 18%, rgba(255, 118, 32, 0.10), transparent 20rem),
        radial-gradient(circle at 16% 42%, rgba(0, 207, 255, 0.08), transparent 18rem),
        radial-gradient(circle at 84% 28%, rgba(106, 92, 255, 0.09), transparent 16rem),
        linear-gradient(180deg, rgba(4, 8, 20, 0.3), rgba(4, 8, 20, 0));
    opacity: 0.72;
    animation: swefood-home-ambient-shift 24s ease-in-out infinite alternate;
}

.sf-menu-live-bg::before {
    background:
        radial-gradient(circle at 50% 18%, rgba(255, 118, 32, 0.10), transparent 20rem),
        radial-gradient(circle at 16% 42%, rgba(0, 207, 255, 0.08), transparent 18rem),
        radial-gradient(circle at 84% 28%, rgba(106, 92, 255, 0.09), transparent 16rem),
        linear-gradient(180deg, rgba(4, 8, 20, 0.3), rgba(4, 8, 20, 0));
    opacity: 0.72;
    animation: swefood-home-ambient-shift 24s ease-in-out infinite alternate;
}

.sf-home-live-bg::after {
    background:
        radial-gradient(circle at 50% 45%, rgba(255, 129, 45, 0.07), transparent 22rem),
        radial-gradient(circle at 50% 50%, rgba(255, 255, 255, 0.02), transparent 32rem);
    filter: blur(34px);
    opacity: 0.52;
}

.sf-menu-live-bg::after {
    background:
        radial-gradient(circle at 50% 45%, rgba(255, 129, 45, 0.07), transparent 22rem),
        radial-gradient(circle at 50% 50%, rgba(255, 255, 255, 0.02), transparent 32rem);
    filter: blur(34px);
    opacity: 0.52;
}

.swefood-3d-layer {
    position: absolute;
    inset: 0;
    transform: translate3d(0, 0, 0);
    will-change: transform;
}

.layer-back {
    filter: blur(6px);
    opacity: 0.44;
}

.layer-mid {
    opacity: 0.56;
}

.layer-front {
    opacity: 0.68;
}

.swefood-3d-ball,
.swefood-3d-glow {
    position: absolute;
    display: block;
    border-radius: 999px;
    transform: translate3d(0, 0, 0);
    will-change: transform;
    pointer-events: none;
}

.swefood-3d-ball {
    left: 0;
    top: 0;
    opacity: 0.42;
    mix-blend-mode: screen;
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
}

.swefood-3d-ball--orange {
    background:
        radial-gradient(circle at 32% 28%, rgba(255, 240, 225, 0.42), rgba(255, 198, 142, 0.16) 22%, rgba(255, 106, 0, 0.62) 58%, rgba(255, 106, 0, 0.06) 100%);
    filter: blur(18px);
}

.swefood-3d-ball--blue {
    background:
        radial-gradient(circle at 35% 28%, rgba(224, 248, 255, 0.42), rgba(121, 226, 255, 0.16) 24%, rgba(0, 207, 255, 0.58) 60%, rgba(0, 207, 255, 0.06) 100%);
    filter: blur(20px);
}

.swefood-3d-ball--purple {
    background:
        radial-gradient(circle at 34% 26%, rgba(239, 237, 255, 0.4), rgba(160, 148, 255, 0.16) 24%, rgba(106, 92, 255, 0.54) 60%, rgba(106, 92, 255, 0.05) 100%);
    filter: blur(22px);
}

.swefood-3d-ball--sm {
    width: 8.5rem;
    height: 8.5rem;
}

.swefood-3d-ball--md {
    width: 12rem;
    height: 12rem;
}

.swefood-3d-ball--lg {
    width: 16rem;
    height: 16rem;
}

.swefood-3d-ball--xl {
    width: 20rem;
    height: 20rem;
}

.swefood-3d-glow {
    inset: auto;
    border-radius: 50%;
    filter: blur(48px);
    opacity: 0.22;
}

.swefood-3d-glow--core {
    width: 38rem;
    height: 38rem;
    left: 50%;
    top: 4%;
    margin-left: -19rem;
    background: radial-gradient(circle, rgba(255, 146, 61, 0.26), rgba(255, 146, 61, 0.06) 45%, rgba(255, 146, 61, 0) 72%);
}

.swefood-3d-glow--left {
    width: 24rem;
    height: 24rem;
    left: -4rem;
    top: 34%;
    background: radial-gradient(circle, rgba(0, 207, 255, 0.18), rgba(0, 207, 255, 0.04) 55%, rgba(0, 207, 255, 0) 76%);
}

.swefood-3d-glow--right {
    width: 28rem;
    height: 28rem;
    right: -6rem;
    top: 50%;
    background: radial-gradient(circle, rgba(106, 92, 255, 0.2), rgba(106, 92, 255, 0.05) 56%, rgba(106, 92, 255, 0) 76%);
}

.is-mobile-hidden {
    display: block;
}

@keyframes swefood-home-ambient-shift {
    0% {
        opacity: 0.58;
        transform: translate3d(0, 0, 0) scale(1);
    }
    100% {
        opacity: 0.78;
        transform: translate3d(0, -1.5%, 0) scale(1.04);
    }
}

@media (max-width: 1024px) {
    .swefood-3d-ball--xl {
        width: 16rem;
        height: 16rem;
    }

    .swefood-3d-glow--core {
        width: 28rem;
        height: 28rem;
        margin-left: -14rem;
    }
}

@media (max-width: 767px) {
    .layer-back {
        filter: blur(7px);
        opacity: 0.56;
    }

    .layer-mid {
        opacity: 0.48;
    }

    .layer-front {
        opacity: 0.4;
    }

    .swefood-3d-ball {
        backdrop-filter: blur(10px);
        -webkit-backdrop-filter: blur(10px);
    }

    .swefood-3d-ball--sm {
        width: 6.25rem;
        height: 6.25rem;
    }

    .swefood-3d-ball--md {
        width: 8.5rem;
        height: 8.5rem;
    }

    .swefood-3d-ball--lg {
        width: 11rem;
        height: 11rem;
    }

    .swefood-3d-ball--xl {
        width: 13rem;
        height: 13rem;
    }

    .swefood-3d-glow {
        filter: blur(38px);
        opacity: 0.26;
    }

    .swefood-3d-glow--core {
        width: 18rem;
        height: 18rem;
        top: 6%;
        margin-left: -9rem;
    }

    .swefood-3d-glow--left,
    .swefood-3d-glow--right {
        width: 16rem;
        height: 16rem;
    }

    .is-mobile-hidden {
        display: none !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .sf-home-live-bg::before {
        animation: none;
    }

    .sf-menu-live-bg::before {
        animation: none;
    }

    .swefood-3d-layer,
    .swefood-3d-ball,
    .swefood-3d-glow {
        transform: none !important;
        transition: none !important;
    }
}