/**
 * Devi Academy — Phase 2 Modern Design System
 * Load after style.css
 */

:root {
  --devi-primary: #0f4c8a;
  --devi-primary-light: #136ad5;
  --devi-primary-dark: #0a3561;
  --devi-accent: #800020;
  --devi-accent-light: #a8284a;
  --devi-gold: #c9a227;
  --devi-secondary: #00aeff;
  --devi-success: #059669;
  --devi-surface: #f4f7fb;
  --devi-surface-alt: #eef2f7;
  --devi-white: #ffffff;
  --devi-text: #334155;
  --devi-text-muted: #64748b;
  --devi-heading: #0f172a;
  --devi-border: #e2e8f0;
  --devi-radius-sm: 8px;
  --devi-radius: 14px;
  --devi-radius-lg: 22px;
  --devi-radius-pill: 999px;
  --devi-shadow-sm: 0 2px 8px rgba(15, 76, 138, 0.06);
  --devi-shadow: 0 8px 30px rgba(15, 76, 138, 0.1);
  --devi-shadow-lg: 0 24px 60px rgba(15, 23, 42, 0.14);
  --devi-font-display: 'Playfair Display', Georgia, 'Times New Roman', serif;
  --devi-font-brand: 'Coronet', 'Coronet LT Std', cursive;
  --devi-font-body: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif;
  --devi-transition: 0.25s cubic-bezier(0.4, 0, 0.2, 1);
  --devi-nav-height: 76px;
}

@font-face {
  font-family: 'Coronet';
  src: url('/css/Coronet.woff2') format('woff2'),
       url('/css/Coronet.woff') format('woff');
  font-weight: normal;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Coronet LT Std';
  src: url('/css/CoronetLTStd-Regular.woff2') format('woff2'),
       url('/css/CoronetLTStd-Regular.woff') format('woff'),
       url('/css/CoronetLTStd-Regular.ttf') format('truetype');
  font-weight: normal;
  font-style: italic;
  font-display: swap;
}

/* ─── Base typography & smoothness ─── */
html {
  scroll-behavior: smooth;
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
}

