:root{--bg:#0f1720;--card:#121a24;--muted:#1b2633;--text:#e6e9ee;--sub:#c7d0da;--accent:#5f8dd3;--link:#8fb4ff}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font-family:Inter,system-ui,Segoe UI,Roboto,Arial,sans-serif;line-height:1.5}
a{color:var(--link);text-decoration:none}a:hover{text-decoration:underline}
.container{max-width:1200px;margin:0 auto;padding:24px}
header{position:sticky;top:0;z-index:50;background:linear-gradient(180deg,rgba(15,23,32,.95),rgba(15,23,32,.86));backdrop-filter:blur(8px);border-bottom:1px solid rgba(255,255,255,.06)}
.nav{display:flex;align-items:center;gap:16px;padding:12px 24px}
.brand{display:flex;align-items:center;gap:12px}
.brand img{width:36px;height:36px;border-radius:8px;border:1px solid rgba(255,255,255,.08);background:#0b1220;object-fit:cover}
.brand .title{display:flex;flex-direction:column}
.brand .name{font-weight:700;letter-spacing:.4px}
.brand .subtitle{font-size:12px;color:var(--sub);margin-top:-2px}

.nav-right{display:flex;align-items:center;gap:12px;margin-left:auto}
.menu{display:flex;align-items:center;gap:12px}
.menu a{padding:10px 14px;border-radius:999px;border:1px solid rgba(255,255,255,.08)}
.menu a:hover{background:var(--muted)}

/* Language dropdown */
.lang-menu{position:relative}
.lang-trigger{padding:10px 12px;border-radius:10px;border:1px solid rgba(255,255,255,.08);background:transparent;color:var(--text);cursor:pointer;display:flex;align-items:center;gap:8px}
.lang-pop{position:absolute;right:0;top:calc(100% + 6px);background:var(--card);border:1px solid rgba(255,255,255,.08);border-radius:12px;min-width:160px;box-shadow:0 10px 30px rgba(0,0,0,.3);display:none;overflow:hidden}
.lang-pop.open{display:block}
.lang-pop button{display:block;width:100%;text-align:left;padding:10px 12px;background:transparent;border:0;color:var(--text);cursor:pointer}
.lang-pop button:hover{background:var(--muted)}

.hero{position:relative;overflow:hidden}
.hero img{width:100%;height:420px;object-fit:cover;border-bottom:1px solid rgba(255,255,255,.06)}
.hero .overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.35),rgba(0,0,0,.6))}
.hero .content{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(100%,980px);padding:24px;text-align:center}
.hero h1{font-size:36px;margin:0 0 12px}.hero p{color:#d9dee6;margin:0 0 16px}
.btns{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.btn{padding:12px 18px;border-radius:10px;border:1px solid rgba(255,255,255,.12);background:var(--accent);color:#fff;font-weight:600;cursor:pointer}
.btn.secondary{background:transparent}
.section{padding:40px 24px;border-top:1px solid rgba(255,255,255,.06);background:linear-gradient(180deg,rgba(255,255,255,.02),transparent)}
.section h2{font-size:26px;margin:0 0 16px}

/* Numbered steps via CSS counters */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;counter-reset:phase}
.step{background:var(--card);border:1px solid rgba(255,255,255,.06);padding:16px;border-radius:14px}
.step h3{margin:0 0 6px 0;font-size:18px;position:relative;padding-left:0.2em}
.step h3::before{counter-increment:phase;content:counter(phase) " — ";color:var(--sub);margin-right:6px}

.gallery{display:flex;gap:16px;overflow-x:auto;padding-bottom:8px}
.gallery .item{background:var(--card);border:1px solid rgba(255,255,255,.06);border-radius:14px;min-width:calc(6cm + 24px);padding:12px}
.gallery .thumb{width:6cm;height:6cm;border-radius:10px;border:1px solid rgba(255,255,255,.06);object-fit:cover;display:block;margin:0 auto 8px}
.gallery .caption{text-align:center;font-size:14px;color:#d9dee6}
.hero video{width:100%;max-width:980px;border-radius:12px;border:1px solid rgba(255,255,255,.08)}

footer{border-top:1px solid rgba(255,255,255,.06);margin-top:40px;background:var(--card)}
.footer-inner{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:18px 24px;flex-wrap:wrap}
.legal{font-size:12px;color:#aeb7c2}.contact{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.icon{width:18px;height:18px;display:inline-block;vertical-align:middle;filter:invert(100%)}

.services-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.card{background:var(--card);border:1px solid rgba(255,255,255,.06);border-radius:14px;padding:16px}
.service-hero{width:100%;height:320px;object-fit:cover;border-bottom:1px solid rgba(255,255,255,.06)}
.service-body{padding:24px}
.examples{display:flex;gap:16px;overflow-x:auto}
.example{background:var(--card);border:1px solid rgba(255,255,255,.06);border-radius:14px;padding:12px;min-width:calc(8cm + 24px)}
.example img{width:8cm;height:8cm;object-fit:cover;border-radius:10px;border:1px solid rgba(255,255,255,.06)}
.example .t{margin-top:8px;text-align:center}
.form-wrap{max-width:720px;margin:40px auto;background:var(--card);border:1px solid rgba(255,255,255,.06);border-radius:16px;padding:24px}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
label{display:block;margin-bottom:6px;color:#cfd6df}
input,select,textarea{width:100%;padding:12px;border-radius:10px;border:1px solid rgba(255,255,255,.12);background:#0d131a;color:var(--text)}
textarea{min-height:140px;resize:vertical}

.rtl{direction:rtl}.rtl .steps{direction:rtl}
@media (max-width:900px){.steps{grid-template-columns:1fr 1fr}.services-grid{grid-template-columns:1fr}}
@media (max-width:560px){.steps{grid-template-columns:1fr}}