/* Google Fonts Import - Unique Professional Fonts */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800&family=Inter:wght@300;400;500;600;700&display=swap');

:root{
  --primary:#4169E1; /* Royal Blue */
  --programs-accent: #8A2BE2;
  --programs-gradient: linear-gradient(135deg, #6f42c1 0%, #9b6bff 100%);
  --primary-dark:#0B3D91; /* Navy Blue */
  --primary-light:#63A4FF; /* Sky Blue */
  --secondary:#FF7A00; /* Orange for asterisks / accents */
  --secondary-light:#FF9C4A;
  --accent:#FF7A00; /* Orange highlight */
  --accent-light:#FFBF64;
  --success:#27AE60;
  --info:#2B82C8;
  --light:#FFFFFF;
  --lighter:#F7FAFC;
  --text:#0F1724; /* crisper, darker body text */
  --text-light:#475569;
  --text-muted:#6B7280;
  --bg:#FFFFFF;
  --border:#E6EEF2;
  --border-light:#F3F7F9;
  --shadow:0 6px 18px rgba(2,6,23,0.04);
  --shadow-md:0 10px 24px rgba(2,6,23,0.06);
  --shadow-lg:0 16px 36px rgba(2,6,23,0.08);
  --shadow-xl:0 24px 48px rgba(2,6,23,0.10);
  --radius:12px;
  --radius-lg:16px;
  --transition:all 0.28s cubic-bezier(0.2, 0, 0.2, 1);
  --font-heading: 'Poppins', sans-serif;
  --font-body: 'Inter', sans-serif;
  /* New color variables for enhanced design */
  --teal:#06B6D4;
  --teal-light:#22D3EE;
  --purple:#8B5CF6;
  --purple-light:#A78BFA;
  --pink:#EC4899;
  --pink-light:#F472B6;
  --emerald:#10B981;
  --emerald-light:#6EE7B7;
  --amber:#F59E0B;
  --amber-light:#FBBF24;
  --red:#EF4444;
  --red-light:#F87171;
}

*{box-sizing:border-box}
body{
  font-family: var(--font-body);
  color:var(--text);
  margin:0;
  background:#FFFFFF;
  line-height:1.6;
  letter-spacing:0.3px;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
}

body > main {
  background:linear-gradient(to bottom, #FFFFFF 0%, #F8F9FE 25%, #F0F4FF 50%, #FBF7FE 75%, #FFFFFF 100%);
}

/* Typography - Headings */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-heading);
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -0.5px;
  margin: 1.5rem 0 0.75rem 0;
}

h1 {
  font-size: clamp(2rem, 5vw, 3.5rem);
  font-weight: 800;
  letter-spacing: -1px;
}

h2 {
  font-size: clamp(1.5rem, 4vw, 2.5rem);
  font-weight: 700;
}

h3 {
  font-size: clamp(1.2rem, 3vw, 1.8rem);
  font-weight: 600;
}

h4 {
  font-size: 1.25rem;
  font-weight: 600;
}

h5 {
  font-size: 1.1rem;
  font-weight: 600;
}

h6 {
  font-size: 1rem;
  font-weight: 600;
}

.container{max-width:1200px;margin:0 auto;padding:0 clamp(0.75rem, 2vw, 1.5rem)}

/* Header & Navigation */
.site-header{
  background:linear-gradient(135deg, var(--primary) 0%, var(--primary-dark) 100%);
  color:#fff;
  padding:0.9rem 0;
  box-shadow:0 4px 20px rgba(11, 61, 145, 0.25);
  position:sticky;
  top:0;
  z-index:100;
  backdrop-filter:blur(20px);
  background-attachment:fixed;
}

.header-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  max-width:1200px;
  margin:0 auto;
  padding:0 1.5rem;
}

.header-logo{
  display:flex;
  align-items:center;
  gap:1rem;
}

.logo-img{
  width:clamp(56px, 8vw, 96px);
  height:auto;
  max-height:96px;
  background:transparent; /* show original logo transparency */
  border-radius:6px;
  padding:0; /* remove heavy padding so the logo reads clearly */
  display:block;
  object-fit:contain;
  box-shadow:0 6px 18px rgba(0,0,0,0.08);
  flex-shrink:0;
}

/* Make the brand text more prominent and aligned with the logo */
.header-logo .brand{
  display:inline-flex;
  align-items:center;
  gap:0.5rem;
  font-weight:800;
  font-size:1.3rem;
  color:#fff;
  text-shadow:0 1px 0 rgba(0,0,0,0.12);
}

/* Mobile-specific logo scaling and spacing tweaks */
@media (max-width:600px){
  .site-header{ padding:0.75rem 0; }
  .header-inner{ padding:0 1rem; }
  .header-logo{ gap:0.5rem; }
  .logo-img{ width:64px; max-height:64px; }
  .header-logo .brand{ font-size:1rem; font-weight:800; }
  .nav-toggle{ padding:0.45rem 0.6rem; }
}

@media (max-width:420px){
  .logo-img{ width:56px; max-height:56px; }
  .header-logo .brand{ font-size:0.95rem; }
  /* keep brand visible but prevent wrapping / overflow */
  .brand{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:120px; display:inline-block; vertical-align:middle; }
}

.brand{
  font-weight:700;
  color:#fff;
  text-decoration:none;
  font-size:1.25rem;
  letter-spacing:0.5px;
}

.nav ul{
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  gap:2.5rem;
}

.nav a{
  text-decoration:none;
  color:#fff;
  font-weight:500;
  transition:var(--transition);
  padding:0.5rem 0;
  border-bottom:3px solid transparent;
  font-size:0.95rem;
  display:block;
  position:relative;
}