body {
  font-family: var(--devi-font-body) !important;
  color: var(--devi-text) !important;
  background: var(--devi-white);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body.page-inner {
  overflow-x: clip;
}

/* Content headings only — do NOT force color on hero headings */
.untree_co-section h1,
.untree_co-section h2,
.untree_co-section h3,
.untree_co-section h4,
.site-footer h3 {
  font-family: var(--devi-font-display) !important;
  color: var(--devi-heading);
  letter-spacing: -0.02em;
}

.untree_co-hero .heading,
.untree_co-hero h1,
.untree_co-hero h2,
.untree_co-hero .text-white,
.untree_co-hero .devi-hero__title {
  color: #fff !important;
}

.untree_co-hero .devi-hero__title,
.devi-logo-text,
.site-nav .logo span {
  font-family: var(--devi-font-brand) !important;
  font-style: italic !important;
  font-weight: 400 !important;
  letter-spacing: 0.02em;
}

.untree_co-hero .devi-hero__title {
  font-size: clamp(2rem, 5vw, 3.25rem) !important;
  line-height: 1.15 !important;
  text-shadow: 0 2px 12px rgba(0, 0, 0, 0.35);
}

.untree_co-hero .desc,
.untree_co-hero .desc p {
  color: rgba(255, 255, 255, 0.92) !important;
}

a {
  transition: color var(--devi-transition), opacity var(--devi-transition);
}

::selection {
  background: rgba(15, 76, 138, 0.2);
  color: var(--devi-heading);
}

/* ─── Buttons ─── */
.btn {
  font-family: var(--devi-font-body) !important;
  font-weight: 600 !important;
  letter-spacing: 0.02em !important;
  text-transform: none !important;
  border-radius: var(--devi-radius-pill) !important;
  padding: 0.75rem 1.6rem !important;
  font-size: 0.9375rem !important;
  transition: transform var(--devi-transition), box-shadow var(--devi-transition), background var(--devi-transition) !important;
}

.btn:hover {
  transform: translateY(-1px);
}

.btn-devi-primary,
.btn-secondary {
  background: linear-gradient(135deg, var(--devi-accent) 0%, var(--devi-accent-light) 100%) !important;
  border: none !important;
  color: #fff !important;
  box-shadow: 0 4px 16px rgba(128, 0, 32, 0.35);
}

.btn-devi-primary:hover,
.btn-secondary:hover {
  color: #fff !important;
  box-shadow: 0 8px 24px rgba(128, 0, 32, 0.4);
}

.btn-devi-outline {
  background: rgba(255, 255, 255, 0.12) !important;
  border: 2px solid rgba(255, 255, 255, 0.65) !important;
  color: #fff !important;
  backdrop-filter: blur(8px);
}

.btn-devi-outline:hover {
  background: rgba(255, 255, 255, 0.22) !important;
  color: #fff !important;
}

.btn-primary {
  background: var(--devi-primary-light) !important;
  border-color: var(--devi-primary-light) !important;
}

.btn-outline-primary {
  color: var(--devi-primary-light) !important;
  border-color: var(--devi-primary-light) !important;
  background: transparent !important;
}

.btn-outline-primary:hover {
  background: var(--devi-primary-light) !important;
  color: #fff !important;
}

/* ─── Top utility bar ─── */
.devi-topbar {
  background: var(--devi-primary-dark);
  font-size: 0.8125rem;
  padding: 0.45rem 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.devi-topbar a {
  color: rgba(255, 255, 255, 0.88) !important;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  transition: color var(--devi-transition);
}

.devi-topbar a:hover {
  color: #fff !important;
}

.devi-topbar__actions {
  display: flex;
  justify-content: flex-end;
  gap: 0.5rem;
  flex-wrap: wrap;
}

.devi-topbar__pill {
  background: rgba(255, 255, 255, 0.1);
  border-radius: var(--devi-radius-pill);
  padding: 0.25rem 0.75rem !important;
  font-weight: 500;
}

.devi-topbar__pill--accent {
  background: rgba(128, 0, 32, 0.55);
}

.devi-topbar__pill:hover {
  background: rgba(255, 255, 255, 0.18);
}

.devi-topbar__pill--accent:hover {
  background: var(--devi-accent);
}

/* ─── Main navigation ─── */

/* Inner pages: nav in normal document flow (fixes broken layout) */
body:not(.page-home) .devi-header.site-nav {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  width: 100%;
  z-index: 100;
  margin-bottom: 0 !important;
  background: linear-gradient(135deg, var(--devi-primary-dark) 0%, var(--devi-primary) 55%, #155a9e 100%);
}

/* Flush header into hero — no white strip on load */
body:not(.page-home) .devi-header.site-nav + .untree_co-hero,
body:not(.page-home) .devi-header.site-nav + .untree_co-section {
  margin-top: 0 !important;
}

body:not(.page-home) .devi-header.site-nav .sticky-nav {
  margin: 0 !important;
}

body:not(.page-home) .devi-header.site-nav .site-navigation::after {
  content: '';
  display: table;
  clear: both;
}

body.page-home .devi-header.site-nav {
  position: absolute !important;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  z-index: 100;
  background: transparent;
}

body.page-home #sticky-wrapper,
body.page-inner #sticky-wrapper,
body:not(.page-home) #sticky-wrapper {
  position: relative !important;
  top: auto !important;
  width: 100%;
  z-index: 2;
}

.site-nav {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

.site-nav.mb-5 {
  margin-bottom: 0 !important;
}

.sticky-nav {
  background: transparent;
  transition: background var(--devi-transition), box-shadow var(--devi-transition), padding var(--devi-transition);
  padding: 0.65rem 0;
}

#sticky-wrapper.is-sticky .sticky-nav,
.sticky-nav.devi-nav--scrolled {
  background: rgba(255, 255, 255, 0.92) !important;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  box-shadow: var(--devi-shadow-sm);
  padding: 0.4rem 0;
}

.site-navigation .devi-brand-mark img,
.site-navigation .float-left img {
  height: 52px;
  width: auto;
  transition: height var(--devi-transition), box-shadow var(--devi-transition);
  background: #ffffff;
  border-radius: 50%;
  padding: 5px;
  box-shadow: 0 2px 14px rgba(0, 0, 0, 0.25);
}

#sticky-wrapper.is-sticky .site-navigation .devi-brand-mark img,
#sticky-wrapper.is-sticky .site-navigation .float-left img,
.sticky-nav.devi-nav--scrolled .site-navigation .devi-brand-mark img,
.sticky-nav.devi-nav--scrolled .site-navigation .float-left img {
  height: 44px;
}

.site-nav .logo,
.site-nav .logo span,
.devi-logo-text {
  font-family: var(--devi-font-brand) !important;
  font-style: italic !important;
  font-weight: 400 !important;
  font-size: 1.65rem !important;
  color: #fff !important;
  margin-left: 0.5rem;
  line-height: 52px;
  text-shadow: 0 1px 6px rgba(0, 0, 0, 0.3);
}

#sticky-wrapper.is-sticky .logo,
#sticky-wrapper.is-sticky .logo span,
#sticky-wrapper.is-sticky .devi-logo-text,
.sticky-nav.devi-nav--scrolled .logo,
.sticky-nav.devi-nav--scrolled .logo span,
.sticky-nav.devi-nav--scrolled .devi-logo-text {
  color: var(--devi-primary-dark) !important;
  text-shadow: none;
  line-height: 44px;
}

.site-nav .site-navigation .site-menu > li > a {
  font-size: 0.875rem !important;
  font-weight: 500 !important;
  color: rgba(255, 255, 255, 0.85) !important;
  padding: 0.5rem 0.85rem !important;
  border-radius: var(--devi-radius-sm);
  transition: background var(--devi-transition), color var(--devi-transition);
}

.site-nav .site-navigation .site-menu > li > a:hover,
.site-nav .site-navigation .site-menu > li.active > a {
  color: #fff !important;
  background: rgba(255, 255, 255, 0.12);
}

#sticky-wrapper.is-sticky .sticky-nav .site-menu > li:not(.devi-nav-cta) > a,
.sticky-nav.devi-nav--scrolled .site-menu > li:not(.devi-nav-cta) > a {
  color: var(--devi-text) !important;
}

#sticky-wrapper.is-sticky .sticky-nav .site-menu > li:not(.devi-nav-cta) > a:hover,
#sticky-wrapper.is-sticky .sticky-nav .site-menu > li:not(.devi-nav-cta).active > a,
.sticky-nav.devi-nav--scrolled .site-menu > li:not(.devi-nav-cta) > a:hover,
.sticky-nav.devi-nav--scrolled .site-menu > li:not(.devi-nav-cta).active > a {
  color: var(--devi-primary-light) !important;
  background: rgba(19, 106, 213, 0.08);
}

#sticky-wrapper.is-sticky .sticky-nav {
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  box-sizing: border-box;
}

.site-nav .site-navigation .site-menu .has-children .dropdown {
  border-radius: var(--devi-radius) !important;
  border: 1px solid var(--devi-border) !important;
  box-shadow: var(--devi-shadow) !important;
  padding: 0.5rem !important;
  margin-top: 0.5rem !important;
  min-width: 220px;
}

.site-nav .site-navigation .site-menu .has-children .dropdown > li > a {
  border-radius: var(--devi-radius-sm);
  padding: 0.55rem 0.85rem !important;
  font-size: 0.875rem !important;
  color: var(--devi-text) !important;
}

.site-nav .site-navigation .site-menu .has-children .dropdown > li > a:hover,
.site-nav .site-navigation .site-menu .has-children .dropdown > li.active > a {
  background: var(--devi-surface) !important;
  color: var(--devi-primary-light) !important;
}

.devi-nav-cta > a {
  background: linear-gradient(135deg, var(--devi-accent), var(--devi-accent-light)) !important;
  color: #fff !important;
  border-radius: var(--devi-radius-pill) !important;
  padding: 0.5rem 1.1rem !important;
  margin-left: 0.35rem;
  box-shadow: 0 4px 14px rgba(128, 0, 32, 0.3);
}

.devi-nav-cta > a:hover {
  background: var(--devi-accent) !important;
  color: #fff !important;
  transform: translateY(-1px);
}

#sticky-wrapper.is-sticky .sticky-nav .site-menu > li.devi-nav-cta > a,
.sticky-nav.devi-nav--scrolled .site-menu > li.devi-nav-cta > a {
  background: linear-gradient(135deg, var(--devi-accent), var(--devi-accent-light)) !important;
  color: #fff !important;
  box-shadow: 0 4px 14px rgba(128, 0, 32, 0.3);
}

#sticky-wrapper.is-sticky .sticky-nav .site-menu > li.devi-nav-cta > a:hover,
.sticky-nav.devi-nav--scrolled .site-menu > li.devi-nav-cta > a:hover {
  background: var(--devi-accent) !important;
  color: #fff !important;
}

/* Mobile menu */
.site-mobile-menu {
  background: var(--devi-white) !important;
  box-shadow: var(--devi-shadow-lg);
}

.site-mobile-menu .site-nav-wrap > li > a {
  color: var(--devi-heading) !important;
  font-weight: 500;
  padding: 0.75rem 1rem;
  border-radius: var(--devi-radius-sm);
}

.burger.light span,
.burger.light::before,
.burger.light::after {
  background: #fff;
}

#sticky-wrapper.is-sticky .burger.light span,
#sticky-wrapper.is-sticky .burger.light::before,
#sticky-wrapper.is-sticky .burger.light::after,
.sticky-nav.devi-nav--scrolled .burger.light span,
.sticky-nav.devi-nav--scrolled .burger.light::before,
.sticky-nav.devi-nav--scrolled .burger.light::after {
  background: var(--devi-heading);
}

/* ─── Hero sections ─── */
.untree_co-hero.overlay::before {
  background: linear-gradient(
    135deg,
    rgba(10, 53, 97, 0.88) 0%,
    rgba(15, 76, 138, 0.75) 45%,
    rgba(128, 0, 32, 0.55) 100%
  ) !important;
  z-index: 1 !important;
}

.untree_co-hero > .container {
  z-index: 2;
}

.devi-hero--home {
  min-height: 88vh !important;
  padding-top: 7rem;
}

.devi-hero--home,
.devi-hero--home > .container,
.devi-hero--home > .container > .row {
  min-height: 88vh !important;
  height: auto !important;
}

.devi-hero__eyebrow {
  display: inline-block;
  font-size: 0.8125rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.85);
  margin-bottom: 0.75rem;
}

.devi-hero__title {
  font-family: var(--devi-font-brand) !important;
  font-style: italic !important;
  font-size: clamp(2rem, 5vw, 3.25rem) !important;
  font-weight: 400 !important;
  color: #fff !important;
  line-height: 1.15 !important;
  margin-bottom: 1rem !important;
  text-shadow: 0 2px 12px rgba(0, 0, 0, 0.35);
}

.devi-hero__subtitle {
  font-size: 1.0625rem;
  color: rgba(255, 255, 255, 0.88);
  max-width: 520px;
  margin: 0 auto 1.75rem;
  line-height: 1.6;
}

.devi-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  justify-content: center;
}

