/* Language Display Logic */
html[dir="rtl"] .en { display: none !important; }
html[dir="ltr"] .ar { display: none !important; }

html[dir="rtl"] body { font-family: 'Cairo', sans-serif; }
html[dir="ltr"] body { font-family: 'Plus Jakarta Sans', sans-serif; }

/* SaaS Premium Gradients & Glassmorphism */
.glass-header {
    background: rgba(255, 255, 255, 0.7);
    backdrop-filter: saturate(180%) blur(20px);
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
}
.dark .glass-header {
    background: rgba(10, 25, 47, 0.7);
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

.mesh-bg {
    background-color: #f8fafc;
    background-image: 
        radial-gradient(at 80% 0%, hsla(217,100%,76%,0.15) 0px, transparent 50%),
        radial-gradient(at 0% 50%, hsla(217,100%,76%,0.15) 0px, transparent 50%);
}
.dark .mesh-bg {
    background-color: #0a192f;
    background-image: 
        radial-gradient(at 80% 0%, hsla(217,100%,50%,0.15) 0px, transparent 50%),
        radial-gradient(at 0% 50%, hsla(217,100%,40%,0.15) 0px, transparent 50%);
}

/* Abstract UI Mockup styling */
.ui-mockup-shadow {
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.15), 0 0 0 1px rgba(0,0,0,0.05);
}
.dark .ui-mockup-shadow {
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.5), 0 0 0 1px rgba(255,255,255,0.1);
}

/* FAQ Accordion Transition */
.faq-content {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Modern Bento Hover Effects */
.bento-card {
    transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}
.bento-card:hover {
    transform: translateY(-4px) scale(1.01);
    border-color: rgba(37, 99, 235, 0.4);
    box-shadow: 0 30px 60px -12px rgba(37, 99, 235, 0.15);
}
.dark .bento-card:hover {
    border-color: rgba(37, 99, 235, 0.6);
    box-shadow: 0 30px 60px -12px rgba(0, 0, 0, 0.8);
}

/* Scroll Animations */
.reveal {
    opacity: 0;
    transform: translateY(40px);
    transition: all 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}
.reveal.active {
    opacity: 1;
    transform: translateY(0);
}
.reveal-delay-1 { transition-delay: 100ms; }
.reveal-delay-2 { transition-delay: 200ms; }
.reveal-delay-3 { transition-delay: 300ms; }

.reveal-left { transform: translateX(-50px); opacity: 0; transition: all 0.8s cubic-bezier(0.16, 1, 0.3, 1); }
.reveal-right { transform: translateX(50px); opacity: 0; transition: all 0.8s cubic-bezier(0.16, 1, 0.3, 1); }
html[dir="rtl"] .reveal-left { transform: translateX(50px); }
html[dir="rtl"] .reveal-right { transform: translateX(-50px); }

.reveal-left.active, .reveal-right.active {
    opacity: 1;
    transform: translateX(0);
}

/* Code Editor Mockup Colors */
.code-keyword { color: #c678dd; }
.code-string { color: #98c379; }
.code-property { color: #e06c75; }
.code-tag { color: #61afef; }