/* Gamex modv1 home decorative motion layer
   Purpose: ONLY section backgrounds. Product/review/game card hover styles stay untouched. */
:root{
    --gmx-fx-bg-a: rgba(255,255,255,.76);
    --gmx-fx-bg-b: rgba(241,245,249,.66);
    --gmx-fx-line: rgba(15,23,42,.055);
    --gmx-fx-texture: rgba(15,23,42,.035);
    --gmx-fx-icon-bg: rgba(255,255,255,.12);
    --gmx-fx-icon-br: rgba(249,115,22,.14);
    --gmx-fx-icon: rgba(249,115,22,.58);
    --gmx-fx-glow-orange: rgba(249,115,22,.18);
    --gmx-fx-glow-blue: rgba(59,130,246,.12);
    --gmx-fx-glow-teal: rgba(45,212,191,.12);
    --gmx-fx-glow-purple: rgba(139,92,246,.13);
    --gmx-fx-glow-yellow: rgba(250,204,21,.11);
    --gmx-fx-glow-red: rgba(239,68,68,.10);
}

html.dark,
body.dark,
body.dark.modern,
[data-theme="dark"]{
    --gmx-fx-bg-a: rgba(8,13,27,.82);
    --gmx-fx-bg-b: rgba(12,20,39,.72);
    --gmx-fx-line: rgba(148,163,184,.062);
    --gmx-fx-texture: rgba(255,255,255,.035);
    --gmx-fx-icon-bg: rgba(15,23,42,.34);
    --gmx-fx-icon-br: rgba(251,146,60,.16);
    --gmx-fx-icon: rgba(251,146,60,.54);
    --gmx-fx-glow-orange: rgba(249,115,22,.20);
    --gmx-fx-glow-blue: rgba(56,189,248,.13);
    --gmx-fx-glow-teal: rgba(45,212,191,.13);
    --gmx-fx-glow-purple: rgba(168,85,247,.15);
    --gmx-fx-glow-yellow: rgba(250,204,21,.10);
    --gmx-fx-glow-red: rgba(239,68,68,.10);
}

.gmx-home-bgfx-section{
    position: relative;
    overflow: hidden;
    isolation: isolate;
    contain: paint;
}

.gmx-home-bgfx-section > :not(.gmx-home-bgfx){
    position: relative;
    z-index: 2;
}

/* Section backgrounds: soft, modern, but not heavy enough to make old PCs cry into their fans. */
.gmx-home-bgfx-section.gmx-popular-section{
    background:
        radial-gradient(circle at 14% 6%, var(--gmx-fx-glow-orange), transparent 30%),
        radial-gradient(circle at 86% 20%, var(--gmx-fx-glow-blue), transparent 34%),
        linear-gradient(135deg, var(--gmx-fx-bg-a), var(--gmx-fx-bg-b));
}

.gmx-home-bgfx-section.gmx-products-popular-section{
    background:
        radial-gradient(circle at 12% 4%, var(--gmx-fx-glow-orange), transparent 30%),
        radial-gradient(circle at 88% 16%, var(--gmx-fx-glow-red), transparent 34%),
        linear-gradient(135deg, var(--gmx-fx-bg-a), var(--gmx-fx-bg-b));
}

.gmx-home-bgfx-section.gmx-category-products-section{
    background:
        radial-gradient(circle at 16% 12%, var(--gmx-fx-glow-teal), transparent 32%),
        radial-gradient(circle at 86% 64%, var(--gmx-fx-glow-blue), transparent 34%),
        linear-gradient(135deg, var(--gmx-fx-bg-a), var(--gmx-fx-bg-b));
}

.gmx-home-bgfx-section.gmx-discount-section{
    background:
        radial-gradient(circle at 18% 0%, var(--gmx-fx-glow-orange), transparent 32%),
        radial-gradient(circle at 88% 18%, var(--gmx-fx-glow-red), transparent 34%),
        linear-gradient(135deg, var(--gmx-fx-bg-a), var(--gmx-fx-bg-b));
}

.gmx-home-bgfx-section.gmx-reviews-section{
    background:
        radial-gradient(circle at 15% 8%, var(--gmx-fx-glow-orange), transparent 30%),
        radial-gradient(circle at 86% 72%, var(--gmx-fx-glow-blue), transparent 34%),
        linear-gradient(180deg, var(--gmx-fx-bg-a), var(--gmx-fx-bg-b));
}