.devi-hero__badge-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  justify-content: center;
  margin-top: 1.5rem;
}

.devi-hero__badge {
  background: rgba(255, 255, 255, 0.15);
  border: 1px solid rgba(255, 255, 255, 0.25);
  border-radius: var(--devi-radius-pill);
  padding: 0.35rem 0.85rem;
  font-size: 0.75rem;
  font-weight: 600;
  color: #fff;
  backdrop-filter: blur(4px);
}

/* Inner page heroes — full-width cover background, stable on scroll */
body.page-inner .untree_co-hero:not(.devi-hero--home),
body:not(.page-home) .untree_co-hero:not(.devi-hero--home) {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  min-height: clamp(260px, 42vh, 400px) !important;
  height: clamp(260px, 42vh, 400px) !important;
  max-height: none !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  background-attachment: scroll !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: hidden !important;
  position: relative !important;
  left: 0 !important;
  right: 0 !important;
}

body.page-inner .untree_co-hero:not(.devi-hero--home) > .container,
body.page-inner .untree_co-hero:not(.devi-hero--home) > .container > .row,
body:not(.page-home) .untree_co-hero:not(.devi-hero--home) > .container,
body:not(.page-home) .untree_co-hero:not(.devi-hero--home) > .container > .row {
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  width: 100%;
}

