
:root{
  --bg:#f7f8fb;
  --primary:#0a74da;
  --accent:#00bfa6;
  --dark:#1e2130;
  --card:#ffffff;
  --radius:14px;
  --container:1100px;
}
*{box-sizing:border-box}
html,body{height:100%}
body{font-family:'Cairo',sans-serif;background:var(--bg);color:var(--dark);line-height:1.6;-webkit-font-smoothing:antialiased}
.container{max-width:var(--container);margin:0 auto;padding:0 20px}
.site-header{position:fixed;top:0;left:0;right:0;background:rgba(30,33,48,0.95);backdrop-filter:blur(6px);color:#fff;z-index:60}
.header-inner{display:flex;align-items:center;justify-content:space-between;padding:14px 0}
.brand{display:flex;align-items:center;gap:12px}
.logo{width:56px;height:56px}
.brand-text h1{font-size:1.05rem;margin:0}
.brand-text .tag{font-size:0.82rem;color:rgba(255,255,255,0.8)}
.main-nav a{color:#fff;margin:0 10px;text-decoration:none;font-weight:600}
.main-nav .lang-toggle{margin-left:12px;background:transparent;border:1px solid rgba(255,255,255,0.12);color:#fff;padding:6px 10px;border-radius:8px;cursor:pointer}

/* Hero */
.hero{margin-top:84px;padding:72px 0;background:linear-gradient(90deg,var(--primary),var(--accent));color:#fff}
.hero-inner{display:flex;align-items:center;justify-content:space-between;gap:24px}
.hero-content{max-width:640px}
.hero h2{font-size:2rem;margin-bottom:12px}
.lead{opacity:0.95;margin-bottom:16px}
.btn{display:inline-block;padding:10px 18px;border-radius:999px;text-decoration:none;font-weight:700}
.btn.primary{background:#fff;color:var(--primary)}
.btn.ghost{background:transparent;border:1px solid rgba(255,255,255,0.18);color:#fff;margin-left:10px}

/* Sections */
.section{padding:54px 0;background:transparent}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:start}
.values{list-style:none;padding-left:0}
.values li{padding:8px 0}
.method{padding-left:18px}

/* Services */
.services-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;margin-top:18px}
.card{background:var(--card);padding:18px;border-radius:12px;box-shadow:0 10px 25px rgba(16,24,40,0.06)}
.card h4{margin-bottom:8px}
.card ul{padding-left:18px;margin-top:8px}

/* Projects */
.projects-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:18px}
.project-card{background:var(--card);padding:16px;border-radius:12px;box-shadow:0 8px 18px rgba(16,24,40,0.04)}
.project-meta{font-size:0.85rem;color:gray;margin-top:10px}

/* Clients */
.clients-grid{display:flex;gap:20px;align-items:center;justify-content:flex-start;margin-top:18px}
.clients-grid img{width:120px;height:auto;filter:grayscale(0.3);opacity:0.95}

/* Contact */
.contact-form{display:flex;flex-direction:column;gap:12px}
.contact-form label{display:block;font-size:0.95rem}
.contact-form input, .contact-form textarea{width:100%;padding:10px;border-radius:10px;border:1px solid #e6e9ef}
.contact-note{margin-top:10px;font-size:0.9rem;color:#555}
.map-placeholder{height:160px;border-radius:10px;background:#fff;display:flex;align-items:center;justify-content:center;color:#888;margin-top:18px;box-shadow:0 6px 18px rgba(16,24,40,0.04)}

/* Footer */
.site-footer{background:var(--dark);color:#fff;padding:18px 0;margin-top:30px}
.footer-inner{display:flex;justify-content:space-between;align-items:center}

/* Responsive */
@media(max-width:920px){
  .projects-grid{grid-template-columns:1fr}
  .services-grid{grid-template-columns:1fr}
  .grid-2{grid-template-columns:1fr}
  .hero-inner{flex-direction:column;text-align:center}
  .clients-grid{flex-wrap:wrap;justify-content:center}
  .footer-inner{flex-direction:column;gap:10px;text-align:center}
}
