* { font-family: Cairo, sans-serif; }
body { background-color: #F8FAFF; color: #1a1a2e; scroll-behavior: smooth; }
.navy  { color: #0B1A3E; }
.gold  { color: #C9A84C; }
.blue  { color: #2E7FC5; }
.bg-navy  { background-color: #0B1A3E; }
.bg-gold  { background-color: #C9A84C; }
.bg-blue  { background-color: #2E7FC5; }
.hero-bg {
    background: linear-gradient(135deg, #0B1A3E 0%, #12296b 55%, #2E7FC5 100%);
    min-height: 100vh;
    position: relative;
    overflow: hidden;
}
.hero-bg::before {
    content: "";
    position: absolute; top: -20%; right: -10%;
    width: 700px; height: 700px; border-radius: 50%;
    background: radial-gradient(circle, rgba(201,168,76,.12) 0%, transparent 65%);
    pointer-events: none;
}
.hero-bg::after {
    content: "";
    position: absolute; bottom: -30%; left: -5%;
    width: 600px; height: 600px; border-radius: 50%;
    background: radial-gradient(circle, rgba(46,127,197,.25) 0%, transparent 65%);
    pointer-events: none;
}
.glass {
    background: rgba(255,255,255,.08);
    backdrop-filter: blur(14px);
    border: 1px solid rgba(255,255,255,.15);
    border-radius: 20px;
}
.s-tag {
    display: inline-flex; align-items: center; gap: .4rem;
    background: rgba(201,168,76,.12); color: #C9A84C;
    padding: .3rem 1rem; border-radius: 999px;
    font-size: .82rem; font-weight: 800;
    border: 1px solid rgba(201,168,76,.25);
}
.stat-card {
    background: white; border-radius: 18px;
    padding: 1.75rem 1.5rem; text-align: center;
    box-shadow: 0 8px 30px rgba(11,26,62,.08);
    border-bottom: 4px solid #C9A84C;
    transition: transform .3s, box-shadow .3s;
}
.stat-card:hover { transform: translateY(-7px); box-shadow: 0 20px 50px rgba(11,26,62,.14); }
.srv-card {
    position: relative; overflow: hidden;
    border-radius: 22px; aspect-ratio: 4/3; cursor: pointer;
    box-shadow: 0 8px 30px rgba(11,26,62,.1);
    transition: box-shadow .4s;
}
.srv-card:hover { box-shadow: 0 20px 60px rgba(11,26,62,.2); }
.srv-card img { width:100%;height:100%;object-fit:cover;transition:transform .6s; }
.srv-card:hover img { transform: scale(1.09); }
.srv-overlay {
    position: absolute; inset: 0;
    background: linear-gradient(to top,rgba(11,26,62,.96) 0%,rgba(11,26,62,.4) 55%,transparent 100%);
    display: flex; flex-direction: column; justify-content: flex-end;
    padding: 1.5rem; transition: background .4s;
}
.srv-card:hover .srv-overlay { background: linear-gradient(to top,rgba(11,26,62,.98) 0%,rgba(46,127,197,.5) 60%,transparent 100%); }
.srv-icon {
    width:48px;height:48px;background:#C9A84C;border-radius:12px;
    display:flex;align-items:center;justify-content:center;
    font-size:1.2rem;color:white;margin-bottom:.65rem;transition:background .3s;
}
.srv-card:hover .srv-icon { background: #2E7FC5; }
.cta-dark {
    background: linear-gradient(135deg,#0B1A3E 0%,#12296b 100%);
    position: relative; overflow: hidden;
}
.cta-dark::before {
    content:"";position:absolute;top:0;right:0;width:450px;height:450px;
    background:radial-gradient(circle,rgba(201,168,76,.12) 0%,transparent 70%);pointer-events:none;
}
.cta-dark::after {
    content:"";position:absolute;bottom:0;left:0;width:350px;height:350px;
    background:radial-gradient(circle,rgba(46,127,197,.15) 0%,transparent 70%);pointer-events:none;
}
.feat-item {
    display:flex;gap:1rem;align-items:flex-start;
    padding:1.25rem 1.5rem;border-radius:16px;
    background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);
    transition:background .3s,transform .3s,border-color .3s;
}
.feat-item:hover { background:rgba(201,168,76,.1);border-color:rgba(201,168,76,.35);transform:translateX(-6px); }
.feat-icon {
    width:50px;height:50px;border-radius:14px;
    background:rgba(201,168,76,.15);border:1px solid rgba(201,168,76,.3);
    display:flex;align-items:center;justify-content:center;
    font-size:1.3rem;color:#C9A84C;flex-shrink:0;
}
.vid-card {
    position:relative;overflow:hidden;border-radius:22px;aspect-ratio:16/9;cursor:pointer;
    border:2px solid rgba(255,255,255,.05);box-shadow:0 8px 30px rgba(11,26,62,.1);
    transition:border-color .3s,box-shadow .3s;
}
.vid-card:hover { border-color:#C9A84C;box-shadow:0 20px 60px rgba(11,26,62,.2); }
.vid-card img { width:100%;height:100%;object-fit:cover;opacity:.75;transition:opacity .4s,transform .5s; }
.vid-card:hover img { opacity:.5;transform:scale(1.06); }
.vid-card .vid-bg { width:100%;height:100%;object-fit:cover;transition:opacity .4s,transform .5s;opacity:.75; }
.vid-card:hover .vid-bg { opacity:.5;transform:scale(1.06); }
.play-btn {
    width:64px;height:64px;background:#C9A84C;border-radius:50%;
    display:flex;align-items:center;justify-content:center;
    font-size:1.4rem;color:white;
    animation:pulse-gold 2s infinite;transition:transform .3s,background .3s;
}
.vid-card:hover .play-btn { transform:scale(1.15);background:#2E7FC5; }
@keyframes pulse-gold {
    0%   { box-shadow:0 0 0 0 rgba(201,168,76,.6); }
    70%  { box-shadow:0 0 0 16px rgba(201,168,76,0); }
    100% { box-shadow:0 0 0 0 rgba(201,168,76,0); }
}
.partner-circle {
    width:140px;height:140px;border-radius:50%;background:white;
    border:2.5px solid #C9A84C;
    display:flex;align-items:center;justify-content:center;
    overflow:hidden;
    font-size:3rem;color:#0B1A3E;
    box-shadow:0 6px 25px rgba(11,26,62,.08);
    transition:all .3s;
}
.partner-circle:hover { border-color:#C9A84C;box-shadow:0 12px 40px rgba(201,168,76,.2);transform:translateY(-6px) scale(1.05);color:#C9A84C; }
.partner-logo {
    width:100%;height:100%;display:block;
    object-fit:contain;
    padding:8px;
    transform:scale(var(--partner-logo-scale, 1));
    transform-origin:center;
}
.partner-logo--contain {
    --partner-logo-scale: 1;
}
.partner-logo--shawaheq {
    --partner-logo-scale: 1.06;
}
.partner-logo--jeddah {
    --partner-logo-scale: 0.98;
}
.partner-logo--alarabiya {
    --partner-logo-scale: 0.96;
}
.faq-item { border:1.5px solid #e8eef8;border-radius:16px;overflow:hidden;transition:box-shadow .3s,border-color .3s; }
.faq-item:hover { box-shadow:0 6px 25px rgba(11,26,62,.08);border-color:#C9A84C; }
.faq-item.open { border-color:#2E7FC5; }
.faq-btn {
    width:100%;text-align:right;padding:1.2rem 1.5rem;background:white;border:none;cursor:pointer;
    display:flex;justify-content:space-between;align-items:center;
    font-family:Cairo,sans-serif;font-weight:800;font-size:1rem;color:#0B1A3E;
}
.faq-body { display:none;padding:0 1.5rem 1.2rem;background:white;color:#4a5568;font-size:.95rem;line-height:1.9; }
.faq-item.open .faq-body { display:block; }
.faq-icon { transition:transform .3s;color:#C9A84C;font-size:1.1rem; }
.faq-item.open .faq-icon { transform:rotate(45deg);color:#2E7FC5; }
.f-input {
    width:100%;padding:.85rem 1.2rem;border:1.5px solid #dde5f0;border-radius:12px;
    background:#F8FAFF;font-family:Cairo,sans-serif;font-size:.95rem;
    transition:border-color .3s,box-shadow .3s,background .3s;outline:none;color:#1a1a2e;
}
.f-input:focus { border-color:#2E7FC5;background:white;box-shadow:0 0 0 3px rgba(46,127,197,.12); }
.f-input::placeholder { color:#9aa5b8; }
.nav-shadow { box-shadow:0 4px 30px rgba(11,26,62,.1); }
.about-img { border-radius:18px;overflow:hidden; }
.about-img img { width:100%;height:100%;object-fit:cover;transition:transform .5s; }
.about-img:hover img { transform:scale(1.06); }
.fade-up { opacity:0;transform:translateY(30px);transition:opacity .65s,transform .65s; }
.fade-up.visible { opacity:1;transform:translateY(0); }
#mobile-menu { max-height:0;overflow:hidden;opacity:0;transition:max-height .35s,opacity .35s; }
#mobile-menu.open { max-height:600px;opacity:1; }
@keyframes pulse-wa {
    0%   { box-shadow:0 0 0 0 rgba(37,211,102,.6); }
    70%  { box-shadow:0 0 0 18px rgba(37,211,102,0); }
    100% { box-shadow:0 0 0 0 rgba(37,211,102,0); }
}
.wa-float { animation:pulse-wa 2.5s infinite; }
::-webkit-scrollbar { width:6px; }
::-webkit-scrollbar-track { background:#F0F6FF; }
::-webkit-scrollbar-thumb { background:#2E7FC5;border-radius:3px; }

/* Video Modal */
#video-modal { backdrop-filter: blur(6px); }
#video-modal video { box-shadow: 0 30px 80px rgba(0,0,0,.5); }
.vid-no-thumb {
    width:100%;height:100%;
    display:flex;align-items:center;justify-content:center;
    background:linear-gradient(135deg,#0B1A3E 0%,#12296b 100%);
}

/* Profile Section */
.profile-frame-wrap { border-radius: 22px; overflow: hidden; box-shadow: 0 20px 60px rgba(11,26,62,.12); border: 1.5px solid rgba(201,168,76,.15); }
.profile-frame { width: 100%; height: 88vh; border: none; display: block; }
@media (max-width: 768px) { .profile-frame { height: 75vh; } }

/* Before/After Gallery */
.ba-img { position:relative; overflow:hidden; border-radius:16px; aspect-ratio:4/3; cursor:pointer; }
.ba-img img { width:100%; height:100%; object-fit:cover; transition:transform .45s cubic-bezier(.4,0,.2,1); }
.ba-img:hover img { transform:scale(1.07); }
.ba-overlay { position:absolute; inset:0; background:linear-gradient(to top,rgba(11,26,62,.55),transparent 55%); opacity:0; transition:opacity .3s; }
.ba-img:hover .ba-overlay { opacity:1; }
.ba-label { position:absolute; top:12px; right:12px; font-size:.7rem; font-weight:800; padding:.3rem .75rem; border-radius:20px; backdrop-filter:blur(6px); letter-spacing:.03em; }
.ba-label.before { background:rgba(11,26,62,.75); color:#fff; }
.ba-label.after { background:rgba(201,168,76,.9); color:#0B1A3E; }
.ba-toggle-btn { padding:.6rem 2rem; font-weight:700; font-size:.9rem; cursor:pointer; transition:background .25s,color .25s; border:none; outline:none; }
.ba-toggle-btn:first-child { border-radius:50px 0 0 50px; }
.ba-toggle-btn:last-child { border-radius:0 50px 50px 0; }