body.page-inner .untree_co-hero.overlay:not(.devi-hero--home)::before,
body:not(.page-home) .untree_co-hero.overlay:not(.devi-hero--home)::before {
  background: linear-gradient(135deg, rgba(10, 53, 97, 0.82) 0%, rgba(15, 76, 138, 0.72) 100%) !important;
  opacity: 1 !important;
}

body.page-inner .untree_co-section .img-fluid,
body.page-inner .untree_co-section img.img-fluid {
  border-radius: var(--devi-radius);
  box-shadow: var(--devi-shadow-sm);
}

body.page-inner .count-numbers .feature {
  text-align: center;
}

body.page-inner .staff .position {
  color: var(--devi-accent);
  font-weight: 600;
  font-size: 0.875rem;
}

.untree_co-hero .heading,
.untree_co-hero h1.heading {
  font-family: var(--devi-font-display) !important;
  font-style: normal !important;
  font-size: clamp(1.75rem, 4vw, 2.75rem) !important;
  color: #fff !important;
}

.untree_co-hero .desc p {
  font-size: 1.05rem;
}

/* ─── CBSE highlight section (homepage) ─── */
.devi-highlight-section {
  padding: 2.5rem 0;
  background: var(--devi-surface);
  border-bottom: 1px solid var(--devi-border);
  position: relative;
  z-index: 2;
}

.devi-section-label {
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--devi-accent);
}

.devi-cbse-card {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
  max-width: 980px;
  margin: 0 auto;
  background: var(--devi-white);
  border-radius: var(--devi-radius-lg);
  overflow: hidden;
  border: 1px solid var(--devi-border);
  box-shadow: var(--devi-shadow-lg);
  transition: transform var(--devi-transition), box-shadow var(--devi-transition);
}

.devi-cbse-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 24px 56px rgba(15, 23, 42, 0.16);
}

.devi-cbse-card__media {
  position: relative;
  min-height: 220px;
  background: var(--devi-primary-dark);
}

.devi-cbse-card__media img {
  width: 100%;
  height: 100%;
  min-height: 220px;
  object-fit: cover;
  display: block;
  transition: transform 0.5s ease;
}

.devi-cbse-card:hover .devi-cbse-card__media img {
  transform: scale(1.03);
}