.nav a::after{
  content:'';
  position:absolute;
  bottom:-3px;
  left:0;
  width:0;
  height:3px;
  background:linear-gradient(90deg, var(--accent), var(--secondary-light));
  transition:width 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.nav a:hover{
  color:var(--accent);
}

.nav a:hover::after{
  width:100%;
}

/* Small caret indicator for menu items that open a dropdown */
.nav a .caret{
  margin-left:0.35rem;
  font-size:0.85rem;
  opacity:0.95;
  display:inline-block;
  transform-origin:center;
  transition:transform 0.18s ease, opacity 0.18s ease;
  color:rgba(255,255,255,0.95);
}

/* Rotate caret when the parent li is active/open */
.nav li.active > a .caret{
  transform:rotate(180deg);
}

/* Hide underlines and carets on mobile */
@media (max-width:1000px){
  .nav a::after{
    display:none !important;
  }
  .nav a .caret{
    display:none !important;
  }
}

/* Slight color change for caret on hover */
.nav a:hover .caret{ color:var(--accent); }

/* Dropdown menu — click only (explicitly disable hover to avoid accidental open) */
.nav li{
  position:relative;
}

.nav-dropdown{
  /* hidden by default, only shown when parent has .active */
  display:none !important;
  visibility:hidden;
  opacity:0;
  position:absolute;
  top:calc(100% + 0.5rem);
  left:0;
  background:linear-gradient(135deg, var(--primary-dark) 0%, #0B2F7F 100%);
  min-width:220px;
  list-style:none;
  margin:0;
  padding:0.75rem 0;
  border-radius:10px;
  box-shadow:0 12px 32px rgba(11, 61, 145, 0.35), 0 0 1px rgba(0,0,0,0.1);
  z-index:1000;
  border:1px solid rgba(255,255,255,0.1);
  transition:var(--transition);
}

/* Ensure hover never opens the dropdown (defensive, important to override any legacy rules) */
.nav li:hover > .nav-dropdown{ display: none !important; }

/* Allow hover to open dropdowns on devices that support hover (desktop) */
@media (hover: hover) and (min-width:700px){
  .nav li:hover > .nav-dropdown{ display:block !important; visibility:visible !important; opacity:1 !important; }
}

.nav li.active > .nav-dropdown{
  display:block !important;
  visibility:visible !important;
  opacity:1 !important;
}

.nav-dropdown li{
  margin:0;
  position:static;
}

.nav-dropdown a{
  display:block;
  padding:0.85rem 1.4rem;
  border:none;
  color:#fff;
  border-bottom:none;
  font-size:0.9rem;
  position:relative;
  transition:all 0.25s ease;
}

.nav-dropdown a::before{
  content:'';
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:4px;
  background:var(--accent);
  transform:scaleY(0);
  transform-origin:center;
  transition:transform 0.25s ease;
}

.nav-dropdown a:hover{
  background:rgba(255,255,255,0.1);
  color:var(--accent);
  border-bottom:none;
  padding-left:1.6rem;
}

.nav-dropdown a:hover::before{
  transform:scaleY(1);
}

.nav-toggle{
  display:none;
  background:linear-gradient(135deg, rgba(255,255,255,0.1), rgba(255,255,255,0.05));
  border:2px solid rgba(255,255,255,0.4);
  color:#fff;
  padding:0.6rem 0.9rem;
  cursor:pointer;
  border-radius:8px;
  font-weight:700;
  font-size:0.9rem;
  transition:all 0.28s ease;
  letter-spacing:0.5px;
}

.nav-toggle:hover{
  background:rgba(255,255,255,0.15);
  border-color:#fff;
  box-shadow:0 4px 12px rgba(255,122,0,0.25);
}

.nav-toggle:active{
  transform:scale(0.98);
}

/* Hero Section */
.hero{
  background:linear-gradient(135deg, var(--primary) 0%, var(--primary-dark) 50%, #004a20 100%);
  color:#fff;
  padding:clamp(2rem, 6vw, 5rem) 0;
  text-align:center;
  position:relative;
  overflow:hidden;
}

/* Page-hero utility to ensure consistent full-bleed background behavior (used on faculty/programs/admissions/contact) */
.page-hero{
  width:100%;
  background-position:center;
  background-size:cover;
  padding:3.5rem 0;
  color:#fff;
}

/* Per-page hero backgrounds (keeps overlay consistent) */
.page-hero--faculty{background-image: linear-gradient(180deg, rgba(7,18,29,0.45) 0%, rgba(7,18,29,0.15) 100%), url('../images/hospital.png');}
.page-hero--contact{background-image: linear-gradient(180deg, rgba(7,18,29,0.45) 0%, rgba(7,18,29,0.15) 100%), url('../images/contact-us.png');}

.hero::before{
  content:'';
  position:absolute;
  top:0;
  left:0;
  right:0;
  bottom:0;
  background:radial-gradient(circle at 20% 80%, rgba(255,255,255,0.1) 0%, transparent 50%);
  pointer-events:none;
}

.hero h1{
  margin:0 0 1.25rem;
  font-size:clamp(1.6rem, 4.5vw, 3rem);
  font-weight:700;
  letter-spacing:-0.8px;
  position:relative;
  z-index:1;
}

/* CONTACT LAYOUT */
.contact-grid{
  display:grid;
  grid-template-columns:1fr 420px;
  gap:2rem;
  align-items:start;
}

.contact-card{
  padding:1.5rem;
  background:var(--lighter);
  border-radius:10px;
  box-shadow:var(--shadow);
}

.contact-card h3{margin-top:0;color:var(--primary)}

.map-wrap{margin-top:1rem;border-radius:8px;overflow:hidden;border:1px solid var(--border-light)}
.map-wrap iframe{width:100%;height:220px;border:0;display:block}

.contact-form{
  padding:1.5rem;
  border-radius:10px;
  background:var(--light);
  box-shadow:var(--shadow);
}

.contact-form label{display:block;margin-bottom:0.375rem;font-weight:600;color:var(--primary)}
.contact-form input,
.contact-form select,
.contact-form textarea{width:100%;padding:0.85rem;border-radius:8px;border:2px solid var(--border);margin-bottom:1rem;background:#fff;transition:var(--transition);font-family:var(--font-body)}
.contact-form input:focus,
.contact-form select:focus,
.contact-form textarea:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px rgba(65, 105, 225, 0.1);background:linear-gradient(to right, #FFFFFF 0%, #F0F4FF 100%)}
.contact-form .form-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.contact-form .form-footer{text-align:right;margin-top:0.5rem}

@media(max-width:900px){
  .contact-grid{grid-template-columns:1fr}
  .map-wrap iframe{height:180px}
  .contact-form .form-row{grid-template-columns:1fr}
}

/* Dynamic gradient title for visual interest */
.dynamic-gradient-text{
  background:linear-gradient(90deg,#FF7A18 0%, #AF4261 30%, #7B5CFF 60%, #00C2A8 100%);
  background-size:300% 100%;
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  display:inline-block;
  animation:gradientShift 8s linear infinite;
  -webkit-font-smoothing:antialiased;
}

@keyframes gradientShift{
  0%{background-position:0% 50%}
  50%{background-position:100% 50%}
  100%{background-position:0% 50%}
}

@media (prefers-reduced-motion:reduce){
  .dynamic-gradient-text{animation:none;color:var(--light);-webkit-text-fill-color:var(--light)}
}

/* Video advert section */
.video-section{margin:2rem auto;display:flex;justify-content:center}
.video-poster{width:100%;max-width:860px;height:300px;background:linear-gradient(180deg, rgba(255,255,255,0.02), rgba(0,0,0,0.05));border-radius:12px;display:flex;align-items:center;justify-content:center;cursor:pointer;position:relative;overflow:hidden;box-shadow:var(--shadow-md);border:1px solid rgba(255,255,255,0.02)}
.video-poster-inner{display:flex;flex-direction:column;align-items:center;gap:0.75rem}
.video-caption{color:rgba(255,255,255,0.9);font-weight:600}
.play-icon{filter:drop-shadow(0 6px 14px rgba(2,6,23,0.35));}

.video-modal{position:fixed;inset:0;background:rgba(3,6,23,0.7);display:flex;align-items:center;justify-content:center;z-index:2000;padding:2rem}
.video-iframe-wrap{width:100%;max-width:1100px;background:transparent;border-radius:10px;overflow:hidden}
.video-iframe-wrap iframe{width:100%;height:60vh;border:0}
.video-close{position:absolute;right:1.25rem;top:1.25rem;background:rgba(255,255,255,0.08);color:#fff;border:0;padding:0.5rem 0.65rem;border-radius:6px;cursor:pointer}

@media (max-width:700px){
  .video-poster{height:220px}
  .video-iframe-wrap iframe{height:50vh}
}

.hero p{
  margin:0 0 1.75rem;
  font-size:clamp(0.95rem, 2.2vw, 1.15rem);
  font-weight:400;
  max-width:700px;
  margin-left:auto;
  margin-right:auto;
  position:relative;
  z-index:1;
  opacity:0.95;
}

/* Image Slider */
.slider-container{
  position:relative;
  width:100%;
  max-width:1200px;
  margin:2rem auto;
  background:#fff;
  border-radius:12px;
  overflow:hidden;
  box-shadow:var(--shadow-lg);
}

.slider{
  position:relative;
  width:100%;
  height:clamp(220px, 30vh, 500px); /* fluid slider height */
  overflow:hidden;
}

.slide{
  position:absolute;
  width:100%;
  height:100%;
  opacity:0;
  transition:opacity 0.8s ease-in-out;
  background:linear-gradient(135deg, #e0e0e0 0%, #f5f5f5 100%);
  display:flex;
  align-items:center;
  justify-content:center;
}

.slide.active{opacity:1}

.slide-image{
  width:100%;
  height:100%;
  object-fit:cover;
}

.slide-content{
  position:absolute;
  bottom:0;
  left:0;
  right:0;
  background:linear-gradient(to top, rgba(0,0,0,0.85), transparent);
  color:#fff;
  padding:clamp(0.6rem, 1.2vw, 1.25rem);
  text-align:center;
}

.slide-content h3{
  margin:0 0 0.5rem;
  font-size:clamp(1rem, 2.2vw, 1.35rem);
  font-weight:700;
}

.slide-controls{
  display:flex;
  justify-content:center;
  gap:0.75rem;
  padding:1.5rem;
  background:var(--light);
}

.slider-btn{
  width:14px;
  height:14px;
  border-radius:50%;
  background:#ddd;
  border:none;
  cursor:pointer;
  transition:background 0.3s, transform 0.3s;
}

.slider-btn.active{
  background:var(--primary);
  transform:scale(1.2);
}

.slider-arrow{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  background:rgba(0,0,0,0.5);
  color:#fff;
  border:none;
  padding:1rem;
  cursor:pointer;
  font-size:1.2rem;
  z-index:10;
  transition:background 0.3s;
}

.slider-arrow:hover{background:rgba(0,0,0,0.8)}

.slider-arrow.prev{left:1rem}
.slider-arrow.next{right:1rem}

/* Buttons */
.btn{
  display:inline-block;
  background:linear-gradient(135deg, var(--secondary) 0%, #c73a53 100%);
  color:#fff;
  padding:0.85rem 2.25rem;
  border-radius:8px;
  text-decoration:none;
  font-weight:600;
  transition:var(--transition);
  border:none;
  cursor:pointer;
  font-size:0.95rem;
  letter-spacing:0.3px;
}

.btn:hover{
  transform:translateY(-4px);
  box-shadow:var(--shadow-lg);
  background:linear-gradient(135deg, var(--secondary-light) 0%, #d84860 100%);
}

/* Sections */
.intro{padding:3rem 0}

.intro h2{
  font-size:2rem;
  margin-bottom:1rem;
  color:var(--primary);
  text-align:center;
}

.intro p{
  font-size:1.05rem;
  text-align:center;
}

/* Register page layout and image sizing */
.register-layout{
  display:grid;
  grid-template-columns:1fr 1.1fr;
  gap:2rem;
  align-items:start;
}

.register-image .register-img{
  width:100%;
  height:100%;
  max-height:620px;
  object-fit:cover;
  border-radius:12px;
  box-shadow:var(--shadow-md);
  display:block;
}

.register-form{display:block}
.register-form form{display:flex;flex-direction:column;gap:1rem}

/* Improve spacing for form sections on wider screens */
@media(min-width:900px){
  .register-form .container, .register-form .intro{max-width:none}
}

@media(max-width:900px){
  .register-layout{grid-template-columns:1fr}
  .register-image{order:0}
  .register-form{order:1}
  .register-image .register-img{max-height:420px}
}

/* Intro and aligned writeup styles for register page */
.page-intro{
  color:var(--text-light);
  font-size:1.05rem;
  max-width:820px;
  margin:0 0 1.5rem;
  line-height:1.5;
  text-align:left;
}

.register-writeup{
  color:var(--text-light);
  margin:0 0 1rem;
  font-size:0.98rem;
  line-height:1.45;
}

@media(max-width:900px){
  .page-intro{ text-align:center }
  .register-writeup{ text-align:center }
}

/* Reusable form classes to replace inline styles on register page */
.form-section{
  margin:2rem 0;
  padding:2rem;
  background:var(--lighter);
  border-radius:8px;
  border-left:4px solid var(--secondary);
}

.form-row{display:grid;grid-template-columns:1fr;gap:1.5rem;margin:1.5rem 0}
.form-row.two-col{grid-template-columns:1fr 1fr}

.field{display:flex;flex-direction:column;margin-bottom:1rem}
.section-title{color:var(--primary);margin-top:0}
.text-center{text-align:center}
.field-label{margin-bottom:0.5rem;font-weight:600;color:var(--text)}
.input, select, .file-input, .textarea{padding:0.75rem;border:2px solid var(--border);border-radius:6px;font-family:inherit;font-size:1rem}
.textarea{min-height:100px;resize:vertical}
.file-input{background:transparent}
.radio-group{display:flex;gap:1rem;margin-top:0.5rem}
.radio-group label{display:flex;gap:0.5rem;align-items:center;font-weight:400}
.checkbox-group{display:flex;gap:0.5rem;align-items:flex-start}
.field-help{font-size:0.85rem;color:var(--text-light);margin-top:0.25rem}

.form-footer{text-align:center;margin:2rem 0}

@media(min-width:900px){
  .form-row.two-col{gap:1.5rem}
}

@media(max-width:900px){
  .form-row.two-col{grid-template-columns:1fr}
}

/* General utility classes */
.card{
  margin-bottom:1.5rem;
  padding:2rem;
  background:linear-gradient(135deg, #F0F9FF 0%, #F3E8FF 100%);
  border-radius:8px;
  border-left:6px solid var(--primary);
  border-top:3px solid var(--secondary);
  border-right:2px solid var(--primary-light);
  border-bottom:2px solid var(--secondary-light);
  box-shadow:0 8px 20px rgba(2,6,23,0.05), inset 0 1px 0 rgba(255,255,255,0.8);
  transition:var(--transition);
}

.card:hover{
  box-shadow:0 12px 32px rgba(65, 105, 225, 0.12), inset 0 1px 0 rgba(255,255,255,0.8);
  transform:translateY(-2px);
  border-top-color:var(--primary);
}

.card h2{
  color:var(--primary);
  margin-top:0;
  margin-bottom:1rem;
  border-bottom:3px solid var(--secondary);
  padding-bottom:0.5rem;
}
.lead{color:var(--text-light);font-size:1rem}
.form-max{max-width:520px;margin:1.5rem 0}
.btn-block{width:100%}
.img-fluid{width:100%;height:auto;display:block}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.muted{color:var(--text-light)}

/* Accent text utility for headings and highlights */
.text-accent{color:var(--secondary)}

/* Status and info boxes */
.status-box{display:none;margin-top:1.5rem;padding:1rem;border-radius:6px;background:#f0f9ff;border-left:4px solid var(--primary)}
.info-card{background:white;padding:1rem;border-radius:6px;margin-bottom:1rem}
.warning-card{background:#fff3e0;border-left:4px solid #f57c00;padding:1rem;border-radius:6px;margin-bottom:1rem;color:#e65100}
.success-card{background:#e8f5e9;border-left:4px solid #388e3c;padding:1rem;border-radius:6px;margin-bottom:1rem;color:#2e7d32}
.error-msg{color:#d32f2f;margin:0}

/* Content section helpers */
.content-image-text{display:flex;gap:1.5rem;align-items:flex-start}
.content-image-text img{max-width:100%;width:auto;height:auto;border-radius:8px;object-fit:contain;box-shadow:var(--shadow);display:block}
.content-image-text .text-content{flex:1}

/* Section headings styled like faculty page */
.content-section h2{margin-top:0;color:var(--primary);border-bottom:3px solid var(--secondary);padding-bottom:0.5rem}

/* Primary button */
.btn{
  display:inline-block;
  padding:0.8rem 1.25rem;
  border-radius:8px;
  background:linear-gradient(135deg, var(--primary) 0%, #5A7FE8 100%);
  color:#fff;
  text-decoration:none;
  font-weight:600;
  border:2px solid rgba(0,0,0,0.03);
  transition:var(--transition);
  box-shadow:0 4px 12px rgba(65, 105, 225, 0.3);
}

.btn:hover{
  transform:translateY(-2px);
  box-shadow:0 6px 20px rgba(65, 105, 225, 0.4);
}
.content-two-col{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;align-items:start}
.values-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1rem}
.icon-box{padding:1rem;border-radius:8px;background:var(--bg);box-shadow:var(--shadow);display:flex;gap:1rem;align-items:flex-start}
.icon{font-size:1.5rem;display:flex;align-items:center;justify-content:center;width:52px;height:52px;background:var(--border-light);border-radius:8px}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:1rem}
.stat-box{padding:1rem;background:var(--bg-light);border-radius:8px;text-align:center}
.stat-number{font-size:1.6rem;font-weight:700;color:var(--primary)}
.stat-label{color:var(--text-light)}

/* Image utility classes for original sizing */
.img-fluid{width:100%;height:auto;display:block;object-fit:cover;border-radius:8px}
.img-original-size{max-width:100%;width:auto;height:auto;display:block;object-fit:contain}
.article-image{width:100%;height:280px;object-fit:contain;background-color:#f8f9fa;border-radius:10px;display:block;box-shadow:var(--shadow);margin-bottom:1.5rem} 

/* Reverted programs-specific layout rules */
/* Programs page uses the default article/image styles now */

/* Grid wrapper for program cards to align and space consistently */
.programs-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
  gap:2rem;
  margin-top:1.5rem;
}

/* Alternate left border accents to match faculty styling */
.programs-grid .programs-article:nth-child(odd){ border-left-color: var(--primary); }
.programs-grid .programs-article:nth-child(even){ border-left-color: var(--secondary); }

/* Programs cards — stacked image on top for consistent vertical rhythm */
.programs-article{
  display:block;
  margin-bottom:2.25rem;
  padding:1.75rem;
  border-radius:12px;
  background:linear-gradient(135deg, #f8fbff 0%, #f3f7fb 100%);
  border-left:5px solid var(--primary);
  box-shadow:var(--shadow);
}

.programs-article .article-image{
  width:100%;
  height:220px;
  object-fit:cover;
  border-radius:8px;
  display:block;
  margin-bottom:1rem;
}

.program-content{padding:0}
.programs-article h2{margin-top:0;color:var(--primary)}
.programs-article h3{margin-top:0.25rem;color:var(--text-light)}

@media(max-width:900px){
  .programs-article{padding:1rem}
  .programs-article .article-image{height:180px}
}

/* Admissions article uses same visual treatment as faculty */
.admissions-article{
  display:flex;
  gap:1.5rem;
  align-items:stretch;
  padding:2rem;
  border-radius:10px;
  background:linear-gradient(135deg, #f0f4f8 0%, #e8f0f7 100%);
  box-shadow:0 8px 20px rgba(65, 105, 225, 0.08), inset 0 1px 0 rgba(255,255,255,0.8);
  border-left:6px solid var(--primary);
  border-top:3px solid var(--secondary);
  border-right:2px solid var(--primary-light);
  border-bottom:3px solid var(--emerald);
  transition:var(--transition);
}

.admissions-article:hover{
  box-shadow:0 16px 40px rgba(65, 105, 225, 0.15), inset 0 1px 0 rgba(255,255,255,0.8);
  border-left-color:var(--secondary);
  border-top-color:var(--primary);
  transform:translateY(-4px);
}
.admissions-article .article-image{
  width:320px;
  height:100%;
  max-height:260px;
  object-fit:cover;
  border-radius:8px;
  flex-shrink:0;
}
.admissions-article .program-content{display:flex;flex-direction:column}
.admissions-article .program-content .form-footer{margin-top:auto}
@media(max-width:900px){
  .admissions-article{flex-direction:column}
  .admissions-article .article-image{width:100%;height:180px;max-height:none}
}

@media(max-width:900px){
  .content-image-text{flex-direction:column}
  .content-two-col{grid-template-columns:1fr}
}

.stack-grid{display:grid;grid-template-columns:1fr;gap:2rem;margin-top:2rem}

/* Ensure images are responsive */
img, .slide-image, .hero img{
  max-width:100%;
  height:auto;
  display:block;
}

/* Mobile navigation: show toggle and collapse links */
/* Mobile / tablet breakpoint: hide desktop nav and show toggle */
@media (max-width:1000px){
  .nav ul{display:none;}
  .nav-toggle{display:block}
  .nav.open ul{
    display:flex;
    flex-direction:column;
    gap:0;
    position:absolute;
    right:1.25rem;
    top:calc(100% + 8px);
    background:linear-gradient(135deg, var(--primary-dark) 0%, #0B2F7F 100%);
    padding:0.75rem 0;
    border-radius:10px;
    box-shadow:0 12px 32px rgba(11, 61, 145, 0.35);
    min-width:220px;
    z-index:999;
    border:1px solid rgba(255,255,255,0.1);
  }

  /* Strong visible mobile panel when open (covers more area and is easier to tap) */
  .nav.open{
    position:fixed;
    right:12px;
    left:12px;
    bottom:auto;
    top:64px;
    background:linear-gradient(135deg, var(--primary) 0%, var(--primary-dark) 100%);
    border-radius:12px;
    padding:0.75rem;
    z-index:2000;
    display:block;
    box-shadow:0 12px 32px rgba(11, 61, 145, 0.35);
    border:1px solid rgba(255,255,255,0.1);
  }
  .nav.open ul{position:static;display:flex;flex-direction:column;gap:0}
  .nav.open a{display:block;padding:0.9rem 1.25rem;transition:all 0.25s ease}
  .nav.open a:hover{color:var(--accent)}
  .nav.open ul li{width:100%}
  .nav.open ul a{display:block;padding:0.9rem 1.25rem;border-bottom:none}

  /* Make header inner stack on mobile */
  .header-inner{flex-wrap:wrap;gap:0.75rem;padding:0.75rem}
  .brand{font-size:1rem}

  /* Slider arrows smaller on mobile */
  .slider-arrow{padding:0.6rem;font-size:1rem}
}

/* Improve footer responsiveness */
@media (max-width:700px){
  .container{padding:0 1rem}
  .footer-grid{grid-template-columns:1fr}
}

/* Chat widget removed */
  color:var(--text-light);
  max-width:800px;
  margin:0 auto;
}

.programs, .faculty-section{padding:3.5rem 0}

.programs h2, .faculty-section h2{
  font-size:2.2rem;
  margin-bottom:2.5rem;
  color:var(--primary);
  text-align:center;
  font-weight:700;
}

.grid{
  display:grid;
  grid-template-columns:1fr;
  gap:2rem;
}

.grid article, .faculty-card{
  background:var(--lighter);
  padding:2.5rem;
  border-radius:var(--radius-lg);
  border-left:4px solid var(--secondary);
  transition:var(--transition);
  box-shadow:var(--shadow);
  overflow:hidden;
  border-top:1px solid var(--border-light);
}

.grid article:hover, .faculty-card:hover{
  transform:translateY(-6px);
  box-shadow:var(--shadow-lg);
  background:var(--light);
  border-left-color:var(--primary);
}

.grid article h3, .faculty-card h3{
  color:var(--primary);
  margin-top:0;
  font-size:1.25rem;
  font-weight:600;
}

.article-image{
  width:100%;
  height:220px;
  object-fit:cover;
  border-radius:10px;
  margin-bottom:1.5rem;
  box-shadow:var(--shadow);
}

/* Faculty Grid */
.faculty-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:2rem;
}

.faculty-card{
  border-left:4px solid var(--secondary);
  background:var(--lighter);
  display:flex;
  gap:2rem;
}

.faculty-image{
  width:120px;
  height:120px;
  border-radius:8px;
  object-fit:cover;
  flex-shrink:0;
}

.faculty-info{flex:1}

.faculty-card h3{
  color:var(--primary);
  margin:0 0 0.25rem;
}

.faculty-card p{margin:0.25rem 0}

.faculty-card strong{color:var(--secondary)}

/* CTA Section */
.cta{
  background:linear-gradient(135deg, var(--primary) 0%, var(--primary-dark) 100%);
  color:#fff;
  padding:3rem 0;
  text-align:center;
  border-radius:8px;
  margin:3rem 0;
}

.cta h2{
  margin-top:0;
  font-size:2rem;
}

/* Contact Form */
form{
  max-width:500px;
  margin:0 auto;
}

label{
  display:block;
  margin-top:1rem;
  font-weight:600;
  color:var(--text);
}

input, textarea, select{
  width:100%;
  padding:0.75rem;
  margin-top:0.5rem;
  border:2px solid var(--border);
  border-radius:6px;
  font-family:inherit;
  font-size:1rem;
  transition:border-color 0.3s, box-shadow 0.3s;
}

input:focus, textarea:focus, select:focus{
  outline:none;
  border-color:var(--primary);
  box-shadow:0 0 0 3px rgba(0,123,61,0.15);
}

/* Footer - unified deep-blue */
.site-footer{
  background: linear-gradient(180deg, var(--primary-dark) 0%, #051738 100%);
  color:#ffffff;
  padding:3rem 0 2rem;
  margin-top:5rem;
  box-shadow:0 -8px 32px rgba(11, 61, 145, 0.2);
  overflow:hidden;
  box-sizing:border-box;
  position:relative;
}

.site-footer::before{
  content:'';
  position:absolute;
  top:0;
  left:0;
  right:0;
  height:1px;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,0.1), transparent);
}

.site-footer .footer-inner{
  display:block;
  max-width:1200px;
  margin:0 auto;
  padding:0 clamp(1rem, 2vw, 1.5rem);
}

/* Footer grid layout */
.footer-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:2.5rem;
  align-items:start;
  padding-top:1.5rem;
}

.footer-column{
  word-wrap:break-word;
  overflow-wrap:break-word;
  min-width:0;
  padding:1rem 0;
}

.footer-column h4{
  font-size:1.05rem;
  font-weight:700;
  margin:0 0 1.25rem;
  color:var(--light);
  text-align:center;
  word-break:break-word;
  letter-spacing:0.5px;
  text-transform:uppercase;
  font-size:0.95rem;
}

.footer-column ul{
  list-style:none;
  padding:0;
  margin:0;
  text-align:center;
}

.footer-column ul li{
  margin:0.65rem 0;
  word-wrap:break-word;
  overflow-wrap:break-word;
}

.footer-column a{
  color:#cfe4ff;
  text-decoration:none;
  display:inline-block;
  word-break:break-word;
  transition:all 0.28s ease;
  position:relative;
  padding-bottom:2px;
}

.footer-column a::after{
  content:'';
  position:absolute;
  bottom:0;
  left:50%;
  width:0;
  height:2px;
  background:var(--accent);
  transition:all 0.28s ease;
  transform:translateX(-50%);
}

.footer-column a:hover{
  color:#ffffff;
  text-decoration:none;
}

.footer-column a:hover::after{
  width:100%;
}

@media(max-width:1024px){
  .footer-grid{grid-template-columns:repeat(2,1fr);gap:1.5rem}
}

@media(max-width:768px){
  .footer-grid{grid-template-columns:1fr;gap:1.5rem}
  .footer-column h4{font-size:0.95rem;margin-bottom:0.5rem}
  .footer-column ul li{margin:0.3rem 0;font-size:0.9rem}
  .footer-column a, .site-footer p, .site-footer address{font-size:0.9rem}
  .slider-container.slider-full{margin-left:0;margin-right:0}
}

@media(max-width:520px){
  .footer-grid{grid-template-columns:1fr;gap:1rem}
  .slider-container.slider-full{margin-left:0;margin-right:0}
}

.site-footer p{
  margin:0.6rem 0;
  color:#d4e6ff;
  font-size:0.95rem;
  word-wrap:break-word;
  overflow-wrap:break-word;
  line-height:1.7;
}

.site-footer address{
  margin:0.6rem 0;
  font-style:normal;
  line-height:1.8;
  word-wrap:break-word;
  overflow-wrap:break-word;
  color:#d4e6ff;
  font-size:0.95rem;
}

.site-footer .footer-right{display:flex;gap:1rem;align-items:center}

.site-footer nav{margin:0}

.site-footer ul{list-style:none;padding:0;display:flex;gap:1rem;margin:0}

.site-footer a{color:#cfe4ff;text-decoration:none;font-weight:600}
.site-footer a:hover{text-decoration:underline;color:#ffffff}

.site-footer .social{
  display:flex;
  gap:0.75rem;
  align-items:center;
  justify-content:center;
  margin-top:1rem;
  flex-wrap:wrap;
}

.site-footer .social a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:44px;
  height:44px;
  border-radius:10px;
  background:linear-gradient(135deg, rgba(255,122,0,0.15), rgba(255,156,74,0.1));
  color:#fff;
  text-decoration:none;
  font-weight:700;
  font-size:0.8rem;
  transition:all 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  border:1px solid rgba(255,255,255,0.1);
}

.site-footer .social a:hover{
  background:linear-gradient(135deg, var(--accent), var(--secondary-light));
  color:#fff;
  transform:translateY(-4px);
  box-shadow:0 8px 24px rgba(255,122,0,0.3);
}

.site-footer .social a svg{
  width:20px;
  height:20px;
  fill:currentColor;
}

/* Keep footer right content aligned */
.site-footer .footer-right{display:flex;gap:1rem;align-items:center}

/* Footer about section - logo and social */
.footer-about{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:1.5rem;
  border-radius:12px;
  background:linear-gradient(135deg, rgba(255,122,0,0.05), rgba(255,156,74,0.03));
  border:1px solid rgba(255,255,255,0.08);
}

.footer-about .footer-logo{
  border-bottom:none;
  padding-bottom:0;
  margin-bottom:1rem;
  background:none;
  border:none;
}

/* Footer logo sizing - reduced to ~half passport size */
.footer-logo{
  display:flex;
  align-items:center;
  justify-content:center;
  margin-bottom:1rem;
  padding-bottom:1rem;
  border-bottom:1px solid rgba(255,255,255,0.15);
  background:none;
}

.footer-logo-img{
  max-width:90px;
  max-height:110px;
  width:auto;
  height:auto;
  object-fit:contain;
  flex-shrink:0;
  filter:drop-shadow(0 4px 12px rgba(0,0,0,0.2));
}

@media(max-width:600px){
  .site-footer{padding:2rem 0.5rem 1.5rem}
  .site-footer .footer-inner{padding:0 0.5rem}
  .footer-logo-img{max-width:75px;max-height:95px}
  .footer-column{margin-bottom:1.75rem}
  .footer-column h4{font-size:0.9rem;margin-bottom:0.75rem;font-weight:700}
  .footer-column ul li{margin:0.35rem 0;font-size:0.85rem}
  .footer-column a, .site-footer p, .site-footer address{font-size:0.85rem;line-height:1.6}
  .site-footer .social{gap:0.5rem;justify-content:center;margin-top:0.75rem}
  .site-footer .social a{width:38px;height:38px;padding:0;border-radius:8px;font-size:0.75rem}
  .footer-logo{margin-bottom:1rem;border-bottom:1px solid rgba(255,255,255,0.15);padding-bottom:1rem}
  .site-footer address br{display:block}
  .footer-about{padding:1.25rem;margin-bottom:1.5rem}
}

@media(max-width:420px){
  .site-footer{padding:1.5rem 0.25rem 1rem}
  .site-footer .footer-inner{padding:0 0.25rem}
  .footer-logo-img{max-width:65px;max-height:80px}
  .footer-column{margin-bottom:1.25rem}
  .footer-column h4{font-size:0.85rem;margin-bottom:0.5rem}
  .footer-column ul li{margin:0.25rem 0;font-size:0.8rem}
  .footer-column a, .site-footer p, .site-footer address{font-size:0.8rem;line-height:1.5}
  .site-footer .social{gap:0.4rem;margin-top:0.5rem}
  .site-footer .social a{width:34px;height:34px;font-size:0.7rem;border-radius:7px}
  .footer-about{padding:1rem}
}

/* Full-bleed slider variant for homepage (larger hero slider) */
.slider-container.slider-full{
  width:100vw;
  max-width:100vw;
  margin-left:calc(50% - 50vw);
  margin-right:calc(50% - 50vw);
  border-radius:0;
  box-shadow:none;
}

.slider-container.slider-full .slider{
  height:clamp(420px, 52vh, 720px);
}

.slider-container.slider-full .slide-content{
  padding:clamp(1rem, 2.5vw, 2rem);
  text-align:left;
  max-width:900px;
  left:3rem;
  bottom:3rem;
  background:linear-gradient(to top right, rgba(0,0,0,0.6), rgba(0,0,0,0.15));
  border-radius:8px;
}

.slider-container.slider-full .slide-content h3{font-size:clamp(1.4rem, 3.6vw, 2.2rem)}

/* Larger arrow sizes for full slider */
.slider-container.slider-full .slider-arrow{padding:1rem;font-size:1.35rem}

/* Ensure slide images remain cover and center */
.slider-container.slider-full .slide-image{object-position:center center}

/* Make slide images align to top so the top isn't cropped on large hero slides */
.slide-image{object-position:center top}

/* Justify main body text for smoother reading */
.container p,
.container li,
.container address,
.news-body p,
.faculty-info p,
.text-content p,
.content-section p,
.cta p,
.news-excerpt,
p,
li,
address {
  text-align:justify;
  text-justify:inter-word;
  hyphens:auto;
}

/* Mobile text alignment optimization for better readability */
@media(max-width:768px){
  .container p,
  .news-body p,
  .faculty-info p,
  .text-content p,
  .content-section p,
  .cta p,
  .news-excerpt {
    text-align:left;
    hyphens:none;
  }
}

@media(max-width:480px){
  .container, main, section, article {
    padding:1rem 0.75rem;
  }
  
  .footer-column address {
    font-size:0.85rem;
    line-height:1.4;
  }
}

/* Programs box — unique styling */
.programs-box{
  background:linear-gradient(135deg, #F0F9FF 0%, #F5E6FF 100%);
  padding:1.25rem;
  border-radius:14px;
  color:var(--text);
  box-shadow:0 8px 20px rgba(2,6,23,0.05), inset 0 1px 0 rgba(255,255,255,0.8);
  margin-bottom:1.25rem;
  border:3px solid var(--primary-light);
  border-top:5px solid var(--secondary);
  position:relative;
}
.programs-box h2{color:var(--primary);margin-top:0}
.programs-box .grid{background:transparent}
.program-card{
  background:linear-gradient(135deg, #FFFFFF 0%, #F3F7FF 100%);
  padding:1.25rem;
  border-radius:10px;
  border:3px solid var(--primary-light);
  border-top:5px solid;
  border-top-color:var(--secondary);
  border-bottom:3px solid var(--secondary-light);
  box-shadow:0 6px 18px rgba(2,6,23,0.04), inset 0 1px 0 rgba(255,255,255,0.8);
  position:relative;
  overflow:hidden;
  transition:var(--transition);
}
.program-card::before{
  content:'';
  position:absolute;
  top:0;
  left:0;
  right:0;
  height:4px;
  background:linear-gradient(90deg, #4169E1 0%, #FF7A00 50%, #8B5CF6 100%);
  opacity:0.8;
}
.program-card:hover{
  transform:translateY(-12px);
  box-shadow:0 16px 40px rgba(65, 105, 225, 0.2), inset 0 1px 0 rgba(255,255,255,0.8);
  border-color:var(--primary);
  border-top-color:var(--primary);
}
.program-card h3{
  color:var(--primary);
  font-weight:700;
  position:relative;
  z-index:1;
}
.program-card p{
  color:var(--text);
  position:relative;
  z-index:1;
}
.program-card strong{
  color:var(--primary-dark);
  position:relative;
  z-index:1;
}

@media (max-width:900px){
  .programs-box{padding:1rem}
}
}

/* Footer links in table-like rows for aligned columns */
.footer-column ul{display:table;margin:0;padding:0}
.footer-column ul li{display:table-row}
.footer-column ul li a{display:table-cell;padding:6px 8px}

/* Icon styles */
.icon-box{
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  padding:2.5rem 2rem;
  background:linear-gradient(135deg, #F0F9FF 0%, #F3E8FF 100%);
  border-radius:var(--radius-lg);
  transition:var(--transition);
  box-shadow:0 8px 20px rgba(65, 105, 225, 0.08), inset 0 1px 0 rgba(255,255,255,0.8);
  border:3px solid var(--primary-light);
  border-top:5px solid var(--amber);
  border-right:3px solid var(--teal);
  border-bottom:3px solid var(--pink);
  position:relative;
  overflow:hidden;
}

.icon-box::before{
  content:'';
  position:absolute;
  bottom:-50%;
  right:-50%;
  width:200px;
  height:200px;
  background:radial-gradient(circle, rgba(65, 105, 225, 0.08) 0%, transparent 70%);
  border-radius:50%;
  pointer-events:none;
}

.icon-box:hover{
  transform:translateY(-12px);
  box-shadow:0 16px 40px rgba(65, 105, 225, 0.15), inset 0 1px 0 rgba(255,255,255,0.8);
  background:linear-gradient(135deg, #EFF6FF 0%, #F5E6FF 100%);
  border-color:var(--primary);
  border-top-color:var(--secondary);
  border-right-color:var(--primary);
  border-bottom-color:var(--secondary);
}

.icon{
  width:64px;
  height:64px;
  margin-bottom:1.5rem;
  display:flex;
  align-items:center;
  justify-content:center;
  background:linear-gradient(135deg, var(--primary-light) 0%, var(--primary) 100%);
  border-radius:12px;
  color:#fff;
  flex-shrink:0;
  transition:var(--transition);
}

.icon-box:hover .icon{
  transform:scale(1.1) rotate(5deg);
  box-shadow:0 8px 16px rgba(13, 122, 71, 0.3);
}

.icon svg{
  width:32px;
  height:32px;
  fill:currentColor;
}

/* Inline SVG icon helpers */
.svg-icon{
  width:32px;
  height:32px;
  display:inline-block;
  vertical-align:middle;
  fill:currentColor;
}

.svg-inline{
  display:inline-flex;
  align-items:center;
  margin-right:0.5rem;
}

.icon-box h3{
  color:var(--primary);
  margin-top:0;
  margin-bottom:0.75rem;
  font-size:1.1rem;
  font-weight:600;
}

.icon-box p{
  margin:0;
  color:var(--text-light);
  font-size:0.95rem;
  line-height:1.5;
}

/* Content sections */
.content-section{
  margin:3.5rem 0;
  padding:2.5rem;
  background:linear-gradient(135deg, #F7FAFC 0%, #EFF6FF 100%);
  border-radius:var(--radius-lg);
  border-left:6px solid var(--secondary);
  border-top:3px solid var(--primary);
  border-right:2px solid var(--primary-light);
  border-bottom:2px solid var(--secondary-light);
  transition:var(--transition);
  position:relative;
  overflow:hidden;
  box-shadow:inset 0 1px 0 0 rgba(255,255,255,0.6), 0 8px 20px rgba(65, 105, 225, 0.08);
}

.content-section::before{
  content:'';
  position:absolute;
  top:-50%;
  right:-20%;
  width:300px;
  height:300px;
  background:radial-gradient(circle, rgba(65, 105, 225, 0.08) 0%, transparent 70%);
  border-radius:50%;
  pointer-events:none;
}

.content-section:hover{
  box-shadow:inset 0 1px 0 0 rgba(255,255,255,0.6), 0 12px 32px rgba(65, 105, 225, 0.15);
  background:linear-gradient(135deg, #EFF6FF 0%, #F3E8FF 100%);
  border-left-color:var(--primary);
  border-top-color:var(--secondary);
  transform:translateY(-2px);
}

.content-section h3{
  color:var(--primary);
  margin-top:0;
  font-size:1.25rem;
  font-weight:600;
  margin-bottom:1rem;
  position:relative;
  z-index:1;
}

/* News preview cards */
.news-list{padding:0;margin:0}
.news-grid{display:grid;grid-template-columns:1fr;gap:1rem}
.news-card{
  background:linear-gradient(135deg, #FFFFFF 0%, #F8FAFC 100%);
  border-radius:10px;
  overflow:hidden;
  display:flex;
  align-items:stretch;
  border:2px solid var(--border);
  border-left:5px solid var(--teal);
  box-shadow:0 8px 20px rgba(2,6,23,0.06), inset 0 1px 0 rgba(255,255,255,0.8);
  transition:transform 0.18s ease,box-shadow 0.18s;
  position:relative;
  overflow:hidden;
}
.news-card::before{
  content:'';
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:5px;
  background:linear-gradient(180deg, #4169E1 0%, #FF7A00 100%);
  z-index:1;
}
.news-card:hover{
  transform:translateY(-8px);
  box-shadow:0 16px 40px rgba(2,6,23,0.12), inset 0 1px 0 rgba(255,255,255,0.8);
  background:linear-gradient(135deg, #EFF6FF 0%, #F3E8FF 100%);
  border-left-color:var(--primary);
}
.news-link{display:flex;gap:1rem;text-decoration:none;color:inherit;width:100%;align-items:stretch}
.news-image-wrap{flex:0 0 38%;max-width:38%;height:140px;overflow:hidden}
.news-image-el{width:100%;height:100%;object-fit:cover;display:block}
.news-body{padding:1rem;flex:1;display:flex;flex-direction:column;justify-content:center}
.news-title{margin:0 0 0.5rem;color:var(--primary);font-size:1.05rem}
.news-excerpt{margin:0;color:var(--text-light);font-size:0.95rem}

@media(min-width:768px){
  .news-grid{grid-template-columns:repeat(2,1fr)}
  .news-image-wrap{height:160px}
}

@media(min-width:1024px){
  .news-grid{grid-template-columns:repeat(4,1fr)}
  .news-card{flex-direction:column}
  .news-image-wrap{width:100%;max-width:100%;height:120px}
}

.content-two-col{
  display:grid;
  grid-template-columns:1fr;
  gap:2rem;
  margin:2rem 0;
}

.content-image-text{
  display:flex;
  flex-direction:column;
  gap:1.5rem;
}

.content-image-text img{
  width:100%;
  border-radius:8px;
  box-shadow:var(--shadow);
  height:auto;
  display:block;
  max-width:100%;
}

/* Responsive two-column image/text alignment */
@media(min-width:768px){
  .content-image-text{flex-direction:row;align-items:center}
  .content-image-text img{flex:0 0 48%;max-width:48%;width:48%;}
  .content-image-text .text-content{flex:1}
  .content-two-col > div img{width:100%;height:auto;max-width:520px;display:block}
}

.text-content{
  flex:1;
}

.text-content h3{
  color:var(--primary);
  margin-top:0;
}

/* Values list */
.values-list{
  display:grid;
  grid-template-columns:1fr;
  gap:1rem;
}

.value-item{
  padding:1.5rem;
  background:var(--bg);
  border-left:4px solid var(--secondary);
  border-radius:4px;
}

.value-item strong{
  color:var(--primary);
  display:block;
  margin-bottom:0.5rem;
}

.value-item p{margin:0}

/* Stats section */
.stats{
  display:grid;
  grid-template-columns:1fr;
  gap:2rem;
  margin:2rem 0;
}

.stat-box{
  text-align:center;
  padding:2rem;
  background:var(--light);
  border-radius:8px;
  border-top:4px solid var(--secondary);
}

.stat-number{
  font-size:2.5rem;
  color:var(--primary);
  font-weight:700;
  margin:0;
}

.stat-label{
  color:var(--text-light);
  margin:0.5rem 0 0;
}

/* Grid for responsive */
@media(min-width:768px){
  .content-two-col{grid-template-columns:1fr 1fr}
  .content-image-text{flex-direction:row;align-items:center}
  .content-image-text img{width:100%;height:auto}
  .stats{grid-template-columns:repeat(3,1fr)}
  .values-list{grid-template-columns:repeat(2,1fr)}
}

/* Responsive */
@media(min-width:768px){
  .hero h1{font-size:clamp(2rem, 3.5vw, 3rem)}
  .programs h2{font-size:2.2rem}
  .grid{grid-template-columns:repeat(3,1fr)}
  .faculty-grid{grid-template-columns:repeat(2,1fr)}
  .faculty-card{flex-direction:column}
  .faculty-image{width:100%;height:200px}
  .slider{height:clamp(320px, 34vh, 500px)}
}

@media(max-width:699px){
  .nav{display:none}
  .nav[aria-hidden="false"]{display:block;position:absolute;top:100%;left:0;right:0;background:var(--primary);flex-direction:column;gap:0}
  .nav ul{flex-direction:column;gap:0;padding:1rem}
  .nav a{display:block;padding:0.75rem 0}
  .nav-toggle{display:inline-block}
  .nav-dropdown{position:static;display:none;background:rgba(0,0,0,0.1);box-shadow:none;margin:0;border-radius:0}
  .nav li.active .nav-dropdown{display:block}
  .nav-dropdown a{padding:0.5rem 0 0.5rem 2rem;font-size:0.85rem}
  .header-inner{flex-wrap:wrap}
  .hero h1{font-size:clamp(1.2rem, 5vw, 1.9rem)}
  .slider{height:clamp(220px, 28vh, 320px)}
  .slider-arrow{padding:0.75rem;font-size:1rem}
  .faculty-grid{grid-template-columns:1fr}
  .article-image{height:150px}
}

/* Tighter news-grid breakpoints for mobile/desktop balance */
@media(min-width:600px){
  .news-grid{grid-template-columns:repeat(2,1fr)}
  .news-image-wrap{height:150px}
}

@media(min-width:900px){
  .news-grid{grid-template-columns:repeat(3,1fr)}
  .news-card{flex-direction:column}
  .news-image-wrap{width:100%;max-width:100%;height:160px}
}

@media(min-width:1200px){
  .news-grid{grid-template-columns:repeat(4,1fr)}
}

/* Accessibility */
a:focus, button:focus, input:focus, textarea:focus, select:focus{
  outline:3px solid rgba(0,123,61,0.5);
  outline-offset:2px;
}

/* Loading animation for images */
@keyframes fadeIn{
  from{opacity:0}
  to{opacity:1}
}

.slide{animation:fadeIn 0.8s}

*{box-sizing:border-box}
body{
  font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  color:var(--text);
  margin:0;
  background:var(--bg);
  line-height:1.6;
}

.container{max-width:1200px;margin:0 auto;padding:0 1rem}

/* Header & Navigation */
.site-header{
  background:linear-gradient(135deg, var(--primary) 0%, #15438c 100%);
  color:#fff;
  padding:1rem 0;
  box-shadow:var(--shadow-lg);
  position:sticky;
  top:0;
  z-index:100;
}

.header-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  max-width:1200px;
  margin:0 auto;
  padding:0 1rem;
}

.header-logo{
  display:flex;
  align-items:center;
  gap:0.75rem;
}

.logo-img{
  width:50px;
  height:50px;
  background:#fff;
  border-radius:50%;
  padding:5px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:bold;
  color:var(--primary);
  font-size:24px;
}

.brand{
  font-weight:700;
  color:#fff;
  text-decoration:none;
  font-size:1.3rem;
  letter-spacing:0.5px;
}

.nav ul{
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  gap:2rem;
}

.nav a{
  text-decoration:none;
  color:#fff;
  font-weight:500;
  transition:color 0.3s, border-bottom 0.3s;
  padding-bottom:0.5rem;
  border-bottom:2px solid transparent;
}

.nav a:hover{
  color:var(--secondary);
  border-bottom-color:var(--secondary);
}

.nav-toggle{
  display:none;
  background:none;
  border:2px solid #fff;
  color:#fff;
  padding:0.5rem 0.75rem;
  cursor:pointer;
  border-radius:4px;
  font-weight:bold;
}

/* Hero Section */
.hero{
  background:linear-gradient(135deg, #1e5a96 0%, #15438c 50%, #0d2a5f 100%);
  color:#fff;
  padding:4rem 0;
  text-align:center;
}

.hero h1{
  margin:0 0 1rem;
  font-size:2.5rem;
  font-weight:700;
  letter-spacing:-0.5px;
}

.hero p{
  margin:0 0 2rem;
  font-size:1.1rem;
  font-weight:300;
  max-width:700px;
  margin-left:auto;
  margin-right:auto;
}

/* Image Slider */
.slider-container{
  position:relative;
  width:100%;
  max-width:1200px;
  margin:2rem auto;
  background:#fff;
  border-radius:12px;
  overflow:hidden;
  box-shadow:var(--shadow-lg);
}

.slider{
  position:relative;
  width:100%;
  height:400px;
  overflow:hidden;
}

.slide{
  position:absolute;
  width:100%;
  height:100%;
  opacity:0;
  transition:opacity 0.6s ease-in-out;
  background:linear-gradient(135deg, #e0e0e0 0%, #f5f5f5 100%);
  display:flex;
  align-items:center;
  justify-content:center;
}

.slide.active{opacity:1}

.slide-image{
  width:100%;
  height:100%;
  object-fit:cover;
}

.slide-content{
  position:absolute;
  bottom:0;
  left:0;
  right:0;
  background:linear-gradient(to top, rgba(0,0,0,0.8), transparent);
  color:#fff;
  padding:2rem;
  text-align:center;
}

.slide-content h3{
  margin:0 0 0.5rem;
  font-size:1.5rem;
}

.slide-controls{
  display:flex;
  justify-content:center;
  gap:0.75rem;
  padding:1.5rem;
  background:#f8f9fa;
}

.slider-btn{
  width:12px;
  height:12px;
  border-radius:50%;
  background:var(--border);
  border:none;
  cursor:pointer;
  transition:background 0.3s;
}

.slider-btn.active{background:var(--primary)}

.slider-arrow{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  background:rgba(0,0,0,0.5);
  color:#fff;
  border:none;
  padding:1rem;
  cursor:pointer;
  font-size:1.2rem;
  z-index:10;
  transition:background 0.3s;
}

.slider-arrow:hover{background:rgba(0,0,0,0.8)}

.slider-arrow.prev{left:1rem}
.slider-arrow.next{right:1rem}

/* Buttons */
.btn{
  display:inline-block;
  background:linear-gradient(135deg, var(--secondary) 0%, #e67e22 100%);
  color:#fff;
  padding:0.75rem 2rem;
  border-radius:6px;
  text-decoration:none;
  font-weight:600;
  transition:transform 0.2s, box-shadow 0.2s;
  border:none;
  cursor:pointer;
  font-size:1rem;
}

.btn:hover{
  transform:translateY(-2px);
  box-shadow:var(--shadow-lg);
}

/* Sections */
.intro{padding:3rem 0}

.intro h2{
  font-size:2rem;
  margin-bottom:1rem;
  color:var(--primary);
  text-align:center;
}

.intro p{
  font-size:1.05rem;
  text-align:center;
  color:var(--text-light);
  max-width:800px;
  margin:0 auto;
}

.programs, .faculty-section{padding:3rem 0}

.programs h2, .faculty-section h2{
  font-size:2rem;
  margin-bottom:2rem;
  color:var(--primary);
  text-align:center;
}

.grid{
  display:grid;
  grid-template-columns:1fr;
  gap:2rem;
}

.grid article, .faculty-card{
  background:#f8f9fa;
  padding:2rem;
  border-radius:8px;
  border-left:4px solid var(--secondary);
  transition:transform 0.3s, box-shadow 0.3s;
  box-shadow:var(--shadow);
}

.grid article:hover, .faculty-card:hover{
  transform:translateY(-5px);
  box-shadow:var(--shadow-lg);
}

.grid article h3, .faculty-card h3{
  color:var(--primary);
  margin-top:0;
}

/* Faculty Grid */
.faculty-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:1.5rem;
}

.faculty-card{
  border-left:4px solid var(--secondary);
  background:#f8f9fa;
}

.faculty-card h3{
  color:var(--primary);
  margin:0 0 0.25rem;
}

.faculty-card p{margin:0.25rem 0}

.faculty-card strong{color:var(--secondary)}

/* CTA Section */
.cta{
  background:linear-gradient(135deg, var(--primary) 0%, #15438c 100%);
  color:#fff;
  padding:3rem 0;
  text-align:center;
  border-radius:8px;
  margin:3rem 0;
}

.cta h2{
  margin-top:0;
  font-size:2rem;
}

/* Contact Form */
form{
  max-width:500px;
  margin:0 auto;
}

label{
  display:block;
  margin-top:1rem;
  font-weight:600;
  color:var(--text);
}

input, textarea, select{
  width:100%;
  padding:0.75rem;
  margin-top:0.5rem;
  border:1px solid var(--border);
  border-radius:6px;
  font-family:inherit;
  font-size:1rem;
  transition:border-color 0.3s, box-shadow 0.3s;
}

input:focus, textarea:focus, select:focus{
  outline:none;
  border-color:var(--primary);
  box-shadow:0 0 0 3px rgba(30,90,150,0.1);
}

/* Footer - unified dark blue (legacy fallback) */
.site-footer{
  background: linear-gradient(180deg, var(--primary-dark) 0%, #041a40 100%);
  color:#ecf8ff;
  padding:2rem 0;
  text-align:center;
  margin-top:4rem;
}

.site-footer nav{margin-top:1rem}

.site-footer ul{
  list-style:none;
  padding:0;
  display:flex;
  justify-content:center;
  gap:2rem;
}

.site-footer a{
  color:#cfe4ff;
  text-decoration:none;
}

.site-footer a:hover{text-decoration:underline;color:#ffffff}

/* Address */
address{
  font-style:normal;
  background:#f8f9fa;
  padding:2rem;
  border-radius:8px;
  margin:2rem 0;
  line-height:1.8;
}

/* Responsive */
@media(min-width:768px){
  .hero h1{font-size:3rem}
  .programs h2{font-size:2.2rem}
  .grid{grid-template-columns:repeat(3,1fr)}
  .faculty-grid{grid-template-columns:repeat(2,1fr)}
  .slider{height:500px}
}

@media(max-width:699px){
  .nav{display:none}
  .nav[aria-hidden="false"]{display:block;position:absolute;top:100%;left:0;right:0;background:var(--primary);flex-direction:column;gap:0}
  .nav ul{flex-direction:column;gap:0;padding:1rem}
  .nav a{display:block;padding:0.75rem 0}
  .nav-toggle{display:inline-block}
  .header-inner{flex-wrap:wrap}
  .hero h1{font-size:1.75rem}
  .slider{height:300px}
  .slider-arrow{padding:0.75rem;font-size:1rem}
  .faculty-grid{grid-template-columns:1fr}
}

/* Accessibility */
a:focus, button:focus, input:focus, textarea:focus, select:focus{
  outline:3px solid rgba(30,90,150,0.5);
  outline-offset:2px;
}

/* Loading animation for images */
@keyframes fadeIn{
  from{opacity:0}
  to{opacity:1}
}

.slide{animation:fadeIn 0.6s}
/* Comprehensive responsive image handling across all pages */
img{
  max-width:100%;
  height:auto;
  display:block;
}

/* Article and content images */
.article-image,
.grid article img,
.faculty-card img,
  object-fit:cover;
  border-radius:10px;
  margin-bottom:1.5rem;
.content-section img{
  width:100%;
  height:auto;
  display:block;
  border-radius:8px;
  object-fit:cover;
}

.advert img, .notice-img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  aspect-ratio: 4 / 3;
}

/* CTA overlay on Important Notices */
.advert{position:relative}
.notice-overlay{position:absolute;left:0;right:0;bottom:0;display:flex;align-items:center;justify-content:space-between;padding:0.6rem 0.8rem;background:linear-gradient(180deg, rgba(0,0,0,0.0), rgba(0,0,0,0.6));color:#fff;gap:0.75rem}
.notice-overlay-text{display:flex;flex-direction:column;min-width:0}
.notice-overlay h4{margin:0;font-size:1rem;font-weight:700;line-height:1.1;color:#fff}
.notice-sub{margin:0;font-size:0.82rem;opacity:0.95;color:rgba(255,255,255,0.92)}
.notice-cta{background:var(--accent);color:#0b1724;padding:0.35rem 0.7rem;border-radius:999px;font-weight:700;font-size:0.85rem;white-space:nowrap;box-shadow:0 6px 14px rgba(13,122,71,0.12)}

/* Overlay transitions + accessibility */
.notice-overlay{transform:translateY(6px);transition:transform 240ms ease, box-shadow 240ms ease;}
.advert:hover .notice-overlay, .advert:focus-within .notice-overlay{transform:translateY(0);box-shadow:0 -6px 18px rgba(2,6,23,0.08)}
.advert:focus-within{outline:3px solid rgba(13,122,71,0.12);outline-offset:4px;border-radius:8px}
.notice-cta{transition:transform 180ms ease, background 180ms ease}
.notice-cta:hover{transform:translateY(-2px);background:var(--accent-light)}
.notice-cta:focus{outline:2px solid rgba(255,255,255,0.9);outline-offset:3px}

@media (prefers-reduced-motion: reduce){
  .notice-overlay, .notice-cta{transition:none}
}

/* Sharpen news titles and cards */
.news-card{background:#fff;border:1px solid rgba(15,23,36,0.04);box-shadow:0 6px 18px rgba(2,6,23,0.04)}
.news-title{color:var(--text);font-weight:700}
.news-excerpt{color:var(--text-light)}

/* ===== PREMIUM FEATURES & DESIGNS ===== */

/* Premium Gradient Backgrounds */
.premium-hero {
  background: linear-gradient(135deg, #667eea 0%, #764ba2 25%, #f093fb 50%, #4facfe 75%, #667eea 100%);
  background-size: 300% 300%;
  animation: premiumGradient 8s ease infinite;
  color: #fff;
  padding: 5rem 2rem;
  text-align: center;
  border-radius: 20px;
  margin: 3rem 0;
}

@keyframes premiumGradient {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

/* Premium Award/Badge Section */
.premium-badges {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 1.5rem;
  margin: 2rem 0;
}

.badge-card {
  background: linear-gradient(135deg, rgba(102, 126, 234, 0.1) 0%, rgba(240, 147, 251, 0.1) 100%);
  border: 2px solid rgba(102, 126, 234, 0.3);
  padding: 2rem;
  border-radius: 16px;
  text-align: center;
  transition: all 0.3s ease;
  position: relative;
  overflow: hidden;
}

.badge-card::before {
  content: '';
  position: absolute;
  top: -50%;
  right: -50%;
  width: 200px;
  height: 200px;
  background: radial-gradient(circle, rgba(240, 147, 251, 0.2) 0%, transparent 70%);
  border-radius: 50%;
}

.badge-card:hover {
  transform: translateY(-8px);
  border-color: rgba(102, 126, 234, 0.6);
  box-shadow: 0 20px 40px rgba(102, 126, 234, 0.2);
}

.badge-icon {
  font-size: 3rem;
  margin-bottom: 1rem;
}

.badge-card h3 {
  color: #667eea;
  margin: 0.5rem 0;
  font-size: 1.1rem;
}

.badge-card p {
  color: #6B7280;
  font-size: 0.9rem;
  margin: 0;
}

/* Premium Statistics Section */
.premium-stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 2rem;
  margin: 3rem 0;
}

.stat-item {
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  color: white;
  padding: 2.5rem;
  border-radius: 16px;
  text-align: center;
  position: relative;
  overflow: hidden;
  transition: all 0.3s ease;
}

.stat-item::before {
  content: '';
  position: absolute;
  top: -50%;
  right: -50%;
  width: 300px;
  height: 300px;
  background: rgba(255, 255, 255, 0.1);
  border-radius: 50%;
}

.stat-item:hover {
  transform: translateY(-10px);
  box-shadow: 0 20px 50px rgba(102, 126, 234, 0.3);
}

.stat-number {
  font-size: 2.5rem;
  font-weight: 800;
  display: block;
  position: relative;
  z-index: 1;
}

.stat-label {
  font-size: 0.95rem;
  font-weight: 600;
  position: relative;
  z-index: 1;
}

/* Premium Feature Cards */
.premium-feature {
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 16px;
  padding: 2.5rem;
  transition: all 0.3s ease;
  position: relative;
  overflow: hidden;
}

.premium-feature::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 4px;
  background: linear-gradient(90deg, #667eea 0%, #764ba2 50%, #f093fb 100%);
  transition: left 0.5s ease;
}

.premium-feature:hover::before {
  left: 0;
}

.premium-feature:hover {
  transform: translateY(-8px);
  box-shadow: 0 20px 40px rgba(102, 126, 234, 0.15);
  border-color: rgba(102, 126, 234, 0.3);
}

.feature-icon {
  width: 60px;
  height: 60px;
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
  font-size: 1.5rem;
  margin-bottom: 1rem;
}

.premium-feature h3 {
  color: #667eea;
  margin-bottom: 1rem;
}

/* Premium Testimonial Cards */
.premium-testimonial {
  background: linear-gradient(135deg, #f8f9ff 0%, #f0e7ff 100%);
  border-left: 4px solid #667eea;
  padding: 2rem;
  border-radius: 12px;
  position: relative;
  transition: all 0.3s ease;
}

.premium-testimonial::before {
  content: '"';
  position: absolute;
  top: 10px;
  right: 20px;
  font-size: 3rem;
  color: rgba(102, 126, 234, 0.2);
  font-weight: 800;
}

.premium-testimonial:hover {
  transform: translateX(8px);
  box-shadow: 0 10px 30px rgba(102, 126, 234, 0.15);
}

.premium-testimonial p {
  color: #374151;
  font-style: italic;
  margin-bottom: 1rem;
  line-height: 1.8;
}

.testimonial-author {
  color: #667eea;
  font-weight: 600;
  font-style: normal;
}

.author-title {
  color: #6B7280;
  font-size: 0.85rem;
}

/* Premium Call-to-Action */
.premium-cta {
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  color: white;
  padding: 3rem 2rem;
  border-radius: 20px;
  text-align: center;
  margin: 3rem 0;
  position: relative;
  overflow: hidden;
}

.premium-cta::before {
  content: '';
  position: absolute;
  top: -50%;
  right: -10%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(255, 255, 255, 0.15) 0%, transparent 70%);
  border-radius: 50%;
}

.premium-cta h2 {
  color: white;
  position: relative;
  z-index: 1;
  margin-top: 0;
}

.premium-cta p {
  color: rgba(255, 255, 255, 0.9);
  position: relative;
  z-index: 1;
}

.premium-cta-btn {
  background: white;
  color: #667eea;
  padding: 0.9rem 2.5rem;
  border-radius: 8px;
  text-decoration: none;
  font-weight: 700;
  display: inline-block;
  margin-top: 1rem;
  transition: all 0.3s ease;
  position: relative;
  z-index: 1;
  border: 2px solid white;
}

.premium-cta-btn:hover {
  background: transparent;
  color: white;
  transform: translateY(-2px);
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
}

/* Premium Timeline */
.premium-timeline {
  position: relative;
  padding: 2rem 0;
}

.timeline-item {
  display: grid;
  grid-template-columns: 200px 1fr;
  gap: 2rem;
  margin-bottom: 2rem;
  align-items: start;
  position: relative;
}

.timeline-marker {
  position: relative;
  text-align: right;
}

.timeline-dot {
  width: 16px;
  height: 16px;
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  border-radius: 50%;
  position: absolute;
  right: -33px;
  top: 5px;
  border: 4px solid white;
  box-shadow: 0 0 0 3px #667eea;
}

.timeline-date {
  color: #667eea;
  font-weight: 600;
  font-size: 0.95rem;
}

.timeline-content {
  background: #f8f9ff;
  padding: 1.5rem;
  border-radius: 12px;
  border-left: 3px solid #667eea;
}

.timeline-content h4 {
  color: #667eea;
  margin-top: 0;
}

/* Premium Comparison Table */
.premium-comparison {
  width: 100%;
  border-collapse: collapse;
  margin: 2rem 0;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(102, 126, 234, 0.1);
}

.premium-comparison th {
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  color: white;
  padding: 1.5rem;
  text-align: left;
  font-weight: 600;
}

.premium-comparison td {
  padding: 1.5rem;
  border-bottom: 1px solid #e5e7eb;
}

.premium-comparison tr:nth-child(even) {
  background: #f8f9ff;
}

.premium-comparison tr:hover {
  background: #f0e7ff;
}

/* Premium Icon Grid */
.icon-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 1.5rem;
  margin: 2rem 0;
}

.icon-item {
  text-align: center;
  padding: 1.5rem;
  border-radius: 12px;
  background: #f8f9ff;
  transition: all 0.3s ease;
  border: 2px solid transparent;
}

.icon-item:hover {
  border-color: #667eea;
  background: linear-gradient(135deg, #f8f9ff 0%, #f0e7ff 100%);
  transform: scale(1.05);
}

.icon-item-icon {
  font-size: 2.5rem;
  margin-bottom: 0.75rem;
}

.icon-item p {
  color: #374151;
  font-size: 0.9rem;
  margin: 0;
  font-weight: 500;
}

/* Premium Certification Badge */
.certification-badge {
  display: inline-block;
  background: linear-gradient(135deg, #fcd34d 0%, #f59e0b 100%);
  color: #92400e;
  padding: 0.75rem 1.5rem;
  border-radius: 20px;
  font-weight: 600;
  font-size: 0.85rem;
  margin: 0.5rem 0.5rem 0.5rem 0;
  box-shadow: 0 4px 12px rgba(245, 158, 11, 0.3);
}

/* Premium Checkmark List */
.premium-checklist {
  list-style: none;
  padding: 0;
  margin: 1.5rem 0;
}

.premium-checklist li {
  padding: 0.75rem 0;
  padding-left: 2rem;
  position: relative;
  color: #374151;
  line-height: 1.6;
}

.premium-checklist li::before {
  content: '✓';
  position: absolute;
  left: 0;
  color: #667eea;
  font-weight: 700;
  font-size: 1.2rem;
}

/* Premium Divider */
.premium-divider {
  height: 3px;
  background: linear-gradient(90deg, transparent 0%, #667eea 50%, transparent 100%);
  margin: 2rem 0;
  border-radius: 2px;
}

/* Premium Section Heading */
.premium-section-heading {
  position: relative;
  display: inline-block;
  margin-bottom: 2rem;
}

.premium-section-heading h2 {
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  margin: 0;
}

.premium-section-heading::after {
  content: '';
  position: absolute;
  bottom: -10px;
  left: 0;
  width: 100px;
  height: 3px;
  background: linear-gradient(90deg, #667eea 0%, #764ba2 100%);
  border-radius: 2px;
}

/* Image optimization for faster loading */
img{
  display:block;
  max-width:100%;
  height:auto;
  will-change:transform;
  backface-visibility:hidden;
}

/* Preload critical images */
.article-image, .hero-image, .faculty-image {
  will-change: transform;
  contain: layout style paint;
}

/* Font display optimization */
@font-face {
  font-family: 'Poppins';
  font-display: swap;
}

@font-face {
  font-family: 'Inter';
  font-display: swap;
}

/* GPU acceleration for smooth animations */
.btn, button, a, nav, .nav-toggle {
  transform: translateZ(0);
  backface-visibility: hidden;
  perspective: 1000px;
}

/* Optimize repaints */
body {
  will-change: scroll-position;
}

/* Reduce layout thrashing */
.container, .site-header, footer {
  contain: layout style;
}

/* Efficient hover states */
a, button, .btn {
  transition: var(--transition);
  transform: translateZ(0);
}

/* Remove unused CSS at build time - CRITICAL SELECTORS MARKED */
/* Lighthouse friendly font loading */
.site-header, .container, main {
  font-kerning: auto;
  text-rendering: optimizeLegibility;
}


/* Make headings crisper */
h1,h2,h3,h4{color:var(--text);font-weight:700;letter-spacing:-0.3px}

/* Slider images - fill container */
.slide-image{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

/* Responsive image constraints */
@media(min-width:768px){
  .article-image{
    max-height:400px;
  }
  .grid article img{
    height:250px;
    object-fit:cover;
  }
  .faculty-card img{
    height:300px;
    object-fit:cover;
  }
}

@media(max-width:767px){
  .article-image{
    max-height:300px;
  }
  .grid article img{
    height:200px;
    object-fit:cover;
  }
  .faculty-card img{
    height:200px;
    object-fit:cover;
  }
}

/* ===== MODERN BOOTSTRAP INTEGRATION ===== */
/* Programs page with Bootstrap grid */
.programs-modern-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
  gap: 2rem;
  margin: 3rem 0;
}

.program-card-modern {
  background: #fff;
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
  transition: var(--transition);
  border: 1px solid rgba(13, 122, 71, 0.08);
  display: flex;
  flex-direction: column;
  height: 100%;
}

.program-card-modern:hover {
  transform: translateY(-8px);
  box-shadow: 0 20px 50px rgba(13, 122, 71, 0.15);
  border-color: rgba(13, 122, 71, 0.2);
}

.program-card-modern-image {
  width: 100%;
  height: 250px;
  object-fit: cover;
  background-color: #f8f9fa;
}

.program-card-modern-body {
  padding: 2rem;
  flex-grow: 1;
  display: flex;
  flex-direction: column;
}

.program-card-modern-title {
  font-family: var(--font-heading);
  font-size: 1.5rem;
  font-weight: 700;
  margin: 0 0 0.5rem 0;
  color: var(--primary);
  line-height: 1.3;
}

.program-card-modern-duration {
  font-size: 0.9rem;
  color: var(--text-muted);
  font-weight: 600;
  margin-bottom: 1rem;
  padding-bottom: 1rem;
  border-bottom: 2px solid var(--border-light);
}

.program-card-modern-description {
  color: var(--text-light);
  font-size: 0.95rem;
  line-height: 1.7;
  margin-bottom: 1.5rem;
  flex-grow: 1;
}

.program-card-modern-features {
  list-style: none;
  padding: 0;
  margin: 1rem 0;
}

.program-card-modern-features li {
  padding: 0.5rem 0;
  padding-left: 1.5rem;
  position: relative;
  font-size: 0.9rem;
  color: var(--text);
}

/* Enhanced list styling with colors */
ul li::marker {
  color: var(--primary);
  font-weight: 700;
}

ol li::marker {
  color: var(--secondary);
  font-weight: 700;
}

/* Colored list items for content sections */
.content-section ul li {
  position: relative;
  padding-left: 1.5rem;
}

.content-section ul li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0.5em;
  width: 6px;
  height: 6px;
  background: linear-gradient(135deg, var(--primary) 0%, var(--secondary) 100%);
  border-radius: 50%;
}

/* Highlight important text */
.content-section strong {
  color: var(--primary-dark);
  font-weight: 700;
}

.program-card-modern-features li:before {
  content: "✓";
  position: absolute;
  left: 0;
  color: var(--primary);
  font-weight: bold;
  font-size: 1.1rem;
}

.program-card-modern-cta {
  margin-top: auto;
  display: flex;
  gap: 0.75rem;
}

.program-card-modern-cta .btn {
  flex: 1;
  padding: 0.75rem 1.5rem;
  font-weight: 600;
  border-radius: 8px;
  text-align: center;
  text-decoration: none;
  transition: var(--transition);
}

.program-card-modern-cta .btn-primary {
  background-color: var(--primary);
  color: #fff;
}

.program-card-modern-cta .btn-primary:hover {
  background-color: var(--primary-dark);
  transform: translateY(-2px);
}

.program-card-modern-cta .btn-secondary {
  background-color: transparent;
  color: var(--primary);
  border: 2px solid var(--primary);
}

.program-card-modern-cta .btn-secondary:hover {
  background-color: rgba(13, 122, 71, 0.05);
  border-color: var(--primary-dark);
}

/* Hero section enhancement with Bootstrap */
.programs-hero {
  background: linear-gradient(135deg, var(--primary) 0%, var(--primary-dark) 100%);
  color: #fff;
  padding: 4rem 2rem;
  border-radius: var(--radius-lg);
  margin-bottom: 3rem;
  text-align: center;
}

.programs-hero h1 {
  font-size: clamp(1.8rem, 5vw, 3rem);
  margin-bottom: 1rem;
  font-weight: 800;
  letter-spacing: -1px;
}

.programs-hero .lead {
  font-size: 1.1rem;
  opacity: 0.95;
  max-width: 700px;
  margin: 0 auto;
}

/* Responsive adjustments */
@media (max-width: 768px) {
  .programs-modern-grid {
    grid-template-columns: 1fr;
    gap: 1.5rem;
  }
  
  .program-card-modern-body {
    padding: 1.5rem;
  }
  
  .program-card-modern-title {
    font-size: 1.3rem;
  }
  
  .programs-hero {
    padding: 2.5rem 1.5rem;
  }
  
  .programs-hero h1 {
    font-size: 1.8rem;
  }
}

/* Bootstrap utility class overrides for consistency */
.btn-primary {
  background-color: var(--primary) !important;
  border-color: var(--primary) !important;
  font-family: var(--font-heading);
  font-weight: 600;
  border-radius: 8px;
}

.btn-primary:hover, .btn-primary:focus {
  background-color: var(--primary-dark) !important;
  border-color: var(--primary-dark) !important;
  transform: translateY(-2px);
}

.card {
  border: 1px solid rgba(13, 122, 71, 0.1) !important;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08) !important;
  border-radius: var(--radius-lg) !important;
}

.card:hover {
  box-shadow: 0 20px 50px rgba(13, 122, 71, 0.15) !important;
}
/* Footer - enforce unified dark-blue (override) */
.site-footer {
  background: linear-gradient(180deg, var(--primary-dark) 0%, #041a40 100%) !important;
  color: #ecf8ff !important;
}
.site-footer a { color: #cfe4ff !important; }
.site-footer p { color: #e9f5ff !important; }
.site-footer .social a { background: rgba(255,255,255,0.04) !important; color: #fff !important; }
.site-footer .footer-inner, .site-footer .footer-grid { border-color: transparent !important; }