.gmx-home-bgfx-section.gmx-market-section{
    background:
        radial-gradient(circle at 14% 6%, var(--gmx-fx-glow-yellow), transparent 32%),
        radial-gradient(circle at 82% 58%, var(--gmx-fx-glow-teal), transparent 36%),
        linear-gradient(135deg, var(--gmx-fx-bg-a), var(--gmx-fx-bg-b));
}

.gmx-home-bgfx-section.gmx-giveaway-section{
    background:
        radial-gradient(circle at 18% 10%, var(--gmx-fx-glow-purple), transparent 32%),
        radial-gradient(circle at 82% 64%, var(--gmx-fx-glow-orange), transparent 34%),
        linear-gradient(135deg, var(--gmx-fx-bg-a), var(--gmx-fx-bg-b));
}

.gmx-home-bgfx-section.gmx-promo-section{
    background:
        radial-gradient(circle at 10% 18%, var(--gmx-fx-glow-blue), transparent 32%),
        radial-gradient(circle at 92% 10%, var(--gmx-fx-glow-orange), transparent 34%),
        linear-gradient(135deg, var(--gmx-fx-bg-a), var(--gmx-fx-bg-b));
}

.gmx-home-bgfx-section.gmx-blog-section{
    background:
        radial-gradient(circle at 16% 8%, var(--gmx-fx-glow-blue), transparent 32%),
        radial-gradient(circle at 86% 66%, var(--gmx-fx-glow-teal), transparent 34%),
        linear-gradient(135deg, var(--gmx-fx-bg-a), var(--gmx-fx-bg-b));
}

.gmx-home-bgfx{
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    overflow: hidden;
    opacity: .82;
}

.gmx-home-bgfx::before{
    content: "";
    position: absolute;
    inset: -2px;
    background-image:
        linear-gradient(var(--gmx-fx-line) 1px, transparent 1px),
        linear-gradient(90deg, var(--gmx-fx-line) 1px, transparent 1px);
    background-size: 64px 64px;
    mask-image: linear-gradient(90deg, transparent 0%, #000 12%, #000 88%, transparent 100%);
    -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 12%, #000 88%, transparent 100%);
    opacity: .52;
    animation: gmxFxGridDrift 56s linear infinite;
}

.gmx-home-bgfx::after{
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(110deg, transparent 0%, var(--gmx-fx-texture) 48%, transparent 66%),
        radial-gradient(circle at 50% 50%, rgba(255,255,255,.025), transparent 48%);
    opacity: .46;
}

.gmx-home-bgfx__orb,
.gmx-home-bgfx__icon{
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    transform: translate3d(0,0,0);
}

.gmx-home-bgfx__orb{
    width: 260px;
    height: 260px;
    border-radius: 999px;
    filter: blur(18px);
    opacity: .20;
    transform: translate3d(0,0,0);
}

.gmx-home-bgfx__orb--one{
    left: -92px;
    top: 8%;
    background: radial-gradient(circle, var(--gmx-fx-glow-orange), transparent 68%);
}

.gmx-home-bgfx__orb--two{
    right: -100px;
    bottom: 2%;
    background: radial-gradient(circle, var(--gmx-fx-glow-blue), transparent 68%);
}

.gmx-home-bgfx__orb--three{
    left: 44%;
    top: 12%;
    width: 190px;
    height: 190px;
    background: radial-gradient(circle, var(--gmx-fx-glow-purple), transparent 68%);
}

.gmx-home-bgfx__icon{
    width: 52px;
    height: 52px;
    border-radius: 17px;
    color: var(--gmx-fx-icon);
    background: linear-gradient(145deg, var(--gmx-fx-icon-bg), rgba(255,255,255,.03));
    border: 1px solid var(--gmx-fx-icon-br);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.10);
    font-size: 19px;
    opacity: .14;
    animation: gmxFxFloat 18s ease-in-out infinite;
    animation-play-state: paused;
}

.gmx-bgfx-visible .gmx-home-bgfx__icon,
.gmx-bgfx-visible .gmx-home-bgfx::before{
    animation-play-state: running;
}

.gmx-bgfx-visible .gmx-home-bgfx__icon{
    opacity: .20;
    will-change: transform;
}

