:root{
    --primary:#0f172a;--accent:#0ea5e9;--gold:#f59e0b;--text:#1e293b;--muted:#64748b;
    --bg:#0f172a;--card:#fff; --txt2:#94a3b8; --border:rgba(255,255,255,0.1);
    --sky-lt:#38BDF8; --green-lt:#4ADE80; --orange-lt:#FB923C;
    --r:12px;--rl:20px;--tr:all .35s cubic-bezier(.4,0,.2,1);
}
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:'Cairo',sans-serif;background-color:var(--bg);color:#fff;line-height:1.6}
.container{max-width:1200px;margin:0 auto;padding:0 20px}

/* Navbar */
.navbar{height:60px;background:rgba(0,0,0,0.8);backdrop-filter:blur(10px);display:flex;align-items:center;justify-content:space-between;padding:0 40px;position:sticky;top:0;z-index:100;border-bottom:1px solid rgba(255,255,255,0.1)}
.nav-brand{color:#fff;font-size:20px;font-weight:800;text-decoration:none;display:flex;align-items:center;gap:10px}
.nav-brand i{color:var(--gold)}
.nav-tog{background:none;border:none;color:#fff;font-size:22px;cursor:pointer;display:none}
.nav-links{display:flex;gap:25px;list-style:none}
.nav-links a{color:#cbd5e1;text-decoration:none;font-size:14px;font-weight:600;transition:color 0.3s;background:rgba(245,158,11,.15);padding:8px 16px;border-radius:8px}
.nav-links a:hover{color:var(--gold)}

/* Hero */
.page-hero{background:linear-gradient(135deg,#0f172a,#1e293b);padding:80px 0;text-align:center}
.page-hero-inner{max-width:800px;margin:0 auto;padding:0 20px}
.page-hero-icon{width:80px;height:80px;background:rgba(14,165,233,0.1);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:36px;margin:0 auto 20px}
.page-hero h1{font-size:42px;font-weight:900;margin-bottom:15px}
.page-hero p{font-size:18px;color:var(--txt2)}

/* Sections */
.sec{padding:60px 0}
.sec-d2{background-color:var(--bg);color:#fff}
.sec-d1{background:#1e293b;color:#fff}
.sh{text-align:center;margin-bottom:50px}
.sh-icon{width:60px;height:60px;background:rgba(14,165,233,0.1);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:24px;margin:0 auto 15px}
.ic-gold{background:rgba(245,158,11,.1);color:var(--gold)}
.sh h2{font-size:32px;font-weight:800;margin-bottom:10px}
.sh p{color:var(--txt2);font-size:16px}

/* Reveal Animation */
.reveal{opacity:0;transform:translateY(30px);transition:all .8s ease}
.reveal.vis{opacity:1;transform:translateY(0)}
.reveal.rd1{transition-delay:.1s}.reveal.rd2{transition-delay:.2s}.reveal.rd3{transition-delay:.3s}

/* Contact Grid & Info */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:start}
.contact-info{display:flex;flex-direction:column;gap:13px}
.info-item{
    background:rgba(255,255,255,0.05);
    border:1px solid var(--border);
    backdrop-filter:blur(10px);
    padding:15px;
    border-radius:14px;
    display:flex;
    align-items:center;
    gap:15px;
    transition:all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    cursor:pointer;
    position:relative;
    overflow:hidden;
}
.info-item::before{
    content:'';position:absolute;top:0;right:0;width:4px;height:100%;
    background:var(--gold);transform:scaleY(0);transition:transform 0.4s;transform-origin:bottom;
}
.info-item:hover{
    transform:translateY(-8px) scale(1.02);
    background:rgba(255,255,255,0.08);
    box-shadow:0 15px 30px rgba(0,0,0,0.3);
}
.info-item:hover::before{transform:scaleY(1);transform-origin:top}
.ii-icon{
    width:50px;height:50px;
    border-radius:12px;
    display:flex;align-items:center;justify-content:center;
    font-size:20px;flex-shrink:0;
    transition:transform 0.4s;
}
.info-item:hover .ii-icon{transform:rotate(-10deg) scale(1.1);}
.ii-label{font-size:13px;color:var(--txt2);margin-bottom:3px}
.ii-val{font-size:16px;font-weight:700;color:#fff}

/* Social Links */
.soc-links{display:flex;gap:10px;flex-wrap:wrap;padding:6px 0;margin-top:5px}
.soc-btn{
    width:48px;height:48px;border-radius:12px;
    display:flex;align-items:center;justify-content:center;
    color:var(--txt2);font-size:1.25rem;
    background:rgba(255,255,255,0.05);
    border:1px solid var(--border);
    transition:var(--tr);cursor:pointer;text-decoration:none
}
.soc-btn:hover{
    color:var(--gold);
    border-color:rgba(234,179,8,.5);
    transform:translateY(-5px) scale(1.05);
    box-shadow:0 8px 20px rgba(234,179,8,.2);
    background:rgba(234,179,8,0.1);
}

/* Map */
.map-box{
    border-radius:16px;overflow:hidden;height:220px;
    background:linear-gradient(135deg,#1e293b,#0f172a);
    display:flex;align-items:center;justify-content:center;
    border:1px solid var(--border);margin-top:14px;position:relative;
}
.map-box img{width:100%;height:100%;object-fit:cover;opacity:.6;transition:opacity 0.4s}
.map-box:hover img{opacity:.4}
.map-overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px}
.map-overlay i{font-size:2.5rem;color:var(--orange-lt);animation:bounce 2s infinite}
@keyframes bounce {0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
.map-overlay p{font-size:.95rem;color:#fff;font-weight:600}

/* Form */
.contact-form-box{
    border-radius:20px;padding:34px;
    background:rgba(255,255,255,0.05);
    border:1px solid rgba(255,255,255,0.1);
    backdrop-filter:blur(14px);
    transition:all 0.4s;
}
.contact-form-box:hover{box-shadow:0 20px 40px rgba(0,0,0,0.3)}
.contact-form-box h3{font-size:1.22rem;font-weight:800;color:#fff;margin-bottom:22px;display:flex;align-items:center;gap:10px}
.contact-form-box h3 i{color:var(--sky-lt)}
.form-2col{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.fi{
    width:100%;padding:14px;border-radius:10px;
    background:rgba(255,255,255,0.05);
    border:1px solid rgba(255,255,255,0.1);
    color:#fff;font-family:'Cairo';font-size:14px;
    margin-bottom:12px;outline:none;transition:all 0.3s;
}
.fi:focus{border-color:var(--accent);background:rgba(255,255,255,0.08);box-shadow:0 0 10px rgba(14,165,233,0.2)}
.fi::placeholder{color:rgba(255,255,255,0.3)}
select.fi option{background:#1e293b;color:#fff}
textarea.fi{resize:none}

/* Buttons */
.btn{
    display:inline-flex;align-items:center;gap:8px;
    padding:14px 24px;border-radius:10px;font-weight:700;
    font-size:15px;text-decoration:none;transition:all 0.3s;
    border:none;cursor:pointer;font-family:'Cairo';
}
.btn-sky{background:linear-gradient(135deg,#0284c7,#0ea5e9);color:#fff}
.btn-sky:hover{transform:translateY(-3px);box-shadow:0 10px 20px rgba(14,165,233,0.3)}
.btn-green{background:linear-gradient(135deg,#059669,#10b981);color:#fff}
.btn-green:hover{transform:translateY(-3px);box-shadow:0 10px 20px rgba(16,185,129,0.3)}

/* Team Cards */
.card{
    background:rgba(255,255,255,0.05);
    border:1px solid rgba(255,255,255,0.1);
    backdrop-filter:blur(10px);
    border-radius:16px;transition:all 0.4s;
}
.card:hover{transform:translateY(-10px);border-color:var(--gold);box-shadow:0 15px 30px rgba(0,0,0,0.3)}

/* Footer (مصغر) */
.sp-footer{background:linear-gradient(135deg,#020617,#0f172a);color:#fff;padding:25px 0 10px}
.footer-grid{display:grid;gap:20px;padding-bottom:15px;border-bottom:1px solid rgba(255,255,255,.07)}
.footer-brand .footer-logo{font-size:1.3rem;font-weight:900;color:var(--gold);margin-bottom:8px;display:flex;align-items:center;gap:10px;justify-content:center}
.footer-brand p{font-size:.85rem;color:#94a3b8;line-height:1.6;margin-bottom:12px}
.footer-soc{display:flex;gap:8px;justify-content:center}
.soc-a{color:#fff;background:rgba(255,255,255,0.1);width:36px;height:36px;border-radius:9px;display:flex;align-items:center;justify-content:center;transition:var(--tr);text-decoration:none;font-size:1rem}
.soc-a:hover{color:var(--gold);background:rgba(255,255,255,0.05);border:1px solid rgba(245,158,11,.5);transform:translateY(-4px)}
.footer-bottom{padding:12px 0;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px}
.footer-bottom p{font-size:.8rem;color:#64748b}
.fbl{display:flex;gap:12px;flex-wrap:wrap}
.fbl a{font-size:.8rem;color:#64748b;text-decoration:none;transition:color .3s}
.fbl a:hover{color:var(--gold)}

/* Scroll To Top */
.btt{
    display:none;position:fixed;bottom:30px;left:30px;
    background:var(--gold);color:#0f172a;
    width:45px;height:45px;border-radius:50%;
    border:none;font-size:18px;cursor:pointer;
    box-shadow:0 10px 20px rgba(0,0,0,0.2);
    z-index:99;transition:transform 0.3s;
    align-items:center;justify-content:center;
}
.btt:hover{transform:scale(1.1) translateY(-3px);background:var(--accent);color:#fff}

/* Responsive */
@media(max-width:900px){
    .contact-grid{grid-template-columns:1fr}
    .form-2col{grid-template-columns:1fr}
}
@media(max-width:768px){
    .nav-tog{display:block}
    .nav-links{display:none;position:absolute;top:60px;right:0;left:0;background:var(--primary);flex-direction:column;padding:20px;gap:15px;border-top:1px solid rgba(255,255,255,.1)}
    .nav-links.open{display:flex}
    .footer-bottom{flex-direction:column;text-align:center}
    .fbl{justify-content:center}
}