/* ═══════════════════════════════════════════════════════════
   LVGI — Ocean Blue Glass Theme
   Palette: #0A1931 · #1A3D63 · #4A7FA7 · #B3CFE5 · #F6FAFD
   Loaded LAST — overrides all previous layers.
   ═══════════════════════════════════════════════════════════ */

:root {
  --glass-bg: rgba(255, 255, 255, 0.55);
  --glass-bg-strong: rgba(255, 255, 255, 0.72);
  --glass-border: rgba(179, 207, 229, 0.65);
  --glass-highlight: rgba(255, 255, 255, 0.85);
  --glass-shadow: 0 8px 32px rgba(10, 25, 49, 0.1);
  --glass-shadow-hover: 0 18px 48px rgba(26, 61, 99, 0.18);
  --glass-blur: 18px;
  --navy-deep-grad: linear-gradient(160deg, #0A1931 0%, #1A3D63 55%, #0A1931 100%);
}

/* ─── Ambient Page Background ─────────────────────────────── */
body {
  background: #F6FAFD !important;
}

.page-bg-pattern {
  background:
    radial-gradient(circle at 12% 18%, rgba(179, 207, 229, 0.45) 0%, transparent 42%),
    radial-gradient(circle at 88% 78%, rgba(74, 127, 167, 0.16) 0%, transparent 45%),
    radial-gradient(circle at 55% 45%, rgba(179, 207, 229, 0.2) 0%, transparent 55%),
    #F6FAFD !important;
  background-image:
    radial-gradient(circle at 12% 18%, rgba(179, 207, 229, 0.45) 0%, transparent 42%),
    radial-gradient(circle at 88% 78%, rgba(74, 127, 167, 0.16) 0%, transparent 45%),
    radial-gradient(circle at 55% 45%, rgba(179, 207, 229, 0.2) 0%, transparent 55%) !important;
}

/* Floating aurora orbs behind everything */
.page-bg-pattern::before,
.page-bg-pattern::after {
  content: '';
  position: absolute;
  border-radius: 50%;
  filter: blur(80px);
  pointer-events: none;
}

.page-bg-pattern::before {
  width: 46vw;
  height: 46vw;
  top: -12vw;
  right: -10vw;
  background: radial-gradient(circle, rgba(179, 207, 229, 0.55), rgba(74, 127, 167, 0.12) 70%, transparent);
  animation: lvgi-orb-drift 18s ease-in-out infinite;
}

.page-bg-pattern::after {
  width: 38vw;
  height: 38vw;
  bottom: -14vw;
  left: -8vw;
  background: radial-gradient(circle, rgba(74, 127, 167, 0.3), rgba(179, 207, 229, 0.1) 70%, transparent);
  animation: lvgi-orb-drift 22s ease-in-out -8s infinite reverse;
}

@keyframes lvgi-orb-drift {
  0%, 100% { transform: translate(0, 0) scale(1); }
  33% { transform: translate(-4vw, 3vw) scale(1.08); }
  66% { transform: translate(3vw, -2vw) scale(0.95); }
}

/* ─── Scroll Progress Bar ─────────────────────────────────── */
.lvgi-scroll-progress {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  z-index: 10001;
  background: linear-gradient(90deg, #1A3D63, #4A7FA7 55%, #B3CFE5);
  transform-origin: 0 50%;
  transform: scaleX(0);
  pointer-events: none;
  box-shadow: 0 0 12px rgba(74, 127, 167, 0.6);
}

/* ─── Selection & Scrollbar ───────────────────────────────── */
::selection { background: #B3CFE5; color: #0A1931; }

::-webkit-scrollbar { width: 10px; }
::-webkit-scrollbar-track { background: #EAF2F9; }
::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #4A7FA7, #1A3D63);
  border-radius: 6px;
  border: 2px solid #EAF2F9;
}

/* ─── Glass Cards (re-enable glassmorphism) ───────────────── */
.glass-card,
.holo-card,
.sidebar-widget,
.facilities-showcase-panel,
.contact-cta-form,
.timeline-card {
  background: var(--glass-bg-strong) !important;
  backdrop-filter: blur(var(--glass-blur)) saturate(160%) !important;
  -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(160%) !important;
  border: 1px solid var(--glass-border) !important;
  box-shadow: var(--glass-shadow), inset 0 1px 0 var(--glass-highlight) !important;
  transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.4s, border-color 0.4s;
}

.glass-card:hover,
.holo-card:hover {
  border-color: rgba(74, 127, 167, 0.55) !important;
  box-shadow: var(--glass-shadow-hover), inset 0 1px 0 var(--glass-highlight) !important;
}

/* Shine sweep across glass cards */
.glass-card::after,
.holo-card::after {
  content: '' !important;
  display: block !important;
  position: absolute;
  inset: 0;
  opacity: 0 !important;
  background: linear-gradient(115deg, transparent 35%, rgba(255, 255, 255, 0.55) 50%, transparent 65%) !important;
  background-size: 250% 250% !important;
  background-position: 120% 50%;
  pointer-events: none;
  transition: opacity 0.4s;
  animation: none !important;
  border-radius: inherit;
}

.glass-card:hover::after,
.holo-card:hover::after {
  opacity: 1 !important;
  animation: lvgi-shine-sweep 1.1s ease forwards !important;
}

@keyframes lvgi-shine-sweep {
  from { background-position: 130% 50%; }
  to { background-position: -30% 50%; }
}

/* Card inner surfaces go transparent so glass shows through */
.news-card-content,
.blog-card-content {
  background: transparent !important;
}

.news-card-image,
.blog-card-image {
  background: rgba(179, 207, 229, 0.25) !important;
  border-bottom: 1px solid var(--glass-border) !important;
}

img { background: #EAF2F9; }

/* ─── Header — frosted glass ──────────────────────────────── */
.site-header {
  background: rgba(246, 250, 253, 0.72) !important;
  backdrop-filter: blur(22px) saturate(180%) !important;
  -webkit-backdrop-filter: blur(22px) saturate(180%) !important;
  border-bottom: 1px solid rgba(179, 207, 229, 0.55) !important;
}

.site-header.scrolled,
.is-front-page .site-header.scrolled {
  background: rgba(246, 250, 253, 0.82) !important;
  box-shadow: 0 8px 32px rgba(10, 25, 49, 0.1) !important;
}

.is-front-page .site-header:not(.scrolled) {
  background: transparent !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  border-bottom-color: transparent !important;
}

.nav-list .current-menu-item a,
.nav-list a:hover {
  background: rgba(179, 207, 229, 0.45) !important;
  color: #1A3D63 !important;
}

/* ─── Top Bar & Ticker — deep navy gradient ───────────────── */
.school-top-bar {
  background: var(--navy-deep-grad) !important;
  border-bottom: 2px solid rgba(179, 207, 229, 0.4) !important;
}

.school-top-bar a { color: #B3CFE5 !important; }
.school-top-bar a:hover { color: #FFFFFF !important; }
.top-bar-divider { color: rgba(179, 207, 229, 0.4); }

.rankings-ticker {
  background: var(--navy-deep-grad) !important;
  border-bottom: 1px solid rgba(179, 207, 229, 0.25) !important;
}

.rankings-ticker-item::before { background: #B3CFE5 !important; }

/* ─── Buttons — glass & gradient ──────────────────────────── */
.lvgi-btn.btn-primary,
.btn-primary {
  background: linear-gradient(135deg, #1A3D63 0%, #4A7FA7 100%) !important;
  border-color: transparent !important;
  color: #fff !important;
  box-shadow: 0 6px 20px rgba(26, 61, 99, 0.35) !important;
  position: relative;
  overflow: hidden;
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.3s !important;
}

.lvgi-btn.btn-primary:hover,
.btn-primary:hover {
  background: linear-gradient(135deg, #4A7FA7 0%, #1A3D63 100%) !important;
  transform: translateY(-2px);
  box-shadow: 0 12px 28px rgba(26, 61, 99, 0.45) !important;
}

.btn-secondary {
  background: rgba(255, 255, 255, 0.5) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
  border: 1px solid rgba(74, 127, 167, 0.5) !important;
  color: #1A3D63 !important;
}

.btn-secondary:hover {
  background: rgba(179, 207, 229, 0.45) !important;
  color: #0A1931 !important;
}

.hero-gwh-actions .btn-secondary {
  background: rgba(255, 255, 255, 0.12) !important;
  color: #fff !important;
  border-color: rgba(179, 207, 229, 0.6) !important;
}

.hero-gwh-actions .btn-secondary:hover {
  background: rgba(179, 207, 229, 0.3) !important;
}

/* ─── Hero — ocean tones ──────────────────────────────────── */
.hero-gwh-overlay {
  background:
    linear-gradient(180deg, rgba(10, 25, 49, 0.5) 0%, rgba(26, 61, 99, 0.68) 50%, rgba(10, 25, 49, 0.92) 100%),
    linear-gradient(90deg, rgba(10, 25, 49, 0.7) 0%, transparent 55%) !important;
}

.hero-gwh-badge {
  background: rgba(179, 207, 229, 0.16) !important;
  backdrop-filter: blur(14px) !important;
  -webkit-backdrop-filter: blur(14px) !important;
  border-color: rgba(179, 207, 229, 0.5) !important;
}

.hero-gwh-stats {
  background: rgba(10, 25, 49, 0.72) !important;
  backdrop-filter: blur(20px) saturate(150%) !important;
  -webkit-backdrop-filter: blur(20px) saturate(150%) !important;
  border-top: 1px solid rgba(179, 207, 229, 0.35) !important;
}

.school-float-icon { color: rgba(179, 207, 229, 0.45) !important; }

.scroll-indicator {
  background: linear-gradient(to bottom, #B3CFE5, transparent) !important;
}

/* Hero v2 / v3 light washes */
.hero-v2,
.hero-section {
  background: linear-gradient(180deg, #DCE9F5 0%, #F6FAFD 100%) !important;
}

.hero-v2-bg {
  background: var(--navy-deep-grad) !important;
}

.holo-mesh {
  background:
    radial-gradient(ellipse 70% 55% at 50% 20%, rgba(74, 127, 167, 0.35) 0%, transparent 60%),
    radial-gradient(ellipse 45% 35% at 85% 70%, rgba(179, 207, 229, 0.18) 0%, transparent 50%),
    radial-gradient(ellipse 40% 30% at 10% 85%, rgba(74, 127, 167, 0.15) 0%, transparent 50%),
    linear-gradient(180deg, #0A1931 0%, #1A3D63 55%, #0A1931 100%) !important;
}

.holo-orb-1 { background: rgba(74, 127, 167, 0.4) !important; }
.holo-orb-2 { background: rgba(179, 207, 229, 0.25) !important; }

.holo-grid-lines {
  background-image:
    linear-gradient(rgba(179, 207, 229, 0.09) 1px, transparent 1px),
    linear-gradient(90deg, rgba(179, 207, 229, 0.09) 1px, transparent 1px) !important;
}

.hero-v3-content .hero-v2-tags span {
  background: rgba(179, 207, 229, 0.14) !important;
  border-color: rgba(179, 207, 229, 0.4) !important;
}

.hero-v2-highlight {
  background: linear-gradient(135deg, #4A7FA7 0%, #B3CFE5 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* ─── Inner Page Hero — navy glass banner ─────────────────── */
.page-hero::before {
  background:
    radial-gradient(ellipse 70% 90% at 80% 10%, rgba(74, 127, 167, 0.45) 0%, transparent 60%),
    radial-gradient(ellipse 50% 70% at 15% 85%, rgba(179, 207, 229, 0.18) 0%, transparent 55%),
    linear-gradient(135deg, #0A1931 0%, #1A3D63 55%, #0A1931 100%) !important;
  opacity: 1 !important;
}

.page-hero::after {
  background: linear-gradient(90deg, transparent, #4A7FA7, #B3CFE5, transparent) !important;
}

/* ─── Sections ────────────────────────────────────────────── */
.section-alt {
  background: linear-gradient(180deg, rgba(179, 207, 229, 0.22) 0%, rgba(246, 250, 253, 0.6) 100%) !important;
}

.section::after {
  background: linear-gradient(90deg, transparent, rgba(74, 127, 167, 0.35), transparent) !important;
}

.section-news,
.section-blog {
  background: transparent !important;
}

.seo-banner {
  background: rgba(179, 207, 229, 0.16) !important;
  border-top: 1px solid rgba(74, 127, 167, 0.2) !important;
}

/* ─── Marquee & Tour — glass strips ───────────────────────── */
.alumni-marquee {
  background: var(--navy-deep-grad) !important;
  border: 1px solid rgba(179, 207, 229, 0.3) !important;
}

.alumni-marquee .marquee-item,
.marquee-item {
  background: rgba(179, 207, 229, 0.14) !important;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border: 1px solid rgba(179, 207, 229, 0.35) !important;
  color: #F6FAFD !important;
}

.tour-player,
.tour-placeholder {
  background: var(--navy-deep-grad) !important;
  color: #F6FAFD !important;
}

.tour-placeholder span { color: #B3CFE5 !important; }

/* ─── Facilities showcase ─────────────────────────────────── */
.facilities-showcase {
  background: transparent !important;
}

.facilities-showcase-tab {
  background: rgba(255, 255, 255, 0.6);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-color: rgba(74, 127, 167, 0.45);
}

.facilities-showcase-tab.active {
  background: linear-gradient(135deg, #1A3D63, #4A7FA7) !important;
  box-shadow: 0 6px 18px rgba(26, 61, 99, 0.35) !important;
}

.facilities-showcase-caption {
  background: linear-gradient(90deg, #0A1931, #1A3D63) !important;
}

.facilities-showcase-media { background: #DCE9F5 !important; }

/* ─── Forms — glass inputs ────────────────────────────────── */
.lvgi-form input,
.lvgi-form select,
.lvgi-form textarea,
.form-group input,
.form-group select,
.form-group textarea {
  background: rgba(255, 255, 255, 0.65) !important;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border: 1px solid rgba(179, 207, 229, 0.7) !important;
  transition: border-color 0.3s, box-shadow 0.3s;
}

.lvgi-form input:focus,
.lvgi-form select:focus,
.lvgi-form textarea:focus,
.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus {
  border-color: #4A7FA7 !important;
  box-shadow: 0 0 0 3px rgba(74, 127, 167, 0.2) !important;
  outline: none;
}

.contact-cta-form .floating-label label {
  background: transparent;
}

/* ─── Modal — glass panel ─────────────────────────────────── */
.lvgi-modal-overlay {
  background: rgba(10, 25, 49, 0.6) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
}

.lvgi-modal-panel {
  background: rgba(246, 250, 253, 0.9) !important;
  backdrop-filter: blur(24px) saturate(160%) !important;
  -webkit-backdrop-filter: blur(24px) saturate(160%) !important;
  border: 1px solid rgba(179, 207, 229, 0.7) !important;
}

.lvgi-modal-close { background: rgba(179, 207, 229, 0.4) !important; }

.lvgi-modal-success .success-icon {
  background: linear-gradient(135deg, #1A3D63, #4A7FA7) !important;
}

/* ─── Footer — deep ocean glass ───────────────────────────── */
.site-footer {
  background:
    radial-gradient(ellipse 80% 60% at 85% 0%, rgba(74, 127, 167, 0.28) 0%, transparent 55%),
    radial-gradient(ellipse 55% 45% at 8% 100%, rgba(179, 207, 229, 0.1) 0%, transparent 55%),
    linear-gradient(160deg, #0A1931 0%, #12294A 60%, #0A1931 100%) !important;
  border-top: 1px solid rgba(179, 207, 229, 0.35) !important;
}

.footer-brand .logo-sub,
.footer-links h4,
.footer-contact h4,
.contact-list svg { color: #B3CFE5 !important; }

.footer-links a:hover,
.footer-bottom-links a:hover,
.contact-list a:hover { color: #B3CFE5 !important; }

.footer-social a {
  background: rgba(179, 207, 229, 0.12) !important;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border: 1px solid rgba(179, 207, 229, 0.3) !important;
}

.footer-social a:hover {
  background: #4A7FA7 !important;
  border-color: #4A7FA7 !important;
  color: #fff !important;
}

/* ─── Floating UI — glass pills ───────────────────────────── */
.enquire-sticky,
.back-to-top {
  background: linear-gradient(160deg, #1A3D63, #4A7FA7) !important;
  box-shadow: -4px 4px 24px rgba(10, 25, 49, 0.35) !important;
}

.enquire-sticky:hover,
.back-to-top:hover {
  background: linear-gradient(160deg, #4A7FA7, #1A3D63) !important;
}

/* ─── Icons & accents ─────────────────────────────────────── */
.feature-icon,
.author-avatar,
.why-card-icon {
  background: linear-gradient(135deg, #1A3D63, #4A7FA7) !important;
  border: 2px solid rgba(179, 207, 229, 0.6) !important;
}

.blog-category,
.news-card time,
.program-tag,
.hero-v2-tags span {
  background: rgba(179, 207, 229, 0.35) !important;
  border: 1px solid rgba(74, 127, 167, 0.35) !important;
  color: #1A3D63 !important;
}

.stat-suffix { color: #4A7FA7 !important; }

.leadership-photo,
.trust-item:hover .trust-item-img { border-color: #4A7FA7 !important; }

/* ─── Scroll-driven reveal helpers (used by JS) ───────────── */
.lvgi-img-parallax {
  overflow: hidden;
}

.lvgi-img-parallax img {
  will-change: transform;
  transform: scale(1.12);
}

[data-lvgi-float] { will-change: transform; }

/* ─── Reduced Motion ──────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  .page-bg-pattern::before,
  .page-bg-pattern::after,
  .glass-card::after,
  .holo-card::after {
    animation: none !important;
  }

  .lvgi-img-parallax img { transform: none; }
}