/* ================================================================
   style.css -- LISSAH | Little Flower Institute of Social Sciences & Health
   Palette: Sage Green + Soft Cream
   ================================================================ */

:root {
  --sage: #7D9B76;
  --sage-dark: #5C7A55;
  --sage-deeper: #3E5C39;
  --sage-light: #A8C4A2;
  --sage-pale: #D4E6CF;
  --cream: #FAF6EF;
  --cream-warm: #F2EAD8;
  --cream-dark: #E8DCC8;
  --text-dark: #2A2F27;
  --text-mid: #4A5447;
  --text-light: #7A8A76;
  --gold: #B8975A;
  --gold-light: #D4B07A;
  --navy: #1B2D4F;
  --white: #ffffff;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  font-family: "Jost", sans-serif;
  background: var(--cream);
  color: var(--text-dark);
  overflow-x: hidden;
  animation: pageFadeIn 0.5s ease both;
}
@keyframes pageFadeIn { from { opacity: 0; } to { opacity: 1; } }
a { text-decoration: none; }
img { max-width: 100%; display: block; }
a, button {
  transition: color 0.2s ease, background 0.2s ease, border-color 0.2s ease,
              box-shadow 0.2s ease, transform 0.2s ease, opacity 0.2s ease;
}

.site-header {
  position: fixed; top: 0; left: 0; right: 0;
  z-index: 1000; transition: box-shadow 0.3s ease;
}
.site-header.scrolled { box-shadow: 0 4px 24px rgba(62,92,57,0.18); }

.hdr-contact-bar {
  background: rgba(62,92,57,0.72);
  backdrop-filter: blur(14px) saturate(1.4);
  -webkit-backdrop-filter: blur(14px) saturate(1.4);
  color: rgba(255,255,255,0.88);
  font-size: 0.7rem; padding: 0 2rem; height: 34px;
  display: flex; align-items: center; justify-content: space-between; gap: 1rem;
  border-bottom: 1px solid rgba(255,255,255,0.12);
}
.hdr-contact-left {
  display: flex; align-items: center; gap: 1.4rem; flex-shrink: 0;
}
.hdr-contact-left span {
  display: flex; align-items: center; gap: 0.35rem;
  white-space: nowrap; font-weight: 600; font-size: 0.75rem;
  letter-spacing: 0.03em; color: white;
}
.hdr-contact-left svg { width: 11px; height: 11px; fill: var(--sage-light); flex-shrink: 0; }
.hdr-social { display: flex; gap: 0.15rem; flex-shrink: 0; }
.hdr-social a {
  width: 24px; height: 24px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  color: rgba(255,255,255,0.85); font-size: 0.72rem; font-weight: 700;
}
.hdr-social a:hover { background: rgba(255,255,255,0.2); color: white; }