.devi-cbse-card__body {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 2rem 2.25rem;
  background: linear-gradient(145deg, var(--devi-primary-dark) 0%, var(--devi-primary) 55%, #1a6ec9 100%);
  color: #fff;
}

.devi-cbse-card__badge {
  display: inline-block;
  align-self: flex-start;
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  background: rgba(255, 255, 255, 0.14);
  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: var(--devi-radius-pill);
  padding: 0.35rem 0.85rem;
  margin-bottom: 0.85rem;
}

.devi-cbse-card__title {
  font-family: var(--devi-font-display) !important;
  font-size: clamp(1.35rem, 2.5vw, 1.85rem) !important;
  color: #fff !important;
  margin-bottom: 0.65rem;
  line-height: 1.25;
}

.devi-cbse-card__stats {
  font-size: 1rem;
  color: rgba(255, 255, 255, 0.92) !important;
  margin-bottom: 1.25rem;
}

.devi-cbse-card__cta {
  display: inline-flex;
  align-items: center;
  align-self: flex-start;
  gap: 0.35rem;
  font-size: 0.875rem;
  font-weight: 700;
  background: #fff;
  color: var(--devi-primary-dark);
  border-radius: var(--devi-radius-pill);
  padding: 0.55rem 1.15rem;
  transition: background var(--devi-transition), color var(--devi-transition);
}

.devi-cbse-card__cta::after {
  content: '→';
  transition: transform var(--devi-transition);
}

.devi-cbse-card:hover .devi-cbse-card__cta {
  background: var(--devi-accent);
  color: #fff;
}

.devi-cbse-card:hover .devi-cbse-card__cta::after {
  transform: translateX(3px);
}

/* legacy aliases (older markup) */
.devi-cbse-link {
  display: block;
  max-width: 960px;
  margin: 0 auto;
}

.devi-highlight-wrap {
  padding: 2.5rem 0;
  background: var(--devi-surface);
}

.cbse-banner {
  position: relative;
  border-radius: var(--devi-radius-lg) !important;
  overflow: hidden;
  box-shadow: var(--devi-shadow-lg) !important;
}

.cbse-banner img {
  width: 100%;
  display: block;
  object-fit: cover;
}

.cbse-overlay {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: flex-end;
  background: linear-gradient(to top, rgba(0, 0, 0, 0.82), rgba(0, 0, 0, 0.15), transparent) !important;
  padding: 2rem !important;
}

/* ─── Section headings ─── */
.line-bottom {
  position: relative;
  padding-bottom: 0.75rem;
}

.line-bottom::before {
  left: 50% !important;
  transform: translateX(-50%) !important;
  width: 56px !important;
  height: 4px !important;
  border-radius: 2px !important;
  background: linear-gradient(90deg, var(--devi-accent), var(--devi-gold)) !important;
}

.untree_co-section {
  padding: 5rem 0 !important;
}

.untree_co-section.bg-light {
  background: var(--devi-surface) !important;
}

/* ─── News cards ─── */
.school-news-item .media-h {
  background: var(--devi-white);
  border-radius: var(--devi-radius-lg);
  border: 1px solid var(--devi-border);
  box-shadow: var(--devi-shadow-sm);
  overflow: hidden;
  transition: transform var(--devi-transition), box-shadow var(--devi-transition);
}

.school-news-item .media-h:hover {
  transform: translateY(-4px);
  box-shadow: var(--devi-shadow);
}

.school-news-item .media-h figure {
  border-radius: 0;
  overflow: hidden;
  min-width: 200px;
  max-width: 280px;
}

.school-news-item .media-h figure img {
  height: 100%;
  min-height: 200px;
  object-fit: cover;
  transition: transform 0.5s ease;
}

.school-news-item .media-h:hover figure img {
  transform: scale(1.05);
}

.school-news-item .media-h-body {
  padding: 1.5rem !important;
}

.school-news-item .media-h-body h2 {
  font-size: 1.2rem !important;
}

.school-news-item .media-h-body h2 a {
  color: var(--devi-heading) !important;
  text-decoration: none;
}

.school-news-item .media-h-body h2 a:hover {
  color: var(--devi-primary-light) !important;
}

.school-news-item .meta {
  font-size: 0.8125rem;
  color: var(--devi-text-muted);
}

.school-news-item p {
  font-size: 0.9375rem !important;
  line-height: 1.65;
  color: var(--devi-text);
}

#schoolNewsToggle,
.devi-news-toggle {
  border-radius: var(--devi-radius-pill);
  padding: 0.65rem 2rem;
  font-weight: 600;
  border: 2px solid var(--devi-primary-light) !important;
  color: #fff !important;
  background: var(--devi-primary-light) !important;
  box-shadow: 0 4px 16px rgba(19, 106, 213, 0.25);
  transition: background var(--devi-transition), color var(--devi-transition), transform var(--devi-transition), box-shadow var(--devi-transition);
}

#schoolNewsToggle:hover,
.devi-news-toggle:hover {
  background: var(--devi-primary-dark) !important;
  border-color: var(--devi-primary-dark) !important;
  color: #fff !important;
  transform: translateY(-1px);
  box-shadow: 0 6px 20px rgba(15, 76, 138, 0.3);
}

/* News cards visible immediately — no scroll-to-reveal delay */
body.page-home .school-news-item {
  opacity: 1 !important;
  transform: none !important;
}

body.page-home .school-news-item.school-news-item--hidden {
  display: none !important;
}

body.page-home .school-news-item .media-h figure img {
  min-height: 220px;
  background: var(--devi-surface-alt);
}

.school-news-item .media-thumbnail--collage {
  background: linear-gradient(145deg, #d4c4a0 0%, #c9b896 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.75rem;
}

.school-news-item .media-thumbnail--collage img {
  object-fit: contain !important;
  width: 100%;
  height: auto;
  min-height: 0 !important;
  max-height: 260px;
  background: transparent;
}

.devi-news-badge {
  display: inline-block;
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  background: var(--devi-accent);
  color: #fff;
  border-radius: var(--devi-radius-pill);
  padding: 0.25rem 0.75rem;
  margin-bottom: 0.5rem;
}

/* ─── Feature cards ─── */
.feature {
  border: 1px solid var(--devi-border) !important;
  border-radius: var(--devi-radius) !important;
  padding: 2rem 1.5rem !important;
  box-shadow: var(--devi-shadow-sm);
  transition: transform var(--devi-transition), box-shadow var(--devi-transition);
  height: 100%;
}

.feature:hover {
  transform: translateY(-4px);
  box-shadow: var(--devi-shadow);
}

.feature h3 {
  font-family: var(--devi-font-body) !important;
  font-size: 1rem !important;
  font-weight: 700 !important;
  color: var(--devi-heading) !important;
}

.feature [class^="uil"] {
  color: var(--devi-primary-light) !important;
}

/* ─── Custom media / facilities ─── */
.custom-media {
  border-radius: var(--devi-radius-lg);
  overflow: hidden;
  border: 1px solid var(--devi-border);
  box-shadow: var(--devi-shadow-sm);
  transition: transform var(--devi-transition), box-shadow var(--devi-transition);
  background: var(--devi-white);
}

.custom-media:hover {
  transform: translateY(-4px);
  box-shadow: var(--devi-shadow);
}

.custom-media img {
  transition: transform 0.5s ease;
}

.custom-media:hover img {
  transform: scale(1.03);
}

.custom-media-body {
  padding: 1.5rem;
}

.custom-media-body h3 {
  font-size: 1.125rem !important;
}

/* ─── Stats counters ─── */
.feature .counter {
  font-family: var(--devi-font-display) !important;
  font-size: 2.5rem !important;
  color: var(--devi-primary-light) !important;
}

/* ─── Schedule / events ─── */
.schedule-card {
  border-radius: var(--devi-radius) !important;
  border: 1px solid var(--devi-border) !important;
  box-shadow: var(--devi-shadow-sm);
  transition: box-shadow var(--devi-transition);
}

.schedule-card:hover {
  box-shadow: var(--devi-shadow);
}

.event-badge {
  background: var(--devi-accent);
  color: #fff;
  font-size: 0.65rem;
  font-weight: 700;
  padding: 0.15rem 0.5rem;
  border-radius: var(--devi-radius-pill);
  margin-left: 0.5rem;
  vertical-align: middle;
}

.event-today .schedule-card,
.schedule-card.event-today {
  border-color: var(--devi-accent) !important;
}

.event-ongoing .schedule-card,
.schedule-card.event-ongoing {
  border-color: var(--devi-gold) !important;
}

/* ─── Accordion ─── */
.accordion-item {
  border: 1px solid var(--devi-border) !important;
  border-radius: var(--devi-radius) !important;
  margin-bottom: 0.75rem;
  overflow: hidden;
}

.accordion .btn-link {
  font-weight: 600;
  color: var(--devi-heading) !important;
  text-decoration: none !important;
  font-size: 1rem;
}

/* ─── Footer ─── */
.site-footer.devi-footer {
  background: linear-gradient(165deg, var(--devi-primary-dark) 0%, #0a2540 100%) !important;
  padding: 4.5rem 0 2rem !important;
  position: relative;
  overflow: hidden;
}

.site-footer.devi-footer::before {
  content: '';
  position: absolute;
  top: -80px;
  right: -80px;
  width: 280px;
  height: 280px;
  background: radial-gradient(circle, rgba(128, 0, 32, 0.25), transparent 70%);
  pointer-events: none;
}

.site-footer.devi-footer .widget h3 {
  font-family: var(--devi-font-body) !important;
  font-size: 0.875rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin-bottom: 1.25rem !important;
}

.site-footer.devi-footer .widget p,
.site-footer.devi-footer address {
  color: rgba(255, 255, 255, 0.72) !important;
  line-height: 1.7;
  font-size: 0.9375rem;
}

.site-footer.devi-footer .links li a {
  color: rgba(255, 255, 255, 0.65) !important;
  font-size: 0.9375rem;
  padding: 0.2rem 0;
  display: inline-block;
}

.site-footer.devi-footer .links li a:hover {
  color: #fff !important;
  transform: translateX(3px);
}

.site-footer.devi-footer .social li a {
  width: 40px !important;
  height: 40px !important;
  background: rgba(255, 255, 255, 0.1) !important;
  border-radius: 50% !important;
  color: #fff !important;
  transition: background var(--devi-transition), transform var(--devi-transition);
}

.site-footer.devi-footer .social li a:hover {
  background: var(--devi-accent) !important;
  transform: translateY(-2px);
}

.site-footer.devi-footer .instagram-gallery li a {
  border-radius: var(--devi-radius-sm);
  overflow: hidden;
  display: block;
  transition: transform var(--devi-transition);
}

.site-footer.devi-footer .instagram-gallery li a:hover {
  transform: scale(1.05);
}

.site-footer.devi-footer .copyright {
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  padding-top: 1.5rem;
  margin-top: 2rem;
  font-size: 0.875rem;
}

.site-footer.devi-footer .copyright a {
  color: rgba(255, 255, 255, 0.75) !important;
}

.devi-footer__brand {
  font-family: var(--devi-font-display);
  font-size: 1.5rem;
  color: #fff;
  margin-bottom: 0.75rem;
}

/* Back to top */
.devi-back-top {
  position: fixed;
  bottom: 1.5rem;
  right: 1.5rem;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: var(--devi-accent);
  color: #fff;
  border: none;
  box-shadow: var(--devi-shadow);
  cursor: pointer;
  opacity: 0;
  visibility: hidden;
  transform: translateY(12px);
  transition: all var(--devi-transition);
  z-index: 999;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.25rem;
}

.devi-back-top.is-visible {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.devi-back-top:hover {
  background: var(--devi-accent-light);
  transform: translateY(-2px);
}

/* ─── Loader ─── */
.loader .spinner-border {
  color: var(--devi-primary-light) !important;
}

#overlayer {
  background: var(--devi-white) !important;
}

/* ─── Form pages (admission + TC) ─── */
body.page-form {
  background: var(--devi-surface) !important;
}

body.page-form .untree_co-hero.overlay::before {
  background: linear-gradient(135deg, rgba(128, 0, 32, 0.88), rgba(15, 76, 138, 0.85)) !important;
}

.form-card,
.tc-card {
  border-radius: var(--devi-radius-lg) !important;
  box-shadow: var(--devi-shadow) !important;
  border: 1px solid var(--devi-border) !important;
  margin-bottom: 1.25rem;
  overflow: hidden;
  background: var(--devi-white);
}

.form-card .card-header,
.tc-section-title {
  background: linear-gradient(135deg, var(--devi-accent) 0%, var(--devi-accent-light) 100%) !important;
  color: #fff !important;
  padding: 1rem 1.35rem !important;
  font-weight: 600 !important;
  font-size: 1rem !important;
  border: none !important;
}

.form-card .card-body {
  padding: 1.35rem !important;
}

.form-control-pill,
.tc-input,
.tc-textarea {
  border-radius: var(--devi-radius-pill) !important;
  border: 1.5px solid var(--devi-border) !important;
  padding: 0.75rem 1.15rem !important;
  font-size: 0.9375rem !important;
  transition: border-color var(--devi-transition), box-shadow var(--devi-transition);
  background: var(--devi-white);
}

.form-control-pill:focus,
.tc-input:focus,
.tc-textarea:focus {
  border-color: var(--devi-accent) !important;
  box-shadow: 0 0 0 3px rgba(128, 0, 32, 0.12) !important;
  outline: none;
}

.tc-card {
  padding: 2rem !important;
}

.tc-title {
  font-family: var(--devi-font-display) !important;
  color: var(--devi-heading) !important;
}

.tc-section {
  background: var(--devi-surface) !important;
  border: 1px solid var(--devi-border) !important;
  border-radius: var(--devi-radius) !important;
}

.tc-submit-btn {
  background: linear-gradient(135deg, var(--devi-accent), var(--devi-accent-light)) !important;
  color: #fff !important;
  border: none !important;
  border-radius: var(--devi-radius-pill) !important;
  padding: 0.75rem 1.75rem !important;
  font-weight: 600 !important;
  box-shadow: 0 4px 16px rgba(128, 0, 32, 0.3);
  transition: transform var(--devi-transition), box-shadow var(--devi-transition);
}

.tc-submit-btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 8px 24px rgba(128, 0, 32, 0.35);
  color: #fff !important;
}

.tc-input.is-valid {
  border-color: var(--devi-success) !important;
}

.tc-input.is-invalid {
  border-color: #dc3545 !important;
}

label .required {
  color: var(--devi-accent) !important;
}

.mb-comfy { margin-bottom: 1rem; }
.mb-comfy-lg { margin-bottom: 1.35rem; }

.inpterr {
  border-color: #dc3545 !important;
  background: #fff5f5 !important;
}

/* ─── Staff cards (about page) ─── */
.staff {
  background: var(--devi-white);
  border-radius: var(--devi-radius);
  border: 1px solid var(--devi-border);
  padding: 1.5rem;
  box-shadow: var(--devi-shadow-sm);
  transition: transform var(--devi-transition);
}

.staff:hover {
  transform: translateY(-3px);
}

.staff-name {
  font-family: var(--devi-font-body) !important;
  font-size: 1rem !important;
  font-weight: 700 !important;
}

/* ─── Content readability ─── */
.untree_co-section p {
  line-height: 1.75;
  color: var(--devi-text);
}

/* ─── Responsive ─── */
.devi-brand-mark {
  display: inline-flex;
  align-items: center;
  margin-right: 0.25rem;
}

.devi-topbar__link {
  color: rgba(255, 255, 255, 0.88) !important;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.8125rem;
}

.devi-topbar__link:hover {
  color: #fff !important;
}

/* Popup triggers */
.popup-trigger {
  cursor: pointer;
}

body.page-form #submitButton {
  background: linear-gradient(135deg, var(--devi-accent), var(--devi-accent-light)) !important;
  color: #fff !important;
  border: none !important;
  border-radius: var(--devi-radius-pill) !important;
  padding: 0.85rem 2.5rem !important;
  font-weight: 600 !important;
  box-shadow: 0 4px 16px rgba(128, 0, 32, 0.3);
}

body.page-form #submitButton:disabled {
  opacity: 0.55;
  cursor: not-allowed;
  transform: none !important;
}

