/*
Theme Name: KPS Kendriya Vidyalaya
Theme URI: https://kpskendriyavidyalaya.com/
Author: Digital Dhanu
Author URI: https://digitaldhanu.com/
Description: A school theme built for KPS Kendriya Vidyalaya, Kamala Nagar Barhani, Siwan. Ships its own header, footer and brand styling in the crest's navy, crimson and gold, and builds the whole 16-page site in one click. Page content is edited with Elementor; the header, footer and contact details are edited in the Customizer.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: kps
Tags: education, school, custom-logo, custom-menu, featured-images, full-width-template, translation-ready
*/

/* ===========================================================
   KPS Kendriya Vidyalaya — stylesheet v2
   Layout: 1280px crest-led institutional grid — navy masthead
   with icon mega-menus, image carousel hero, gradient actions.
   Palette lifted from the school crest: navy, crimson, gold.
   =========================================================== */

:root{
  --navy:#0E2E63;
  --navy-deep:#09224B;
  --navy-ink:#071A3B;
  --crimson:#C2192B;
  --crimson-deep:#8E0F1E;
  --gold:#E0A422;
  --gold-deep:#B67E08;
  --gold-soft:#FBEFD2;
  --paper:#F2F5FB;
  --surface:#FFFFFF;
  --surface-2:#E8EEF8;
  --ink:#121A2B;
  --muted:#52607C;
  --line:#D6DFEE;
  --on-navy:#FFFFFF;
  --grad-crimson:linear-gradient(135deg,#E0392F 0%,#C2192B 48%,#8E0F1E 100%);
  --grad-gold:linear-gradient(135deg,#F7CE63 0%,#E0A422 50%,#B67E08 100%);
  --grad-navy:linear-gradient(135deg,#1C4A96 0%,#0E2E63 55%,#071A3B 100%);
  --grad-duo:linear-gradient(118deg,#0E2E63 0%,#1A3F85 38%,#C2192B 100%);
  --shadow:0 1px 2px rgba(14,46,99,.06), 0 10px 28px rgba(14,46,99,.09);
  --shadow-lg:0 20px 54px rgba(14,46,99,.18);
  --radius:16px;
  --radius-sm:10px;
  --display:"Bitter", Georgia, "Times New Roman", serif;
  --body:"Mukta", "Segoe UI", system-ui, -apple-system, sans-serif;
  --maxw:1280px;
}

@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --navy:#17397A;--navy-deep:#0B2250;--navy-ink:#07183A;
    --crimson:#E65062;--crimson-deep:#C2192B;
    --gold:#F0BE50;--gold-deep:#C9900F;--gold-soft:#4A3914;
    --paper:#080F1D;--surface:#101A2E;--surface-2:#16233C;
    --ink:#E9EEF8;--muted:#9CAAC6;--line:#22304D;
    --grad-crimson:linear-gradient(135deg,#E65062 0%,#C2192B 55%,#8E0F1E 100%);
    --grad-gold:linear-gradient(135deg,#F7CE63 0%,#E0A422 50%,#B67E08 100%);
    --grad-navy:linear-gradient(135deg,#1C4A96 0%,#102C5F 55%,#07183A 100%);
    --grad-duo:linear-gradient(118deg,#17397A 0%,#28529E 38%,#E65062 100%);
    --shadow:0 1px 2px rgba(0,0,0,.45), 0 10px 28px rgba(0,0,0,.38);
    --shadow-lg:0 20px 54px rgba(0,0,0,.55);
    color-scheme: dark;
  }
}
:root[data-theme="dark"]{
  --navy:#17397A;--navy-deep:#0B2250;--navy-ink:#07183A;
  --crimson:#E65062;--crimson-deep:#C2192B;
  --gold:#F0BE50;--gold-deep:#C9900F;--gold-soft:#4A3914;
  --paper:#080F1D;--surface:#101A2E;--surface-2:#16233C;
  --ink:#E9EEF8;--muted:#9CAAC6;--line:#22304D;
  --grad-crimson:linear-gradient(135deg,#E65062 0%,#C2192B 55%,#8E0F1E 100%);
  --grad-gold:linear-gradient(135deg,#F7CE63 0%,#E0A422 50%,#B67E08 100%);
  --grad-navy:linear-gradient(135deg,#1C4A96 0%,#102C5F 55%,#07183A 100%);
  --grad-duo:linear-gradient(118deg,#17397A 0%,#28529E 38%,#E65062 100%);
  --shadow:0 1px 2px rgba(0,0,0,.45), 0 10px 28px rgba(0,0,0,.38);
  --shadow-lg:0 20px 54px rgba(0,0,0,.55);
  color-scheme: dark;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion: reduce){ html{scroll-behavior:auto} }
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:var(--body);font-size:16.5px;line-height:1.62;overflow-x:hidden;
}
img{max-width:100%;display:block}
a{color:var(--navy);text-decoration:none}
a:hover{color:var(--crimson)}
:focus-visible{outline:3px solid var(--gold);outline-offset:2px;border-radius:4px}
svg{flex:none}

h1,h2,h3,h4{font-family:var(--display);color:var(--ink);line-height:1.18;margin:0 0 .38em;text-wrap:balance;font-weight:700;letter-spacing:-.012em}
h1{font-size:clamp(1.95rem,1.3rem + 2.6vw,3rem)}
h2{font-size:clamp(1.55rem,1.2rem + 1.5vw,2.15rem)}
h3{font-size:clamp(1.18rem,1.05rem + .5vw,1.42rem)}
p{margin:0 0 .8em}
ul,ol{margin:0 0 .8em;padding-left:1.2em}
li{margin-bottom:.22em}

.wrap{
  width:100%;max-width:var(--maxw);margin-inline:auto;
  padding-left:max(18px, env(safe-area-inset-left, 0px));
  padding-right:max(18px, env(safe-area-inset-right, 0px));
}
.section{padding-block:clamp(2.1rem,1.5rem + 2.2vw,3.4rem)}
.section--tight{padding-block:clamp(1.5rem,1.1rem + 1.4vw,2.2rem)}
.section--alt{background:var(--surface-2)}
.section--navy{background:var(--grad-navy);color:var(--on-navy)}
.section--navy h2,.section--navy h3{color:var(--on-navy)}

.eyebrow{
  font-size:.76rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;
  color:var(--crimson);margin:0 0 .45rem;display:flex;align-items:center;gap:.6rem;
}
.eyebrow::before{content:"";width:28px;height:3px;background:var(--grad-gold);border-radius:2px;flex:none}
.section--navy .eyebrow{color:var(--gold)}
.lede{font-size:1.02rem;color:var(--muted);max-width:68ch}
.section--navy .lede{color:#C9D6EE}
.head-block{max-width:66ch;margin-bottom:1.5rem}
.head-block--center{margin-inline:auto;text-align:center}
.head-block--center .eyebrow{justify-content:center}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  font-weight:700;font-size:.95rem;padding:.68rem 1.35rem;border-radius:999px;
  border:2px solid transparent;cursor:pointer;line-height:1.3;text-align:center;
  transition:transform .15s ease, box-shadow .15s ease, filter .15s ease;
}
.btn:hover{transform:translateY(-2px)}
.btn--primary{background:var(--grad-crimson);color:#fff;box-shadow:0 10px 24px rgba(194,25,43,.3)}
.btn--primary:hover{color:#fff;filter:brightness(1.07)}
.btn--gold{background:var(--grad-gold);color:#30210A;box-shadow:0 10px 24px rgba(224,164,34,.34)}
.btn--gold:hover{color:#30210A;filter:brightness(1.05)}
.btn--navy{background:var(--grad-navy);color:#fff;box-shadow:0 10px 24px rgba(14,46,99,.26)}
.btn--navy:hover{color:#fff;filter:brightness(1.15)}
.btn--ghost{border-color:currentColor;color:var(--navy);background:transparent}
.section--navy .btn--ghost,.hero .btn--ghost,.cta-band .btn--ghost,.pagehead .btn--ghost{color:#fff}
.btn--ghost:hover{background:rgba(14,46,99,.08)}
.section--navy .btn--ghost:hover,.hero .btn--ghost:hover,.cta-band .btn--ghost:hover{background:rgba(255,255,255,.14);color:#fff}
.btn--duo{background-color:#13306A;background-image:linear-gradient(118deg,#0E2E63 0%,#1A3F85 36%,#C2192B 100%);color:#fff;border-color:#E0A422;box-shadow:0 8px 20px rgba(14,46,99,.32)}
.btn--duo:hover{color:#fff;filter:brightness(1.14)}
.btn--duo svg{color:#fff}
.btn--sm{padding:.52rem 1.05rem;font-size:.87rem}
.btn-row{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:1.1rem}
.btn-row--center{justify-content:center}

/* ---------- top utility bar ---------- */
.topbar{background:var(--navy-ink);color:#C2D2EC;font-size:.86rem}
.topbar a{color:#C2D2EC}
.topbar a:hover{color:var(--gold)}
.topbar .wrap{display:flex;flex-wrap:wrap;gap:.2rem 1.4rem;align-items:center;justify-content:space-between;padding-block:.38rem}
.topbar-contact,.topbar-links{display:flex;flex-wrap:wrap;gap:.3rem 1.3rem;align-items:center;margin:0;padding:0;list-style:none}
.topbar-contact span,.topbar-links a{display:inline-flex;align-items:center;gap:.4rem}
.topbar-links a{font-weight:600}

/* ---------- masthead ---------- */
.masthead{
  background:var(--surface);border-bottom:3px solid transparent;
  border-image:var(--grad-gold) 1;
  position:sticky;top:env(safe-area-inset-top, 0px);z-index:40;box-shadow:var(--shadow);
}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top, 0px);z-index:50;background:var(--navy-ink)}
.masthead .wrap{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding-block:.45rem;position:relative}
.brand{display:flex;align-items:center;gap:.7rem;min-width:0;flex:none}
.brand img{height:52px;width:auto}
@media (max-width: 480px){ .brand img{height:46px} }

.nav-toggle{
  display:none;background:var(--grad-navy);color:#fff;border:0;border-radius:10px;
  padding:.6rem .9rem;font-size:.92rem;font-weight:700;cursor:pointer;align-items:center;gap:.55rem;
}
.nav-toggle .bars{display:block;width:18px;height:2px;background:#fff;position:relative}
.nav-toggle .bars::before,.nav-toggle .bars::after{content:"";position:absolute;left:0;width:18px;height:2px;background:#fff}
.nav-toggle .bars::before{top:-6px}
.nav-toggle .bars::after{top:6px}

.nav{display:flex;align-items:center;gap:.05rem;list-style:none;margin:0;padding:0}
.nav > li{position:static}
.nav > li:not(.has-mega){position:relative}
.nav > li:not(.nav-cta) > a,.nav > li > button{
  display:flex;align-items:center;gap:.4rem;font-family:var(--body);font-weight:600;
  font-size:.93rem;color:var(--ink);padding:.62rem .62rem;border-radius:9px;
  background:none;border:0;cursor:pointer;white-space:nowrap;
}
.nav > li:not(.nav-cta) > a svg,.nav > li > button svg:first-child{color:var(--navy);opacity:.85}
.nav > li:not(.nav-cta) > a:hover,.nav > li > button:hover,.nav > li.is-open > button{background:var(--surface-2);color:var(--crimson)}
.nav > li:not(.nav-cta) > a:hover svg,.nav > li > button:hover svg:first-child{color:var(--crimson)}
.nav > li.current > a{color:var(--crimson)}
.nav > li.current > a::after{content:"";position:absolute;left:.62rem;right:.62rem;bottom:.05rem;height:3px;background:var(--grad-gold);border-radius:2px}
.caret{width:9px;height:9px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg) translate(-2px,-2px);opacity:.6}

/* mega menu */
.mega{
  position:absolute;left:0;right:0;top:100%;display:none;z-index:60;
  background:var(--surface);border-top:1px solid var(--line);
  box-shadow:var(--shadow-lg);border-radius:0 0 var(--radius) var(--radius);
}
.nav > li:hover > .mega,.nav > li.is-open > .mega{display:block}
.mega-inner{
  max-width:var(--maxw);margin-inline:auto;display:grid;grid-template-columns:1fr 1fr 280px;
  gap:1.3rem;padding:1.2rem max(18px, env(safe-area-inset-left,0px));
}
.mega h4{font-size:.76rem;letter-spacing:.14em;text-transform:uppercase;color:var(--crimson);margin:0 0 .8rem;font-family:var(--body)}
.mega ul{list-style:none;margin:0;padding:0;display:grid;gap:.25rem}
.mega ul a{
  display:flex;gap:.7rem;align-items:flex-start;padding:.55rem .6rem;border-radius:10px;color:var(--ink);
}
.mega ul a:hover{background:var(--surface-2);color:var(--crimson)}
.mega .mi{
  width:34px;height:34px;border-radius:9px;background:var(--surface-2);color:var(--navy);
  display:grid;place-items:center;flex:none;border:1px solid var(--line);
}
.mega ul a:hover .mi{background:var(--grad-navy);color:var(--gold);border-color:transparent}
.mega .mt{display:block;font-weight:700;font-size:.93rem;line-height:1.35}
.mega .md{display:block;font-size:.8rem;color:var(--muted);line-height:1.4}
.mega-promo{
  border-radius:var(--radius);overflow:hidden;background:var(--grad-navy);color:#fff;
  display:flex;flex-direction:column;
}
.mega-promo .photo{border-radius:0;aspect-ratio:16/9}
.mega-promo-body{padding:1rem 1.1rem 1.2rem}
.mega-promo h5{font-family:var(--display);font-size:1.02rem;margin:0 0 .3rem;color:#fff}
.mega-promo p{font-size:.84rem;color:#C9D6EE;margin:0 0 .8rem;line-height:1.45}

.nav-cta{margin-left:.45rem}
.nav > li.nav-cta > a.btn{
  background-color:#13306A;
  background-image:linear-gradient(118deg,#0E2E63 0%,#1A3F85 36%,#C2192B 100%);
  color:#fff;border:2px solid #E0A422;border-radius:999px;
  padding:.52rem 1.05rem;box-shadow:0 8px 20px rgba(14,46,99,.32);
}
.nav > li.nav-cta > a.btn:hover{color:#fff;filter:brightness(1.14);transform:translateY(-2px)}
.nav > li.nav-cta > a.btn svg{color:#fff;opacity:1}

@media (max-width: 1150px){
  .nav-toggle{display:inline-flex}
  .nav{
    display:none;position:absolute;left:0;right:0;top:100%;flex-direction:column;align-items:stretch;gap:0;
    background:var(--surface);border-top:1px solid var(--line);box-shadow:var(--shadow-lg);
    padding:.5rem max(18px, env(safe-area-inset-left,0px)) 1.2rem;max-height:74vh;overflow-y:auto;
  }
  .nav.is-open{display:flex}
  .nav > li,.nav > li:not(.has-mega){position:static}
  .nav > li:not(.nav-cta) > a,.nav > li > button{width:100%;justify-content:flex-start;padding:.8rem .3rem;border-bottom:1px solid var(--line)}
  .nav > li > button .caret{margin-left:auto}
  .nav > li.current > a::after{display:none}
  .mega{position:static;display:none;box-shadow:none;border:0;border-radius:0}
  .nav > li:hover > .mega{display:none}
  .nav > li.is-open > .mega{display:block}
  .mega-inner{grid-template-columns:1fr;gap:1rem;padding:.6rem 0 1rem .3rem;border-left:3px solid var(--gold);padding-left:.8rem;margin:.4rem 0}
  .mega-promo{display:none}
  .nav-cta{margin:1rem 0 0}
  .nav > li.nav-cta > a.btn{width:100%;border-bottom-width:2px}
}

/* ---------- announcement ribbon ---------- */
.ribbon{background:var(--grad-crimson);color:#fff;overflow:hidden;font-weight:600;font-size:.95rem}
.ribbon .wrap{display:flex;align-items:center;gap:.9rem;padding-block:.4rem}
.ribbon-tag{background:#fff;color:var(--crimson-deep);font-size:.71rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;padding:.22rem .6rem;border-radius:4px;flex:none}
.ribbon-track{overflow:hidden;flex:1;min-width:0}
.ribbon-track p{margin:0;white-space:nowrap;animation:slide 26s linear infinite}
@keyframes slide{from{transform:translateX(35%)}to{transform:translateX(-100%)}}
@media (prefers-reduced-motion: reduce){ .ribbon-track p{animation:none;white-space:normal} }

/* ---------- hero carousel ---------- */
.hero{position:relative;background:var(--navy-ink);color:#fff;overflow:hidden}
.hero-track{position:relative;min-height:clamp(380px,42vw,480px)}
.hero-slide{
  position:absolute;inset:0;opacity:0;visibility:hidden;
  transition:opacity .7s ease;display:flex;align-items:center;
}
.hero-slide.is-active{opacity:1;visibility:visible}
@media (prefers-reduced-motion: reduce){ .hero-slide{transition:none} }
.hero-bg{position:absolute;inset:0;z-index:0;background:var(--grad-navy)}
.hero-bg img{width:100%;height:100%;object-fit:cover;opacity:.46}
.hero-bg::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(100deg, rgba(7,26,59,.95) 0%, rgba(9,34,75,.86) 42%, rgba(9,34,75,.35) 100%);
}
.hero-slide .wrap{position:relative;z-index:2;width:100%;padding-block:clamp(2rem,1.5rem + 2.4vw,3rem)}
.hero-copy{max-width:640px}
.hero-kicker{
  display:inline-flex;align-items:center;gap:.5rem;font-size:.75rem;font-weight:700;
  letter-spacing:.16em;text-transform:uppercase;color:var(--gold);margin-bottom:.7rem;
}
.hero-kicker::before{content:"";width:26px;height:3px;background:var(--grad-gold);border-radius:2px}
.hero h1{color:#fff;margin-bottom:.4em;text-shadow:0 2px 18px rgba(0,0,0,.35)}
.hero h1 em{font-style:normal;color:var(--gold)}
.hero p{color:#D5E0F2;font-size:1.02rem;max-width:54ch;margin-bottom:0}
.hero-nav{
  position:absolute;bottom:1rem;left:0;right:0;z-index:5;
  display:flex;align-items:center;gap:.8rem;
  max-width:var(--maxw);margin-inline:auto;
  padding-left:max(18px, env(safe-area-inset-left,0px));
  padding-right:max(18px, env(safe-area-inset-right,0px));
}
.hero-dots{display:flex;gap:.5rem}
.hero-dots button{width:36px;height:5px;border-radius:3px;border:0;background:rgba(255,255,255,.32);cursor:pointer;padding:0}
.hero-dots button[aria-current="true"]{background:var(--grad-gold)}
.hero-arrows{display:flex;gap:.5rem;margin-left:auto}
.hero-arrows button{
  width:38px;height:38px;border-radius:50%;border:1px solid rgba(255,255,255,.35);
  background:rgba(7,26,59,.5);color:#fff;cursor:pointer;display:grid;place-items:center;
}
.hero-arrows button:hover{background:var(--grad-gold);color:#30210A;border-color:transparent}

/* quick strip under hero */
.quickstrip{background:var(--surface);border-bottom:1px solid var(--line)}
.quickstrip .wrap{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;padding:0;background:var(--line)}
.quickstrip a{
  display:flex;gap:.8rem;align-items:center;background:var(--surface);
  padding:.85rem max(18px, env(safe-area-inset-left,0px));color:var(--ink);
}
.quickstrip a:hover{background:var(--surface-2);color:var(--crimson)}
.quickstrip .qi{width:38px;height:38px;border-radius:11px;background:var(--grad-navy);color:var(--gold);display:grid;place-items:center;flex:none}
.quickstrip .qt{display:block;font-weight:700;font-size:.95rem;line-height:1.3}
.quickstrip .qd{display:block;font-size:.81rem;color:var(--muted);line-height:1.3}
@media (max-width: 900px){ .quickstrip .wrap{grid-template-columns:repeat(2,1fr)} }
@media (max-width: 460px){ .quickstrip .wrap{grid-template-columns:1fr} }

/* ---------- photo frames ---------- */
.photo{position:relative;border-radius:var(--radius);overflow:hidden;background:var(--grad-navy);box-shadow:var(--shadow)}
.photo::before{
  content:attr(data-label);position:absolute;inset:0;display:grid;place-items:center;
  color:rgba(255,255,255,.7);font-family:var(--display);font-size:.9rem;text-align:center;
  padding:1.2rem;z-index:0;line-height:1.4;
}
.photo img{position:relative;z-index:1;width:100%;height:100%;object-fit:cover}
.photo--4x3{aspect-ratio:4/3}
.photo--16x9{aspect-ratio:16/9}
.photo--3x2{aspect-ratio:3/2}
.photo--1x1{aspect-ratio:1/1}
.photo--tall{aspect-ratio:3/4}
.photo-frame{position:relative}
.photo-frame::after{
  content:"";position:absolute;inset:14px -14px -14px 14px;border:3px solid var(--gold);
  border-radius:var(--radius);z-index:-1;
}
@media (max-width: 640px){ .photo-frame::after{display:none} }

/* ---------- splits & grids ---------- */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.4rem,1rem + 2.2vw,2.6rem);align-items:center}
.split--narrow-left{grid-template-columns:.88fr 1.12fr}
.split--narrow-right{grid-template-columns:1.12fr .88fr}
@media (max-width: 900px){ .split,.split--narrow-left,.split--narrow-right{grid-template-columns:1fr} }
.stamp{display:block;border-left:4px solid var(--gold);background:var(--surface-2);padding:.8rem 1.05rem;border-radius:0 var(--radius-sm) var(--radius-sm) 0;font-size:.97rem}

.grid{display:grid;gap:1.1rem}
.grid--2{grid-template-columns:repeat(2,1fr)}
.grid--3{grid-template-columns:repeat(3,1fr)}
.grid--4{grid-template-columns:repeat(4,1fr)}
@media (max-width: 1050px){ .grid--4{grid-template-columns:repeat(2,1fr)} .grid--3{grid-template-columns:repeat(2,1fr)} }
@media (max-width: 700px){ .grid--2,.grid--3,.grid--4{grid-template-columns:1fr} }

.card{
  background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);
  padding:1.25rem;display:flex;flex-direction:column;min-width:0;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg);border-color:var(--gold)}
.card h3{margin-bottom:.3rem}
.card p{color:var(--muted);font-size:.96rem;margin-bottom:0}
.card .card-link{margin-top:auto;padding-top:.8rem;font-weight:700;font-size:.9rem;color:var(--crimson);display:inline-flex;align-items:center;gap:.4rem}
.card-icon{
  width:44px;height:44px;border-radius:12px;display:grid;place-items:center;flex:none;
  background:var(--grad-navy);color:var(--gold);margin-bottom:.75rem;
}
.card-icon--gold{background:var(--grad-gold);color:#30210A}
.card-icon--crimson{background:var(--grad-crimson);color:#fff}
.card--rail{border-top:4px solid var(--navy)}
.card--rail:nth-child(3n+2){border-top-color:var(--crimson)}
.card--rail:nth-child(3n+3){border-top-color:var(--gold)}
.card--media{padding:0;overflow:hidden}
.card--media .card-body{padding:1.15rem}
.card--media .photo{border-radius:0;box-shadow:none}

/* numbered steps */
.steps{list-style:none;margin:0;padding:0;display:grid;gap:.8rem;counter-reset:step}
.steps > li{
  background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);
  padding:1.05rem 1.2rem 1.05rem 4.1rem;position:relative;counter-increment:step;
}
.steps > li::before{
  content:counter(step,decimal-leading-zero);position:absolute;left:1.15rem;top:1rem;
  font-family:var(--display);font-weight:700;font-size:1.25rem;
  background:var(--grad-gold);-webkit-background-clip:text;background-clip:text;color:transparent;
}
.steps h3{font-size:1.08rem;margin-bottom:.35rem}
.steps ul{margin:.5rem 0 0;padding-left:1.1rem;color:var(--muted);font-size:.95rem}

/* counters */
.counters{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;text-align:center}
@media (max-width: 780px){ .counters{grid-template-columns:repeat(2,1fr)} }
.counter{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.17);border-radius:var(--radius);padding:1.1rem 1rem}
.counter .ci{color:var(--gold);margin:0 auto .4rem;display:block}
.counter .num{display:block;font-family:var(--display);font-weight:700;color:var(--gold);font-size:clamp(1.85rem,1.3rem + 1.8vw,2.7rem);line-height:1;font-variant-numeric:tabular-nums}
.counter .label{display:block;margin-top:.35rem;font-size:.86rem;letter-spacing:.07em;text-transform:uppercase;color:#C9D6EE;font-weight:600}

/* page header */
.pagehead{background:var(--navy-ink);color:#fff;position:relative;overflow:hidden}
.pagehead-bg{position:absolute;inset:0;z-index:0}
.pagehead-bg img{width:100%;height:100%;object-fit:cover;opacity:.3}
.pagehead-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg, rgba(7,26,59,.94), rgba(9,34,75,.72))}
.pagehead .wrap{position:relative;z-index:2;padding-block:clamp(1.7rem,1.3rem + 1.8vw,2.6rem)}
.pagehead h1{color:#fff;margin-bottom:.3em}
.pagehead p{color:#CCD9EF;max-width:66ch;margin:0;font-size:.98rem}
.crumbs{list-style:none;display:flex;flex-wrap:wrap;gap:.45rem;margin:0 0 .6rem;padding:0;font-size:.85rem;color:#9DB3D8}
.crumbs a{color:var(--gold)}
.crumbs li+li::before{content:"/";margin-right:.45rem;color:#6C85B4}

/* tables */
.table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface)}
table{border-collapse:collapse;width:100%;min-width:520px;font-size:.95rem}
th,td{padding:.65rem 1rem;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}
thead th{background:var(--grad-navy);color:#fff;font-family:var(--body);font-weight:700;font-size:.82rem;letter-spacing:.07em;text-transform:uppercase}
tbody tr:last-child td{border-bottom:0}
tbody tr:nth-child(even){background:var(--surface-2)}
tbody th{background:var(--surface-2);font-weight:700;font-family:var(--body);width:38%}

/* link lists */
.linklist{list-style:none;margin:0;padding:0;display:grid;gap:.5rem}
.linklist a{
  display:flex;align-items:center;gap:.9rem;background:var(--surface);border:1px solid var(--line);
  border-radius:var(--radius-sm);padding:.7rem 1rem;font-weight:600;color:var(--ink);
}
.linklist a:hover{border-color:var(--gold);color:var(--crimson);box-shadow:var(--shadow)}
.linklist .li-ico{width:38px;height:38px;border-radius:10px;background:var(--surface-2);color:var(--navy);display:grid;place-items:center;flex:none;border:1px solid var(--line)}
.linklist a:hover .li-ico{background:var(--grad-crimson);color:#fff;border-color:transparent}
.linklist .tag{margin-left:auto;font-size:.72rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);flex:none}

.chips{display:flex;flex-wrap:wrap;gap:.6rem;list-style:none;margin:0;padding:0}
.chips a{display:inline-flex;align-items:center;gap:.45rem;background:var(--surface);border:1px solid var(--line);border-radius:999px;padding:.45rem 1.05rem;font-size:.92rem;font-weight:600;color:var(--ink)}
.chips a:hover{background:var(--grad-navy);color:#fff;border-color:transparent}

/* subject cards */
.subject{
  background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);
  overflow:hidden;display:flex;flex-direction:column;transition:transform .18s ease, box-shadow .18s ease;
}
.subject:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}
.subject .photo{border-radius:0;box-shadow:none}
.subject-body{padding:1.05rem;display:flex;flex-direction:column;flex:1}
.subject-head{display:flex;gap:.7rem;align-items:center;margin-bottom:.55rem}
.subject-head .si{width:42px;height:42px;border-radius:11px;background:var(--grad-navy);color:var(--gold);display:grid;place-items:center;flex:none}
.subject-head h3{margin:0;font-size:1.08rem}
.subject ul{list-style:none;margin:0 0 .85rem;padding:0;display:grid;gap:.22rem;font-size:.9rem;color:var(--muted)}
.subject ul li{display:flex;gap:.5rem;align-items:flex-start;margin:0}
.subject ul li::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--gold);margin-top:.58rem;flex:none}
.subject .btn{margin-top:auto}

/* gallery + lightbox */
.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:.7rem}
.gallery button{padding:0;border:0;background:none;cursor:pointer;border-radius:var(--radius-sm);overflow:hidden;display:block;width:100%}
.gallery .photo{border-radius:var(--radius-sm)}
.gallery button:hover .photo{box-shadow:var(--shadow-lg);transform:translateY(-3px)}
.gallery .photo{transition:transform .18s ease, box-shadow .18s ease}
.lightbox{
  position:fixed;inset:0;z-index:90;background:rgba(7,18,38,.93);
  display:grid;place-items:center;padding:max(20px, env(safe-area-inset-top,0px)) 20px;
}
.lightbox img{max-width:min(1100px,94vw);max-height:84vh;width:auto;border-radius:var(--radius);box-shadow:var(--shadow-lg)}
.lightbox-close,.lightbox-prev,.lightbox-next{
  position:absolute;width:48px;height:48px;border-radius:50%;border:1px solid rgba(255,255,255,.3);
  background:rgba(255,255,255,.1);color:#fff;cursor:pointer;display:grid;place-items:center;font-size:1.3rem;
}
.lightbox-close{top:max(20px, env(safe-area-inset-top,0px));right:20px}
.lightbox-prev{left:16px;top:50%;transform:translateY(-50%)}
.lightbox-next{right:16px;top:50%;transform:translateY(-50%)}
.lightbox-close:hover,.lightbox-prev:hover,.lightbox-next:hover{background:var(--grad-gold);color:#30210A}

/* forms */
.form{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:clamp(1.1rem,.9rem + 1vw,1.6rem);box-shadow:var(--shadow)}
.field{display:grid;gap:.3rem;margin-bottom:.75rem}
.field label{font-size:.87rem;font-weight:700}
.field input,.field select,.field textarea{
  font-family:var(--body);font-size:.97rem;color:var(--ink);background:var(--paper);
  border:1px solid var(--line);border-radius:var(--radius-sm);padding:.6rem .85rem;width:100%;
}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--navy);outline:2px solid var(--gold);outline-offset:1px}
.field textarea{min-height:96px;resize:vertical}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:0 1rem}
@media (max-width: 620px){ .form-row{grid-template-columns:1fr} }
.form-note{font-size:.86rem;color:var(--muted);margin:.9rem 0 0}
.form-status{margin-top:1rem;padding:.9rem 1.1rem;border-radius:var(--radius-sm);background:var(--gold-soft);border-left:4px solid var(--gold);font-size:.94rem;font-weight:600}

/* contact info */
.info-list{list-style:none;margin:0;padding:0;display:grid;gap:.7rem}
.info-list li{display:flex;gap:.9rem;align-items:flex-start}
.info-list .ico{width:42px;height:42px;border-radius:12px;flex:none;display:grid;place-items:center;background:var(--grad-navy);color:var(--gold)}
.info-list .k{display:block;font-size:.74rem;letter-spacing:.13em;text-transform:uppercase;color:var(--muted);font-weight:700}
.info-list .v{display:block;font-weight:600;word-break:break-word}

/* CTA band */
.cta-band{background:var(--grad-navy);color:#fff;border-top:4px solid var(--gold)}
.cta-band .wrap{padding-block:clamp(1.7rem,1.3rem + 1.6vw,2.5rem);display:grid;grid-template-columns:1.35fr .65fr;gap:1.6rem;align-items:center}
@media (max-width: 820px){ .cta-band .wrap{grid-template-columns:1fr} }
.cta-band h2{color:#fff;margin-bottom:.4rem}
.cta-band p{color:#C9D6EE;margin:0}
.cta-band .btn-row{margin-top:0;justify-content:flex-end}
@media (max-width: 820px){ .cta-band .btn-row{justify-content:flex-start} }

/* footer */
.footer{background:var(--navy-ink);color:#B6C6E2;font-size:.94rem;position:relative}
.footer::before{content:"";display:block;height:4px;background:var(--grad-gold)}
.footer a{color:#B6C6E2}
.footer a:hover{color:var(--gold)}
.footer .wrap{padding-block:clamp(2rem,1.6rem + 1.6vw,2.8rem)}
.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.35fr;gap:1.4rem 2rem}
@media (max-width: 1000px){ .footer-grid{grid-template-columns:1fr 1fr} }
@media (max-width: 600px){ .footer-grid{grid-template-columns:1fr} }
.footer-col{min-width:0}
.footer-col + .footer-col{border-left:1px solid rgba(255,255,255,.09);padding-left:2rem}
@media (max-width: 1000px){ .footer-col + .footer-col{border-left:0;padding-left:0} }
.footer-logo{background:#fff;border-radius:12px;padding:.5rem .7rem;display:inline-block;margin-bottom:.8rem}
.footer-logo img{height:46px;width:auto}
.footer-about{margin-bottom:.9rem;line-height:1.6}
.footer-motto{
  display:inline-flex;align-items:center;gap:.55rem;border:1px solid rgba(224,164,34,.45);
  background:rgba(224,164,34,.08);border-radius:999px;padding:.3rem .95rem;
  color:var(--gold);font-family:var(--display);font-size:.98rem;margin-bottom:.2rem;
}
.footer h3{color:#fff;font-size:.95rem;letter-spacing:.06em;text-transform:uppercase;margin-bottom:.9rem;position:relative;padding-bottom:.5rem;font-family:var(--body);font-weight:700}
.footer h3::after{content:"";position:absolute;left:0;bottom:0;width:32px;height:3px;background:var(--grad-gold);border-radius:2px}
.footer ul{list-style:none;margin:0;padding:0;display:grid;gap:.1rem}
.footer ul li{margin:0}
.footer-links a{display:flex;align-items:center;gap:.5rem;padding:.26rem 0;transition:transform .15s ease}
.footer-links a svg{color:var(--gold);opacity:.7;transition:transform .15s ease}
.footer-links a:hover{transform:translateX(3px)}
.footer-links a:hover svg{opacity:1}
.footer-contact{display:grid;gap:.75rem}
.footer-contact li{display:flex;gap:.7rem;align-items:flex-start;line-height:1.5}
.footer-contact .fi{
  width:32px;height:32px;border-radius:9px;flex:none;display:grid;place-items:center;
  background:rgba(224,164,34,.14);color:var(--gold);border:1px solid rgba(224,164,34,.3);
}
.footer-contact .fk{display:block;font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:#8EA3C8;font-weight:700}
.footer-contact .fv{display:block;font-weight:600;color:#DCE6F7;word-break:break-word}
.footer-cta{margin-top:1rem}
.footer .social{display:flex;gap:.5rem;margin-top:1rem;flex-wrap:wrap}
.footer .social a{
  width:38px;height:38px;border-radius:10px;display:grid;place-items:center;
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);
}
.footer .social a:hover{background:var(--grad-gold);color:#30210A;border-color:transparent}
.footer-bottom{border-top:1px solid rgba(255,255,255,.1);font-size:.85rem;background:rgba(0,0,0,.2)}
.footer-bottom .wrap{display:flex;flex-wrap:wrap;gap:.4rem 1.5rem;justify-content:space-between;align-items:center;padding-block:.8rem}
.footer-bottom nav{display:flex;flex-wrap:wrap;gap:.3rem 1.1rem}

/* sticky mobile action bar */
.actionbar{display:none}
@media (max-width: 780px){
  .actionbar{
    display:grid;grid-template-columns:1fr 1fr;gap:1px;position:fixed;left:0;right:0;bottom:0;z-index:70;
    background:var(--line);padding-bottom:env(safe-area-inset-bottom, 0px);
    padding-left:env(safe-area-inset-left, 0px);padding-right:env(safe-area-inset-right, 0px);
    box-shadow:0 -6px 20px rgba(14,46,99,.2);
  }
  .actionbar a{display:flex;align-items:center;justify-content:center;gap:.45rem;background:var(--grad-crimson);color:#fff;font-weight:700;font-size:.94rem;padding:.9rem .5rem}
  .actionbar a + a{background:var(--grad-navy)}
  body{padding-bottom:64px}
}

.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
/* ===========================================================
   WordPress-specific additions on top of the base stylesheet:
   native menu markup, dropdowns, blog/archive and editor classes.
   =========================================================== */

/* ---------- navigation built from a WordPress menu ---------- */
.nav .sub-menu{
  list-style:none;margin:0;padding:.4rem;position:absolute;top:100%;left:0;min-width:250px;
  background:var(--surface);border:1px solid var(--line);border-radius:12px;
  box-shadow:var(--shadow-lg);display:none;z-index:60;
}
.nav > li.menu-item-has-children{position:relative}
.nav > li.menu-item-has-children:hover > .sub-menu,
.nav > li.menu-item-has-children.is-open > .sub-menu{display:block}
.nav .sub-menu li{margin:0}
.nav .sub-menu a{
  display:flex;align-items:center;gap:.55rem;padding:.5rem .7rem;border-radius:8px;
  font-size:.92rem;font-weight:600;color:var(--ink);white-space:nowrap;
}
.nav .sub-menu a:hover{background:var(--surface-2);color:var(--crimson)}
.nav .sub-menu a svg{color:var(--navy);opacity:.75}
.nav .sub-menu a:hover svg{color:var(--crimson);opacity:1}
.nav > li.menu-item-has-children > a::after{
  content:"";width:8px;height:8px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;
  transform:rotate(45deg) translate(-2px,-2px);opacity:.6;margin-left:.15rem;flex:none;
}
/* wide dropdowns when a menu has a lot of children */
.nav > li.kps-wide > .sub-menu{min-width:470px;column-count:2;column-gap:.4rem}
.nav > li.kps-wide > .sub-menu li{break-inside:avoid}

.nav > li.current-menu-item > a,
.nav > li.current-menu-ancestor > a,
.nav > li.current_page_item > a{color:var(--crimson)}
.nav > li.current-menu-item > a::before,
.nav > li.current-menu-ancestor > a::before,
.nav > li.current_page_item > a::before{
  content:"";position:absolute;left:.62rem;right:.62rem;bottom:.05rem;height:3px;
  background:var(--grad-gold);border-radius:2px;
}

@media (max-width: 1150px){
  .nav .sub-menu{
    position:static;display:none;box-shadow:none;border:0;border-left:3px solid var(--gold);
    border-radius:0;margin:.2rem 0 .5rem .4rem;padding-left:.6rem;min-width:0;
  }
  .nav > li.menu-item-has-children:hover > .sub-menu{display:none}
  .nav > li.menu-item-has-children.is-open > .sub-menu{display:block}
  .nav > li.kps-wide > .sub-menu{min-width:0;column-count:1}
  .nav > li.current-menu-item > a::before{display:none}
  .nav > li.menu-item-has-children > a::after{margin-left:auto}
}

/* ---------- hero carousel built by the theme shortcode ---------- */
.kps-hero-shortcode{margin:0}

/* ---------- blog, archive and single post ---------- */
.entry{
  background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);
  padding:1.5rem;margin-bottom:1.3rem;
}
.entry h2{font-size:1.4rem;margin-bottom:.4rem}
.entry .meta{font-size:.84rem;color:var(--muted);margin-bottom:.7rem}
.entry-content > *:last-child{margin-bottom:0}
.entry-content img{border-radius:var(--radius-sm);margin:1.2rem 0}
.entry-content blockquote{
  margin:1.3rem 0;padding:.9rem 1.2rem;border-left:4px solid var(--gold);
  background:var(--surface-2);border-radius:0 var(--radius-sm) var(--radius-sm) 0;font-style:italic;
}
.entry-content code{background:var(--surface-2);padding:.15em .4em;border-radius:5px;font-size:.92em}
.entry-content pre{background:var(--navy-ink);color:#DCE6F7;padding:1rem;border-radius:var(--radius-sm);overflow-x:auto}

.pagination{display:flex;flex-wrap:wrap;gap:.45rem;margin-top:1.6rem}
.pagination .page-numbers{
  display:grid;place-items:center;min-width:40px;height:40px;padding:0 .7rem;
  background:var(--surface);border:1px solid var(--line);border-radius:10px;font-weight:600;color:var(--ink);
}
.pagination .page-numbers.current,.pagination .page-numbers:hover{
  background:var(--grad-navy);color:#fff;border-color:transparent;
}

/* ---------- WordPress core classes ---------- */
.alignleft{float:left;margin:.3rem 1.4rem 1rem 0}
.alignright{float:right;margin:.3rem 0 1rem 1.4rem}
.aligncenter{margin-inline:auto;display:block}
.alignwide,.alignfull{max-width:100%}
.wp-caption{max-width:100%}
.wp-caption-text,figcaption{font-size:.86rem;color:var(--muted);text-align:center;margin-top:.5rem}
.sticky,.gallery-caption,.bypostauthor{display:block}
.screen-reader-text{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0,0,0,0);white-space:nowrap;border:0;
}
.skip-link:focus{
  position:fixed;top:12px;left:12px;z-index:200;width:auto;height:auto;clip:auto;
  background:var(--navy);color:#fff;padding:.7rem 1.2rem;border-radius:10px;font-weight:700;
}

/* ---------- Elementor plays nicely with the theme shell ---------- */
.elementor-section.elementor-section-boxed > .elementor-container{max-width:var(--maxw)}
body.elementor-page .site-main{padding:0}
.site-main{min-height:40vh}
/* ===========================================================
   KPS Kendriya Vidyalaya — Contact Form 7 styling
   Paste into Appearance → Customize → Additional CSS,
   or upload to /wp-content/uploads/kps/form-styles.css
   =========================================================== */

:root{
  --kps-navy:#0E2E63;
  --kps-navy-deep:#071A3B;
  --kps-crimson:#C2192B;
  --kps-gold:#E0A422;
  --kps-paper:#F3F6FB;
  --kps-ink:#121A2B;
  --kps-muted:#52607C;
  --kps-line:#D6DFEE;
}

/* layout helpers used inside the form markup */
.wpcf7 .kps-grid-1{display:grid;gap:0;margin-bottom:0}
.wpcf7 .kps-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}
@media (max-width:600px){ .wpcf7 .kps-grid-2{grid-template-columns:1fr} }

.wpcf7 label{
  display:block;font-size:14px;font-weight:700;color:var(--kps-ink);
  margin-bottom:12px;line-height:1.5;
}

.wpcf7 input[type=text],
.wpcf7 input[type=email],
.wpcf7 input[type=tel],
.wpcf7 input[type=number],
.wpcf7 input[type=date],
.wpcf7 select,
.wpcf7 textarea{
  width:100%;margin-top:5px;
  font-family:inherit;font-size:15.5px;font-weight:400;color:var(--kps-ink);
  background:var(--kps-paper);
  border:1px solid var(--kps-line);border-radius:10px;
  padding:11px 14px;line-height:1.4;
  transition:border-color .15s ease, box-shadow .15s ease;
}
.wpcf7 textarea{min-height:100px;resize:vertical}

.wpcf7 input:focus,
.wpcf7 select:focus,
.wpcf7 textarea:focus{
  outline:none;border-color:var(--kps-navy);
  box-shadow:0 0 0 3px rgba(224,164,34,.35);
}

.wpcf7 input[type=file]{
  width:100%;margin-top:5px;font-size:14px;
  background:var(--kps-paper);border:1px dashed var(--kps-line);
  border-radius:10px;padding:11px 14px;
}

/* submit button — the two-colour brand gradient */
.wpcf7 input[type=submit],
.wpcf7 button[type=submit]{
  width:100%;cursor:pointer;
  font-family:inherit;font-size:15.5px;font-weight:700;color:#fff;
  background-color:#13306A;
  background-image:linear-gradient(118deg,#0E2E63 0%,#1A3F85 36%,#C2192B 100%);
  border:2px solid var(--kps-gold);border-radius:999px;
  padding:13px 28px;margin-top:6px;
  box-shadow:0 8px 20px rgba(14,46,99,.3);
  transition:transform .15s ease, filter .15s ease;
}
.wpcf7 input[type=submit]:hover,
.wpcf7 button[type=submit]:hover{transform:translateY(-2px);filter:brightness(1.14)}

/* the little spinner CF7 shows while sending */
.wpcf7 .wpcf7-spinner{margin:12px auto 0;display:block}

/* validation + response messages */
.wpcf7 .wpcf7-not-valid-tip{
  color:var(--kps-crimson);font-size:13px;font-weight:600;margin-top:5px;
}
.wpcf7 .wpcf7-not-valid{border-color:var(--kps-crimson)!important}
.wpcf7 form .wpcf7-response-output{
  margin:16px 0 0;padding:13px 16px;border:0;border-left:4px solid var(--kps-gold);
  background:#FBEFD2;color:#3C2B05;border-radius:10px;font-size:15px;font-weight:600;
}
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output{
  background:#FBE3E6;border-left-color:var(--kps-crimson);color:#6A0B16;
}
.wpcf7 form.sent .wpcf7-response-output{
  background:#E3F3E8;border-left-color:#1E7A3C;color:#125027;
}

/* dark mode, if the theme supports it */
@media (prefers-color-scheme: dark){
  body.kps-dark .wpcf7 label{color:#E9EEF8}
  body.kps-dark .wpcf7 input,
  body.kps-dark .wpcf7 select,
  body.kps-dark .wpcf7 textarea{
    background:#101A2E;border-color:#22304D;color:#E9EEF8;
  }
}