/* Prevents the page from ever becoming horizontally scrollable on mobile.
   Without this, if any single element (a badge, a wide table, an image)
   is even a few px wider than the viewport, the whole page gains horizontal
   scroll and can render pre-scrolled - which clips the left edge of every
   line of text uniformly, exactly like a page that's been nudged sideways. */
html{ overflow-x:hidden; }
body{ overflow-x:hidden; max-width:100%; font-family:'Inter',sans-serif; color:#334155; }
h1,h2,h3,h4,h5,.font-heading{ font-family:'Poppins',sans-serif; }

a{ text-decoration:none; }

/* ===== Buttons ===== */
.btn-brand-primary{ background:var(--brand-primary); color:#fff; border:none; font-weight:600; padding:10px 22px; border-radius:8px; transition:.2s; }
.btn-brand-primary:hover{ background:var(--brand-secondary); color:#fff; transform:translateY(-2px); }
.btn-brand-accent{ background:var(--brand-accent); color:#1a1a1a; border:none; font-weight:600; border-radius:8px; }
.btn-brand-accent:hover{ opacity:.9; color:#1a1a1a; }
.btn-outline-brand{ border:2px solid var(--brand-primary); color:var(--brand-primary); font-weight:600; border-radius:8px; background:transparent; }
.btn-outline-brand:hover{ background:var(--brand-primary); color:#fff; }

/* ===== Topbar & Nav ===== */
.topbar{ background:var(--brand-dark); color:#dbe4f0; }
.topbar a{ color:#dbe4f0; }
.main-nav{ background:#fff; box-shadow:0 2px 15px rgba(0,0,0,.06); padding:10px 0; transition:box-shadow .2s; }

.nav-top-row{ display:flex; align-items:center; justify-content:space-between; gap:10px; width:100%; min-width:0; }
@media (min-width: 992px){
  .nav-top-row{ width:auto; flex:0 0 auto; }
}

.main-nav .navbar-brand{
  font-weight:800; font-size:18px; color:var(--brand-dark); font-family:'Poppins',sans-serif;
  display:flex; align-items:center; gap:10px; min-width:0; flex:1 1 auto; margin-right:0;
}
.main-nav .brand-name{
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap; min-width:0; flex:1 1 auto; line-height:1.15;
}
.main-nav .navbar-toggler{ border:none; box-shadow:none !important; flex-shrink:0; padding:6px 9px; }
.main-nav .nav-link{ font-weight:600; color:#374151; margin:0 4px; border-radius:8px; padding:8px 14px !important; transition:.15s; white-space:nowrap; }
.main-nav .nav-link:hover{ color:var(--brand-primary); background:var(--brand-light); }

/* At desktop widths the collapsed nav becomes a single flex row with no
   wrap by default (Bootstrap navbar-expand-lg), which is what overflows
   on common laptop widths once logo + 8 links + 2 buttons are all present.
   Tighten spacing progressively as room gets tight, and allow a graceful
   wrap onto a second line as a safety net rather than clipping. */
@media (min-width: 992px){
  #mainNav.navbar-collapse{ flex-wrap:wrap; justify-content:flex-end; row-gap:8px; }
  .main-nav .navbar-nav{ flex-wrap:wrap; row-gap:6px; }
  .main-nav .nav-link{ padding:8px 10px !important; margin:0 1px; font-size:14.5px; }
  .main-nav .nav-item.ms-lg-2{ margin-left:8px !important; }
}
@media (min-width: 992px) and (max-width: 1199.98px){
  .main-nav .nav-link{ padding:7px 8px !important; font-size:13.5px; }
  .main-nav .nav-link i{ display:none; } /* icon on Portal Login - text alone is enough at this width */
  .main-nav .btn-outline-brand, .main-nav .btn-brand-primary{ padding:8px 14px; font-size:14px; }
}

@media (max-width: 991.98px){
  .main-nav .navbar-collapse{ background:#fff; border-radius:14px; box-shadow:0 8px 30px rgba(20,30,60,.12); padding:14px; margin-top:12px; }
  .main-nav .nav-link{ padding:12px 14px !important; }
  .main-nav .btn-brand-primary{ display:block; text-align:center; margin-top:8px; }
}
/* Hard-clipping logo box: no matter what size image is uploaded or how
   the surrounding CSS loads, the browser physically cannot render the
   logo larger than this fixed box because overflow is hidden. */
.brand-logo-box{
  display:inline-flex; align-items:center; justify-content:center; overflow:hidden; flex-shrink:0;
  width:150px; height:44px;
}
.brand-logo-box-footer{ width:150px; height:40px; }
.brand-logo-box-sidebar{ width:150px; height:34px; background:#fff; border-radius:6px; padding:3px; box-sizing:border-box; }
.brand-logo-box-login{ width:220px; height:56px; margin:0 auto 14px; }

@media (max-width: 420px){
  .main-nav .navbar-brand{ font-size:15px; }
  .brand-logo-box{ width:38px; height:34px; }
}

/* ===== Hero ===== */
.hero{
  background:linear-gradient(120deg, rgba(13,27,42,.88), rgba(11,94,215,.75)), var(--hero-img, none);
  background-size:cover; background-position:center;
  color:#fff; padding:110px 0 90px;
  position:relative;
}
.hero h1{ font-size:clamp(32px, 5vw, 54px); font-weight:800; line-height:1.15; overflow-wrap:break-word; }
.hero p.lead{ font-size:19px; opacity:.92; max-width:600px; overflow-wrap:break-word; }
.hero .badge-pill{ background:rgba(255,255,255,.15); padding:8px 18px; border-radius:30px; font-weight:600; font-size:13px; display:inline-block; margin-bottom:18px; }

/* Pulsing "live" badge - e.g. "Admissions Open" in the hero */
.badge-pill.pulse-live{ display:inline-flex; align-items:center; gap:8px; }
.pulse-dot{ position:relative; width:9px; height:9px; border-radius:50%; background:#22c55e; flex-shrink:0; }
.pulse-dot::after{
  content:''; position:absolute; inset:-6px; border-radius:50%; background:#22c55e; opacity:.6;
  animation:pulse-ring 1.8s cubic-bezier(0.4,0,0.6,1) infinite;
}
@keyframes pulse-ring{
  0%{ transform:scale(0.6); opacity:.65; }
  70%{ transform:scale(1.8); opacity:0; }
  100%{ transform:scale(1.8); opacity:0; }
}

.stats-strip{ background:var(--brand-secondary); color:#fff; padding:28px 0; }
.stats-strip .stat-num{ font-size:32px; font-weight:800; }
.stats-strip .stat-label{ font-size:13px; opacity:.85; }

/* ===== Sections ===== */
.section{ padding:80px 0; }
.section-light{ background:var(--brand-light); }
.section-tag{ color:var(--brand-primary); font-weight:700; text-transform:uppercase; letter-spacing:1px; font-size:13px; }
.section-title{ font-weight:800; font-size:clamp(26px,4vw,38px); color:var(--brand-dark); margin-bottom:16px; }

/* ===== Team ===== */
.team-card{ background:#fff; border-radius:16px; overflow:hidden; box-shadow:0 4px 20px rgba(20,30,60,.06); transition:.25s; height:100%; text-align:center; border:1px solid #eef1f6; }
.team-card:hover{ transform:translateY(-6px); box-shadow:0 12px 30px rgba(20,30,60,.12); }
.team-card .photo{ width:100%; aspect-ratio:1/1; object-fit:cover; display:block; background:var(--brand-light); }
.team-card .body{ padding:22px 18px; }
.team-card .name{ font-weight:800; color:var(--brand-dark); margin-bottom:2px; }
.team-card .role{ color:var(--brand-primary); font-weight:600; font-size:13px; text-transform:uppercase; letter-spacing:.5px; margin-bottom:12px; }
.team-card .say{ color:#64748b; font-size:14px; font-style:italic; position:relative; padding-top:8px; }
.team-card .say::before{ content:'\201C'; font-size:34px; font-family:Georgia,serif; color:var(--brand-accent); display:block; line-height:.5; margin-bottom:4px; font-style:normal; }

/* ===== Cards ===== */
.program-card{ background:#fff; border-radius:16px; overflow:hidden; box-shadow:0 4px 20px rgba(20,30,60,.06); transition:.25s; height:100%; border:1px solid #eef1f6; }
.program-card:hover{ transform:translateY(-6px); box-shadow:0 12px 30px rgba(20,30,60,.12); }
.program-card img{ height:190px; width:100%; object-fit:cover; }
.program-card .body{ padding:22px; }
.program-card .badge-cat{ background:var(--brand-light); color:var(--brand-primary); font-weight:600; }

.feature-card{ background:#fff; border-radius:14px; padding:28px; text-align:center; box-shadow:0 4px 20px rgba(20,30,60,.05); height:100%; }
.feature-card .icon{ width:64px; height:64px; border-radius:16px; background:var(--brand-primary); color:#fff; display:flex; align-items:center; justify-content:center; font-size:26px; margin:0 auto 18px; }

.testimonial-card{ background:#fff; border-radius:16px; padding:26px; box-shadow:0 4px 20px rgba(20,30,60,.06); height:100%; }
.testimonial-card .stars{ color:var(--brand-accent); }
.testimonial-card img{ width:52px; height:52px; border-radius:50%; object-fit:cover; }

.gallery-item{ border-radius:14px; overflow:hidden; position:relative; }
.gallery-item img{ width:100%; height:220px; object-fit:cover; transition:.3s; }
.gallery-item:hover img{ transform:scale(1.08); }

.news-card{ background:#fff; border-radius:14px; overflow:hidden; box-shadow:0 4px 20px rgba(20,30,60,.06); height:100%; }
.news-card img{ height:180px; width:100%; object-fit:cover; }
.news-card .body{ padding:20px; }

/* ===== CTA ===== */
.cta-section{ background:linear-gradient(120deg, var(--brand-secondary), var(--brand-primary)); color:#fff; border-radius:24px; padding:60px; }

/* ===== FAQ ===== */
.accordion-button:not(.collapsed){ background:var(--brand-light); color:var(--brand-primary); }
.accordion-button:focus{ box-shadow:none; }

/* ===== Footer ===== */
.site-footer{ background:var(--brand-dark); }
.footer-links li{ margin-bottom:10px; }
.footer-links a{ color:#c7d0dd; }
.footer-links a:hover{ color:#fff; }
.footer-bottom{ background:rgba(0,0,0,.2); }
.footer-bottom a{ color:#c7d0dd; }
.social-btn{ width:38px; height:38px; border-radius:50%; background:rgba(255,255,255,.1); color:#fff; display:flex; align-items:center; justify-content:center; }
.social-btn:hover{ background:var(--brand-primary); color:#fff; }

/* ===== WhatsApp float ===== */
.whatsapp-float{
  position:fixed; bottom:24px; right:24px; background:#25d366; color:#fff; width:58px; height:58px;
  border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:28px;
  box-shadow:0 6px 20px rgba(0,0,0,.25); z-index:999;
}

/* ===== Partner Universities (pulsing logos) ===== */
.partner-item{
  display:flex; align-items:center; justify-content:center; height:120px; position:relative;
}
.partner-logo-ring{
  position:relative; width:88px; height:88px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  background:#fff; box-shadow:0 4px 16px rgba(20,30,60,.08);
}
.partner-logo-ring::before{
  content:''; position:absolute; inset:-6px; border-radius:50%; border:2px solid var(--brand-primary);
  opacity:.55; animation:partnerPulse 2.6s ease-out infinite;
}
.partner-logo-ring img{ width:60%; height:60%; object-fit:contain; }
@keyframes partnerPulse{
  0%{ transform:scale(.85); opacity:.55; }
  70%{ transform:scale(1.35); opacity:0; }
  100%{ opacity:0; }
}
.partner-name{ text-align:center; font-size:12.5px; font-weight:600; color:#6b7280; margin-top:10px; }
@media (prefers-reduced-motion: reduce){
  .partner-logo-ring::before{ animation:none; }
}
.booking-hero{ background:linear-gradient(120deg, var(--brand-dark), var(--brand-secondary)); color:#fff; padding:70px 0; }
.booking-hero .badge-pill{ margin-bottom:14px; }
.booking-form-card{ background:#fff; border-radius:18px; box-shadow:0 10px 40px rgba(20,30,60,.1); padding:36px; margin-top:-60px; position:relative; z-index:2; }

/* ===== Apply page step wizard ===== */
.apply-steps{ display:flex; justify-content:space-between; gap:8px; }
.apply-step{ flex:1; text-align:center; position:relative; opacity:.5; transition:opacity .2s; }
.apply-step.active, .apply-step.done{ opacity:1; }
.apply-step .num{
  display:flex; align-items:center; justify-content:center; width:34px; height:34px; border-radius:50%;
  background:var(--brand-light); color:var(--brand-dark); font-weight:800; font-size:14px; margin:0 auto 6px;
  border:2px solid transparent; transition:.2s;
}
.apply-step.active .num{ background:var(--brand-primary); color:#fff; }
.apply-step.done .num{ background:#22c55e; color:#fff; }
.apply-step .label{ display:block; font-size:12px; font-weight:600; color:#8a94a6; }
.apply-step.active .label{ color:var(--brand-dark); }
.apply-review-box{ background:var(--brand-light); border-radius:12px; padding:18px 20px; }

@media (max-width: 480px){
  .apply-step .label{ display:none; }
}

@media (max-width: 768px){
  .cta-section{ padding:40px 24px; border-radius:16px; }
  .booking-form-card{ margin-top:-30px; padding:24px; }
  .hero{ padding:70px 0 100px; text-align:center; }
  .hero .lead{ max-width:100%; margin-left:auto; margin-right:auto; }
  .hero .d-flex.flex-wrap{ justify-content:center; }
  .section{ padding:56px 0; }
  body{ padding-bottom:66px; } /* room for sticky mobile CTA bar */
}

/* ===== Reveal-on-scroll animation ===== */
.reveal{ opacity:0; transform:translateY(24px); transition:opacity .6s ease, transform .6s ease; }
.reveal.is-visible{ opacity:1; transform:translateY(0); }

/* ===== Trust badges strip ===== */
.trust-strip{ background:#fff; border-top:1px solid #eef1f6; border-bottom:1px solid #eef1f6; }
.trust-badge{ display:flex; align-items:center; gap:12px; padding:18px 10px; }
.trust-badge .icon{ width:44px; height:44px; border-radius:12px; background:var(--brand-light); color:var(--brand-primary); display:flex; align-items:center; justify-content:center; font-size:20px; flex-shrink:0; }
.trust-badge .label{ font-weight:700; font-size:14px; color:var(--brand-dark); line-height:1.2; }
.trust-badge .sub{ font-size:12px; color:#8a94a6; }

/* ===== Admission process timeline ===== */
.step-card{ background:#fff; border-radius:16px; padding:28px 22px; box-shadow:0 4px 20px rgba(20,30,60,.06); height:100%; position:relative; border:1px solid #eef1f6; }
.step-card .step-num{
  width:42px; height:42px; border-radius:50%; background:var(--brand-primary); color:#fff; font-weight:800;
  display:flex; align-items:center; justify-content:center; margin-bottom:16px; font-size:16px;
}
.step-connector{ display:none; }
@media (min-width: 992px){
  .step-connector{ display:block; position:absolute; top:42px; left:100%; width:100%; height:2px; background:repeating-linear-gradient(90deg, var(--brand-primary) 0 8px, transparent 8px 16px); z-index:0; }
  .step-card{ z-index:1; }
}

/* ===== Gallery lightbox ===== */
.gallery-item{ cursor:zoom-in; }
.lightbox-overlay{
  position:fixed; inset:0; background:rgba(10,15,25,.92); z-index:2000; display:none;
  align-items:center; justify-content:center; padding:24px;
}
.lightbox-overlay.open{ display:flex; }
.lightbox-overlay img{ max-width:100%; max-height:88vh; border-radius:10px; box-shadow:0 20px 60px rgba(0,0,0,.5); }
.lightbox-close{
  position:absolute; top:20px; right:24px; color:#fff; font-size:32px; background:none; border:none; cursor:pointer; line-height:1;
}

/* ===== Back to top ===== */
.back-to-top{
  position:fixed; bottom:24px; right:96px; width:46px; height:46px; border-radius:50%;
  background:var(--brand-dark); color:#fff; display:none; align-items:center; justify-content:center;
  font-size:18px; box-shadow:0 6px 20px rgba(0,0,0,.25); z-index:998; border:none;
}
.back-to-top.show{ display:flex; }
@media (max-width: 576px){
  .back-to-top{ right:16px; bottom:80px; }
  .whatsapp-float{ right:16px; bottom:80px; }
  .back-to-top{ right:auto; left:16px; }
}

/* ===== Sticky mobile CTA bar ===== */
.mobile-cta-bar{
  display:none; position:fixed; bottom:0; left:0; right:0; z-index:997;
  background:#fff; box-shadow:0 -4px 20px rgba(0,0,0,.1); padding:10px 14px;
}
.mobile-cta-bar .row{ --bs-gutter-x: 0.5rem; }
@media (max-width: 768px){
  .mobile-cta-bar{ display:block; }
}