/* Gallery modal polish */
.uni-modal-content {
  border-radius: var(--devi-radius-lg);
}

.uni-play-btn {
  border-radius: var(--devi-radius-pill) !important;
}

/* ─── Inner page content polish (all non-home pages) ─── */
body.page-inner .section-title .heading,
body.page-inner .section-title h2,
body.page-inner .custom-block h3,
body.page-inner .custom-block h4 {
  font-family: var(--devi-font-display) !important;
  color: var(--devi-heading);
}

body.page-inner .custom-block {
  background: var(--devi-white);
  border: 1px solid var(--devi-border);
  border-radius: var(--devi-radius-lg);
  padding: 2rem;
  margin-bottom: 2rem;
  box-shadow: var(--devi-shadow-sm);
}

body.page-inner .custom-block img,
body.page-inner .custom-block .img-fluid {
  border-radius: var(--devi-radius);
}

body.page-inner .untree_co-section .table {
  background: var(--devi-white);
  border-radius: var(--devi-radius);
  overflow: hidden;
  box-shadow: var(--devi-shadow-sm);
}

body.page-inner .untree_co-section .table thead th {
  background: var(--devi-primary-dark);
  color: #fff;
  border: none;
  font-weight: 600;
  font-size: 0.875rem;
}

body.page-inner .untree_co-section .table td,
body.page-inner .untree_co-section .table th {
  border-color: var(--devi-border);
  vertical-align: middle;
}

