@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@300;400;600;700;800&display=swap');
* { margin:0; padding:0; box-sizing:border-box; }
html, body { overflow-x:hidden; max-width:100%; }
body { font-family:'Cairo',sans-serif; color:#222; background:#fff; font-size:14px; }
a { text-decoration:none; color:inherit; transition:color .2s; }
ul { list-style:none; }
.container { max-width:1200px; margin:0 auto; padding:0 16px; }

/* STICKY HEADER — position:fixed (not sticky) because body needs
   overflow-x:hidden to stop a horizontal-scroll bug elsewhere on the page,
   and any non-'visible' overflow on body breaks position:sticky for its
   children (it becomes their scroll-container for containing-block
   purposes). Fixed positioning isn't affected by that. body-padding-top is
   set in JS to match the header's real height so content doesn't sit
   underneath it. */
.site-header { position:fixed; top:0; left:0; right:0; z-index:500; transition:box-shadow .2s; }
.site-header.scrolled { box-shadow:0 4px 20px rgba(0,0,0,.15); }

/* TOPBAR */
.topbar { background:#fff; border-bottom:1px solid #eaeaea; padding:7px 0; }
.topbar .inner { display:flex; align-items:center; justify-content:space-between; }
.topbar-left { display:flex; align-items:center; gap:14px; }
.burger { display:none; font-size:22px; color:#555; cursor:pointer; }
.tb-social { display:flex; gap:6px; align-items:center; }
.tb-social a { width:28px; height:28px; border-radius:6px; display:flex; align-items:center; justify-content:center; font-size:15px; }
.s-ig{background:#e1306c;color:#fff;} .s-yt{background:#ff0000;color:#fff;}
.s-tg{background:#2ca5e0;color:#fff;} .s-fb{background:#1877f2;color:#fff;} .s-wa{background:#25d366;color:#fff;}
.tb-en { border:1.5px solid #ccc; border-radius:5px; padding:2px 11px; font-size:12px; font-weight:700; color:#333; }
.tb-en:hover { background:#1a3273; color:#fff; border-color:#1a3273; }
.topbar-right { display:flex; align-items:center; gap:22px; }
.tb-links { display:flex; align-items:center; gap:22px; }
.tb-links a { font-size:13px; font-weight:600; color:#333; display:flex; align-items:center; gap:5px; }
.tb-links a i { font-size:14px; color:#1a3273; }
.tb-links a:hover { color:#1a3273; }
.tb-logo { display:flex; align-items:center; gap:9px; }
/* MAINNAV */
.mainnav { background:#1a3273; }
.mainnav ul { display:flex; align-items:stretch; flex-wrap:wrap; }
.mainnav ul li a { display:flex; align-items:center; gap:5px; padding:13px 16px; font-size:13px; font-weight:600; color:#c0d0e8; white-space:nowrap; }
.mainnav ul li a:hover, .mainnav ul li.active > a { background:rgba(255,255,255,.14); color:#fff; }
/* HERO */
.hero { position:relative; height:480px; overflow:hidden; background:#0b1f45; display:flex; align-items:center; justify-content:center; }
.hero-bg { position:absolute; inset:0; background:url('../images/cover1.jpg') center/cover no-repeat; filter:brightness(.45); }
.hero-bg-video { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; filter:brightness(.45); }
.hero-overlay { position:absolute; inset:0; background:linear-gradient(160deg,rgba(10,25,70,.7),rgba(26,50,115,.5)); }
.hero-content { position:relative; z-index:3; text-align:center; color:#fff; padding:0 20px; }
.hero-content h1 { font-size:32px; font-weight:800; margin-bottom:14px; line-height:1.5; }
.hero-content p { font-size:15px; opacity:.88; max-width:600px; margin:0 auto 24px; line-height:2; }
.hero-btns { display:flex; gap:12px; justify-content:center; flex-wrap:wrap; }
.btn-hero { padding:11px 28px; border-radius:8px; font-size:14px; font-weight:700; font-family:'Cairo',sans-serif; cursor:pointer; border:none; display:inline-block; }
.btn-primary { background:#ABA005; color:#fff; }
.btn-outline { background:transparent; color:#fff; border:2px solid rgba(255,255,255,.7); }
.btn-primary:hover { background:#8a8204; }
.btn-outline:hover { background:rgba(255,255,255,.1); }
/* STATS */
.stats-bar { background:#1a3273; padding:28px 0; }
.stats-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; text-align:center; }
.stat-item h3 { font-size:28px; font-weight:800; color:#ABA005; }
.stat-item p { font-size:13px; color:rgba(255,255,255,.8); margin-top:4px; }
/* DEPTS */
.depts { padding:60px 0; background:#fff; }
.depts-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:30px; margin-bottom:35px; }
.dept-card { text-align:center; padding:20px 10px; cursor:pointer; transition:transform .2s; display:block; }
.dept-card:hover { transform:translateY(-5px); }
.dept-card img { width:130px; height:130px; object-fit:contain; margin-bottom:12px; }
.dept-card h4 { font-size:14px; font-weight:800; color:#1a3273; margin-bottom:5px; line-height:1.5; }
/* SECTION TITLE */
.section-title { text-align:center; margin-bottom:35px; }
.section-title h2 { font-size:22px; font-weight:800; color:#1a3273; margin-bottom:6px; display:flex; align-items:center; justify-content:center; gap:16px; white-space:nowrap; }
.section-title h2::before, .section-title h2::after { content:''; flex:1; height:2px; background:linear-gradient(to left,#ABA005,#1a3273); max-width:200px; }
.section-title h2::after { background:linear-gradient(to right,#ABA005,#1a3273); }
.section-title p { font-size:14px; color:#666; }
/* NEWS */
.news { padding:55px 0; background:#fff; }
.news-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:25px; }
.news-card { display:block; background:#fff; border:1px solid #eee; border-radius:10px; overflow:hidden; transition:box-shadow .2s; color:inherit; }
.news-card:hover { box-shadow:0 6px 22px rgba(0,0,0,.1); }
.news-img-wrap { height:240px; overflow:hidden; }
.news-img-wrap img { width:100%; height:100%; object-fit:cover; }
.news-body { padding:16px; }
.news-body h3 { font-size:14px; font-weight:700; color:#1a3273; margin-bottom:8px; line-height:1.8; }
.news-body p { font-size:13px; color:#666; line-height:1.8; }
.more-btn { display:inline-block; padding:10px 35px; border:2px solid #1a3273; border-radius:6px; font-size:14px; font-weight:700; color:#1a3273; font-family:'Cairo',sans-serif; transition:all .2s; }
.more-btn:hover { background:#1a3273; color:#fff; }
/* ANNOUNCEMENTS */
.ann-section { padding:40px 0; background:#f8f9fa; border-top:1px solid #eee; }
.ann-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:20px; }
.ann-header h2 { font-size:18px; font-weight:800; color:#1a3273; }
.ann-header a { font-size:13px; color:#ABA005; font-weight:600; }
.ann-header a:hover { color:#1a3273; }
.ann-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.ann-card { display:block; background:#fff; border:1px solid #e8e8e8; border-radius:8px; padding:16px 18px; color:inherit; transition:box-shadow .2s; }
.ann-card:hover { box-shadow:0 4px 16px rgba(0,0,0,.1); }
.ann-card h4 { font-size:14px; font-weight:700; color:#1a3273; margin-bottom:14px; line-height:1.7; }
.ann-meta { display:flex; align-items:center; justify-content:space-between; font-size:12px; color:#999; }
.ann-meta span { display:flex; align-items:center; gap:5px; }
/* EVENTS */
.events { padding:55px 0; background:#fff; }
.events-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.ev-card { border-radius:10px; overflow:hidden; }
.ev-img { position:relative; height:220px; overflow:hidden; }
.ev-img img { width:100%; height:100%; object-fit:cover; }
.ev-dates { position:absolute; top:12px; left:12px; display:flex; gap:6px; }
.ev-date { background:#1a3273; color:#fff; text-align:center; padding:6px 10px; border-radius:4px; min-width:54px; }
.ev-date .day { font-size:18px; font-weight:800; line-height:1; }
.ev-date .month { font-size:11px; opacity:.85; }
.ev-date .time { font-size:11px; opacity:.75; margin-top:2px; }
.ev-body { padding:14px 4px; }
.ev-body h4 { font-size:14px; font-weight:800; color:#ABA005; margin-bottom:6px; }
.ev-body p { font-size:12.5px; color:#666; line-height:1.8; text-align:center; }
/* FEATURES */
.features { background:linear-gradient(135deg,#7c7403 0%,#ABA005 100%); padding:60px 0; }
.features .section-title h2 { color:#fff; }
.features .section-title h2::before, .features .section-title h2::after { background:rgba(255,255,255,.4); }
.features-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:35px; }
.feat-card { text-align:center; color:#fff; }
.feat-card img { width:80px; height:80px; object-fit:contain; margin-bottom:14px; filter:brightness(0) invert(1); }
.feat-card h4 { font-size:15px; font-weight:800; margin-bottom:10px; }
.feat-card p { font-size:13px; line-height:2; opacity:.88; }
/* GALLERY */
.gallery-banner { position:relative; height:560px; overflow:hidden; }
.gallery-grid { display:grid; grid-template-columns:1fr 1fr 1fr; grid-template-rows:1fr 1fr; height:100%; gap:3px; }
.gallery-item { position:relative; overflow:hidden; }
.gallery-item img { width:100%; height:100%; object-fit:cover; display:block; filter:brightness(.6); transition:transform .4s; }
.gallery-item:hover img { transform:scale(1.06); filter:brightness(.4); }
.gallery-item-overlay { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; opacity:0; transition:opacity .3s; background:rgba(171,160,5,.25); }
.gallery-item:hover .gallery-item-overlay { opacity:1; }
.gallery-item-overlay i { font-size:32px; color:#fff; }
.gallery-center { position:relative; }
.gallery-center img { filter:brightness(.5); }
.gallery-text { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; color:#fff; text-align:center; z-index:3; pointer-events:none; }
.gallery-text h2 { font-size:38px; font-weight:800; text-shadow:0 2px 12px rgba(0,0,0,.5); margin-bottom:10px; }
.gallery-text .go-line { width:60px; height:3px; background:#ABA005; margin:0 auto 14px; }
.gallery-text a { font-size:15px; color:rgba(255,255,255,.9); font-weight:600; pointer-events:all; }
.gallery-text a:hover { color:#ABA005; }
/* VIRTUAL TOUR */
.vtour { position:relative; padding:70px 0 0; text-align:center; overflow:hidden; background:#fff; }
.vtour-bg { position:absolute; bottom:0; left:0; right:0; height:220px; background:url('../images/Untitled-1.png') center bottom/contain no-repeat; opacity:.18; }
.vtour-content { position:relative; z-index:2; max-width:680px; margin:0 auto; padding-bottom:60px; }
.vtour-icon img { width:50px; height:50px; object-fit:contain; }
.vtour h2 { font-size:28px; font-weight:800; color:#1a3273; margin-bottom:10px; }
.vtour p { font-size:15px; color:#555; margin-bottom:24px; line-height:1.8; }
.vtour-divider { display:flex; align-items:center; justify-content:center; gap:16px; margin-bottom:18px; }
.vtour-divider span { display:block; width:120px; height:2px; }
.vtour-divider span:first-child { background:linear-gradient(to left,#ABA005,#1a3273); }
.vtour-divider span:last-child { background:linear-gradient(to right,#ABA005,#1a3273); }
/* SUCCESS */
.success-banner { height:500px; overflow:hidden; }
.success-strips { display:flex; height:100%; }
.success-strip { flex:1; overflow:hidden; position:relative; }
.success-strip img { width:100%; height:100%; object-fit:cover; filter:brightness(.55); transition:transform .4s; }
.success-strip:hover img { transform:scale(1.05); filter:brightness(.4); }
.success-center { position:relative; }
.success-text { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; color:#fff; text-align:center; z-index:2; }
.success-text h2 { font-size:52px; font-weight:800; margin-bottom:10px; }
.success-line { width:60px; height:3px; background:linear-gradient(to right,#ABA005,#1a3273); margin:0 auto 14px; }
.success-text p { font-size:17px; opacity:.9; }
/* PARTNERS */
.partners { padding:55px 0; background:#fff; }
.partners-grid { display:grid; grid-template-columns:repeat(6,1fr); gap:30px; margin-bottom:35px; }
.partner-item { display:flex; align-items:center; justify-content:center; padding:14px; border-radius:8px; transition:all .25s; }
.partner-item:hover { background:#f5f5f5; transform:scale(1.06); }
.partner-item img { max-width:120px; max-height:70px; object-fit:contain; filter:grayscale(1) opacity(.6); transition:filter .25s; }
.partner-item:hover img { filter:grayscale(0) opacity(1); }
.partners-more { text-align:center; margin-top:10px; }
/* FOOTER */
footer { background:#0b1728; color:#8899aa; padding:50px 0 0; }
.footer-grid { display:grid; grid-template-columns:1.1fr .85fr 1.1fr 1.1fr; gap:35px; padding-bottom:35px; border-bottom:1px solid rgba(255,255,255,.07); }
.fcol h4 { font-size:14px; font-weight:700; color:#fff; margin-bottom:16px; padding-bottom:8px; border-bottom:2px solid #ABA005; display:inline-flex; align-items:center; gap:7px; }
.fcol h4 i { font-size:15px; color:#ABA005; }
.fcol ul li { margin-bottom:9px; }
.fcol ul li a { font-size:13px; color:#8899aa; display:flex; align-items:center; gap:7px; }
.fcol ul li a i { font-size:14px; color:#ABA005; flex-shrink:0; }
.fcol ul li a:hover { color:#fff; }
.contact-list .ci { display:flex; gap:10px; align-items:flex-start; margin-bottom:10px; font-size:13px; }
.contact-list .ci i { color:#ABA005; margin-top:2px; font-size:15px; flex-shrink:0; }
.f-social { display:flex; gap:8px; margin-top:16px; flex-wrap:wrap; }
.f-social a { width:34px; height:34px; border-radius:8px; display:flex; align-items:center; justify-content:center; font-size:15px; }
.f-social a:hover { transform:translateY(-2px); }
.f-social .s-wa{background:#25d366;color:#fff;} .f-social .s-fb{background:#1877f2;color:#fff;}
.f-social .s-tw{background:#1da1f2;color:#fff;} .f-social .s-yt{background:#ff0000;color:#fff;} .f-social .s-ig{background:#e1306c;color:#fff;}
.footer-bottom { text-align:center; padding:13px 0; font-size:12px; color:#445566; border-top:1px solid rgba(255,255,255,.05); }
#scrollTop { position:fixed; bottom:22px; left:22px; width:40px; height:40px; background:#ABA005; color:#fff; border:none; border-radius:8px; font-size:18px; cursor:pointer; display:flex; align-items:center; justify-content:center; box-shadow:0 3px 12px rgba(0,0,0,.25); opacity:0; pointer-events:none; transition:opacity .3s; z-index:999; }
#scrollTop.show { opacity:1; pointer-events:all; }
/* AGREEMENTS SLIDER */
.agr-slide { flex:0 0 calc((100% - 120px)/5); display:flex; flex-direction:column; align-items:center; justify-content:center; background:#fff; border-radius:12px; padding:20px; gap:12px; }
.agr-slide:hover { opacity:.85; }
.agr-slide img { width:70px; height:70px; object-fit:contain; filter:invert(18%) sepia(60%) saturate(800%) hue-rotate(200deg) brightness(80%); }
.agr-slide span { font-size:14px; font-weight:700; color:#1a3273; text-align:center; }
/* SDG */
.sdg-wheel-container { display:flex; gap:40px; align-items:center; flex-wrap:wrap; justify-content:center; max-width:1100px; margin:0 auto; }
.sdg-wheel-svg-wrapper { position:relative; width:500px; height:500px; flex-shrink:0; }
.sdg-wheel-svg { filter:drop-shadow(0 10px 30px rgba(0,0,0,.3)); }
.sdg-wheel-info-box { background:#fff; border-radius:20px; padding:30px; width:420px; min-height:380px; box-shadow:0 20px 60px rgba(0,0,0,.15); transition:background-color .3s; display:flex; flex-direction:column; justify-content:center; }
.sdg-wheel-info-box h2 { color:#333; margin-bottom:15px; font-size:20px; border-bottom:3px solid #ddd; padding-bottom:10px; display:flex; align-items:center; gap:10px; }
.sdg-wheel-info-box p { color:#555; line-height:1.8; font-size:15px; }
.sdg-wheel-default-msg { text-align:center; color:#999; padding:20px 0; }
.sdg-wheel-default-msg-icon { font-size:60px; margin-bottom:15px; }
#sdgWheelGoalInfo { display:none; }
/* PAGE HERO */
.page-hero { background:linear-gradient(135deg,#07153c,#1a3273); padding:50px 0; color:#fff; text-align:center; }
.page-hero h1 { font-size:28px; font-weight:800; margin-bottom:8px; }
.page-hero p { font-size:14px; opacity:.8; }
.breadcrumb { display:flex; align-items:center; gap:8px; justify-content:center; margin-top:12px; font-size:13px; opacity:.75; }
.breadcrumb a { color:#fff; }
/* ARCHIVE */
.archive-section { padding:55px 0; }
.archive-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:25px; }
.archive-filters { display:flex; gap:10px; margin-bottom:30px; flex-wrap:wrap; }
.filter-btn { padding:7px 18px; border:1.5px solid #ddd; border-radius:20px; font-size:13px; font-weight:600; color:#555; cursor:pointer; background:#fff; font-family:'Cairo',sans-serif; transition:all .2s; }
.filter-btn.active, .filter-btn:hover { background:#1a3273; color:#fff; border-color:#1a3273; }
.news-card-date { font-size:12px; color:#999; margin-bottom:6px; display:flex; align-items:center; gap:5px; }
.news-card-cat { display:inline-block; background:#f0f4ff; color:#1a3273; padding:2px 10px; border-radius:20px; font-size:11px; font-weight:700; margin-bottom:8px; }
/* SINGLE */
.single-section { padding:55px 0; }
.single-grid { display:grid; grid-template-columns:1fr 320px; gap:35px; }
.article-img { width:100%; height:380px; object-fit:cover; border-radius:12px; margin-bottom:25px; }
.article-title { font-size:22px; font-weight:800; color:#1a3273; margin-bottom:14px; line-height:1.6; }
.article-meta { display:flex; align-items:center; gap:18px; font-size:13px; color:#888; margin-bottom:22px; padding-bottom:18px; border-bottom:1px solid #eee; flex-wrap:wrap; }
.article-meta span { display:flex; align-items:center; gap:5px; }
.article-body { font-size:14px; color:#444; line-height:2.2; }
.article-body h2,.article-body h3 { color:#1a3273; margin:22px 0 10px; font-size:17px; }
.article-body p { margin-bottom:14px; }
.sidebar-card { background:#f8f9fa; border-radius:10px; padding:20px; margin-bottom:22px; }
.sidebar-card h3 { font-size:15px; font-weight:800; color:#1a3273; margin-bottom:14px; padding-bottom:8px; border-bottom:2px solid #ABA005; }
.sidebar-item { display:flex; gap:10px; margin-bottom:14px; padding-bottom:14px; border-bottom:1px solid #eee; }
.sidebar-item:last-child { border:none; margin:0; padding:0; }
.sidebar-item img { width:60px; height:60px; object-fit:cover; border-radius:6px; flex-shrink:0; }
.sidebar-item-body h4 { font-size:13px; font-weight:700; color:#1a3273; line-height:1.6; margin-bottom:4px; }
.sidebar-item-body span { font-size:12px; color:#999; }
.badge { background:#f0f4ff; color:#1a3273; padding:3px 10px; border-radius:20px; font-size:12px; font-weight:700; }
/* ABOUT PAGE */
.about-cover { position:relative; height:380px; overflow:hidden; }
.about-cover-img { width:100%; height:100%; object-fit:cover; object-position:center 30%; display:block; }
.about-cover-card { position:absolute; bottom:0; right:0; background:linear-gradient(135deg,#ABA005 0%,#8a8204 100%); color:#fff; padding:18px 35px 18px 60px; clip-path:polygon(20px 0%,100% 0%,100% 100%,0% 100%); }
.about-cover-card h1 { font-size:24px; font-weight:800; }
.about-page-body { max-width:1200px; margin:0 auto; padding:35px 16px 70px; display:grid; grid-template-columns:220px 1fr; gap:35px; align-items:start; }
.about-sidebar { position:sticky; top:20px; }
.about-sidebar-nav { background:#fff; border-radius:10px; overflow:hidden; box-shadow:0 3px 16px rgba(0,0,0,.1); }
.about-sidebar-nav li a { display:flex; align-items:center; justify-content:space-between; padding:13px 18px; font-size:13.5px; font-weight:600; color:#333; border-bottom:1px solid #f0f0f0; transition:all .2s; }
.about-sidebar-nav li:last-child a { border-bottom:none; }
.about-sidebar-nav li a:hover { background:#fffbf0; color:#ABA005; padding-right:22px; }
.about-sidebar-nav li.active a { background:#ABA005; color:#fff; }
.about-sidebar-nav li.active a i { color:rgba(255,255,255,.7); }
.about-sidebar-nav li a i { font-size:14px; color:#ccc; }
.about-content-area h2 { font-size:20px; font-weight:800; color:#1a3273; margin-bottom:20px; padding-bottom:8px; border-bottom:2px solid #ABA005; display:inline-block; }
.about-content-area p { font-size:14.5px; line-height:2.1; color:#444; margin-bottom:18px; text-align:justify; }
.about-section { display:block; }
/* EXTERNAL RELATIONS SUB-NAV */
.er-sub-nav { display:none; background:#f8f9fc; border-top:1px solid #eee; list-style:none; }
.er-sub-nav.er-open { display:block; }
.er-sub-nav li a { display:block; padding:10px 18px 10px 18px; padding-right:32px; font-size:13px; font-weight:600; color:#555; border-bottom:1px solid #f0f0f0; transition:all .2s; }
.er-sub-nav li:last-child a { border-bottom:none; }
.er-sub-nav li a::before { content:'– '; color:#ABA005; }
.er-sub-nav li.active a { color:#1a3273; font-weight:700; background:#eef2fb; }
.er-sub-nav li a:hover { color:#ABA005; padding-right:36px; }
/* REGISTRATION PAGE */
.reg-gold { color:#c8a951; font-weight:700; font-size:15px; display:block; margin-bottom:10px; margin-top:10px; }
.reg-red { color:#e74c3c; font-weight:700; font-size:14.5px; display:block; margin:14px 0; }
.reg-bullet { list-style:disc; padding-right:20px; line-height:2.3; font-size:14px; color:#444; margin-bottom:16px; }
.reg-h3 { font-size:15px; font-weight:700; color:#1a3273; margin:14px 0 8px; }
.reg-table { width:100%; border-collapse:collapse; margin-bottom:20px; font-size:13.5px; }
.reg-table th { background:#1a3273; color:#fff; padding:10px 14px; text-align:right; }
.reg-table td { padding:9px 14px; border-bottom:1px solid #eee; color:#444; }
.reg-table tr:nth-child(even) td { background:#f9f9f9; }
/* DEPARTMENT PAGE */
.dept-hero { position:relative; height:430px; overflow:hidden; background:#0b1f45; display:flex; align-items:flex-end; }
.dept-hero-bg { position:absolute; inset:0; background-size:cover; background-position:center; filter:brightness(.45) saturate(1.1); }
.dept-hero-overlay { position:absolute; inset:0; background:linear-gradient(160deg,rgba(10,25,70,.7) 0%,rgba(15,40,100,.5) 50%,rgba(10,25,70,.3) 100%); }
.dept-hero-grid { position:absolute; inset:0; background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px); background-size:45px 45px; }
.dept-hero-fade { position:absolute; bottom:0; left:0; right:0; height:180px; background:linear-gradient(to top,rgba(0,20,60,.8),transparent); pointer-events:none; }
.dept-hero-card { position:relative; z-index:4; width:100%; background:rgba(171,160,5,.92); padding:18px 28px; display:flex; align-items:center; justify-content:space-between; backdrop-filter:blur(6px); border-top:1px solid rgba(255,255,255,.15); }
.dept-hero-card h1 { font-size:22px; font-weight:800; color:#fff; }
.dept-hero-sub { font-size:13px; color:rgba(255,255,255,.85); margin-top:3px; }
.dept-hero-icon { width:60px; height:60px; background:rgba(255,255,255,.15); border-radius:12px; display:flex; align-items:center; justify-content:center; font-size:30px; color:#fff; flex-shrink:0; }
.dept-tabs { background:#f0f0f0; border-bottom:1px solid #ddd; position:sticky; top:0; z-index:100; }
.dept-tabs .container { overflow-x:auto; }
#deptTabsNav { display:flex; list-style:none; padding:0; margin:0; white-space:nowrap; }
#deptTabsNav li a { display:flex; align-items:center; gap:6px; padding:13px 20px; color:#444; font-size:13px; font-weight:600; transition:all .2s; border-bottom:3px solid transparent; }
#deptTabsNav li a:hover { color:#1a3273; background:rgba(26,50,115,.05); }
#deptTabsNav li.active a { background:#ABA005; color:#fff; border-bottom-color:#8a8204; }
#deptTabsNav li a i { font-size:15px; }
.dept-breadcrumb { background:#fafafa; border-bottom:1px solid #eee; padding:9px 0; }
.dept-breadcrumb-inner { display:flex; align-items:center; gap:6px; font-size:12.5px; color:#888; justify-content:flex-end; }
.dept-breadcrumb-inner a { color:#1a3273; font-weight:600; }
.dept-breadcrumb-inner i { color:#aaa; }
.dept-tab-content { padding:35px 0 60px; }
.dept-content-wrap { max-width:1200px; margin:0 auto; padding:0 16px; }
.dept-content-grid { display:grid; grid-template-columns:1fr 1fr; gap:45px; margin-bottom:45px; align-items:start; }
.dept-content-text h2 { font-size:20px; font-weight:800; color:#1a3273; margin-bottom:16px; padding-bottom:8px; border-bottom:2px solid #ABA005; display:inline-block; }
.dept-content-text p { font-size:14.5px; line-height:2.1; color:#444; margin-bottom:14px; }
.dept-video-box { border-radius:10px; overflow:hidden; box-shadow:0 4px 20px rgba(0,0,0,.14); background:#000; position:relative; }
.dept-video-box iframe { width:100%; height:275px; border:none; display:block; }
.dept-video-label { display:flex; align-items:center; gap:10px; margin-top:10px; font-size:12px; color:#555; }
.dept-yt-badge { background:#ff0000; color:#fff; padding:2px 8px; border-radius:3px; font-size:11px; font-weight:700; display:flex; align-items:center; gap:4px; flex-shrink:0; }
.dept-contact-section { max-width:1200px; margin:0 auto; padding:0 16px 65px; }
.dept-section-title { display:flex; align-items:center; gap:10px; margin-bottom:18px; }
.dept-section-title i { font-size:22px; color:#ABA005; background:rgba(26,188,156,.1); width:40px; height:40px; border-radius:10px; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.dept-section-title h2 { font-size:20px; font-weight:800; color:#1a3273; padding-bottom:8px; border-bottom:2px solid #ABA005; display:inline-block; }
.dept-table-wrap { overflow-x:auto; border-radius:10px; box-shadow:0 2px 12px rgba(0,0,0,.07); }
.dept-table-wrap table { width:100%; border-collapse:collapse; font-size:13.5px; }
.dept-table-wrap th { background:#1a3273; color:#fff; padding:13px 16px; text-align:right; font-weight:700; }
.dept-table-wrap th i { margin-left:6px; }
.dept-table-wrap td { padding:12px 16px; border-bottom:1px solid #f0f0f0; }
.dept-table-wrap tr:last-child td { border:none; }
.dept-table-wrap tr:hover td { background:#f8f9ff; }
.dept-table-wrap a { color:#1a3273; }
.course-plan-wrap { border-radius:10px; overflow:hidden; box-shadow:0 2px 12px rgba(0,0,0,.07); margin-bottom:24px; }
.course-plan-term-header { background:#ABA005; color:#fff; padding:14px 20px; font-size:15px; font-weight:800; text-align:center; }
.course-plan-table-scroll { overflow-x:auto; }
.course-plan-table { width:100%; border-collapse:collapse; font-size:13.5px; }
.course-plan-table th { background:#e9ecef; color:#333; padding:12px 16px; text-align:center; font-weight:700; }
.course-plan-table td { padding:11px 16px; border-bottom:1px solid #f0f0f0; text-align:center; }
.course-plan-table tr:last-child td { border:none; }
.course-plan-table tbody tr:nth-child(even) td { background:#fafafa; }
.course-plan-table tr:hover td { background:#f2fff8; }
.course-code-link { color:#1a73e8; font-weight:600; cursor:pointer; text-decoration:none; }
.course-code-link:hover { text-decoration:underline; }
.course-pdf-link { display:inline-flex; align-items:center; gap:5px; color:#c0392b; font-weight:600; font-size:12.5px; text-decoration:none; }
.course-pdf-link:hover { text-decoration:underline; }
.course-plan-file-only { background:#fff; padding:18px 20px; }
.course-plan-file-row { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:10px 0; border-bottom:1px solid #f0f0f0; }
.course-plan-file-row:last-child { border-bottom:none; }
.course-plan-file-title { font-size:14px; font-weight:700; color:#1a3273; }
.course-plan-divider { font-size:17px; font-weight:800; color:#1a3273; margin:8px 0 16px; padding-bottom:8px; border-bottom:2px solid #ABA005; }
.dept-dean-grid { display:grid; grid-template-columns:240px 1fr; gap:40px; align-items:start; }
.dept-dean-card { background:#fff; border-radius:12px; box-shadow:0 3px 16px rgba(0,0,0,.1); overflow:hidden; }
.dept-dean-photo { width:100%; height:200px; background:linear-gradient(135deg,#07153c 0%,#1a3273 100%); display:flex; align-items:center; justify-content:center; overflow:hidden; }
.dept-dean-photo img { width:100%; height:100%; object-fit:cover; object-position:top center; }
.dept-dean-info { padding:16px; text-align:center; border-top:3px solid #ABA005; }
.dept-dean-info .d-name { font-size:14.5px; font-weight:800; color:#1a3273; margin-bottom:12px; line-height:1.5; }
.dept-dean-info .d-row { display:flex; align-items:flex-start; gap:7px; margin-bottom:8px; font-size:12.5px; color:#555; text-align:right; }
.dept-dean-info .d-row i { color:#ABA005; font-size:14px; flex-shrink:0; margin-top:1px; }
.dept-dean-info .d-row a { color:#1a3273; font-weight:600; }
.dept-dean-info .d-row a:hover { color:#ABA005; text-decoration:underline; }
.d-name { font-size:15px; font-weight:800; color:#1a3273; margin-bottom:6px; }
.d-row { display:flex; align-items:center; gap:8px; font-size:13px; color:#555; margin-bottom:6px; }
.d-row i { color:#ABA005; }
.d-row a { color:#1a3273; }
.dept-dean-message p { font-size:14.5px; line-height:2.1; color:#444; margin-bottom:14px; text-align:justify; }
.dept-dean-message .signature { font-size:14px; font-weight:700; color:#1a3273; margin-top:20px; }
.dept-block { background:#fff; border-radius:12px; box-shadow:0 2px 12px rgba(0,0,0,.08); overflow:hidden; margin-bottom:20px; }
.dept-block-header { background:#1a3273; color:#fff; padding:14px 20px; display:flex; align-items:center; justify-content:space-between; font-size:15px; font-weight:700; }
.dept-block-header i { font-size:20px; opacity:.5; }
.dept-program-row { display:flex; align-items:center; justify-content:space-between; padding:14px 20px; border-bottom:1px solid #f0f0f0; gap:15px; }
.dept-program-row:last-child { border:none; }
.dept-prog-info { display:flex; align-items:center; gap:12px; }
.dept-prog-dot { width:10px; height:10px; border-radius:50%; background:#ABA005; flex-shrink:0; }
.dept-prog-name { font-size:14px; font-weight:700; color:#1a3273; margin-bottom:4px; }
.dept-prog-details { font-size:12.5px; color:#777; display:flex; gap:14px; }
.dept-prog-details .deg,.dept-prog-details .dur { color:#333; font-weight:600; }
.dept-prog-btns { display:flex; gap:8px; }
.dept-prog-btn { display:flex; align-items:center; gap:5px; padding:7px 14px; border-radius:6px; font-size:12px; font-weight:700; }
.dept-btn-red { background:#ff0000; color:#fff; }
.dept-btn-green { background:#1a3273; color:#fff; }
.dept-faculty-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.dept-faculty-card { background:#fff; border-radius:12px; box-shadow:0 2px 12px rgba(0,0,0,.08); overflow:hidden; }
.dept-fc-header { height:140px; background:#f5f6fa; display:flex; align-items:center; justify-content:center; }
.dept-fc-avatar { width:100%; height:100%; position:relative; }
.dept-fc-avatar img { width:100%; height:100%; object-fit:cover; object-position:top; }
.dept-avatar-ph { width:100%; height:100%; display:flex; align-items:center; justify-content:center; }
.dept-fc-body { padding:16px; }
.dept-fc-name { font-size:14px; font-weight:800; color:#1a3273; margin-bottom:3px; }
.dept-fc-degree { font-size:12px; color:#ABA005; font-weight:600; margin-bottom:10px; }
.dept-fc-info { border-top:1px solid #f0f0f0; padding-top:10px; }
.dept-fc-item { display:flex; align-items:center; gap:7px; font-size:12px; color:#555; margin-bottom:6px; }
.dept-fc-item i { color:#ABA005; flex-shrink:0; }
.dept-fc-item a { color:#1a3273; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.dept-fc-item .tag { background:#f0f4ff; color:#1a3273; padding:2px 8px; border-radius:20px; font-size:11px; font-weight:700; }
.dept-news-col { background:#fff; border-radius:12px; box-shadow:0 2px 12px rgba(0,0,0,.07); overflow:hidden; }
.dept-ncol-header { display:flex; align-items:center; justify-content:space-between; padding:12px 18px; background:#ABA005; }
.dept-ncol-header h3 { font-size:15px; font-weight:700; color:#fff; }
.dept-ncol-archive { font-size:12px; font-weight:600; color:#fff; background:rgba(255,255,255,.2); padding:4px 12px; border-radius:20px; border:1px solid rgba(255,255,255,.4); }
.dept-ncol-archive:hover { background:rgba(255,255,255,.35); }
.dept-news-row { display:flex; gap:12px; padding:12px 16px; border-bottom:1px solid #f5f5f5; align-items:center; }
.dept-news-row:last-child { border:none; }
.dept-news-thumb { width:80px; height:60px; border-radius:7px; overflow:hidden; flex-shrink:0; background:linear-gradient(135deg,#1a3273,#ABA005); display:flex; align-items:center; justify-content:center; order:1; }
.dept-news-text { flex:1; order:0; }
.dept-news-thumb img { width:100%; height:100%; object-fit:cover; }
.dept-news-title { font-size:13px; font-weight:700; color:#1a3273; line-height:1.6; margin-bottom:4px; }
.dept-news-date { font-size:11px; color:#aaa; }
.dept-ann-row { display:block; padding:11px 16px; border-bottom:1px solid #f5f5f5; }
.dept-ann-row:last-child { border:none; }
.dept-ann-title { font-size:13px; font-weight:600; color:#333; line-height:1.6; margin-bottom:3px; }
.dept-ann-date { font-size:11px; color:#aaa; }
/* NAVBAR DROPDOWN */
.mainnav ul li { position:relative; }
.mainnav ul li .nav-dropdown { display:none; position:absolute; top:100%; right:0; width:260px; background:#fff; border-top:3px solid #ABA005; border-radius:0 0 10px 10px; box-shadow:0 8px 24px rgba(0,0,0,.18); z-index:9999; padding:6px 0; }
.mainnav ul li:hover .nav-dropdown { display:block; }
.mainnav ul li .nav-dropdown a { display:flex; align-items:center; gap:8px; padding:10px 18px; font-size:13px; font-weight:700; color:#1a3273; white-space:normal; line-height:1.5; background:transparent; transition:background .15s,color .15s; }
.mainnav ul li .nav-dropdown a i { color:#ABA005; font-size:14px; flex-shrink:0; }
.mainnav ul li .nav-dropdown a:hover { background:#1a3273; color:#fff; }
.mainnav ul li .nav-dropdown a:hover i { color:#ABA005; }
.nav-dropdown-divider { height:1px; background:#f0f0f0; margin:4px 0; }
.mainnav ul li > a.has-dropdown::after { content:'\ea4e'; font-family:'remixicon'; font-size:13px; margin-right:2px; opacity:.7; }
.nav-dropdown-item { position:relative; }
.nav-dropdown-item.has-submenu > a { padding-inline-end:12px; }
.nav-submenu-caret { margin-inline-start:auto; opacity:.6; font-size:12px; }
.nav-dropdown-item .nav-submenu { display:none; position:absolute; top:-3px; right:100%; width:240px; background:#fff; border-top:3px solid #ABA005; border-radius:10px 0 10px 10px; box-shadow:0 8px 24px rgba(0,0,0,.18); z-index:10000; padding:6px 0; }
.nav-dropdown-item.has-submenu:hover > .nav-submenu { display:block; }
/* Touch devices have no :hover, so JS toggles this class on tap (see ucas.js) */
.mainnav ul li.dropdown-open > .nav-dropdown { display:block; }
.nav-dropdown-item.has-submenu.dropdown-open > .nav-submenu { display:block; }

/* RESPONSIVE */
@media(max-width:900px){
  .about-page-body{grid-template-columns:1fr;}
  .about-sidebar{position:static;}
  .about-sidebar-nav{display:flex;flex-wrap:wrap;}
  .about-sidebar-nav li{flex:1 1 45%;}
  .stats-grid,.news-grid,.ann-grid,.archive-grid{grid-template-columns:1fr 1fr;}
  .footer-grid{grid-template-columns:1fr 1fr;}
  .single-grid{grid-template-columns:1fr;}
  .features-grid{grid-template-columns:1fr 1fr;}
  .depts-grid{grid-template-columns:repeat(2,1fr);}
}
@media(max-width:600px){
  .stats-grid,.footer-grid{grid-template-columns:1fr;}
  .hero-content h1{font-size:22px;}
  .tb-links{display:none;}
  .tb-social{display:none;}
  .topbar{padding:16px 0;}
  .topbar .inner{position:relative;}
  .topbar-right{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);}
  .news-grid,.ann-grid,.archive-grid{grid-template-columns:1fr;}
  .partners-grid{grid-template-columns:repeat(3,1fr);}
  .features-grid{grid-template-columns:1fr;}
  .gallery-banner{height:300px;}
  .success-banner{height:300px;}
  .success-text h2{font-size:28px;}
  .sdg-wheel-svg-wrapper{width:320px;height:320px;}
  .sdg-wheel-info-box{width:100%;}

  /* Collapsible mobile nav — the .burger toggle + .mainnav.open class already
     existed but had no matching CSS, so the menu never actually collapsed. */
  .burger { display:block; }
  .mainnav ul { display:none; flex-direction:column; width:100%; }
  .mainnav.open ul { display:flex; }
  .mainnav ul li { width:100%; }
  .mainnav ul li a { width:100%; }
  .mainnav ul li:hover .nav-dropdown,
  .nav-dropdown-item.has-submenu:hover > .nav-submenu { display:none; }
  .mainnav ul li .nav-dropdown,
  .nav-dropdown-item .nav-submenu {
    position:static; width:100%; box-shadow:none; border-radius:0;
    border-top:none; border-right:3px solid #ABA005; margin-right:0;
  }
  .mainnav ul li.dropdown-open > .nav-dropdown,
  .nav-dropdown-item.has-submenu.dropdown-open > .nav-submenu { display:block; }
}
/* ====== Faculty Cards (department page) ====== */
.faculty-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
@media(max-width:900px){.faculty-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:580px){.faculty-grid{grid-template-columns:1fr;}}
.faculty-card{background:#fff;border-radius:12px;overflow:hidden;box-shadow:0 3px 16px rgba(0,0,0,.09);transition:transform .25s,box-shadow .25s;}
.faculty-card:hover{transform:translateY(-4px);box-shadow:0 10px 30px rgba(0,0,0,.14);}
.fc-header{height:120px;background:linear-gradient(135deg,#07153c 0%,#1a3273 100%);position:relative;display:flex;align-items:flex-end;justify-content:center;}
.fc-avatar{width:90px;height:90px;border-radius:50%;border:4px solid #fff;position:absolute;bottom:-45px;background:#e8f0fa;display:flex;align-items:center;justify-content:center;overflow:hidden;box-shadow:0 4px 14px rgba(0,0,0,.15);}
.fc-avatar img{width:100%;height:100%;object-fit:cover;}
.fc-avatar .avatar-placeholder{width:100%;height:100%;background:linear-gradient(135deg,#e8f0fa,#c8d8f0);display:flex;align-items:center;justify-content:center;}
.fc-avatar .avatar-placeholder img{width:65%;height:65%;object-fit:contain;opacity:.7;}
.fc-body{padding:55px 18px 20px;text-align:center;}
.fc-name{font-size:15px;font-weight:800;color:#1a3273;margin-bottom:4px;}
.fc-degree{font-size:12.5px;color:#ABA005;font-weight:600;margin-bottom:16px;}
.fc-info{text-align:right;border-top:1px solid #eee;padding-top:14px;}
.fc-info-item{display:flex;align-items:center;gap:8px;margin-bottom:9px;font-size:12.5px;color:#555;}
.fc-info-item i{font-size:15px;color:#1a3273;flex-shrink:0;width:18px;}
.fc-info-item a{color:#1a3273;font-weight:600;}
.fc-info-item a:hover{color:#ABA005;text-decoration:underline;}
.fc-info-item .tag{color:#ABA005;font-weight:600;}
.fc-personal-link{display:inline-flex;align-items:center;gap:4px;font-size:12.5px;color:#1a3273;font-weight:600;text-decoration:none;}
.fc-personal-link:hover{color:#ABA005;}
/* PROGRAMS SECTION - matching engineering.html classes */
.dept-header{background:#f0f0f0;border-bottom:1px solid #e0e0e0;padding:13px 18px;display:flex;align-items:center;gap:10px;justify-content:flex-end;}
.dept-header span{font-size:15px;font-weight:700;color:#1a3273;}
.dept-header i{font-size:18px;color:#1a3273;opacity:.6;}
.program-row{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;border-bottom:1px solid #f0f0f0;gap:20px;}
.program-row:last-child{border-bottom:none;}
.program-row:hover{background:#fafcff;}
.prog-info{display:flex;align-items:center;gap:10px;flex:1;text-align:right;}
.prog-dot{width:8px;height:8px;border-radius:50%;background:#ABA005;flex-shrink:0;order:-1;}
.prog-meta{line-height:1.7;}
.prog-name{font-size:14px;font-weight:700;color:#1a3273;}
.prog-details{font-size:12.5px;color:#666;display:flex;gap:14px;justify-content:flex-end;}
.prog-details .deg{color:#ABA005;font-weight:600;}
.prog-details .dur{color:#2471a3;font-weight:600;}
.prog-btns{display:flex;gap:7px;flex-shrink:0;}
.prog-btn{display:inline-flex;align-items:center;gap:5px;padding:6px 13px;border-radius:5px;font-size:12px;font-weight:700;cursor:pointer;border:none;text-decoration:none;white-space:nowrap;font-family:'Cairo',sans-serif;}
.prog-btn i{font-size:13px;}
.prog-btn-red{background:#e74c3c;color:#fff;}
.prog-btn-green{background:#ABA005;color:#fff;}
.prog-btn-red:hover{background:#c0392b;}
.prog-btn-green:hover{background:#8a8204;}
/* SCROLL TOP */
#scrollTop{position:fixed;bottom:22px;left:22px;width:40px;height:40px;background:#ABA005;color:#fff;border:none;border-radius:8px;font-size:18px;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 3px 12px rgba(0,0,0,.25);opacity:0;pointer-events:none;transition:opacity .3s,transform .2s;z-index:999;}
#scrollTop.show{opacity:1;pointer-events:all;}
#scrollTop:hover{background:#8a8204;transform:translateY(-2px);}
/* DEPT RESPONSIVE */
@media(max-width:960px){.dept-content-grid{grid-template-columns:1fr;}.dept-dean-grid{grid-template-columns:1fr;}}
@media(max-width:640px){.dept-hero{height:320px;}.faculty-grid{grid-template-columns:repeat(2,1fr);}}
/* SITE PAGINATION */
.site-pagination{display:flex;justify-content:center;margin:10px 0;}
.site-pagination ul{display:flex;flex-wrap:wrap;gap:6px;list-style:none;margin:0;padding:0;}
.site-pagination li a,.site-pagination li span{display:inline-flex;align-items:center;justify-content:center;min-width:38px;height:38px;padding:0 10px;border-radius:8px;font-size:14px;font-weight:700;text-decoration:none;color:#1a3273;background:#fff;border:1px solid #e0e0e0;font-family:'Cairo',sans-serif;}
.site-pagination li a:hover{background:#ABA005;color:#fff;border-color:#ABA005;}
.site-pagination li.site-pagination-active span{background:#ABA005;color:#fff;border-color:#ABA005;}
.site-pagination li.site-pagination-disabled span{color:#bbb;background:#f7f7f7;cursor:default;}