html.dark .gmx-bgfx-visible .gmx-home-bgfx__icon,
body.dark .gmx-bgfx-visible .gmx-home-bgfx__icon{
    opacity: .22;
}

.gmx-home-bgfx--games .gmx-home-bgfx__icon:nth-of-type(2n),
.gmx-home-bgfx--reviews .gmx-home-bgfx__icon:nth-of-type(2n),
.gmx-home-bgfx--discounts .gmx-home-bgfx__icon:nth-of-type(2n),
.gmx-home-bgfx--categoryProducts .gmx-home-bgfx__icon,
.gmx-home-bgfx--blog .gmx-home-bgfx__icon:nth-of-type(2n){
    color: rgba(45,212,191,.54);
    border-color: rgba(45,212,191,.14);
}

.gmx-home-bgfx--giveaway .gmx-home-bgfx__icon,
.gmx-home-bgfx--giveaway .gmx-home-bgfx__icon:nth-of-type(2n){
    color: rgba(168,85,247,.54);
    border-color: rgba(168,85,247,.15);
}

.gmx-home-bgfx--market .gmx-home-bgfx__icon,
.gmx-home-bgfx--market .gmx-home-bgfx__icon:nth-of-type(2n){
    color: rgba(250,204,21,.48);
    border-color: rgba(250,204,21,.13);
}

.gmx-home-bgfx--promo .gmx-home-bgfx__icon,
.gmx-home-bgfx--promo .gmx-home-bgfx__icon:nth-of-type(2n){
    color: rgba(56,189,248,.52);
    border-color: rgba(56,189,248,.14);
}

.gmx-home-bgfx__icon--1{left: 7%; top: 22%; animation-delay: -1s;}
.gmx-home-bgfx__icon--2{left: 18%; bottom: 14%; width: 42px; height: 42px; font-size: 16px; animation-delay: -8s;}
.gmx-home-bgfx__icon--3{left: 45%; top: 11%; width: 46px; height: 46px; animation-delay: -4s;}
.gmx-home-bgfx__icon--4{right: 18%; top: 22%; animation-delay: -11s;}
.gmx-home-bgfx__icon--5{right: 8%; bottom: 18%; width: 42px; height: 42px; font-size: 16px; animation-delay: -14s;}
.gmx-home-bgfx__icon--6{left: 55%; bottom: 10%; width: 38px; height: 38px; font-size: 15px; animation-delay: -17s;}

/* Review slider arrows needed spacing; no card hover override here. */
.gmx-home-bgfx-section .gmx-review-rel-wrap{
    padding-left: clamp(0px, 3vw, 42px) !important;
    padding-right: clamp(0px, 3vw, 42px) !important;
}

.gmx-home-bgfx-section .gmx-review-swiper{
    overflow: hidden !important;
    padding-left: 2px !important;
    padding-right: 2px !important;
}

.gmx-home-bgfx-section .gmx-review-prev{left: 2px !important;}
.gmx-home-bgfx-section .gmx-review-next{right: 2px !important;}

@keyframes gmxFxGridDrift{
    0%{background-position: 0 0, 0 0;}
    100%{background-position: 64px 64px, 64px 64px;}
}

@keyframes gmxFxFloat{
    0%, 100%{transform: translate3d(0,0,0) rotate(-6deg);}
    50%{transform: translate3d(12px,-14px,0) rotate(5deg);}
}

/* Automatic low-power mode from JS. Keeps design, removes the “site is freezing” feeling. */
.gmx-fx-lite .gmx-home-bgfx::before,
.gmx-fx-lite .gmx-home-bgfx__icon{
    animation: none !important;
}

.gmx-fx-lite .gmx-home-bgfx::before{
    opacity: .34;
}

.gmx-fx-lite .gmx-home-bgfx::after{
    opacity: .26;
}

.gmx-fx-lite .gmx-home-bgfx__orb{
    filter: blur(10px);
    opacity: .12;
}

.gmx-fx-lite .gmx-home-bgfx__icon{
    opacity: .10;
}

.gmx-fx-lite .gmx-home-bgfx__icon--4,
.gmx-fx-lite .gmx-home-bgfx__icon--5,
.gmx-fx-lite .gmx-home-bgfx__icon--6,
.gmx-fx-lite .gmx-home-bgfx__orb--three{
    display: none;
}

