@font-face {
            font-family: 'Neue Power';
            src: local('Hanken Grotesk'), local('Arial');
            /* Fallback font */
        }
        @font-face {
            font-family: 'Lyon Arabic Text';
            src: local('Noto Serif'), local('Georgia');
            /* Fallback font */
        }
    

        .glow-button {
            box-shadow: 0 0 20px rgba(67, 33, 234, 0.4);
        }
        .glow-button:hover {
            box-shadow: 0 0 25px rgba(67, 33, 234, 0.6);
            transform: translateY(-2px);
        }
        .bg-radial-glow {
            background: radial-gradient(circle at center, rgba(67, 33, 234, 0.15) 0%, transparent 70%);
        }
        /* GLOBAL TYPOGRAPHY FIX: Remove tracking for Arabic text */
        h1, h2, h3, h4, h5, h6, p, a, span, div, button, input, label, textarea, select {
            letter-spacing: 0 !important;
        }

        /* ===== Smooth scrolling ===== */
        html { scroll-behavior: smooth; }

        /* ===== Skip link (accessibility + SEO) ===== */
        .skip-link {
            position: fixed; top: -100px; right: 16px; z-index: 999;
            background: #4321ea; color: #fff; padding: 12px 20px; border-radius: 8px;
            transition: top .25s ease;
        }
        .skip-link:focus { top: 16px; }

        /* ===== Header shrink-on-scroll ===== */
        #site-header { z-index: 75; }
        header.is-scrolled { box-shadow: 0 8px 30px rgba(0,0,0,0.35); }
        header.is-scrolled .site-header-inner { padding-top: .85rem; padding-bottom: .85rem; }
        header .site-header-inner { transition: padding .3s ease; }

        /* ===== Scroll reveal system ===== */
        .reveal {
            opacity: 0;
            transform: translateY(28px);
            transition: opacity .8s cubic-bezier(.22,1,.36,1), transform .8s cubic-bezier(.22,1,.36,1);
            will-change: opacity, transform;
        }
        .reveal.reveal-active { opacity: 1; transform: translateY(0); }
        .reveal-scale { transform: scale(.94); }
        .reveal-scale.reveal-active { transform: scale(1); }
        .reveal-right { transform: translateX(40px); }
        .reveal-right.reveal-active { transform: translateX(0); }
        .reveal-left { transform: translateX(-40px); }
        .reveal-left.reveal-active { transform: translateX(0); }

        @media (prefers-reduced-motion: reduce) {
            html { scroll-behavior: auto; }
            .reveal, .reveal-scale, .reveal-right, .reveal-left {
                opacity: 1 !important; transform: none !important; transition: none !important;
            }
            .float-anim, .pulse-glow { animation: none !important; }
        }

        /* ===== Ambient hero motion ===== */
        .float-anim { animation: floatY 6s ease-in-out infinite; }
        @keyframes floatY {
            0%, 100% { transform: translateY(0); }
            50% { transform: translateY(-14px); }
        }
        .pulse-glow { animation: pulseGlow 3.5s ease-in-out infinite; }
        @keyframes pulseGlow {
            0%, 100% { opacity: .55; }
            50% { opacity: 1; }
        }

        /* ===== Card hover lift ===== */
        .lift-card { transition: transform .35s cubic-bezier(.22,1,.36,1), box-shadow .35s ease, border-color .35s ease; }
        .lift-card:hover { transform: translateY(-6px); box-shadow: 0 20px 45px rgba(67,33,234,0.18); }

        /* ===== Mobile menu ===== */
        #mobile-menu {
            position: fixed; inset: 0; z-index: 60;
            background: rgba(20,6,40,0.97);
            backdrop-filter: blur(12px);
            display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2rem;
            opacity: 0; pointer-events: none;
            transition: opacity .35s ease;
        }
        #mobile-menu.open { opacity: 1; pointer-events: auto; }
        #mobile-menu a { font-size: 1.5rem; }
        body.menu-open { overflow: hidden; }
        .hamburger-icon { transition: transform .3s ease; }
        #mobile-menu-toggle[aria-expanded="true"] .hamburger-icon { transform: rotate(90deg); }

        /* ===== Back to top ===== */
        #back-to-top {
            position: fixed; bottom: 24px; left: 24px; z-index: 50;
            width: 48px; height: 48px; border-radius: 9999px;
            display: flex; align-items: center; justify-content: center;
            background: #4321ea; color: #fff; box-shadow: 0 8px 24px rgba(67,33,234,.5);
            opacity: 0; transform: translateY(16px) scale(.8); pointer-events: none;
            transition: opacity .3s ease, transform .3s ease; border: none; cursor: pointer;
        }
        #back-to-top.visible { opacity: 1; transform: translateY(0) scale(1); pointer-events: auto; }

        /* ===== Mobile sticky CTA ===== */
        #mobile-sticky-cta {
            position: fixed; bottom: 0; right: 0; left: 0; z-index: 45;
            padding: 12px 16px; background: rgba(30,7,51,0.96);
            backdrop-filter: blur(10px);
            border-top: 1px solid rgba(197,192,255,0.15);
            transform: translateY(100%);
            transition: transform .35s ease;
        }
        #mobile-sticky-cta.visible { transform: translateY(0); }

        /* ===== Scroll progress bar ===== */
        #scroll-progress {
            position: fixed; top: 0; right: 0; height: 3px; width: 0%;
            background: linear-gradient(90deg, #4321ea, #c5c0ff);
            z-index: 80; transition: width .1s linear;
        }

        /* ===== Image lazy fade-in ===== */
        img[loading="lazy"] { opacity: 0; transition: opacity .6s ease; }
        img[loading="lazy"].loaded { opacity: 1; }

        /* ===== Accordion open indicator ===== */
        details[open] summary span.material-symbols-outlined:last-child { color: #4321ea; }

        /* ===== Focus visibility (accessibility) ===== */
        a:focus-visible, button:focus-visible, input:focus-visible, summary:focus-visible {
            outline: 3px solid #c5c0ff; outline-offset: 3px; border-radius: 4px;
        }

        /* ===== Counter number tabular figures for smooth counting ===== */
        .counter-num { font-variant-numeric: tabular-nums; }

        /* ===== Anchor offset for fixed header ===== */
        section[id] { scroll-margin-top: 100px; }