
        :root {
            --brand: #e1ff00;
            --brand-dim: rgba(225,255,0,0.12);
            --dark: #0d0d0d;
            --dark2: #141414;
            --dark3: #1a1a1a;
        }
        * { box-sizing: border-box; }
        body { font-family: 'Inter', sans-serif; background-color: var(--dark); color: #ffffff; overflow-x: hidden; }
        h1,h2,h3,h4,h5,h6,.font-oswald { font-family: 'Oswald', sans-serif; }
        .bebas { font-family: 'Bebas Neue', sans-serif; }
        .text-brand { color: var(--brand); }
        .bg-brand { background-color: var(--brand); }
        .border-brand { border-color: var(--brand); }

        /* Marquee */
        .marquee-wrap { overflow: hidden; white-space: nowrap; display: flex; }
        .marquee-track { display: flex; animation: tick 22s linear infinite; }
        .marquee-track-r { display: flex; animation: tick-r 22s linear infinite; }
        @keyframes tick { 0%{transform:translateX(0)} 100%{transform:translateX(-50%)} }
        @keyframes tick-r { 0%{transform:translateX(-50%)} 100%{transform:translateX(0)} }

        /* Swiper */
        .swiper-pagination-bullet-active { background-color: var(--brand) !important; }

        /* Diagonal cut */
        .clip-diagonal { clip-path: polygon(0 0, 100% 0, 100% 88%, 0 100%); }
        .clip-diagonal-r { clip-path: polygon(0 0, 100% 0, 100% 100%, 0 88%); }

        /* Glitch effect on hero text */
        .glitch { position: relative; }
        .glitch::before, .glitch::after {
            content: attr(data-text);
            position: absolute; top: 0; left: 0;
            width: 100%; height: 100%;
        }
        .glitch::before {
            color: #ff0055; clip-path: polygon(0 0, 100% 0, 100% 45%, 0 45%);
            transform: translateX(-3px); animation: glitch1 3s infinite steps(2);
        }
        .glitch::after {
            color: #00eeff; clip-path: polygon(0 55%, 100% 55%, 100% 100%, 0 100%);
            transform: translateX(3px); animation: glitch2 3s infinite steps(2);
        }
        @keyframes glitch1 { 0%,100%{transform:translateX(-3px)} 50%{transform:translateX(3px)} }
        @keyframes glitch2 { 0%,100%{transform:translateX(3px)} 50%{transform:translateX(-3px)} }

        /* Pulse dot */
        @keyframes pulse-out { 0%{transform:scale(1);opacity:0.8} 100%{transform:scale(2.5);opacity:0} }
        .pulse-dot::after {
            content:''; position:absolute; inset:0; border-radius:50%;
            background:var(--brand); animation: pulse-out 1.8s ease-out infinite;
        }

        /* Stripe accent */
        .stripe-bg {
            background-image: repeating-linear-gradient(
                -45deg,
                transparent, transparent 8px,
                rgba(225,255,0,0.04) 8px, rgba(225,255,0,0.04) 9px
            );
        }

        /* Number ticker */
        @keyframes count-bounce { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-6px)} }
        .stat-num { animation: count-bounce 3s ease-in-out infinite; }

        /* Card hover lift */
        .card-lift { transition: transform 0.35s ease, box-shadow 0.35s ease; }
        .card-lift:hover { transform: translateY(-8px); box-shadow: 0 30px 60px rgba(225,255,0,0.12); }

        /* Bold outline */
        .text-stroke { color: transparent; -webkit-text-stroke: 2px rgba(255,255,255,0.08); }
        .text-stroke-brand { color: transparent; -webkit-text-stroke: 2px var(--brand); }

        /* Scroll bar */
        ::-webkit-scrollbar { width: 4px; }
        ::-webkit-scrollbar-track { background: var(--dark); }
        ::-webkit-scrollbar-thumb { background: var(--brand); border-radius: 2px; }

        /* Header scroll effect */
        .header-scrolled { background: rgba(13,13,13,0.95) !important; backdrop-filter: blur(16px); border-bottom: 1px solid rgba(225,255,0,0.1); }

        /* Floating geometric */
        @keyframes geo-float { 0%,100%{transform:translateY(0) rotate(0deg)} 50%{transform:translateY(-30px) rotate(180deg)} }
        .geo-float { animation: geo-float 8s ease-in-out infinite; }

        /* Neon glow */
        .neon-glow { box-shadow: 0 0 20px rgba(225,255,0,0.4), 0 0 60px rgba(225,255,0,0.15); }
        .neon-text { text-shadow: 0 0 20px rgba(225,255,0,0.6); }
    