
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600;700&display=swap');
:root{--nav-height:64px;--accent:#081a46;--muted:#5a5f66;--max-width:1100px}
*{box-sizing:border-box}html,body{height:100%;margin:0;font-family:'Poppins',sans-serif;color:#222;background:#fff}
.container{max-width:var(--max-width);margin:0 auto;padding:0 20px}
.header{position:fixed;top:0;left:0;right:0;height:var(--nav-height);background:rgba(255,255,255,0.97);backdrop-filter:blur(4px);border-bottom:1px solid rgba(8,26,70,0.06);z-index:50}
.header .container{display:flex;align-items:center;height:100%;justify-content:space-between}
.brand{display:flex;align-items:center;gap:14px}
.brand img{height:42px;width:auto;display:block}
.brand h1{margin:0;font-size:16px;font-weight:700;color:var(--accent);letter-spacing:0.6px}
.nav{display:flex;gap:18px;align-items:center}
.nav a{color:var(--muted);text-decoration:none;font-weight:600;font-size:14px;padding:8px 10px;border-radius:4px}
.nav a:hover{color:var(--accent);background:rgba(8,26,70,0.04)}
.hero{margin-top:var(--nav-height);position:relative}
.hero .banner{width:100%;height:360px;background-size:cover;background-position:center;display:flex;align-items:center;justify-content:center}
.hero .overlay{position:absolute;left:0;right:0;top:var(--nav-height);height:360px;display:flex;align-items:center;justify-content:center;pointer-events:none}
.hero .logo-center{background:rgba(255,255,255,0.92);padding:16px 22px;border-radius:8px;box-shadow:0 6px 18px rgba(8,26,70,0.08);display:flex;flex-direction:column;align-items:center;gap:6px;pointer-events:auto}
.logo-center img{height:86px}
.logo-center h2{margin:0;font-size:20px;color:var(--accent);font-weight:700}
.logo-center p{margin:0;color:var(--muted);font-size:13px}
.section{padding:48px 0}
.about .box{background:#fff;padding:28px;border-radius:8px;box-shadow:0 6px 18px rgba(15,21,30,0.04)}
.about h3{margin-top:0;color:var(--accent)}
.contact .grid{display:flex;gap:18px;flex-wrap:wrap;align-items:center;justify-content:space-between}
.contact .left{flex:1 1 420px}
.contact .right{flex:0 1 320px;text-align:right}
.contact p{margin:6px 0;color:var(--muted)}
.footer{border-top:1px solid rgba(8,26,70,0.06);padding:18px 0;color:var(--muted);font-size:13px;text-align:center}
.footer .two-lines{max-width:var(--max-width);margin:0 auto;padding:6px 20px}

@media(max-width:900px){.hero .banner{height:300px}.logo-center img{height:72px}.contact .right{text-align:left;margin-top:12px}.nav{display:none}}
@media(max-width:520px){.hero .banner{height:240px}.logo-center img{height:60px}.logo-center h2{font-size:18px}}
.whatsapp {
    position: fixed;
    right: 18px;
    bottom: 18px;
    background: #25D366;
    color: #fff;
    border-radius: 50px;
    padding: 12px 16px;
    display: flex;
    gap: 10px;
    align-items: center;
    box-shadow: 0 10px 30px rgba(37,211,102,0.18);
    z-index: 9999;
    text-decoration: none;
    font-weight: 700;
}

.whatsapp img {
    height: 32px;   /* قابل تنظیم بسته به تصویر */
    width: 32px;
    display: block;
}