@media (max-width: 992px){
    .gmx-home-bgfx-section.gmx-reviews-section{padding-top: 70px; padding-bottom: 70px;}
    .gmx-home-bgfx__icon{width: 44px; height: 44px; font-size: 16px; border-radius: 15px; opacity: .13;}
    .gmx-home-bgfx__icon--3,
    .gmx-home-bgfx__icon--6{display: none;}
    .gmx-home-bgfx__orb{width: 210px; height: 210px; filter: blur(14px);}
    .gmx-home-bgfx-section .gmx-pop-header{gap: 14px;}
}

@media (max-width: 768px){
    .gmx-home-bgfx-section.gmx-popular-section,
    .gmx-home-bgfx-section.gmx-products-popular-section,
    .gmx-home-bgfx-section.gmx-category-products-section,
    .gmx-home-bgfx-section.gmx-discount-section,
    .gmx-home-bgfx-section.gmx-reviews-section,
    .gmx-home-bgfx-section.gmx-market-section,
    .gmx-home-bgfx-section.gmx-giveaway-section,
    .gmx-home-bgfx-section.gmx-promo-section,
    .gmx-home-bgfx-section.gmx-blog-section{
        background:
            radial-gradient(circle at 20% 0%, var(--gmx-fx-glow-orange), transparent 42%),
            linear-gradient(180deg, var(--gmx-fx-bg-a), var(--gmx-fx-bg-b));
    }

    .gmx-home-bgfx::before{background-size: 48px 48px; opacity: .30; animation: none;}
    .gmx-home-bgfx::after{opacity: .24;}
    .gmx-home-bgfx__orb{filter: blur(9px); opacity: .10;}
    .gmx-home-bgfx__icon{animation: none; opacity: .10;}
    .gmx-home-bgfx__icon--2,
    .gmx-home-bgfx__icon--5,
    .gmx-home-bgfx__icon--6{display: none;}
    .gmx-home-bgfx__icon--1{left: 4%; top: 18%;}
    .gmx-home-bgfx__icon--4{right: 5%; top: 18%;}

    .gmx-home-bgfx-section .gmx-review-rel-wrap{
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .gmx-home-bgfx-section .gmx-section-header{
        margin-bottom: 30px;
    }

    .gmx-home-bgfx-section .gmx-section-title{
        line-height: 1.18;
    }
}

@media (max-width: 480px){
    .gmx-home-bgfx__icon{opacity: .08;}
    .gmx-home-bgfx__orb--three{display: none;}
    .gmx-home-bgfx-section.gmx-reviews-section{padding-top: 54px; padding-bottom: 54px;}
    .gmx-home-bgfx-section .gmx-badge-neon{font-size: 11px; padding: 5px 14px;}
}

@media (prefers-reduced-motion: reduce){
    .gmx-home-bgfx::before,
    .gmx-home-bgfx__icon{
        animation: none !important;
    }
}

/* v2.4 performance guard: arxa fon qalır, hərəkət yalnız güclü desktoplarda və scroll dayananda işləyir. */
.gmx-home-bgfx::before,
.gmx-home-bgfx__icon {
    animation: none !important;
}

.gmx-home-bgfx__orb {
    filter: none !important;
    opacity: .12;
}

.gmx-bgfx-visible .gmx-home-bgfx__icon {
    will-change: auto;
}

html.gmx-fx-motion:not(.gmx-is-scrolling) .gmx-bgfx-visible .gmx-home-bgfx::before {
    animation: gmxFxGridDrift 72s linear infinite !important;
}

html.gmx-fx-motion:not(.gmx-is-scrolling) .gmx-bgfx-visible .gmx-home-bgfx__icon {
    animation: gmxFxFloatLite 28s ease-in-out infinite !important;
    will-change: transform;
}

html.gmx-is-scrolling .gmx-home-bgfx::before,
html.gmx-is-scrolling .gmx-home-bgfx__icon,
html.gmx-fx-lite .gmx-home-bgfx::before,
html.gmx-fx-lite .gmx-home-bgfx__icon {
    animation: none !important;
    will-change: auto !important;
}

@keyframes gmxFxFloatLite {
    0%, 100% { transform: translate3d(0,0,0) rotate(-3deg); }
    50% { transform: translate3d(5px,-6px,0) rotate(3deg); }
}