body.page-inner .ul-check li {
  line-height: 1.7;
  margin-bottom: 0.35rem;
}

body.page-inner .ul-check.primary li::before {
  color: var(--devi-accent) !important;
}

body.page-inner .btn-outline-primary {
  border-radius: var(--devi-radius-pill) !important;
  font-weight: 600;
}

body.page-home .feature {
  opacity: 1;
}

/* Below-fold homepage sections: always visible, no scroll-reveal delay */
.devi-home-below-fold,
.devi-home-below-fold [data-aos] {
  opacity: 1 !important;
  transform: none !important;
  transition: none !important;
}

.devi-home-below-fold .custom-media img {
  background: var(--devi-surface-alt);
  min-height: 180px;
  object-fit: cover;
}

@media (max-width: 991px) {
  .school-news-item .media-h {
    flex-direction: column !important;
  }

  .school-news-item .media-h figure {
    max-width: 100%;
    width: 100%;
  }

  .devi-highlight-section,
  .devi-highlight-wrap {
    padding: 2rem 0;
  }

  .devi-cbse-card {
    grid-template-columns: 1fr;
  }

  .devi-cbse-card__body {
    padding: 1.5rem;
  }

  .devi-topbar__actions {
    justify-content: flex-start;
    margin-top: 0.25rem;
  }
}

@media (max-width: 767px) {
  .untree_co-section {
    padding: 3rem 0 !important;
  }

  .devi-hero__actions {
    flex-direction: column;
    align-items: stretch;
  }

  .devi-hero__actions .btn {
    width: 100%;
  }

  .site-nav .logo {
    font-size: 1.1rem !important;
  }
}