:root{
    --bg:#000;
    --card:#131313;
    --accent:#FC7E10;
    --muted:#E4E4E4;
    --text:#F5F5F5;
    --container:1100px;
    --radius:12px;
    --transition:0.25s ease;
}

/* Base */
*{box-sizing:border-box}
html,body{height:100%}
body{
    margin:0;
    font-family:Inter, system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif;
    background:var(--bg);
    color:var(--text);
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    line-height:1.6;
    direction:ltr;
}

/* RTL */
html[lang="fa"] body,
html[lang="ar"] body,
body[data-lang="fa"],
body[data-lang="ar"] {
    direction:rtl;
    font-family:"Vazirmatn","Noto Naskh Arabic",Inter,sans-serif;
}

/* Containers */
.container{max-width:var(--container);margin:0 auto;padding:0 20px;}
.section{padding:60px 0}

/* Header */
.site-header{
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:16px 24px;
    background:var(--card);
    position:sticky;
    top:0;
    z-index:50;
    border-bottom:1px solid #222;
}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--text)}
.logo-img{height:48px;width:auto;display:block}
.brand-title{font-weight:800;font-size:20px;color:var(--text)}
.main-nav{display:flex;gap:16px;align-items:center}
.nav-link{color:var(--text);text-decoration:none;font-weight:600;transition:color var(--transition)}
.nav-link:hover,.nav-link.active{color:var(--accent)}
.right{display:flex;align-items:center;gap:12px}
.lang-switch a{color:var(--muted);text-decoration:none;font-weight:700}

/* Hamburger menu */
.menu-toggle{
    display:none;
    background:none;
    border:none;
    color:var(--text);
    font-size:28px;
    cursor:pointer;
}
@media (max-width:900px){
    .main-nav{display:none;}
    .menu-toggle{display:block;}
}
.mobile-nav{
    display:none;
    flex-direction:column;
    background:var(--card);
    border-top:1px solid #222;
    position:sticky;
    top:65px;
    z-index:40;
}
.mobile-nav a{
    padding:12px 20px;
    color:var(--text);
    text-decoration:none;
    border-bottom:1px solid #222;
}
.mobile-nav a:hover{background:#1a1a1a;color:var(--accent)}
.mobile-nav.open {
    display: flex;
    animation: fadeIn 0.25s ease;
}

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}
/* Buttons */
.btn{display:inline-block;padding:10px 18px;border-radius:40px;text-decoration:none;font-weight:700;text-align:center}
.btn-primary{background:linear-gradient(45deg,var(--accent),#FF9F38);color:#000}
.btn-ghost{border:1px solid #333;color:var(--text);background:transparent}
.btn.large{padding:16px 28px;font-size:18px}

/* Hero */
.hero{padding:80px 0;background:linear-gradient(180deg,#0d0d0d,#000);text-align:center}
.hero-title{color:var(--accent);font-size:42px;margin:0 0 12px}
.hero-sub{color:var(--muted);max-width:900px;margin:0 auto 20px;font-size:18px}
.hero-ctas{display:flex;gap:12px;justify-content:center;margin-bottom:18px;flex-wrap:wrap}
.hero-features{list-style:none;padding:0;margin:12px auto 0;display:flex;gap:18px;justify-content:center;flex-wrap:wrap}
.hero-features li{color:var(--muted);font-size:15px}

/* Layouts */
.three-col,
.compare-grid,
.stats-grid,
.grid{
    display:flex;
    flex-wrap:wrap;
    gap:20px;
}
.three-col article,
.compare-item,
.card,
.stat{
    background:var(--card);
    padding:22px;
    border-radius:var(--radius);
    flex:1;
    min-width:260px;
    border:1px solid #222;
}
.card-link{display:inline-block;margin-top:12px;color:var(--accent);text-decoration:none}

/* Stats */
.stat{text-align:center}
.stat h3{color:var(--accent);margin:6px 0}

/* Testimonials */
.testimonials .testimonial{background:var(--card);padding:20px;border-radius:12px;margin-bottom:12px;border:1px solid #222}
.testimonials blockquote{margin:0 0 8px;font-style:italic;color:var(--muted)}

/* FAQ */
.faq details{background:#111;padding:14px;border-radius:10px;margin-bottom:10px;border:1px solid #222}
.faq summary{cursor:pointer;font-weight:700;color:var(--accent)}

/* Footer */
.site-footer{padding:36px 20px;background:var(--card);color:#9b9b9b;border-top:1px solid #222;text-align:center}
.footer-nav a{color:var(--muted);text-decoration:none}

/* Responsive typography & layout */
@media (max-width:900px){
    .hero-title{font-size:32px}
    .hero-sub{font-size:16px}
    .three-col,.compare-grid{flex-direction:column}
    .right .btn.btn-primary {
        display: none;
    }
}

@media (max-width:600px){
    .hero{padding:60px 0}
    .hero-title{font-size:26px}
    .hero-sub{font-size:15px;padding:0 10px}
    .btn{width:100%;max-width:300px}
    .section{padding:40px 0}
    .container{padding:0 16px}
}

/* RTL spacing fixes */
html[lang="fa"] .three-col article,
html[lang="ar"] .three-col article,
body[data-lang="fa"] .three-col article,
body[data-lang="ar"] .three-col article {
    text-align:right;
}