
/* ============================================================
   Phase 3 — Premium admissions/banner/gallery/announcement/staff
   ============================================================ */

/* Premium form */
.admissions-hero { background: linear-gradient(135deg, var(--brand-primary), var(--brand-secondary)); border-radius: 0 0 30px 30px; }
.admissions-hero .hero-icon-wrap { width: 80px; height: 80px; margin: 0 auto 12px; border-radius: 50%; background: rgba(255,255,255,.15); display:flex; align-items:center; justify-content:center; font-size: 42px; color: var(--brand-gold); backdrop-filter: blur(4px); }
.premium-form .form-section { border-left: 4px solid var(--brand-primary); position: relative; transition: transform .2s ease, box-shadow .2s ease; }
.premium-form .form-section:hover { transform: translateY(-2px); box-shadow: 0 12px 24px rgba(11,50,217,.10); }
.premium-form .section-head { display: flex; gap: 14px; align-items: center; margin-bottom: 8px; }
.premium-form .section-icon { width: 52px; height: 52px; border-radius: 14px; color: #fff; display:flex; align-items:center; justify-content:center; font-size: 26px; box-shadow: 0 8px 16px rgba(0,0,0,.12); }
.bg-gradient-primary { background: linear-gradient(135deg,#0B32D9,#1F4FFF); }
.bg-gradient-gold { background: linear-gradient(135deg,#F5C21A,#f39c12); }
.bg-gradient-red { background: linear-gradient(135deg,#e74c3c,#c0392b); }
.bg-gradient-blue { background: linear-gradient(135deg,#3498db,#2980b9); }
.premium-form .form-label i { color: var(--brand-primary); margin-right: 4px; }
.premium-form .form-control-lg, .premium-form .form-select-lg { border-radius: 12px; border: 1.5px solid #e3e6ef; }
.premium-form .form-control-lg:focus, .premium-form .form-select-lg:focus { border-color: var(--brand-primary); box-shadow: 0 0 0 .25rem rgba(11,50,217,.15); }
.upload-drop { border: 2px dashed #cfd6e8; border-radius: 12px; padding: 8px; background: #f8faff; transition: all .2s; }
.upload-drop:hover { border-color: var(--brand-primary); background: #eef3ff; }
.upload-drop.has-file { border-color: #16a34a; background: #ecfdf5; }

.form-steps { display:flex; align-items:center; justify-content:space-between; padding: 0 8px; }
.form-steps .step { display:flex; flex-direction:column; align-items:center; gap:4px; color:#8a94a6; }
.form-steps .step span { width:36px; height:36px; border-radius:50%; background:#e6eaf5; color:#8a94a6; display:flex; align-items:center; justify-content:center; font-weight:700; }
.form-steps .step.active span { background: var(--brand-primary); color:#fff; box-shadow:0 6px 12px rgba(11,50,217,.35); }
.form-steps .step-line { flex:1; height:2px; background:#e6eaf5; margin: 0 6px; margin-bottom:20px; }

.timeline-list { list-style:none; padding-left:0; margin:0; }
.timeline-list li { position:relative; padding: 6px 0 6px 22px; border-left:2px solid #e6eaf5; margin-left:8px; }
.timeline-list li .tl-dot { position:absolute; left:-7px; top:12px; width:12px; height:12px; border-radius:50%; background:var(--brand-gold); box-shadow:0 0 0 3px rgba(245,194,26,.25); }

/* Banners / carousel */
.home-carousel { margin-bottom: 20px; }
.banner-slide { position: relative; min-height: 460px; background-size: cover; background-position: center; }
.banner-overlay { position:absolute; inset:0; background: linear-gradient(90deg, rgba(11,50,217,.75), rgba(11,50,217,.15)); }
.banner-caption { position: relative; z-index: 2; padding: 90px 20px; }
.carousel-indicators [data-bs-target] { width: 10px; height: 10px; border-radius: 50%; }

/* Announcement marquee */
.announce-marquee { display:flex; align-items:center; background: linear-gradient(90deg, var(--brand-gold), #ffdc6b); color:#3b2a00; overflow:hidden; }
.announce-marquee .am-label { padding: 8px 14px; background: rgba(0,0,0,.15); font-weight: 700; white-space: nowrap; }
.announce-marquee .am-track { display: inline-flex; gap: 30px; padding: 8px 20px; white-space: nowrap; animation: marquee 40s linear infinite; }
.announce-marquee .am-item { font-weight: 600; }
@keyframes marquee { from { transform: translateX(0);} to { transform: translateX(-50%);} }

/* Announcement modal + countdown */
.announce-modal { border-radius: 20px; overflow: hidden; box-shadow: 0 30px 60px rgba(0,0,0,.25); }
.countdown-box { display:flex; gap: 10px; justify-content:center; margin-top: 6px; }
.countdown-box .cd-cell { background: linear-gradient(135deg, var(--brand-primary), var(--brand-secondary)); color:#fff; padding: 12px 14px; border-radius: 12px; min-width: 70px; text-align:center; box-shadow:0 8px 16px rgba(11,50,217,.25); }
.countdown-box .cd-cell span { font-size: 24px; font-weight: 800; display:block; line-height: 1; }
.countdown-box .cd-cell small { opacity:.8; font-size: 11px; text-transform: uppercase; letter-spacing:.5px; }

/* Gallery */
.gallery-thumb { display:block; position:relative; border-radius: 12px; overflow: hidden; aspect-ratio: 1/1; background:#f1f3f9; }
.gallery-thumb img { width:100%; height:100%; object-fit:cover; transition: transform .4s ease; }
.gallery-thumb:hover img { transform: scale(1.08); }
.gallery-thumb .gallery-cap { position:absolute; left:0; right:0; bottom:0; padding: 6px 8px; font-size: 12px; color:#fff; background: linear-gradient(transparent, rgba(0,0,0,.6)); opacity:0; transition: opacity .2s; }
.gallery-thumb:hover .gallery-cap { opacity: 1; }
.gallery-thumb-lg { aspect-ratio: 4/3; }

/* Staff */
.staff-card { background:#fff; border-radius: 16px; overflow: hidden; box-shadow: 0 8px 20px rgba(0,0,0,.06); cursor: pointer; }
.staff-photo { aspect-ratio: 1/1; background:#eef2fb; }
.staff-photo img { width:100%; height:100%; object-fit: cover; }
.staff-photo-placeholder { width:100%; height:100%; display:flex; align-items:center; justify-content:center; font-size: 90px; color:var(--brand-primary); }
.staff-body { padding: 10px; }

/* Mobile attendance */
.mobile-attend .attend-row { border-left: 4px solid var(--brand-primary); }
.mobile-attend .attend-avatar { width:44px; height:44px; border-radius:50%; background:#eef2fb; color:var(--brand-primary); display:flex; align-items:center; justify-content:center; font-size:26px; }
.btn-icon-lg { width: 56px; height: 56px; display:flex; align-items:center; justify-content:center; font-size: 24px; padding: 0; border-radius: 14px; }
@media (max-width: 576px) {
    .banner-slide { min-height: 320px; }
    .banner-caption { padding: 50px 12px; }
    .countdown-box .cd-cell { min-width: 60px; padding: 10px 8px; }
    .countdown-box .cd-cell span { font-size: 18px; }
}
