/* ============================================================
   الخلفية الثابتة لموقع rave-tech.net (القيم الفعلية من الموقع الأصلي)
   تتحمّل بعد rave-bg.css وتحل محل قيمه
   ============================================================ */
.epic-fixed-bg { background: rgb(10, 12, 26); }
.epic-fixed-bg::after { display: none; }

.epic-fixed-bg .epic-base-gradient { background: linear-gradient(135deg, rgb(10, 12, 26) 0%, rgb(16, 20, 53) 50%, rgb(26, 30, 66) 100%); }

.epic-fixed-bg .hero-mesh-gradient {
    background:
        radial-gradient(at 0% 0%, rgba(0, 212, 255, 0.15) 0px, transparent 50%),
        radial-gradient(at 100% 0%, rgba(124, 58, 237, 0.15) 0px, transparent 50%),
        radial-gradient(at 100% 100%, rgba(0, 212, 255, 0.1) 0px, transparent 50%),
        radial-gradient(at 0% 100%, rgba(124, 58, 237, 0.1) 0px, transparent 50%);
    filter: blur(80px); opacity: .8; transform: none;
    animation: meshBreath 10s ease-in-out infinite alternate;
}

.epic-fixed-bg .hero-grid-lines {
    background-image:
        linear-gradient(rgba(0, 212, 255, 0.05) 1px, transparent 1px),
        linear-gradient(90deg, rgba(0, 212, 255, 0.05) 1px, transparent 1px);
    background-size: 60px 60px; opacity: .3; overflow: hidden; transform: none;
}
.epic-fixed-bg .hero-grid-lines .grid-line { position: absolute; background: linear-gradient(90deg, transparent, rgba(0, 212, 255, 0.1), transparent); }
.epic-fixed-bg .hero-grid-lines .grid-line.horizontal { left: auto; right: auto; width: 100%; height: 1px; animation: gridMoveHorizontal 20s linear infinite; }
.epic-fixed-bg .hero-grid-lines .grid-line.horizontal:nth-child(1) { top: 20%; animation-delay: 0s; }
.epic-fixed-bg .hero-grid-lines .grid-line.horizontal:nth-child(2) { top: 50%; animation-delay: -7s; }
.epic-fixed-bg .hero-grid-lines .grid-line.horizontal:nth-child(3) { top: 80%; animation-delay: -14s; }
.epic-fixed-bg .hero-grid-lines .grid-line.vertical { top: auto; bottom: auto; width: 1px; height: 100%; background: linear-gradient(180deg, transparent, rgba(0, 212, 255, 0.1), transparent); animation: gridMoveVertical 20s linear infinite; }
.epic-fixed-bg .hero-grid-lines .grid-line.vertical:nth-child(4) { left: 20%; animation-delay: -5s; }
.epic-fixed-bg .hero-grid-lines .grid-line.vertical:nth-child(5) { left: 50%; animation-delay: -12s; }
.epic-fixed-bg .hero-grid-lines .grid-line.vertical:nth-child(6) { left: 80%; animation-delay: -18s; }

.epic-fixed-bg .hero-shapes { opacity: .4; transform: none; overflow: hidden; }
.epic-fixed-bg .hero-shapes .shape { position: absolute; opacity: .1; background: none; border: 2px solid rgba(0, 212, 255, 0.3); border-radius: 0; margin: 0; animation: shapeFloat 20s ease-in-out infinite; }
.epic-fixed-bg .hero-shapes .shape-1 { width: 100px; height: 100px; top: 20%; left: 10%; right: auto; bottom: auto; border-radius: 50%; transform: none; animation-delay: 0s; }
.epic-fixed-bg .hero-shapes .shape-2 { width: 150px; height: 150px; top: 60%; right: 10%; left: auto; bottom: auto; border-radius: 0; transform: rotate(45deg); animation-delay: -5s; }
.epic-fixed-bg .hero-shapes .shape-3 { width: 80px; height: 80px; top: 40%; left: 70%; right: auto; bottom: auto; border-radius: 30% 70% 70% 30% / 30% 30% 70% 70%; transform: none; animation-delay: -10s; }
.epic-fixed-bg .hero-shapes .shape-4 { width: 120px; height: 120px; bottom: 20%; left: 30%; top: auto; right: auto; border-radius: 50%; border-style: dashed; transform: none; animation-delay: -15s; }
.epic-fixed-bg .hero-shapes .shape-5 { width: 60px; height: 60px; top: 10%; right: 30%; left: auto; bottom: auto; border-radius: 0; transform: rotate(30deg); animation-delay: -8s; }
@keyframes shapeFloat {
    0%, 100% { translate: 0 0; rotate: 0deg; }
    25% { translate: 30px -30px; rotate: 5deg; }
    50% { translate: 20px 20px; rotate: -5deg; }
    75% { translate: -30px 30px; rotate: 3deg; }
}

.epic-fixed-bg .hero-orbs { transform: none; overflow: hidden; }
.epic-fixed-bg .hero-orbs .orb { position: absolute; border-radius: 50%; filter: blur(80px); animation: orbFloat 25s ease-in-out infinite; }
.epic-fixed-bg .hero-orbs .orb-1 { width: 400px; height: 400px; background: rgba(0, 212, 255, 0.15); top: -10%; left: -10%; right: auto; bottom: auto; animation-delay: 0s; }
.epic-fixed-bg .hero-orbs .orb-2 { width: 300px; height: 300px; background: rgba(156, 136, 255, 0.1); bottom: -5%; right: -5%; top: auto; left: auto; animation-delay: -10s; }
.epic-fixed-bg .hero-orbs .orb-3 { width: 250px; height: 250px; background: rgba(0, 136, 255, 0.12); top: 40%; left: 50%; right: auto; bottom: auto; margin-left: -125px; animation-delay: -5s; }
@keyframes orbFloat {
    0%, 100% { transform: translate(0, 0) scale(1); }
    33% { transform: translate(50px, -30px) scale(1.1); }
    66% { transform: translate(-30px, 50px) scale(0.9); }
}
@keyframes meshBreath {
    0% { transform: scale(1); opacity: .6; }
    100% { transform: scale(1.2); opacity: .9; }
}
@keyframes gridMoveHorizontal {
    0% { transform: translateX(-100%); opacity: 0; }
    50% { opacity: 1; }
    100% { transform: translateX(100%); opacity: 0; }
}
@keyframes gridMoveVertical {
    0% { transform: translateY(-100%); opacity: 0; }
    50% { opacity: 1; }
    100% { transform: translateY(100%); opacity: 0; }
}
@media (max-width: 768px) {
    .epic-fixed-bg .hero-mesh-gradient { filter: blur(50px); }
}
@media (prefers-reduced-motion: reduce) {
    .epic-fixed-bg * { animation: none !important; }
}