:root{
--bg:#f7f8fb; --card:#ffffff; --muted:#6b7280; --accent:#0ea5a4; --accent-2:#075985;
--radius:14px;
}
*{box-sizing:border-box}
body{margin:0;font-family:'Cairo',sans-serif;background:var(--bg);color:#0f172a;direction:rtl; -webkit-font-smoothing:antialiased;}
.container{max-width:1100px;margin:0 auto;padding:28px}
.site-header{display:flex;justify-content:space-between;align-items:center;padding:14px 0}
.logo{width:48px;height:48px;border-radius:10px;background:linear-gradient(135deg,var(--accent),var(--accent-2));display:flex;align-items:center;justify-content:center;color:white;font-weight:700}
.main-nav .nav{list-style:none;display:flex;gap:12px;padding:0;margin:0}
.main-nav .nav li a{color:var(--muted);text-decoration:none;padding:8px 12px;border-radius:8px}
.site-footer{padding:22px 0;color:var(--muted);font-size:14px} .hero{display:grid;grid-template-columns:1fr;gap:20px;align-items:center;padding:18px 0}
.hero-card{background:linear-gradient(180deg, rgba(255,255,255,0.6), rgba(255,255,255,0.9));border-radius:var(--radius);padding:20px;box-shadow:0 8px 24px rgba(2,6,23,0.06)}
.badge{background:rgba(14,165,164,0.12);color:var(--accent);padding:6px 10px;border-radius:999px;font-weight:600} .services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:12px}
.service-item{background:var(--card);padding:16px;border-radius:12px;box-shadow:0 6px 18px rgba(2,6,23,0.04)} .tags-wrap{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.tag{display:inline-block;padding:8px 12px;border-radius:999px;border:1px solid rgba(2,6,23,0.06);background:#fff;text-decoration:none;color:var(--muted);font-weight:600} .testimonials-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:12px}
.testi-item{background:var(--card);padding:16px;border-radius:12px;box-shadow:0 6px 18px rgba(2,6,23,0.04)} .contact-card{background:var(--card);padding:18px;border-radius:12px;box-shadow:0 6px 18px rgba(2,6,23,0.04)}
form{display:grid;gap:12px}
input,textarea,button{font-family:inherit}
input,textarea{padding:10px;border:1px solid #e6e9ef;border-radius:8px}
textarea{min-height:110px}
.btn{display:inline-block;padding:12px 18px;border-radius:12px;text-decoration:none;font-weight:600}
.btn-primary{background:var(--accent);color:white;border:none}
.btn-outline{background:transparent;border:2px solid rgba(2,6,23,0.06);color:var(--muted)} @media (max-width:980px){
.services-grid{grid-template-columns:repeat(2,1fr)}
.testimonials-grid{grid-template-columns:1fr}
.main-nav{display:none}
}
@media (max-width:540px){
.services-grid{grid-template-columns:1fr}
.container{padding:18px}
}