
:root{--bg1:#07141a;--bg2:#0b2b2e;--accent:#ff8b2d;--accent2:#00d9ff;--muted:#a9cbd6}
*{box-sizing:border-box}body{margin:0;font-family:Poppins,system-ui;background:linear-gradient(180deg,var(--bg1),var(--bg2));color:#eaf5ff}
.container{max-width:1100px;margin:0 auto;padding:36px 20px;text-align:center}
.header-logo{max-width:160px;margin:0 auto 18px;display:block}
.brand-title{font-family:'Vazirmatn',Poppins;font-size:34px;font-weight:800;margin:6px 0;color:var(--accent)}
.hero-sub{color:var(--muted);margin-bottom:12px}
.lang-toggle{display:inline-flex;gap:8px;margin:10px 0}
.lang-toggle button{background:#0c2530;padding:8px 10px;border-radius:6px;border:1px solid rgba(255,255,255,0.04);color:#fff;cursor:pointer}
.card{background:rgba(255,255,255,0.02);padding:28px;border-radius:12px;box-shadow:0 12px 36px rgba(0,0,0,0.6);margin-bottom:26px}
.services-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px;margin-top:20px;text-align:center}
.svc{background:rgba(255,255,255,0.03);padding:18px;border-radius:8px;border:1px solid rgba(255,255,255,0.03)}
.portfolio{display:flex;gap:18px;justify-content:center;flex-wrap:wrap;margin-top:24px}
.project{width:30%;min-width:220px;border-radius:8px;overflow:hidden;box-shadow:0 10px 30px rgba(0,0,0,0.5);background:#0b2a2b}
.project img{width:100%;height:160px;object-fit:cover;display:block}
.footer{margin-top:40px;padding:18px 0;color:var(--muted)}
.socials{display:flex;gap:12px;justify-content:center;margin-top:8px}
.socials a{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:999px;background:rgba(255,255,255,0.03);text-decoration:none}
.tooltip[data-tip]:hover::after{content:attr(data-tip);position:absolute;bottom:-46px;left:50%;transform:translateX(-50%);background:#0b2730;color:#fff;padding:6px 10px;border-radius:6px;font-size:13px;white-space:nowrap;box-shadow:0 6px 18px rgba(0,0,0,0.6)}
@media(max-width:800px){.project{width:100%}.brand-title{font-size:28px}}
