/* الإعدادات الأساسية */
* { margin: 0; padding: 0; box-sizing: border-box; }
body { 
    font-family: 'Cairo', sans-serif; 
    background-color: #020617; 
    scroll-behavior: smooth; 
    overflow-x: hidden; 
    color: white;
}

/* خلفية الماتريكس */
#code-canvas { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 0; opacity: 0.15; pointer-events: none; }

/* الهيدر والنو بار */
.navbar { background: rgba(2, 6, 23, 0.9); backdrop-filter: blur(15px); border-bottom: 1px solid rgba(255,255,255,0.05); }

/* --- حل مشكلة صورة الكلية واللوحة --- */
.college-hero-box { 
    width: 100%; 
    height: 350px; 
    border-radius: 30px; 
    overflow: hidden; 
    position: relative; 
    border: 1px solid rgba(255,255,255,0.1);
}
@media (min-width: 768px) { .college-hero-box { height: 500px; } }

.college-hero-img { 
    width: 100%; 
    height: 100%; 
    object-fit: cover; 
    /* هذا السطر يضمن ظهور اللوحة الصفراء في الصورة */
    object-position: center 70%; 
}

.hero-overlay-gradient { 
    position: absolute; bottom: 0; width: 100%; padding: 40px 20px; 
    background: linear-gradient(to top, #020617, transparent); 
    text-align: center; 
}

/* --- تنسيق صور القيادة (دائرية) --- */
.avatar-ring { 
    width: 160px; height: 160px; border-radius: 50%; 
    border: 4px solid; padding: 5px; margin: 0 auto; 
    overflow: hidden; background: #0f172a; transition: 0.4s;
}
@media (min-width: 768px) { .avatar-ring { width: 200px; height: 200px; } }

.avatar-img { 
    width: 100%; height: 100%; border-radius: 50%; 
    object-fit: cover; object-position: center top; 
}

/* الكروت والشبكة */
.course-card { 
    background: rgba(30, 41, 59, 0.5); border-radius: 20px; 
    border: 1px solid rgba(255, 255, 255, 0.05); padding: 15px; transition: 0.3s;
}
.course-card:hover { transform: translateY(-5px); border-color: #3b82f6; }
.course-img { width: 100%; height: 120px; object-fit: cover; border-radius: 15px; }

/* العناوين */
.section-title { 
    border-right: 5px solid #3b82f6; padding-right: 15px; 
    margin-bottom: 30px; font-weight: 900; color: #3b82f6; 
}

/* الموبايل */
.mobile-bottom-nav { 
    position: fixed; bottom: 0; left: 0; width: 100%; height: 70px; 
    background: rgba(15, 23, 42, 0.95); display: flex; 
    justify-content: space-around; align-items: center; z-index: 100;
}
.nav-item { color: #94a3b8; text-decoration: none; font-size: 0.7rem; text-align: center; }

.wa-btn { 
    background: #25D366; color: white; padding: 10px 25px; 
    border-radius: 50px; font-weight: bold; text-decoration: none; display: inline-block;
}