:root{
  --primary:#0c3d91; /* deep navy */
  --accent:#1e88e5;  /* warm gold */
  --accent2:#0c3d91; /* red */
  --ink:#0e1726;
  --bg:#f6f8fc;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;direction:rtl;font-family:'Almarai',system-ui,-apple-system,Segoe UI,Arial;color:var(--ink);background:#fff;line-height:1.9;scroll-behavior:smooth}
a{color:var(--primary);text-decoration:none}
.container{max-width:1200px;margin:auto;padding:0 18px}

/* Topbar */
.topbar{background:linear-gradient(90deg,var(--primary),#122a3d);color:#e7edf6;font-size:14px}
.topbar .container{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;padding:8px 0}
.topbar a{color:#e7edf6}

/* Navbar */
nav{position:sticky;top:0;background:#ffffffb3;backdrop-filter:saturate(160%) blur(8px);border-bottom:1px solid #eaf0f6;z-index:50}
.navbar{display:flex;align-items:center;justify-content:space-between;padding:10px 0;gap:16px}
.brand strong{font-weight:800;color:var(--primary)}
.menu{list-style:none;display:flex;gap:12px;margin:0;padding:0}
.menu a{display:inline-block;padding:10px 16px;border-radius:12px;background:linear-gradient(180deg,#ffffff,#f3f6fb);border:1px solid #e0e6f2;box-shadow:0 6px 12px rgba(0,0,0,.06), inset 0 -2px 0 #e8ecf6;font-weight:800;transition:transform .12s ease, box-shadow .2s ease, background .2s ease, color .2s ease}
.menu a:hover{transform:translateY(-2px);background:var(--accent2);color:#fff;box-shadow:0 10px 18px rgba(12,24,98,.25), inset 0 -2px 0 #072a66}
#menu-toggle{display:none}
@media(max-width:760px){#menu-toggle{display:block}.menu{display:none;flex-direction:column}.menu.open{display:flex}.menu a{text-align:center}}

/* Hero */
.hero{position:relative;height:58vh;min-height:360px;overflow:hidden;background:#000}
.slide{position:absolute;inset:0;opacity:0;transition:opacity .9s ease}
.slide.active{opacity:1}
.slide img{width:100%;height:100%;object-fit:cover;filter:brightness(.55)}
/* gradient overlay */
.slide::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#00000066 10%,#00000033 60%,transparent)}
.caption{position:absolute;inset:auto 0 14% 0;color:#fff}
.caption .inner{max-width:1200px;margin:auto;padding:0 18px}
.badge{display:inline-flex;gap:8px;align-items:center;background:#ffffff25;border:1px solid #ffffff35;padding:6px 12px;border-radius:999px;margin-bottom:10px}
.h1{font-size:38px;line-height:1.25;margin:8px 0 12px;font-weight:800}
.lead{font-size:17px;max-width:850px;color:#394457;}}
.slider-dots{position:absolute;bottom:12px;left:0;right:0;display:flex;gap:8px;justify-content:center;z-index:3}
.slider-dots button{width:10px;height:10px;border-radius:999px;border:none;background:#ffffff70;cursor:pointer}
.slider-dots button.active{background:var(--accent2)}
.arrows{position:absolute;inset:0;display:flex;justify-content:space-between;align-items:center;padding:0 6px;z-index:4}
.arrow{width:40px;height:40px;border-radius:50%;background:#ffffffa0;border:1px solid #fff;display:grid;place-items:center;cursor:pointer}
.arrow:hover{background:#fff}

/* Buttons */
.btn{display:inline-flex;align-items:center;gap:8px;padding:10px 14px;border-radius:12px;border:1px solid #e6eaf3;background:#fff;font-weight:800;color:var(--primary);box-shadow:0 6px 12px rgba(0,0,0,.06)}
.btn.primary{background:linear-gradient(180deg,#7fb3ff,#1e88e5);border:1px solid #1669b1;color:#ffffff}
.btn:hover{transform:translateY(-2px);box-shadow:0 10px 18px rgba(0,0,0,.12)}

/* Sections */
.section{padding:56px 0;background:#fff;transition:background .2s ease, box-shadow .2s ease}
.section.alt{background:linear-gradient(180deg,#fafcff,#f2f6fc)}
.section .intro{color:#394457}
.h2{font-size:26px;font-weight:800;margin:0 0 16px;border-right:7px solid var(--accent);padding-right:12px}
.sub{color:#5a6478;margin:-6px 0 18px}
.grid{display:grid;gap:16px}
.cards-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.cards-4{grid-template-columns:repeat(4,minmax(0,1fr))}
@media(max-width:1000px){.cards-3{grid-template-columns:repeat(2,1fr)}.cards-4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.cards-3,.cards-4{grid-template-columns:1fr}.h1{font-size:28px}}

/* Cards (compact imagery) */
.card{background:#fff;border:1px solid #e6eaf3;border-radius:18px;overflow:hidden;box-shadow:0 8px 22px rgba(0,0,0,.05);transition:transform .16s ease, box-shadow .22s ease,border-color .22s ease}
.card:hover{transform:translateY(-4px);box-shadow:0 16px 34px rgba(0,0,0,.12);border-color:#dfe5f2}
.card .img{height:140px;overflow:hidden}
.card .img img{width:100%;height:100%;object-fit:cover}
.card .body{padding:14px}
.tag{display:inline-block;background:#fff3d4;border:1px solid #ffe2a3;color:#6b4a00;padding:2px 8px;border-radius:999px;font-size:12px;margin-bottom:8px}
.kpis{display:flex;gap:12px;flex-wrap:wrap;margin-top:10px}
.kpi{background:#fff;border:1px solid #eef1f6;border-radius:14px;padding:12px 14px;min-width:160px;box-shadow:0 8px 22px rgba(0,0,0,.03)}
.kpi strong{display:block;font-size:22px;color:var(--primary)}

/* Table */
.table{width:100%;border-collapse:collapse}
.table th,.table td{border:1px solid #e6eaf3;padding:10px 12px;text-align:right}
.table th{background:#f7f9fe}

/* Gallery (thumbnails) */
.gallery{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
@media(max-width:1000px){.gallery{grid-template-columns:repeat(3,1fr)}}
@media(max-width:640px){.gallery{grid-template-columns:repeat(2,1fr)}}
.gallery .thumb{position:relative;border-radius:14px;overflow:hidden;border:1px solid #e6eaf3;box-shadow:0 6px 14px rgba(0,0,0,.06);cursor:pointer}
.gallery .thumb img{width:100%;height:140px;object-fit:cover;display:block;transition:transform .25s ease}
.gallery .thumb:hover img{transform:scale(1.05)}
.gallery .thumb::after{content:"";position:absolute;inset:auto 0 0 0;height:50%;background:linear-gradient(180deg,transparent,#00000055);opacity:.6}

/* Lightbox */
.lightbox{position:fixed;inset:0;background:#000a;display:none;align-items:center;justify-content:center;z-index:100}
.lightbox.open{display:flex}
.lightbox img{max-width:92vw;max-height:86vh;border-radius:14px;box-shadow:0 20px 60px rgba(0,0,0,.45)}

/* Contact */
.contact-list{list-style:none;padding:0;margin:0;display:grid;gap:8px}
.contact-list a span[dir='ltr']{unicode-bidi:embed;direction:ltr}

/* Footer */
footer{background:#0a0f25;color:#cdd3e1;padding:26px 0;margin-top:46px}
footer a{color:#cdd3e1}

/* Reveal */
.reveal{opacity:0;transform:translateY(18px)}
.reveal.is-visible{opacity:1;transform:none;transition:.6s ease}

.hero .lead{color:#fff}