.hdr-brand-bar {
  display: flex; align-items: stretch; height: 80px;
  background: rgba(242,234,216,0.55);
  backdrop-filter: blur(16px) saturate(1.6) brightness(1.05);
  -webkit-backdrop-filter: blur(16px) saturate(1.6) brightness(1.05);
  border-bottom: 1px solid rgba(125,155,118,0.30);
  position: relative; z-index: 1001;
}
.hdr-logo-block {
  background: transparent; display: flex; align-items: center;
  padding: 0 1.75rem 0 1.5rem; flex-shrink: 0;
  z-index: 2; position: relative;
  border-right: 1px solid rgba(125,155,118,0.3);
}
.logo-link { display: flex; align-items: center; }
.hdr-logo-block img { height: 60px; object-fit: contain; width: auto; }
.hdr-right-block {
  flex: 1; display: flex; align-items: center; justify-content: flex-end;
  padding: 0 2rem; gap: 1.25rem; background: transparent;
}
.hdr-center-links {
  display: flex; align-items: center; gap: 0; flex: 1;
  justify-content: center; flex-wrap: nowrap;
}
.hdr-center-links a {
  color: var(--cream-warm); font-size: 0.72rem; font-weight: 500;
  letter-spacing: 0.04em; padding: 0.3rem 0.9rem;
  border-right: 1px solid rgba(125,155,118,0.3); white-space: nowrap;
}
.hdr-center-links a:last-child { border-right: none; }
.hdr-center-links a:hover { color: white; }
.hdr-badges { display: flex; gap: 0.75rem; align-items: center; }
.badge-circle {
  width: 46px; height: 46px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 0.52rem; font-weight: 800; text-transform: uppercase;
  letter-spacing: 0.04em; text-align: center; line-height: 1.2;
  border: 3px solid;
}
.badge-naac { background: rgba(255,243,224,0.92); border-color: #e67e00; color: #b35e00; }
.badge-nirf { background: rgba(232,245,233,0.92); border-color: var(--sage-dark); color: var(--sage-deeper); }
.hdr-quicklinks { display: flex; gap: 1rem; align-items: center; }
.login-dropdown-wrap { position: relative; }
.login-btn {
  background: transparent; border: 1.5px solid var(--sage);
  color: var(--sage-dark); padding: 0.42rem 1rem; border-radius: 3px;
  font-size: 0.73rem; font-weight: 600; letter-spacing: 0.06em;
  cursor: pointer; font-family: "Jost", sans-serif;
}
.login-btn:hover { background: var(--sage-pale); border-color: var(--sage-dark); }
.login-dropdown {
  display: none; position: absolute; top: calc(100% + 6px); right: 0;
  background: white; min-width: 160px; border-radius: 4px; list-style: none;
  box-shadow: 0 8px 28px rgba(0,0,0,0.15); border-top: 3px solid var(--sage);
  z-index: 99999;
}
.login-dropdown.open { display: block; }
.login-dropdown li a {
  display: block; padding: 0.6rem 1rem; font-size: 0.78rem;
  color: var(--text-mid); border-left: 3px solid transparent;
}
.login-dropdown li + li { border-top: 1px solid var(--cream-dark); }
.login-dropdown li a:hover { background: var(--sage-pale); color: var(--sage-deeper); border-left-color: var(--sage); }
.btn-admission {
  background: var(--sage-dark); color: white; padding: 0.52rem 1.3rem;
  border-radius: 3px; font-size: 0.73rem; font-weight: 700;
  letter-spacing: 0.1em; text-transform: uppercase; white-space: nowrap;
  box-shadow: 0 3px 14px rgba(92,122,85,0.5);
  animation: pulse-btn 2.5s infinite;
}
.btn-admission:hover { background: var(--sage-deeper); }
@keyframes pulse-btn {
  0%,100% { box-shadow: 0 3px 14px rgba(92,122,85,0.45); }
  50%      { box-shadow: 0 3px 24px rgba(92,122,85,0.75); }
}

.hdr-nav {
  background: var(--sage-deeper);
  border-top: 1px solid rgba(255,255,255,0.10);
  position: relative; z-index: 999;
}
.hdr-nav-inner { padding: 0 2.5rem; display: flex; width: 100%; }
.hdr-nav ul {
  list-style: none; display: flex; width: 100%;
  justify-content: space-between; flex-wrap: wrap;
}
.hdr-nav ul > li { position: relative; }
.hdr-nav ul > li:first-child > a { padding-left: 0.5rem; }
.hdr-nav ul > li:last-child > a  { padding-right: 0.5rem; }
.hdr-nav ul > li > a {
  display: flex; align-items: center; gap: 0.2rem;
  color: rgba(255,255,255,0.92); font-size: 10px; font-weight: 600;
  letter-spacing: 0.03em; text-transform: uppercase;
  padding: 0.45rem 0.5rem; border-bottom: 3px solid transparent;
  transition: all 0.2s; white-space: nowrap; position: relative;
}
.hdr-nav ul > li > a::after {
  content: ''; position: absolute; bottom: 0; left: 50%; right: 50%;
  height: 3px; background: var(--sage-light);
  transition: left 0.25s ease, right 0.25s ease;
}
.hdr-nav ul > li > a:hover::after,
.hdr-nav ul > li > a.active::after { left: 0; right: 0; }
.hdr-nav ul > li > a:hover,
.hdr-nav ul > li > a.active {
  color: white; background: rgba(255,255,255,0.08);
  border-bottom-color: var(--sage-light);
}
.caret {
  width: 0; height: 0;
  border-left: 3px solid transparent; border-right: 3px solid transparent;
  border-top: 4px solid rgba(255,255,255,0.55);
  margin-left: 2px; transition: transform 0.2s;
}
.hdr-nav ul > li:hover > a .caret { transform: rotate(180deg); border-top-color: white; }
.hdr-nav .dropdown {
  position: absolute; top: 100%; left: 0; background: white;
  min-width: 220px; border-top: 3px solid var(--sage);
  border-radius: 0 0 4px 4px; box-shadow: 0 8px 32px rgba(0,0,0,0.15);
  opacity: 0; visibility: hidden; transform: translateY(4px);
  transition: opacity 0.22s ease, visibility 0.22s ease, transform 0.22s ease !important;
  list-style: none; z-index: 9999;
  display: flex !important; flex-direction: column !important;
  width: auto !important; justify-content: flex-start !important;
}
.hdr-nav ul > li:hover > .dropdown {
  opacity: 1; visibility: visible; transform: translateY(0);
  display: flex !important; flex-direction: column !important;
}
.hdr-nav .dropdown li { border-bottom: 1px solid #f0f0f0; }
.hdr-nav .dropdown li:last-child { border-bottom: none; }
.hdr-nav .dropdown li a {
  display: flex; align-items: center; justify-content: space-between;
  padding: 0.65rem 1.1rem; font-size: 0.82rem; font-weight: 400;
  color: #333; text-transform: none; letter-spacing: 0; text-shadow: none;
  transition: background 0.15s, color 0.15s, padding-left 0.15s;
}
.hdr-nav .dropdown li a:hover {
  background: var(--sage-pale); color: var(--sage-deeper); padding-left: 1.4rem;
}

.site-header.scrolled .hdr-brand-bar {
  background: rgba(62,92,57,0.92);
  backdrop-filter: blur(20px) saturate(1.8);
  -webkit-backdrop-filter: blur(20px) saturate(1.8);
  box-shadow: 0 4px 20px rgba(62,92,57,0.25);
  border-bottom-color: rgba(255,255,255,0.15);
}
.site-header.scrolled .hdr-center-links a { color: rgba(255,255,255,0.85); }
.site-header.scrolled .hdr-center-links a:hover { color: white; }
.site-header.scrolled .hdr-logo-block { border-right-color: rgba(255,255,255,0.2); }
.site-header.scrolled .hdr-contact-bar { background: rgba(62,92,57,0.95); }
.site-header.scrolled .hdr-nav { background: var(--sage-deeper); }

.hero {
  position: relative; width: 100%; height: 100vh; min-height: 600px;
  overflow: hidden; display: flex; align-items: center; justify-content: center;
  background: #1a2e1a;
}
.hero-video-wrap { position: absolute; inset: 0; overflow: hidden; z-index: 0; }
.hero-mp4 {
  position: absolute; top: 50%; left: 50%;
  width: 177.78vh; height: 100vh; min-width: 100%; min-height: 56.25vw;
  transform: translate(-50%,-50%); pointer-events: none; object-fit: cover;
}
.hero-overlay {
  position: absolute; inset: 0; z-index: 2;
  background: linear-gradient(to bottom, rgba(10,20,10,0.30) 0%, rgba(10,20,10,0.45) 45%, rgba(6,16,6,0.74) 100%);
  pointer-events: none;
}

.marquee-bar {
  background: var(--sage-dark); color: white; padding: 0.72rem 0; overflow: hidden;
  -webkit-mask-image: linear-gradient(to right, transparent 0%, black 5%, black 95%, transparent 100%);
  mask-image: linear-gradient(to right, transparent 0%, black 5%, black 95%, transparent 100%);
}
.marquee-track {
  display: flex; gap: 3rem;
  animation: marquee 35s linear infinite; white-space: nowrap;
}
.marquee-track span { font-size: 0.74rem; letter-spacing: 0.1em; text-transform: uppercase; opacity: 0.9; }
.marquee-track span::before { content: "* "; color: var(--gold-light); }
@keyframes marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }

section { padding: 4.5rem 2rem; }
.section-center-head { text-align: center; margin-bottom: 2.5rem; }
.tag {
  font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.15em;
  color: var(--sage); font-weight: 600; display: flex; align-items: center;
  gap: 0.5rem; margin-bottom: 0.5rem;
}
.tag::after { content:""; width:36px; height:1.5px; background: var(--sage-light); }
.tag-center {
  font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.15em;
  color: var(--sage); font-weight: 600; margin-bottom: 0.4rem; display: inline-block;
}
.section-center-head h2 {
  font-family: "Playfair Display", serif;
  font-size: clamp(1.7rem, 3vw, 2.4rem); font-weight: 700; color: var(--text-dark);
}
.section-header {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 1.2rem; border-bottom: 2px solid var(--sage-pale); padding-bottom: 0.6rem;
}
.section-header h3 { font-family: "Playfair Display", serif; font-size: 1.2rem; color: var(--text-dark); }
.section-header a { font-size: 0.72rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.07em; color: var(--sage-dark); }
.section-header a:hover { color: var(--sage-deeper); }

.intro-section { background: white; }
.intro-inner { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 3.5rem; align-items: center; }
.intro-img-wrap { border-radius: 10px; overflow: hidden; position: relative; }
.about-slider { position: relative; width: 100%; aspect-ratio: 4/3; border-radius: 10px; overflow: hidden; box-shadow: 0 8px 32px rgba(62,92,57,0.15); }
.about-slider-track { display: flex; width: 500%; height: 100%; transition: transform 0.7s cubic-bezier(0.77,0,0.175,1); }
.about-slide { width: 20%; height: 100%; display: flex; align-items: center; justify-content: center; overflow: hidden; position: relative; flex-shrink: 0; }
.about-slide img { width: 100%; height: 100%; object-fit: cover; object-position: center; display: block; }
.slide-1 { background: linear-gradient(135deg, #5C7A55, #3E5C39); }
.slide-2 { background: linear-gradient(135deg, #7D9B76, #5C7A55); }
.slide-3 { background: linear-gradient(135deg, #A8C4A2, #7D9B76); }
.slide-4 { background: linear-gradient(135deg, #D4E6CF, #A8C4A2); }
.slide-5 { background: linear-gradient(135deg, #3E5C39, #7D9B76); }
.about-slider-dots { position: absolute; bottom: 0.85rem; left: 50%; transform: translateX(-50%); display: flex; gap: 0.45rem; z-index: 5; }
.dot { width: 8px; height: 8px; border-radius: 50%; background: rgba(255,255,255,0.45); cursor: pointer; transition: background 0.3s, transform 0.3s; border: none; }
.dot.active { background: white; transform: scale(1.3); }
.slide-prev, .slide-next {
  position: absolute; top: 50%; transform: translateY(-50%);
  background: rgba(255,255,255,0.2); border: none; color: white;
  font-size: 1.6rem; line-height: 1; width: 36px; height: 36px;
  border-radius: 50%; cursor: pointer; z-index: 5;
  display: flex; align-items: center; justify-content: center;
  backdrop-filter: blur(4px);
}
.slide-prev { left: 0.75rem; } .slide-next { right: 0.75rem; }
.slide-prev:hover, .slide-next:hover { background: rgba(255,255,255,0.38); }
.intro-text h2 { font-family: "Playfair Display", serif; font-size: 1.75rem; font-weight: 700; color: var(--text-dark); line-height: 1.25; margin-bottom: 1rem; }
.intro-text p { font-size: 0.88rem; color: var(--text-mid); line-height: 1.78; margin-bottom: 1rem; }
.intro-links { display: flex; gap: 0.85rem; flex-wrap: wrap; margin-top: 1.5rem; }
.read-more { display: inline-flex; align-items: center; gap: 0.4rem; background: var(--sage-dark); color: white; padding: 0.62rem 1.5rem; border-radius: 2px; font-size: 0.78rem; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; }
.read-more:hover { background: var(--sage-deeper); }
.read-more.outline { background: transparent; border: 1.5px solid var(--sage); color: var(--sage-dark); }
.read-more.outline:hover { background: var(--sage-pale); }

.courses-section { background: linear-gradient(rgba(30,50,30,0.82), rgba(20,38,20,0.88)), url('images/slide1.jpg') center/cover no-repeat fixed; padding: 5rem 2rem; color: white; }
.courses-inner { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1fr 2fr; gap: 4rem; align-items: center; }
.courses-left .courses-tag { font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.18em; color: var(--sage-light); font-weight: 600; margin-bottom: 0.5rem; }
.courses-left h2 { font-family: "Playfair Display", serif; font-size: 2.4rem; font-weight: 700; color: white; margin-bottom: 1.25rem; line-height: 1.15; }
.courses-left p { font-size: 0.9rem; line-height: 1.8; color: rgba(255,255,255,0.78); margin-bottom: 2rem; }
.btn-courses { display: inline-flex; align-items: center; gap: 0.4rem; background: var(--sage); color: white; padding: 0.7rem 1.6rem; border-radius: 2px; font-size: 0.78rem; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; }
.btn-courses:hover { background: var(--sage-dark); }
.btn-courses::after { content: "->"; }
.courses-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; }
.course-card { background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.15); border-radius: 10px; padding: 1.75rem 1rem; text-align: center; display: flex; flex-direction: column; align-items: center; gap: 0.85rem; backdrop-filter: blur(6px); color: white; transition: background 0.25s, transform 0.25s, border-color 0.25s; }
.course-card:hover { background: rgba(125,155,118,0.28); border-color: var(--sage-light); transform: translateY(-4px); }
.course-icon { width: 56px; height: 56px; display: flex; align-items: center; justify-content: center; }
.course-icon svg { width: 100%; height: 100%; stroke: white; }
.course-card span { font-size: 0.75rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em; color: rgba(255,255,255,0.9); line-height: 1.3; }

.events-notices { background: white; }
.events-notices-inner { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 2fr 1fr; gap: 3rem; }
.event-list { display: flex; flex-direction: column; gap: 0; }
.event-item { display: grid; grid-template-columns: 145px 1fr; gap: 1rem; padding: 1rem 0; border-bottom: 1px solid var(--cream-dark); transition: padding-left 0.2s; align-items: center; }
.event-item:hover { padding-left: 0.4rem; }
.event-photo { width: 145px; height: 100px; border-radius: 6px; overflow: hidden; background: var(--sage-pale); flex-shrink: 0; }
.event-photo img { width: 100%; height: 100%; object-fit: cover; object-position: center; display: block; transition: transform 0.3s; }
.event-item:hover .event-photo img { transform: scale(1.05); }
.event-info h4 { font-size: 0.9rem; font-weight: 600; color: var(--text-dark); line-height: 1.4; margin-bottom: 0.35rem; }
.event-info h4 a { color: var(--text-dark); transition: color 0.2s; }
.event-info h4 a:hover { color: var(--sage-dark); }
.event-date-tag { margin-bottom: 0.35rem; }
.event-date-tag span { display: inline-block; background: var(--sage-deeper); color: white; font-size: 0.68rem; font-weight: 600; letter-spacing: 0.06em; padding: 0.18rem 0.65rem; border-radius: 2px; }
.event-info p { font-size: 0.78rem; color: var(--text-light); line-height: 1.5; }
.notice-list { list-style: none; display: flex; flex-direction: column; }
.notice-item { padding: 0.85rem 0; border-bottom: 1px solid var(--cream-dark); transition: padding-left 0.2s; }
.notice-item:hover { padding-left: 0.4rem; }
.notice-tag { display: inline-block; background: var(--sage-pale); color: var(--sage-dark); font-size: 0.58rem; text-transform: uppercase; letter-spacing: 0.07em; padding: 0.1rem 0.45rem; border-radius: 100px; font-weight: 600; margin-bottom: 0.22rem; }
.notice-item h4 { font-size: 0.86rem; font-weight: 500; color: var(--text-dark); line-height: 1.4; margin-bottom: 0.18rem; }
.notice-item .date { font-size: 0.72rem; color: var(--text-light); }
.notice-item .date a { color: var(--sage-dark); }

.principal { background: var(--sage-deeper); padding: 4rem 2rem; color: white; }
.principal-inner { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 260px 1fr; gap: 3.5rem; align-items: center; }
.principal-photo { width: 240px; height: 300px; border-radius: 10px; background: linear-gradient(160deg, var(--sage-pale), var(--sage-light)); display: flex; align-items: center; justify-content: center; box-shadow: 0 12px 40px rgba(0,0,0,0.28); }
.photo-placeholder { font-family: "Playfair Display", serif; font-size: 0.95rem; color: var(--sage-deeper); text-align: center; font-style: italic; padding: 1rem; }
.principal-text .label { font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.18em; color: var(--sage-light); font-weight: 600; margin-bottom: 0.4rem; }
.principal-text h2 { font-family: "Playfair Display", serif; font-size: 1.9rem; margin-bottom: 0.25rem; }
.principal-text .title { font-size: 0.82rem; color: var(--sage-light); margin-bottom: 1.4rem; letter-spacing: 0.05em; }
.principal-text p { font-family: "Cormorant Garamond", serif; font-size: 1.1rem; opacity: 0.88; line-height: 1.8; margin-bottom: 1.5rem; max-width: 640px; }
.btn-white { display: inline-flex; align-items: center; gap: 0.4rem; background: white; color: var(--sage-deeper); padding: 0.6rem 1.5rem; border-radius: 2px; font-size: 0.78rem; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; }
.btn-white:hover { background: var(--cream-warm); }

.achievers-section { background: white; padding: 4rem 2rem; }
.achievers-inner { max-width: 1200px; margin: 0 auto; }
.achievers-title { font-family: "Playfair Display", serif; font-size: clamp(1.6rem, 3vw, 2.2rem); font-weight: 700; color: var(--text-dark); margin-bottom: 2rem; }
.achievers-slider-wrap { display: flex; align-items: center; gap: 0.5rem; }
.achievers-track-outer { flex: 1; overflow: hidden; }
.achievers-track { display: flex; transition: transform 0.5s ease; }
.ach-card { flex: 0 0 25%; padding: 0 0.6rem; box-sizing: border-box; }
.ach-photo { width: 100%; aspect-ratio: 3/4; overflow: hidden; border-radius: 4px; background: var(--sage-pale); margin-bottom: 1rem; }
.ach-photo img { width: 100%; height: 100%; object-fit: cover; object-position: top center; display: block; transition: transform 0.4s; }
.ach-card:hover .ach-photo img { transform: scale(1.04); }
.ach-info h4 { font-family: "Playfair Display", serif; font-size: 1rem; font-weight: 700; color: var(--text-dark); margin-bottom: 0.5rem; }
.ach-line { width: 40px; height: 2px; background: var(--sage); margin-bottom: 0.5rem; }
.ach-info p { font-size: 0.84rem; color: var(--text-mid); line-height: 1.55; }
.ach-prev, .ach-next { flex-shrink: 0; width: 38px; height: 38px; border-radius: 50%; background: var(--sage-pale); border: 1.5px solid var(--sage-light); color: var(--sage-deeper); font-size: 1.5rem; line-height: 1; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.ach-prev:hover, .ach-next:hover { background: var(--sage); border-color: var(--sage-dark); color: white; }
@media (max-width: 1100px) { .ach-card { flex: 0 0 33.33%; } }
@media (max-width: 900px)  { .ach-card { flex: 0 0 50%; } }
@media (max-width: 600px)  { .ach-card { flex: 0 0 100%; } }

.creative-stats { position: relative; background: linear-gradient(135deg, var(--sage-deeper) 0%, #2a4a28 50%, var(--sage-dark) 100%); padding: 4rem 2rem; overflow: hidden; }
.cs-bg-text { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); font-family: "Playfair Display", serif; font-size: clamp(6rem, 18vw, 14rem); font-weight: 700; color: rgba(255,255,255,0.04); white-space: nowrap; pointer-events: none; letter-spacing: 0.2em; user-select: none; }
.cs-inner { max-width: 1000px; margin: 0 auto; display: flex; align-items: center; justify-content: center; gap: 0; position: relative; z-index: 1; }
.cs-item { flex: 1; text-align: center; display: flex; flex-direction: column; align-items: center; gap: 0.3rem; padding: 0 1.5rem; }
.cs-num { font-family: "Playfair Display", serif; font-size: clamp(3rem, 5vw, 5rem); font-weight: 700; color: white; line-height: 1; display: inline-block; }
.cs-plus { font-family: "Playfair Display", serif; font-size: 2rem; font-weight: 700; color: var(--sage-light); line-height: 1; min-height: 2rem; }
.cs-label { font-size: 0.82rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.18em; color: rgba(255,255,255,0.65); margin-top: 0.25rem; }
.cs-divider { width: 1px; height: 100px; background: linear-gradient(to bottom, transparent, rgba(255,255,255,0.25), transparent); flex-shrink: 0; }

.moments { background: var(--cream-warm); }
.moments-inner { max-width: 1200px; margin: 0 auto; }
.moments-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1.5rem; }
.moments-header h2 { font-family: "Playfair Display", serif; font-size: 1.4rem; color: var(--text-dark); }
.moments-header a { font-size: 0.72rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.07em; color: var(--sage-dark); }
.gallery-grid { display: grid; grid-template-columns: repeat(3, 1fr); grid-template-rows: auto; gap: 0.6rem; }
.gallery-item:nth-child(1) { grid-column: 1; grid-row: 1 / 3; }
.gallery-item:nth-child(2) { grid-column: 2; grid-row: 1; }
.gallery-item:nth-child(3) { grid-column: 3; grid-row: 1; }
.gallery-item:nth-child(4) { grid-column: 2 / 4; grid-row: 2; }
.gallery-item:nth-child(5) { grid-column: 1; grid-row: 3; }
.gallery-item:nth-child(6) { grid-column: 2; grid-row: 3; }
.gallery-item:nth-child(7) { grid-column: 3; grid-row: 3; }
.gallery-item { border-radius: 6px; overflow: hidden; min-height: 200px; }
.gallery-item:nth-child(1) { min-height: 410px; }
.gal-img { width: 100%; height: 100%; min-height: inherit; background: linear-gradient(135deg, var(--sage-pale), var(--cream-dark)); display: flex; align-items: center; justify-content: center; cursor: pointer; overflow: hidden; }
.gal-img img { width: 100%; height: 100%; object-fit: cover; object-position: center; display: block; transition: transform 0.4s; }
.gallery-item:hover .gal-img img { transform: scale(1.07); }

.cta-band {
  background-color: var(--sage-deeper);
  background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.04'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E"),
    linear-gradient(135deg, var(--sage-deeper) 0%, #2d5229 50%, var(--sage-dark) 100%);
  padding: 5rem 3rem; text-align: center; color: white;
  position: relative; overflow: hidden;
}
.cta-band::before { content: ''; position: absolute; top: -80px; right: -80px; width: 300px; height: 300px; border-radius: 50%; background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.06); }
.cta-band::after { content: ''; position: absolute; bottom: -60px; left: -60px; width: 220px; height: 220px; border-radius: 50%; background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.06); }
.cta-band h2 { font-family: "Playfair Display", serif; font-size: clamp(1.8rem, 3vw, 2.6rem); margin-bottom: 1rem; position: relative; z-index: 1; }
.cta-band p { font-family: "Cormorant Garamond", serif; font-size: 1.15rem; opacity: 0.85; max-width: 520px; margin: 0 auto 2.5rem; line-height: 1.7; position: relative; z-index: 1; }
.cta-actions { display: flex; gap: 1rem; justify-content: center; flex-wrap: wrap; position: relative; z-index: 1; }
.btn-cta-solid { background: white; color: var(--sage-deeper); padding: 0.88rem 2.2rem; border-radius: 2px; font-size: 0.82rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; }
.btn-cta-solid:hover { background: var(--cream-warm); transform: translateY(-2px); }
.btn-cta-outline { border: 1.5px solid rgba(255,255,255,0.55); color: white; padding: 0.88rem 2.2rem; border-radius: 2px; font-size: 0.82rem; font-weight: 500; letter-spacing: 0.1em; text-transform: uppercase; }
.btn-cta-outline:hover { border-color: white; background: rgba(255,255,255,0.08); }

footer { background: var(--text-dark); color: var(--cream-warm); padding: 3.5rem 2rem 1.75rem; }
.footer-grid { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: 2.5rem; padding-bottom: 2.5rem; border-bottom: 1px solid rgba(255,255,255,0.08); margin-bottom: 1.75rem; }
.footer-brand img { height: 50px; margin-bottom: 1.1rem; filter: brightness(0) invert(1); opacity: 0.85; }
.footer-brand p { font-size: 0.82rem; opacity: 0.58; line-height: 1.7; }
.footer-contact { font-size: 0.78rem; opacity: 0.45; margin-top: 0.5rem; }
.footer-social { display: flex; gap: 0.5rem; margin-top: 1rem; }
.footer-social a { width: 32px; height: 32px; border-radius: 50%; background: rgba(255,255,255,0.08); display: flex; align-items: center; justify-content: center; color: rgba(255,255,255,0.65); font-size: 0.75rem; font-weight: 700; }
.footer-social a:hover { background: var(--sage); color: white; }
.footer-col h5 { font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.12em; color: var(--sage-light); margin-bottom: 0.9rem; }
.footer-col ul { list-style: none; display: flex; flex-direction: column; gap: 0.55rem; }
.footer-col ul a { color: rgba(242,234,216,0.58); font-size: 0.82rem; }
.footer-col ul a:hover { color: var(--cream-warm); }
.footer-bottom { max-width: 1200px; margin: 0 auto; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 1rem; }
.footer-bottom p { font-size: 0.75rem; opacity: 0.4; }
.footer-accred { display: inline-flex; align-items: center; gap: 0.45rem; background: rgba(168,196,162,0.1); border: 1px solid rgba(168,196,162,0.18); padding: 0.3rem 0.8rem; border-radius: 100px; font-size: 0.7rem; color: var(--sage-light); }

.mob-hamburger { display: none; }
.top-nav-panel { display: none; }
.reveal-hidden { opacity: 0; transform: translateY(20px); transition: opacity 0.55s ease, transform 0.55s ease; }
.reveal-hidden.revealed { opacity: 1; transform: translateY(0); }

::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: var(--cream-warm); }
::-webkit-scrollbar-thumb { background: var(--sage); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: var(--sage-dark); }

@media (max-width: 1100px) {
  .hdr-quicklinks { display: none; }
  .hdr-center-links a { font-size: 0.65rem; padding: 0.3rem 0.6rem; }
  .hdr-nav ul > li > a { font-size: 10px; padding: 0.72rem 0.42rem; letter-spacing: 0.02em; }
  .courses-grid { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 900px) {
  .hdr-contact-bar { display: flex; flex-wrap: wrap; gap: 0.3rem; height: auto; padding: 0.4rem 1rem; font-size: 0.6rem; }
  .hdr-contact-left { gap: 0.6rem; flex-wrap: wrap; }
  .hdr-contact-left span { font-size: 0.6rem; }
  .hdr-contact-left span:nth-child(2), .hdr-contact-left span:nth-child(3) { display: none; }
  .site-header { height: auto; position: fixed; top: 0; left: 0; right: 0; z-index: 2000; }
  .hdr-brand-bar { height: 56px; padding: 0 1rem; background: white; backdrop-filter: none; border-bottom: 2px solid var(--sage); display: flex; align-items: center; justify-content: space-between; position: relative; box-shadow: 0 2px 12px rgba(0,0,0,0.1); }
  .hdr-logo-block { clip-path: none; border-right: none; padding: 0; background: transparent; flex-shrink: 0; }
  .hdr-logo-block img { height: 40px; }
  .hdr-right-block { display: none; }
  .hdr-center-links { display: none; }
  .hdr-nav { display: none; position: fixed; top: 90px; left: 0; right: 0; z-index: 1999; max-height: calc(100vh - 90px); overflow-y: auto; box-shadow: 0 8px 24px rgba(0,0,0,0.2); }
  .hdr-nav.mob-open { display: block; }
  .hdr-nav ul { flex-direction: column; background: var(--sage-deeper); width: 100%; justify-content: flex-start; padding: 0; }
  .hdr-nav ul > li { width: 100%; position: relative; }
  .hdr-nav ul > li > a { display: flex; align-items: center; justify-content: space-between; width: 100%; font-size: 13px; font-weight: 600; letter-spacing: 0.05em; text-transform: uppercase; padding: 0.9rem 1.25rem; color: rgba(255,255,255,0.92); border-bottom: 1px solid rgba(255,255,255,0.08); border-left: 3px solid transparent; white-space: normal; }
  .hdr-nav ul > li > a::after { display: none; }
  .hdr-nav ul > li > a:hover, .hdr-nav ul > li > a.active { background: rgba(255,255,255,0.08); border-left-color: var(--sage-light); color: white; }
  .caret { border-top-color: rgba(255,255,255,0.6); flex-shrink: 0; }
  .hdr-nav .dropdown { position: static; opacity: 1; visibility: visible; transform: none; box-shadow: none; border-top: none; border-left: 3px solid var(--sage-light); margin-left: 1.25rem; display: none !important; background: rgba(0,0,0,0.18); border-radius: 0; min-width: unset; width: calc(100% - 1.25rem); flex-direction: column !important; }
  .hdr-nav ul > li:hover > .dropdown { display: none !important; }
  .hdr-nav ul > li.mob-dd-open > .dropdown { display: flex !important; opacity: 1; visibility: visible; }
  .hdr-nav ul > li.mob-dd-open > a .caret { transform: rotate(180deg); border-top-color: white; }
  .hdr-nav .dropdown li a { display: block; color: rgba(255,255,255,0.8); padding: 0.65rem 1.2rem; font-size: 12px; font-weight: 500; text-transform: none; }
  .hdr-nav .dropdown li a:hover { background: rgba(255,255,255,0.08); color: white; padding-left: 1.2rem; }
  .top-hamburger { display: flex; flex-direction: column; gap: 4px; cursor: pointer; background: transparent; border: none; padding: 0.3rem 0.5rem; flex-shrink: 0; }
  .top-hamburger span { display: block; width: 20px; height: 2px; background: white; border-radius: 2px; transition: all 0.25s; }
  .main-hamburger { display: flex; flex-direction: column; gap: 5px; cursor: pointer; background: transparent; border: none; padding: 0.5rem; flex-shrink: 0; }
  .main-hamburger span { display: block; width: 22px; height: 2.5px; background: var(--sage-deeper); border-radius: 2px; transition: all 0.25s; }
  .main-hamburger.is-open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  .main-hamburger.is-open span:nth-child(2) { opacity: 0; }
  .main-hamburger.is-open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
  .top-nav-panel { display: none; position: fixed; left: 0; right: 0; background: var(--sage-deeper); z-index: 1998; flex-direction: column; }
  .top-nav-panel.open { display: flex; }
  .top-nav-panel a { padding: 0.75rem 1.25rem; color: rgba(255,255,255,0.9); font-size: 0.82rem; font-weight: 500; border-bottom: 1px solid rgba(255,255,255,0.1); letter-spacing: 0.03em; }
  .top-nav-panel a:hover { background: rgba(255,255,255,0.08); color: white; }
  .mob-hamburger.is-open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  .mob-hamburger.is-open span:nth-child(2) { opacity: 0; }
  .mob-hamburger.is-open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
  .hero { margin-top: 60px; height: 280px; min-height: unset; }
  section { padding: 3rem 1.25rem; }
  .intro-inner, .principal-inner { grid-template-columns: 1fr; gap: 2rem; }
  .events-notices-inner { grid-template-columns: 1fr; gap: 2rem; }
  .event-item { grid-template-columns: 100px 1fr; }
  .event-photo { width: 100px; height: 72px; }
  .courses-inner { grid-template-columns: 1fr; gap: 2.5rem; }
  .courses-grid { grid-template-columns: repeat(4, 1fr); }
  .gallery-grid { grid-template-columns: repeat(2,1fr); }
  .gallery-item:nth-child(n) { grid-column: auto; grid-row: auto; min-height: 160px; }
  .gallery-item:nth-child(1) { grid-column: 1 / 3; min-height: 220px; }
  .footer-grid { grid-template-columns: 1fr 1fr; }
  .cta-band { padding: 3rem 1.25rem; }
  .cs-divider { display: none; }
}

@media (max-width: 600px) {
  .courses-grid { grid-template-columns: repeat(2, 1fr); }
  .gallery-grid { grid-template-columns: repeat(2,1fr); }
  .gallery-item:nth-child(n) { grid-column: auto; grid-row: auto; min-height: 140px; }
  .footer-grid { grid-template-columns: 1fr; }
  .principal-photo { width: 100%; height: 200px; }
  .cs-inner { flex-wrap: wrap; gap: 2rem; }
  .cs-item { flex: 0 0 45%; }
}

/* ================================================================
   UNIFIED HEADER – copied from inner.css so the home page menu is
   exactly the same as every other page (same rules, same order)
   ================================================================ */
:root { --forest:#3E5C39; --forest-dk:#1a3318; --forest-md:#2d5229; }
/* ===== MEGA MENU ===== */
.dropdown--mega {
  display: none;
  position: absolute;
  top: 0;
  left: 100%;
  background: white;
  border-left: 3px solid #3E5C39;
  box-shadow: 4px 8px 32px rgba(0,0,0,0.12);
  min-width: 520px;
  padding: 1.5rem;
  gap: 0;
  flex-direction: row !important;
  z-index: 999;
}
.hdr-nav ul > li:hover .dropdown--mega { display: flex !important; }
.mega-col {
  flex: 1;
  padding: 0 1.25rem;
  border-right: 1px solid #F0EDE6;
  list-style: none;
}
.mega-col:last-child { border-right: none; }
.mega-col-title {
  display: block;
  font-size: 0.68rem;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  font-weight: 700;
  color: #3E5C39;
  margin-bottom: 0.85rem;
  padding-bottom: 0.5rem;
  border-bottom: 1px solid #E8DCC8;
}
.mega-col ul { list-style: none; padding: 0; margin: 0; }
.mega-col ul li a {
  display: block;
  padding: 0.45rem 0;
  font-size: 0.85rem;
  color: #4A5447;
  font-weight: 500;
  transition: color 0.2s, padding-left 0.2s;
  border: none;
  background: none;
}
.mega-col ul li a:hover {
  color: #3E5C39;
  padding-left: 6px;
}

/* ===== RIGHT SIDE FLYOUT SUBMENUS ===== */
.hdr-nav .has-sub { position: relative !important; }
.hdr-nav .sub-right {
  position: absolute !important;
  top: 0 !important;
  left: 100% !important;
  min-width: 220px !important;
  opacity: 0 !important;
  visibility: hidden !important;
  transform: translateX(4px) !important;
  transition: opacity 0.2s, visibility 0.2s, transform 0.2s !important;
  border-top: 3px solid #3E5C39 !important;
  border-left: none !important;
}
.hdr-nav .has-sub:hover > .sub-right {
  opacity: 1 !important;
  visibility: visible !important;
  transform: translateX(0) !important;
}
/* Remove mega menu styles no longer needed */
.dropdown--mega { display: none !important; }

/* ===== HEADER FIX - matches style.css brand-bar classes ===== */
.hdr-brand-accred { font-size:0.68rem;color:rgba(255,255,255,0.6);margin-top:0.15rem; }
.hdr-brand-actions { display:flex;align-items:center;gap:1rem; }
.hdr-login-group { position:relative; }
.hdr-login-toggle { display:flex;align-items:center;gap:0.4rem;background:rgba(255,255,255,0.12);border:1px solid rgba(255,255,255,0.25);color:white;padding:0.5rem 1rem;border-radius:6px;font-size:0.82rem;font-weight:600;cursor:pointer;font-family:"Jost",sans-serif; }
.hdr-login-toggle svg { width:16px;height:16px; }
.hdr-login-drop { display:none;position:absolute;right:0;top:calc(100% + 6px);background:white;border:1px solid #E8DCC8;border-radius:8px;min-width:160px;box-shadow:0 8px 24px rgba(0,0,0,0.12);z-index:999; }
.hdr-login-drop.open { display:block; }
.hdr-login-drop a { display:block;padding:0.65rem 1rem;font-size:0.84rem;color:#2A2F27;text-decoration:none;border-bottom:1px solid #F0EDE6; }
.hdr-login-drop a:last-child { border-bottom:none; }
.hdr-login-drop a:hover { background:#FAF6EF;color:#3E5C39; }
.hdr-admission-btn { background:white;color:#3E5C39;padding:0.6rem 1.4rem;border-radius:6px;font-size:0.82rem;font-weight:700;text-decoration:none;white-space:nowrap;transition:all 0.2s; }
.hdr-admission-btn:hover { background:#FAF6EF; }
.hdr-topbar-right { display:flex;gap:1rem;margin-left:auto; }
.hdr-topbar-right a { font-size:0.72rem;color:rgba(255,255,255,0.7);text-decoration:none;text-transform:uppercase;letter-spacing:0.06em; }
.hdr-topbar-right a:hover { color:white; }
.mob-hamburger { display:none;flex-direction:column;gap:5px;background:none;border:none;cursor:pointer;padding:0.5rem; }
.mob-hamburger span { display:block;width:22px;height:2px;background:white;border-radius:2px;transition:all 0.3s; }
@media (max-width:900px) {
  .hdr-brand-bar { flex-wrap:wrap;padding:0.75rem 1rem; }
  .hdr-brand img { height:52px; }
  .hdr-brand-name { font-size:1.1rem; }
  .hdr-brand-accred { display:none; }
  .mob-hamburger { display:flex;margin-left:auto; }
  .hdr-brand-actions { display:none; }
  .hdr-topbar-right { display:none; }
  .hdr-nav { display:none; }
  .hdr-nav.open { display:block; }
}

/* 2-column student life dropdown */
.dropdown--2col {
  display: none;
  grid-template-columns: 1fr 1fr !important;
  min-width: 460px !important;
  right: 0 !important;
  left: auto !important;
}
.hdr-nav ul > li:hover > .dropdown--2col { display: grid !important; }
@media (max-width:900px) {
  .dropdown--2col { grid-template-columns: 1fr !important; min-width: unset !important; }
  .hdr-nav ul > li.open > .dropdown--2col { display: flex !important; flex-direction:column; }
}

/* 3-column dropdown */
.dropdown--3col {
  display: none;
  grid-template-columns: 1fr 1fr 1fr !important;
  min-width: 540px !important;
  left: 0 !important;
  right: auto !important;
}
.hdr-nav ul > li:hover > .dropdown--3col { display: grid !important; }
@media (max-width:900px) {
  .dropdown--3col { grid-template-columns: 1fr !important; min-width: unset !important; }
  .hdr-nav ul > li.open > .dropdown--3col { display: flex !important; flex-direction:column; }
}

.site-header {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 1000;
  background: var(--forest);
  box-shadow: 0 2px 12px rgba(0,0,0,0.15);
}
.site-header.scrolled { box-shadow: 0 4px 24px rgba(62,92,57,0.25); }

.hdr-contact-bar {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  padding: 0.4rem 2rem;
  background: rgba(0,0,0,0.2);
  border-bottom: 1px solid rgba(255,255,255,0.08);
  flex-wrap: wrap;
}
.hdr-contact-left {
  display: flex;
  align-items: center;
  gap: 1.25rem;
  flex: 1;
}
.hdr-contact-left span {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.72rem;
  color: rgba(255,255,255,0.78);
  white-space: nowrap;
}
.hdr-contact-left svg { width:11px;height:11px;fill:var(--sage-light);flex-shrink:0; }
.hdr-social { display:flex;align-items:center;gap:0.5rem; }
.hdr-social a {
  width:26px;height:26px;border-radius:50%;
  background:rgba(255,255,255,0.12);
  display:flex;align-items:center;justify-content:center;
  transition:background 0.2s;
}
.hdr-social a:hover { background:rgba(255,255,255,0.25); }
.hdr-social svg { width:13px;height:13px;fill:white; }
.hdr-topbar-right { display:flex;align-items:center;gap:1rem; }
.hdr-topbar-right a {
  font-size:0.68rem;color:rgba(255,255,255,0.65);
  text-transform:uppercase;letter-spacing:0.06em;transition:color 0.2s;
}
.hdr-topbar-right a:hover { color:white; }

.hdr-brand-bar {
  display:flex;align-items:center;justify-content:space-between;
  padding:0.6rem 2rem;background:var(--forest);
  border-bottom:1px solid rgba(255,255,255,0.08);
}
.hdr-logo-block { display:flex;align-items:center; }
.logo-link { display:flex;align-items:center; }
.logo-link img { height:62px;width:auto; }

.hdr-right-block {
  display:flex;align-items:center;gap:1rem;flex:1;justify-content:flex-end;
}
.hdr-badges { display:flex;align-items:center;gap:0.5rem; }
.badge-circle {
  width:52px;height:52px;border-radius:50%;
  border:2px solid rgba(255,255,255,0.4);
  display:flex;align-items:center;justify-content:center;
  font-size:0.55rem;font-weight:700;text-align:center;
  color:white;line-height:1.2;text-transform:uppercase;
}
.badge-naac { background:rgba(255,255,255,0.1); }
.badge-nirf { background:rgba(255,165,0,0.2);border-color:rgba(255,165,0,0.5); }
.hdr-center-links { display:flex;align-items:center;gap:1rem; }
.hdr-center-links a {
  font-size:0.72rem;color:rgba(255,255,255,0.75);
  transition:color 0.2s;text-transform:uppercase;letter-spacing:0.05em;
}
.hdr-center-links a:hover { color:white; }
.hdr-quicklinks { position:relative; }
.login-dropdown-wrap { position:relative; }
.login-btn {
  display:flex;align-items:center;gap:0.4rem;
  background:rgba(255,255,255,0.1);border:1px solid rgba(255,255,255,0.22);
  color:white;padding:0.45rem 0.9rem;border-radius:6px;
  font-size:0.78rem;font-weight:600;cursor:pointer;
  font-family:"Jost",sans-serif;transition:background 0.2s;
}
.login-btn:hover { background:rgba(255,255,255,0.18); }
.login-dropdown {
  display:none;position:absolute;right:0;top:calc(100% + 6px);
  background:white;border:1px solid var(--cream-dark);
  border-radius:8px;min-width:160px;
  box-shadow:0 8px 24px rgba(0,0,0,0.12);z-index:999;overflow:hidden;
}
.login-dropdown-wrap:hover .login-dropdown { display:block; }
.login-dropdown li a {
  display:block;padding:0.6rem 1rem;font-size:0.82rem;
  color:var(--text-dark);border-bottom:1px solid var(--cream-dark);
  transition:background 0.15s;
}
.login-dropdown li:last-child a { border-bottom:none; }
.login-dropdown li a:hover { background:var(--cream);color:var(--forest); }
.btn-admission {
  background:white;color:var(--forest);padding:0.5rem 1.25rem;
  border-radius:6px;font-size:0.78rem;font-weight:700;
  transition:all 0.2s;white-space:nowrap;
}
.btn-admission:hover { background:var(--cream); }

.mob-hamburger {
  display:none;flex-direction:column;gap:5px;
  background:none;border:none;cursor:pointer;padding:0.4rem;
}
.mob-hamburger span {
  display:block;width:22px;height:2px;
  background:white;border-radius:2px;transition:all 0.3s;
}
.main-hamburger { margin-left:auto; }

.hdr-nav {
  background:rgba(0,0,0,0.15);
  border-top:1px solid rgba(255,255,255,0.07);
}
.hdr-nav-inner {
  padding:0 1.5rem;display:flex;width:100%;
  max-width:1400px;margin:0 auto;
}
.hdr-nav ul {
  display:flex;align-items:stretch;flex-wrap:wrap;width:100%;
}
.hdr-nav ul > li { position:relative; }
.hdr-nav ul > li > a {
  display:flex;align-items:center;gap:0.25rem;
  padding:0.7rem 0.8rem;font-size:0.72rem;font-weight:600;
  text-transform:uppercase;letter-spacing:0.07em;
  color:rgba(255,255,255,0.85);white-space:nowrap;
  transition:color 0.2s;position:relative;
}
.hdr-nav ul > li > a::after {
  content:'';position:absolute;
  bottom:0;left:50%;right:50%;height:2px;
  background:white;transition:all 0.25s;
}
.hdr-nav ul > li > a:hover,
.hdr-nav ul > li > a.active { color:white; }
.hdr-nav ul > li > a:hover::after,
.hdr-nav ul > li > a.active::after { left:0.8rem;right:0.8rem; }
.caret {
  display:inline-block;width:0;height:0;
  border-left:4px solid transparent;border-right:4px solid transparent;
  border-top:4px solid rgba(255,255,255,0.7);
  margin-left:2px;vertical-align:middle;
}
.hdr-nav ul > li > .dropdown {
  display:none;position:absolute;top:100%;left:0;
  background:white;min-width:230px;
  border:1px solid var(--cream-dark);
  border-radius:0 0 8px 8px;
  box-shadow:0 8px 28px rgba(0,0,0,0.12);
  z-index:999;flex-direction:column;
}
.hdr-nav ul > li:hover > .dropdown { display:flex; }
.hdr-nav ul > li > .dropdown > li > a {
  display:block;padding:0.55rem 1rem;font-size:0.82rem;font-weight:500;
  color:var(--text-dark);border-bottom:1px solid var(--cream-dark);
  transition:all 0.15s;text-transform:none;letter-spacing:0;
}
.hdr-nav ul > li > .dropdown > li:last-child > a { border-bottom:none; }
.hdr-nav ul > li > .dropdown > li > a:hover {
  background:var(--cream);color:var(--forest);padding-left:1.25rem;
}
.has-sub { position:relative; }
.sub-dropdown {
  display:none !important;position:absolute !important;
  top:0 !important;left:100% !important;min-width:200px !important;
}
.has-sub:hover > .sub-dropdown { display:flex !important; }
.sub-arrow { float:right;font-size:1rem;line-height:1; }

@media (max-width:1024px) {
  .hdr-nav ul > li > a { padding:0.7rem 0.55rem;font-size:0.68rem; }
}
@media (max-width:900px) {
  .hdr-contact-bar { padding:0.35rem 1rem; }
  .hdr-topbar-right { display:none; }
  .hdr-brand-bar { padding:0.5rem 1rem; }
  .logo-link img { height:48px; }
  .hdr-center-links { display:none; }
  .hdr-right-block { gap:0.5rem; }
  .mob-hamburger { display:flex; }
  .hdr-nav { display:none; }
  .hdr-nav.open { display:block;max-height:70vh;overflow-y:auto; }
  .hdr-nav ul { flex-direction:column; }
  .hdr-nav ul > li > a { padding:0.75rem 1rem;font-size:0.82rem;border-bottom:1px solid rgba(255,255,255,0.08); }
  .hdr-nav ul > li > .dropdown {
    position:static;display:none;box-shadow:none;border:none;
    border-radius:0;background:rgba(0,0,0,0.2);
  }
  .hdr-nav ul > li.open > .dropdown { display:flex; }
  .hdr-nav ul > li > .dropdown > li > a {
    color:rgba(255,255,255,0.8);background:transparent;
    border-color:rgba(255,255,255,0.08);padding-left:2rem;
  }
  .hdr-nav ul > li > .dropdown > li > a:hover { background:rgba(255,255,255,0.08);color:white; }
}
@media (max-width:600px) {
  .hdr-contact-left span:not(:first-child) { display:none; }
  .hdr-badges { display:none; }
}

/* ===== ACADEMICS DROPDOWN – two columns (4th main-menu item) ===== */
@media (min-width:901px) {
  .hdr-nav-inner > ul > li:nth-child(4) > .dropdown,
  .hdr-nav > ul > li:nth-child(4) > .dropdown {
    display:grid !important;
    grid-template-columns:1fr 1fr !important;
    min-width:480px !important;
    left:0 !important;
    right:auto !important;
    column-gap:0;
  }
  .hdr-nav-inner > ul > li:nth-child(4) > .dropdown > li:nth-child(odd),
  .hdr-nav > ul > li:nth-child(4) > .dropdown > li:nth-child(odd) { border-right:1px solid #F0EDE6; }
}

/* ================================================================
   GLASS HEADER – semi-transparent, frosted (all pages)
   The frosted layer is a ::before so the mobile menu keeps working.
   ================================================================ */
body .site-header { background:transparent !important; box-shadow:0 6px 30px rgba(10,25,10,0.18); border-bottom:1px solid rgba(255,255,255,0.14); }
body .site-header::before {
  content:''; position:absolute; inset:0; z-index:-1; pointer-events:none;
  background:linear-gradient(180deg, rgba(30,52,28,0.62) 0%, rgba(40,66,36,0.48) 100%);
  -webkit-backdrop-filter:blur(16px) saturate(1.6);
  backdrop-filter:blur(16px) saturate(1.6);
  transition:background 0.35s ease;
}
body .site-header.scrolled::before { background:linear-gradient(180deg, rgba(30,52,28,0.86) 0%, rgba(40,66,36,0.8) 100%); }

body .site-header .hdr-contact-bar,
body .site-header.scrolled .hdr-contact-bar { background:rgba(0,0,0,0.16); -webkit-backdrop-filter:none; backdrop-filter:none; border-bottom:1px solid rgba(255,255,255,0.08); }
body .site-header .hdr-brand-bar,
body .site-header.scrolled .hdr-brand-bar { background:transparent; -webkit-backdrop-filter:none; backdrop-filter:none; box-shadow:none; border-bottom:1px solid rgba(255,255,255,0.1); }

/* glass menu strip */
body .site-header .hdr-nav,
body .site-header.scrolled .hdr-nav {
  background:linear-gradient(180deg, rgba(255,255,255,0.10) 0%, rgba(255,255,255,0.04) 100%);
  border-top:1px solid rgba(255,255,255,0.16);
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.08);
}
body .site-header .hdr-nav ul > li > a { border-radius:6px 6px 0 0; transition:background 0.2s, color 0.2s; }
body .site-header .hdr-nav ul > li > a:hover,
body .site-header .hdr-nav ul > li > a.active { background:rgba(255,255,255,0.12); color:white; }

/* frosted dropdowns */
body .site-header .hdr-nav .dropdown {
  background:rgba(255,255,255,0.9) !important;
  -webkit-backdrop-filter:blur(14px) saturate(1.4);
  backdrop-filter:blur(14px) saturate(1.4);
  border:1px solid rgba(255,255,255,0.6) !important;
  border-top:3px solid #7D9B76 !important;
  box-shadow:0 14px 40px rgba(10,25,10,0.22) !important;
}
body .site-header .hdr-nav .dropdown li a { background:transparent; }

/* glass buttons in the brand bar */
body .site-header .login-btn { background:rgba(255,255,255,0.12); border:1px solid rgba(255,255,255,0.28); -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); }
body .site-header .badge-circle { -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); }

/* mobile: keep the opened menu readable */
@media (max-width:900px) {
  body .site-header::before { background:rgba(30,52,28,0.9); }
  body .site-header .hdr-nav.open,
  body .site-header .hdr-nav.mob-open { background:rgba(26,46,24,0.97); }
}
/* ================================================================
   STICKY BREADCRUMB – appears under the header once the banner
   scrolls away, so the current page + Home link stay visible
   ================================================================ */
.sticky-crumb {
  position:fixed; left:0; right:0; z-index:990;
  transform:translateY(-110%); opacity:0; pointer-events:none;
  transition:transform 0.3s ease, opacity 0.3s ease;
}
.sticky-crumb::before {
  content:''; position:absolute; inset:0; z-index:-1;
  background:rgba(250,246,239,0.88);
  -webkit-backdrop-filter:blur(12px) saturate(1.4); backdrop-filter:blur(12px) saturate(1.4);
  border-bottom:1px solid rgba(62,92,57,0.15);
  box-shadow:0 6px 18px rgba(26,51,24,0.08);
}
.sticky-crumb.show { transform:translateY(0); opacity:1; pointer-events:auto; }
.sticky-crumb-inner { max-width:1200px; margin:0 auto; padding:0.55rem 2rem; display:flex; align-items:center; gap:1rem; }
.sticky-crumb-title { font-family:"Playfair Display",serif; font-size:1rem; font-weight:700; color:#2A2F27; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:45%; padding-right:1rem; border-right:1px solid #E8DCC8; }
.sticky-crumb .breadcrumb-nav {
  display:flex; align-items:center; flex-wrap:wrap; gap:0.35rem;
  background:none !important; border:none !important; box-shadow:none !important;
  padding:0 !important; margin:0 !important; backdrop-filter:none !important;
  font-size:0.8rem; color:#7A8A76;
}
.sticky-crumb .breadcrumb-nav a { color:#3E5C39 !important; font-weight:600; }
.sticky-crumb .breadcrumb-nav a:hover { text-decoration:underline; }
.sticky-crumb .breadcrumb-nav span { color:#4A5447 !important; }
.sticky-crumb .breadcrumb-nav .bc-sep { color:#A8C4A2 !important; }
@media (max-width:700px) {
  .sticky-crumb-inner { padding:0.5rem 1rem; }
  .sticky-crumb-title { display:none; }
}

/* ================================================================
   HOME – Upcoming Events & Notice Board
   • show only the latest 5 in each
   • both columns the same height, items spread evenly
   ================================================================ */
/* 6th item onwards is hidden (works even if other elements sit in the list) */
.event-list > .event-item ~ .event-item ~ .event-item ~ .event-item ~ .event-item ~ .event-item,
.notice-list > .notice-item ~ .notice-item ~ .notice-item ~ .notice-item ~ .notice-item ~ .notice-item { display:none !important; }

@media (min-width:901px) {
  .events-notices-inner { align-items:stretch; }
  .events-notices-inner > * { display:flex; flex-direction:column; min-width:0; }
  .events-notices-inner > * > .event-list,
  .events-notices-inner > * > .notice-list { flex:1; display:flex; flex-direction:column; }
  /* spread the 5 items so both columns end at the same line */
  .event-list > .event-item { flex:1; }
  .notice-list > .notice-item { flex:1; display:flex; flex-direction:column; justify-content:center; }
  /* keep long titles tidy so heights stay even */
  .event-info h4, .notice-item h4 { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
  .event-info p { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
}

/* Notice Board – compact cards (fixes stretched tag / floating text) */
@media (min-width:901px) {
  .notice-list { gap:0.7rem; }
  .notice-list > .notice-item { justify-content:center; align-items:flex-start; }
}
.notice-list > .notice-item {
  gap:0.3rem; background:#FAF6EF; border:1px solid #E8DCC8; border-left:4px solid #3E5C39;
  border-radius:10px; padding:0.75rem 1rem !important;
  transition:box-shadow 0.2s, transform 0.2s, background 0.2s;
}
.notice-list > .notice-item:hover { padding-left:1rem !important; background:#fff; transform:translateX(3px); box-shadow:0 6px 18px rgba(62,92,57,0.1); }
.notice-list > .notice-item + .notice-item { border-top:1px solid #E8DCC8; }
.notice-item .notice-tag { display:inline-block; align-self:flex-start; width:auto; margin:0; background:#D4E6CF; color:#3E5C39; font-size:0.6rem; font-weight:700; padding:0.15rem 0.6rem; }
.notice-item h4 { margin:0; font-size:0.88rem; font-weight:600; line-height:1.4; }
.notice-item .date { font-size:0.74rem; margin:0; }
.notice-item .date a { display:inline-flex; align-items:center; gap:0.25rem; font-weight:600; color:#3E5C39; }
.notice-item .date a:hover { text-decoration:underline; }
@media (max-width:900px) { .notice-list { gap:0.6rem; } }

/* ===== MOBILE HEADER: logo + white hamburger on one row, no Admission button ===== */
@media (max-width: 900px) {
  .site-header .hdr-brand-bar { display: flex !important; flex-wrap: nowrap !important; align-items: center !important; justify-content: space-between !important; gap: 0.75rem; }
  .site-header .hdr-right-block { display: none !important; }
  .site-header .hdr-logo-block { flex: 1 1 auto; min-width: 0; border-right: 0 !important; padding-right: 0 !important; margin-right: 0 !important; }
  .site-header .hdr-logo-block img { width: auto; max-width: 100%; height: auto; max-height: 46px; }
  .site-header .mob-hamburger { display: flex !important; flex-shrink: 0; margin-left: auto; padding: 0.5rem; background: transparent !important; border: 0; }
  .site-header .mob-hamburger span { background: #fff !important; width: 24px; height: 2px; }
}

/* ===== MOBILE MENU: readable sub-menus (dark background, white text) ===== */
@media (max-width: 900px) {
  .site-header .hdr-nav ul > li > .dropdown,
  .site-header .hdr-nav ul > li > .dropdown--2col,
  .site-header .hdr-nav ul > li > .dropdown--3col,
  .site-header .hdr-nav ul > li > .dropdown--mega {
    position: static !important; transform: none !important; width: auto !important; min-width: 0 !important;
    background: rgba(0, 0, 0, 0.22) !important; box-shadow: none !important; border: 0 !important; border-radius: 0 !important;
    grid-template-columns: 1fr !important; flex-direction: column !important; padding: 0 !important; margin: 0 !important;
  }
  .site-header .hdr-nav ul > li > .dropdown > li { width: 100% !important; border: 0 !important; box-shadow: none !important; }
  .site-header .hdr-nav ul > li > .dropdown > li > a,
  .site-header .hdr-nav ul > li > .dropdown a {
    display: block !important; color: rgba(255, 255, 255, 0.9) !important; background: transparent !important;
    font-size: 0.84rem !important; font-weight: 500 !important; text-transform: none !important; letter-spacing: 0 !important;
    padding: 0.7rem 1rem 0.7rem 2rem !important; border: 0 !important; border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
  }
  .site-header .hdr-nav ul > li > .dropdown a:hover,
  .site-header .hdr-nav ul > li > .dropdown a:focus { background: rgba(255, 255, 255, 0.1) !important; color: #fff !important; }
  .site-header .hdr-nav ul > li > .dropdown a::before,
  .site-header .hdr-nav ul > li > .dropdown a::after { display: none !important; }
}

/* ===== MOBILE: lighter, glassy header + menu panel ===== */
@media (max-width: 900px) {
  body .site-header::before { background: rgba(30, 52, 28, 0.62) !important; -webkit-backdrop-filter: blur(14px) saturate(1.5); backdrop-filter: blur(14px) saturate(1.5); }
  /* one even shade: only the header's glass layer is coloured, every row inside is transparent */
  body .site-header .hdr-contact-bar,
  body .site-header .hdr-brand-bar,
  body .site-header .hdr-logo-block,
  body .site-header.scrolled .hdr-contact-bar,
  body .site-header.scrolled .hdr-brand-bar { background: transparent !important; box-shadow: none !important; }
  body .site-header .hdr-contact-bar { border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important; }
  body .site-header .hdr-brand-bar::before, body .site-header .hdr-brand-bar::after,
  body .site-header .hdr-contact-bar::before, body .site-header .hdr-contact-bar::after { display: none !important; }
  body .site-header::before, body .site-header.scrolled::before { background: rgba(30, 52, 28, 0.66) !important; }
  body .site-header .hdr-nav,
  body .site-header .hdr-nav.open,
  body .site-header .hdr-nav.mob-open {
    background: rgba(34, 58, 31, 0.78) !important;
    -webkit-backdrop-filter: blur(16px) saturate(1.5); backdrop-filter: blur(16px) saturate(1.5);
    border-top: 1px solid rgba(255, 255, 255, 0.12);
  }
  body .site-header .hdr-nav ul > li > .dropdown { background: rgba(0, 0, 0, 0.18) !important; }
  body .site-header .hdr-nav-inner { padding: 0 !important; background: transparent !important; }
  body .site-header .hdr-nav-inner > ul { background: transparent !important; width: 100%; }
  body .site-header .hdr-nav-inner > ul > li > a { padding-left: 1.25rem !important; padding-right: 1.25rem !important; }
  body .site-header .hdr-nav ul > li > .dropdown a { padding-left: 2.25rem !important; }
}

/* ===== MOBILE: taller hero video ===== */
@media (max-width: 900px) {
  .hero { margin-top: 0 !important; height: 70vh !important; min-height: 440px !important; max-height: 640px; }
  .hero-mp4 { top: 0 !important; left: 0 !important; transform: none !important; width: 100% !important; height: 100% !important; min-width: 0 !important; min-height: 0 !important; object-fit: cover; }
}
@media (max-width: 600px) {
  .hero { height: 62vh !important; min-height: 400px !important; }
}

/* ===== HEADER LOGO: same white version as the footer ===== */
.site-header .hdr-logo-block img,
.site-header .logo-link img { filter: brightness(0) invert(1); }

/* ===== HEADER: accreditation logos + top links aligned right ===== */
.site-header .hdr-accred { display: flex; align-items: center; gap: 0.5rem; flex-shrink: 0; }
.site-header .accred-logo { width: 48px; height: 48px; border-radius: 50%; background: #fff; padding: 3px; object-fit: contain; display: block; flex-shrink: 0; filter: none !important; }
.site-header .hdr-accred .badge-circle { width: 48px; height: 48px; flex-shrink: 0; }
.site-header .hdr-center-links { flex: 1; justify-content: flex-end !important; }
@media (max-width: 1250px) {
  .site-header .accred-logo, .site-header .hdr-accred .badge-circle { width: 42px; height: 42px; }
  .site-header .hdr-accred { gap: 0.35rem; }
  .site-header .hdr-center-links a { padding: 0.3rem 0.55rem; }
}
@media (max-width: 1100px) {
  .site-header .hdr-accred .badge-nirf { display: none; }
  .site-header .hdr-right-block { padding: 0 1rem !important; gap: 0.75rem !important; }
  .site-header .accred-logo { width: 38px; height: 38px; padding: 2px; }
  .site-header .hdr-center-links a { padding: 0.3rem 0.45rem; font-size: 0.62rem; }
}
@media (max-width: 1024px) and (min-width: 901px) {
  .site-header .hdr-center-links { display: none !important; }
  .site-header .hdr-right-block { justify-content: flex-end !important; }
}

/* ===== TOP BAR: phone / email links ===== */
.hdr-contact-bar a.hdr-contact-link { color: inherit; text-decoration: none; transition: color 0.2s; }
.hdr-contact-bar a.hdr-contact-link:hover { color: #fff; text-decoration: underline; text-underline-offset: 3px; }

/* ===== MAIN MENU: single white underline on hover / active ===== */
@media (min-width: 901px) {
  body .site-header .hdr-nav ul > li > a,
  body .site-header .hdr-nav ul > li > a:hover,
  body .site-header .hdr-nav ul > li > a.active { border-bottom-color: transparent !important; box-shadow: none !important; }
  body .site-header .hdr-nav ul > li > a::after { background: #fff !important; height: 2px !important; }
}

/* =====================================================================
   FOOTER (ft-*) - logo + about | quick links | quick links | contact
   ===================================================================== */
footer.ft { background: #1a2e18; color: rgba(255,255,255,0.78); padding: 0; margin: 0; font-family: "Jost", sans-serif; }
.ft-inner { max-width: 1240px; margin: 0 auto; padding: 4rem 1.5rem 3rem; display: grid; grid-template-columns: 1.5fr 1fr 1fr 1.35fr; gap: 2.5rem; }
.ft-col h5 { font-family: "Playfair Display", serif; font-size: 1.12rem; font-weight: 700; color: #fff; margin: 0.4rem 0 1.25rem; padding-bottom: 0.7rem; position: relative; letter-spacing: 0; text-transform: none; }
.ft-col h5::after { content: ''; position: absolute; left: 0; bottom: 0; width: 38px; height: 2px; background: #A8C4A2; }
.ft-logo { display: inline-block; margin-bottom: 1.1rem; }
.ft-logo img { height: 58px; width: auto; filter: brightness(0) invert(1); display: block; }
.ft-brand p { font-size: 0.88rem; line-height: 1.8; color: rgba(255,255,255,0.7); margin: 0 0 1.1rem; }
.ft-badges { display: flex; flex-wrap: wrap; gap: 0.4rem; margin-bottom: 1.25rem; }
.ft-badges span { font-size: 0.68rem; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: #D4E6CF; border: 1px solid rgba(168,196,162,0.35); border-radius: 100px; padding: 0.25rem 0.7rem; }
.ft-social { display: flex; gap: 0.55rem; }
.ft-social a { width: 38px; height: 38px; border-radius: 50%; background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.14); display: flex; align-items: center; justify-content: center; color: #fff; transition: background 0.2s, transform 0.2s; }
.ft-social a svg { width: 17px; height: 17px; }
.ft-social a:hover { background: #3E5C39; transform: translateY(-2px); }
.ft-links { list-style: none; margin: 0; padding: 0; }
.ft-links li { margin: 0 0 0.6rem; }
.ft-links a { color: rgba(255,255,255,0.75); text-decoration: none; font-size: 0.9rem; display: inline-flex; align-items: center; gap: 0.5rem; transition: color 0.2s, transform 0.2s; }
.ft-links a::before { content: ''; width: 6px; height: 6px; border-top: 1.5px solid #A8C4A2; border-right: 1.5px solid #A8C4A2; transform: rotate(45deg); flex-shrink: 0; }
.ft-links a:hover { color: #fff; transform: translateX(3px); }
.ft-contact { list-style: none; margin: 0 0 1.25rem; padding: 0; }
.ft-contact li { display: flex; align-items: flex-start; gap: 0.8rem; margin-bottom: 1rem; font-size: 0.9rem; line-height: 1.6; }
.ft-contact a { color: rgba(255,255,255,0.85); text-decoration: none; word-break: break-word; }
.ft-contact a:hover { color: #fff; text-decoration: underline; text-underline-offset: 3px; }
.ft-ico { width: 34px; height: 34px; border-radius: 8px; background: rgba(168,196,162,0.14); color: #A8C4A2; display: flex; align-items: center; justify-content: center; flex-shrink: 0; margin-top: -2px; }
.ft-ico svg { width: 16px; height: 16px; }
.ft-map { display: inline-flex; align-items: center; gap: 0.45rem; background: #3E5C39; color: #fff; text-decoration: none; font-size: 0.82rem; font-weight: 600; padding: 0.6rem 1.1rem; border-radius: 6px; transition: background 0.2s; }
.ft-map svg { width: 15px; height: 15px; }
.ft-map:hover { background: #4f7349; color: #fff; }
.ft-bottom { border-top: 1px solid rgba(255,255,255,0.1); max-width: 1240px; margin: 0 auto; padding: 1.2rem 1.5rem; display: flex; justify-content: space-between; align-items: center; gap: 0.75rem; flex-wrap: wrap; font-size: 0.8rem; color: rgba(255,255,255,0.55); }
.ft-bottom p { margin: 0; }
@media (max-width: 1024px) { .ft-inner { grid-template-columns: 1fr 1fr; gap: 2.25rem; } }
@media (max-width: 600px) {
  .ft-inner { grid-template-columns: 1fr 1fr; padding: 3rem 1.1rem 2rem; gap: 2rem 1.25rem; }
  .ft-brand, .ft-inner > .ft-col:last-child { grid-column: 1 / -1; }
  .ft-bottom { flex-direction: column; text-align: center; }
}

/* =====================================================================
   RESPONSIVE CONTENT TABLES (rt-*) - tables typed in admin editors
   ===================================================================== */
.rt-wrap { width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; margin: 1rem 0 1.25rem; border: 1px solid #E8DCC8; border-radius: 10px; background: #fff; }
.rt-table { width: 100% !important; min-width: 560px; border-collapse: collapse; font-size: 0.88rem; margin: 0 !important; border: 0 !important; }
.rt-table th, .rt-table td { padding: 0.7rem 1rem !important; border: 0 !important; border-top: 1px solid #F0EDE6 !important; text-align: left; vertical-align: middle; color: #4A5447; height: auto !important; width: auto !important; }
.rt-table thead th, .rt-table tr.rt-head > * { background: #3E5C39 !important; color: #fff !important; font-size: 0.74rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.06em; white-space: nowrap; border-top: 0 !important; }
.rt-table tbody tr:nth-child(even) td { background: #FCFAF5; }
.rt-table tbody tr:hover td { background: #F3F7F2; }
.rt-table a { color: #3E5C39; word-break: break-all; }
.rt-table p { margin: 0; }
@media (max-width: 700px) {
  .rt-wrap { border: 0; background: transparent; overflow: visible; }
  .rt-stack, .rt-wrap .rt-stack, .inner-page-full .rt-stack { min-width: 0 !important; }
  .rt-stack, .rt-stack tbody, .rt-stack tr, .rt-stack td, .rt-stack th { display: block; width: 100% !important; }
  .rt-stack thead, .rt-stack tr.rt-head { display: none; }
  .rt-stack tr { background: #fff; border: 1px solid #E8DCC8; border-left: 4px solid #3E5C39; border-radius: 10px; margin-bottom: 0.75rem; padding: 0.4rem 0; }
  .rt-stack tbody tr:nth-child(even) td, .rt-stack tbody tr:hover td { background: transparent; }
  .rt-stack td { display: flex; gap: 0.75rem; border: 0 !important; padding: 0.35rem 0.9rem !important; font-size: 0.86rem; }
  .rt-stack td[data-label]::before { content: attr(data-label); flex: 0 0 38%; max-width: 130px; font-size: 0.68rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; color: #7A8A76; padding-top: 0.15rem; }
  .rt-stack td:empty, .rt-stack td:not([data-label]):empty { display: none; }
}


/* ===== Header / footer logo: white transparent PNG (no filter), 90px ===== */
.site-header .hdr-logo-block img,
.site-header .logo-link img { filter: none !important; height: 90px !important; max-height: none !important; width: auto !important; max-width: none !important; }
.ft-logo img { filter: none !important; height: 70px !important; width: auto !important; }
@media (max-width: 1100px) {
  .site-header .hdr-logo-block img, .site-header .logo-link img { height: 64px !important; }
}
@media (max-width: 768px) {
  .site-header .hdr-logo-block img, .site-header .logo-link img { height: auto !important; max-height: 48px !important; max-width: 100% !important; }
}

/* ===== Header logo spacing + Login on one line ===== */
.site-header .hdr-logo-block { padding-right: 1.6rem !important; margin-right: 1.4rem !important; }
.site-header .hdr-logo-block img, .site-header .logo-link img { height: 90px !important; }
.login-btn { white-space: nowrap !important; }
@media (max-width: 1100px) { .site-header .hdr-logo-block img, .site-header .logo-link img { height: 60px !important; } }
@media (max-width: 768px) {
  .site-header .hdr-logo-block { padding-right: 0 !important; margin-right: 0 !important; }
  .site-header .hdr-logo-block img, .site-header .logo-link img { height: auto !important; max-height: 46px !important; }
}


/* ===== Header logo: fit the row ===== */
.site-header .hdr-logo-block { padding-right: 1.1rem !important; margin-right: .6rem !important; flex-shrink: 0; }
.site-header .hdr-logo-block img, .site-header .logo-link img { height: 68px !important; max-width: none !important; }
@media (max-width: 1280px) { .site-header .hdr-logo-block img, .site-header .logo-link img { height: 58px !important; } }
@media (max-width: 1100px) { .site-header .hdr-logo-block img, .site-header .logo-link img { height: 52px !important; } }
@media (max-width: 768px) {
  .site-header .hdr-logo-block { padding-right: 0 !important; margin-right: 0 !important; flex-shrink: 1; }
  .site-header .hdr-logo-block img, .site-header .logo-link img { height: auto !important; max-height: 44px !important; max-width: 100% !important; }
}


/* ===== Accreditation logos: equal-size white discs (HD) ===== */
.site-header .accred-logo { width: 54px !important; height: 54px !important; object-fit: contain !important; background: transparent !important; border: 0 !important; padding: 0 !important; border-radius: 0 !important; box-shadow: none !important; filter: drop-shadow(0 1px 2px rgba(0,0,0,.25)) !important; flex-shrink: 0; }
@media (max-width: 1280px) { .site-header .accred-logo { width: 46px !important; height: 46px !important; } }
@media (max-width: 1100px) { .site-header .accred-logo { width: 42px !important; height: 42px !important; } }
@media (max-width: 768px)  { .site-header .accred-logo { width: 38px !important; height: 38px !important; } }

/* ===== Header row 2: white logo & icon area (desktop), colour logo, equal-height icons ===== */
.logo-link .logo-color { display: none; }
@media (min-width: 901px) {
  body .site-header .hdr-brand-bar,
  body .site-header.scrolled .hdr-brand-bar {
    background: linear-gradient(90deg, #fffffff0 0%, #ffffffa6 55%, rgba(255, 255, 255, .9) 100%) !important;
    -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
    border-bottom: 1px solid rgba(62,92,57,.15) !important; box-shadow: 0 2px 10px rgba(0,0,0,.06) !important;
  }
  body .site-header .hdr-brand-bar::before, body .site-header .hdr-brand-bar::after { display: none !important; }
  .site-header .hdr-logo-block { background: transparent !important; border-right: 1px solid rgba(62,92,57,.18) !important; clip-path: none !important; }
  .site-header .logo-link .logo-white { display: none !important; }
  .site-header .logo-link .logo-color { display: block !important; height: 64px !important; width: auto !important; max-width: none !important; filter: none !important; }
  .site-header .hdr-right-block { background: transparent !important; }

  /* icons: same height, natural colours, no shadow */
  .site-header .hdr-accred { display: flex !important; align-items: center !important; gap: 1.1rem !important; }
  .site-header .accred-logo { height: 50px !important; width: auto !important; max-width: 80px !important; object-fit: contain !important; filter: none !important; background: transparent !important; padding: 0 !important; border-radius: 0 !important; box-shadow: none !important; }

  /* links + buttons readable on white */
  .site-header .hdr-center-links a,
  .site-header.scrolled .hdr-center-links a { color: #2F4A2C !important; border-color: rgba(62,92,57,.2) !important; }
  .site-header .hdr-center-links a:hover { color: #7A9A72 !important; }
  .site-header .login-btn { background: transparent !important; color: #2F4A2C !important; border: 1.5px solid #3E5C39 !important; }
  .site-header .login-btn:hover { background: #3E5C39 !important; color: #fff !important; }
  .site-header .btn-admission { background: #3E5C39 !important; color: #fff !important; border-color: #3E5C39 !important; }
  .site-header .btn-admission:hover { background: #2F4A2C !important; color: #fff !important; }
}
@media (min-width: 901px) and (max-width: 1280px) {
  .site-header .logo-link .logo-color { height: 54px !important; }
  .site-header .accred-logo { height: 42px !important; }
  .site-header .hdr-accred { gap: .7rem !important; }
}
@media (min-width: 901px) and (max-width: 1100px) {
  .site-header .logo-link .logo-color { height: 46px !important; }
  .site-header .accred-logo { height: 36px !important; }
}

/* ===== Hide the top contact bar once the page is scrolled ===== */
.site-header .hdr-contact-bar { max-height: 140px; overflow: hidden; transition: max-height .35s ease, padding .35s ease, opacity .25s ease, border-width .35s ease; }
body .site-header.scrolled .hdr-contact-bar { max-height: 0 !important; min-height: 0 !important; height: 0 !important; padding-top: 0 !important; padding-bottom: 0 !important; opacity: 0; border-width: 0 !important; pointer-events: none; }

/* ===== DESKTOP DROPDOWN ITEMS: same look as inner pages (cream hover, dark text, no underline) ===== */
@media (min-width: 901px) {
  body .site-header .hdr-nav .dropdown li > a,
  body .site-header .hdr-nav .dropdown li > a.active { color: var(--text-dark, #2C3A28) !important; background: transparent !important; border-radius: 0 !important; text-transform: none !important; letter-spacing: 0 !important; }
  body .site-header .hdr-nav .dropdown li > a:hover,
  body .site-header .hdr-nav .dropdown li > a:focus { background: var(--cream, #F6F1E7) !important; color: var(--forest, #2F4A2C) !important; padding-left: 1.25rem !important; }
  body .site-header .hdr-nav .dropdown li > a::after,
  body .site-header .hdr-nav .dropdown li > a::before { display: none !important; content: none !important; }
}

/* ===== Multi-column dropdowns: keep the grid while fading in/out (no 1-column flash on close) ===== */
@media (min-width: 901px) {
  .hdr-nav .dropdown.dropdown--2col,
  .hdr-nav ul > li > .dropdown.dropdown--2col,
  .hdr-nav ul > li:hover > .dropdown.dropdown--2col { display: grid !important; grid-template-columns: 1fr 1fr !important; flex-direction: unset !important; }
  .hdr-nav .dropdown.dropdown--3col,
  .hdr-nav ul > li > .dropdown.dropdown--3col,
  .hdr-nav ul > li:hover > .dropdown.dropdown--3col { display: grid !important; grid-template-columns: 1fr 1fr 1fr !important; flex-direction: unset !important; }
  .hdr-nav .dropdown { pointer-events: none; }
  .hdr-nav ul > li:hover > .dropdown { pointer-events: auto; }
  .hdr-nav .dropdown { transition: opacity .2s ease, visibility 0s linear .2s, transform .2s ease !important; }
  .hdr-nav ul > li:hover > .dropdown { transition: opacity .2s ease, visibility 0s linear 0s, transform .2s ease !important; }
}

/* ===== Login dropdown: same look as the main menu dropdowns (no left line) ===== */
body .site-header .login-dropdown {
  top: calc(100% + 8px) !important; right: 0 !important; min-width: 190px !important; padding: 0 !important; margin: 0 !important;
  background: rgba(255,255,255,.96) !important; -webkit-backdrop-filter: blur(14px) saturate(1.4); backdrop-filter: blur(14px) saturate(1.4);
  border: 1px solid rgba(232,220,200,.9) !important; border-top: 3px solid #7D9B76 !important;
  border-radius: 0 0 8px 8px !important; box-shadow: 0 14px 40px rgba(10,25,10,.22) !important; overflow: hidden !important; list-style: none !important;
}
body .site-header .login-dropdown li { list-style: none !important; margin: 0 !important; border: 0 !important; }
body .site-header .login-dropdown li a {
  display: block !important; padding: .6rem 1.1rem !important; font-size: .84rem !important; font-weight: 500 !important;
  color: #2A2F27 !important; background: transparent !important; text-transform: none !important; letter-spacing: 0 !important;
  border: 0 !important; border-left: 0 !important; border-bottom: 1px solid #F0EADF !important; box-shadow: none !important;
  transition: background .15s, color .15s, padding-left .15s !important;
}
body .site-header .login-dropdown li:last-child a { border-bottom: 0 !important; }
body .site-header .login-dropdown li a:hover,
body .site-header .login-dropdown li a:focus { background: #FAF6EF !important; color: #2F4A2C !important; padding-left: 1.35rem !important; border-left: 0 !important; }
body .site-header .login-dropdown li a::before,
body .site-header .login-dropdown li a::after { display: none !important; content: none !important; }