/* Vedashree International School - the website's one stylesheet.
   The console's palette, as it is: white base always (the console has no
   dark mode), Inter for everything that carries weight, Fraunces only for
   the small navy titles. The f is pinned flat - SOFT and WONK at 0 - so it
   never goes quirky (22 September 2026). */
:root{
  --navy:#0d1b3e;
  --navy2:#1f3567;
  --gold:#c79a3b;
  --ink:#10131a;
  --muted:#5b6472;
  --mut:#7a8194;
  --line:#e6eaf2;
  --red:#c8202c;

  --blue:#1f4bb8;   --blue-b:#e7f1fb;
  --teal:#0f7a52;   --teal-b:#e7f6ee;
  --violet:#5b34c4; --violet-b:#f3eefc;
  --amber:#9a6b00;  --amber-b:#fbf0d9;
  --rose:#b3202c;   --rose-b:#fdecef;
  --cyan:#0e6ba8;   --cyan-b:#eef3ff;

  --bg:#ffffff;
  --surface:#ffffff;
  --panel:#f6f8fc;
  --text:var(--ink);
  --dim:var(--muted);
  --shadow:0 1px 2px rgba(13,27,62,.05),0 10px 30px rgba(13,27,62,.07);
  color-scheme:light;
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--text);
  font-family:Inter,Arial,sans-serif;font-size:16px;line-height:1.62;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{margin:0;line-height:1.18;text-wrap:balance}
h1{font-family:Inter,Arial,sans-serif;font-weight:800;letter-spacing:-.032em;color:var(--navy)}
h2{font-family:Fraunces,Georgia,serif;font-weight:700;letter-spacing:-.01em;color:var(--navy)}
h3,h4{font-family:Fraunces,Georgia,serif;font-weight:700;letter-spacing:-.01em;color:var(--navy)}
h2,h3,h4,.brand,.masthead .nm,.msg blockquote,.rline.total .k{font-variation-settings:"SOFT" 0,"WONK" 0}
p{margin:0}
/* HAR LINE DONO KINARON SE BARABAR (Sahil, 23 Sep 2026).
   Hyphenation saath mein lagti hai - uske bina justify shabdon ke beech
   chaudi khaai bana deta hai aur padhna mushkil ho jaata hai.
   Heading par kabhi nahin: wahan `text-wrap:balance` lagi hai, aur justify
   ek do-shabd ki heading ko poore panne par kheench deta hai. */
p,li,blockquote,dd,figcaption{text-align:justify;text-justify:inter-word;
  -webkit-hyphens:auto;hyphens:auto}
.wrap{max-width:1160px;margin:0 auto;padding-inline:20px}
.eyebrow{font-size:11px;font-weight:700;letter-spacing:.17em;text-transform:uppercase;
  color:var(--gold);display:block;margin-bottom:11px}
.btn{display:inline-flex;align-items:center;gap:8px;justify-content:center;
  font-family:Inter,sans-serif;font-size:14.5px;font-weight:600;padding:11px 20px;border-radius:8px;
  text-decoration:none;border:1px solid transparent;cursor:pointer;transition:.16s;white-space:nowrap}
.btn-gold{background:var(--gold);color:#241804;border-color:var(--gold)}
.btn-gold:hover{background:#b3872e;border-color:#b3872e}
.btn-navy{background:var(--navy);color:#fff;border-color:var(--navy)}
.btn-navy:hover{background:var(--navy2);border-color:var(--navy2)}
.btn-line{border-color:var(--line);background:#fff;color:var(--text)}
.btn-line:hover{border-color:var(--gold)}
.btn-ghost{border-color:rgba(255,255,255,.4);color:#fff}
.btn-ghost:hover{background:rgba(255,255,255,.12)}
.masthead{background:var(--surface);text-align:center;padding-block:30px 22px}
.masthead .nm{font-family:Fraunces,Georgia,serif;font-weight:800;color:var(--ink);
  font-size:clamp(34px,7vw,66px);line-height:1;letter-spacing:-.022em;display:block}
.masthead .sb{font-family:Inter,Arial,sans-serif;font-weight:700;color:var(--gold);
  font-size:clamp(14px,2.4vw,24px);letter-spacing:.42em;text-transform:uppercase;
  display:block;margin-top:12px;padding-left:.42em}
.masthead .addr{margin-top:16px;font-size:clamp(13px,1.5vw,15.5px);color:var(--dim)}
@media(max-width:560px){
  .masthead{padding-block:22px 18px}
  .masthead .sb{letter-spacing:.24em;padding-left:.24em;margin-top:9px}
}
.infobar{background:var(--navy);color:#c6cfe4;font-size:13px}
.infobar .wrap{display:flex;flex-wrap:wrap;gap:7px 16px;justify-content:center;align-items:center;
  padding-block:10px;text-align:center}
.infobar a{color:#c6cfe4;text-decoration:none;display:inline-flex;align-items:center;gap:7px}
.infobar a:hover{color:#fff}
.infobar b{color:var(--gold);font-weight:700;font-variant-numeric:tabular-nums}
.infobar .sep{opacity:.3}
.infobar svg{width:15px;height:15px;flex:none}
@media(max-width:700px){.infobar{font-size:12px}}
.goldrule{height:3px;background:var(--gold)}
header.site{position:sticky;top:env(safe-area-inset-top,0px);z-index:50;background:var(--surface);
  border-bottom:1px solid var(--line);box-shadow:0 1px 0 rgba(13,27,62,.04)}
header.site .wrap{display:flex;align-items:center;gap:18px;padding-block:11px}
.brand{text-decoration:none;margin-right:auto;color:inherit;font-family:Fraunces,Georgia,serif;
  font-weight:800;font-size:19px;color:var(--ink);letter-spacing:-.015em;line-height:1}
/* Nav - wahi uthne wali harkat jo console ke attendance calendar ke tile par
   hai (.sa-tilecell): halka sa upar uthna, apni rang ki halki parat, aur
   neeche lakeer ka khulna. Har tab ka apna rang --t / --tb top.html se aata
   hai. Jiska motion band hai uske liye sirf rang badalta hai. */
nav.main{display:flex;gap:2px;align-items:center}
nav.main a{position:relative;text-decoration:none;font-size:14.5px;font-weight:600;color:var(--dim);
  padding:9px 13px;border-radius:10px;border:1px solid transparent;background:transparent;
  transition:transform .24s cubic-bezier(.34,1.15,.4,1),background .24s ease,color .18s ease,
             box-shadow .24s ease,border-color .24s ease}
nav.main a::after{content:"";position:absolute;left:13px;right:13px;bottom:5px;height:2px;border-radius:2px;
  background:var(--t,var(--gold));transform:scaleX(0);
  transition:transform .24s cubic-bezier(.34,1.15,.4,1)}
nav.main a:hover,nav.main a:focus-visible{transform:translateY(-3px);color:var(--navy);
  background:var(--tb,var(--panel));outline:none;
  border-color:color-mix(in srgb,var(--t,var(--gold)) 24%,transparent);
  box-shadow:0 12px 24px -14px color-mix(in srgb,var(--t,var(--navy)) 65%,transparent)}
nav.main a:hover::after,nav.main a:focus-visible::after{transform:scaleX(1)}
nav.main a.here{color:var(--navy);background:var(--tb,var(--panel))}
nav.main a.here::after{transform:scaleX(1)}
@media(prefers-reduced-motion:reduce){
  nav.main a{transition:background .2s ease,color .2s ease}
  nav.main a:hover,nav.main a:focus-visible{transform:none}
  nav.main a::after{transition:none}
}
@media(max-width:1060px){nav.main{display:none}}
.hero{background:var(--surface);border-bottom:1px solid var(--line)}
.hero .wrap{padding-block:58px 62px;display:grid;grid-template-columns:1.1fr .9fr;gap:46px;align-items:center}
@media(max-width:920px){.hero .wrap{grid-template-columns:1fr;padding-block:40px 44px;gap:30px}}
.tagpill{display:inline-flex;align-items:center;gap:8px;background:var(--amber-b);color:var(--amber);
  border:1px solid color-mix(in srgb,var(--gold) 35%,transparent);
  padding:5px 13px;border-radius:999px;font-size:12px;font-weight:700;letter-spacing:.03em}
.tagpill .dot{width:6px;height:6px;border-radius:50%;background:var(--gold)}
.hero h1{font-size:clamp(30px,4.4vw,46px);margin-top:18px;line-height:1.12}
.hero h1 em{font-style:normal;color:var(--gold)}
.hero .lede{margin-top:18px;font-size:clamp(16px,1.9vw,18.5px);color:var(--dim);max-width:40ch}
.hero .cta{display:flex;flex-wrap:wrap;gap:11px;margin-top:26px}
.hero .under{margin-top:24px;padding-top:18px;border-top:1px solid var(--line);
  display:flex;flex-wrap:wrap;gap:10px 26px;font-size:13px;color:var(--dim)}
.hero .under b{color:var(--text);font-weight:600}
.frame{border:1px solid var(--line);border-radius:10px;background:var(--panel);aspect-ratio:4/3;max-width:100%;
  display:flex;flex-direction:column;justify-content:flex-end;padding:18px;gap:3px;
  background-image:repeating-linear-gradient(135deg,transparent,transparent 12px,color-mix(in srgb,var(--line) 55%,transparent) 12px,color-mix(in srgb,var(--line) 55%,transparent) 13px)}
.frame .tag{font-size:10.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--gold)}
.frame b{font-size:15.5px;font-weight:600}
.frame span{font-size:13px;color:var(--dim)}
.strip{background:var(--navy);color:#dbe2f1}
.strip .wrap{display:flex;flex-wrap:wrap;gap:6px 28px;justify-content:center;padding-block:13px;
  font-size:13.5px;font-weight:500;text-align:center}
.strip b{color:var(--gold);font-weight:700}
.strip .sep{opacity:.35}
section{padding-block:clamp(46px,6vw,74px)}
.tinted{background:var(--panel);border-block:1px solid var(--line)}
.sec-head{max-width:720px;margin-bottom:34px}
.sec-head h2{font-size:clamp(21px,2.5vw,27px)}
.sec-head p{margin-top:12px;color:var(--dim);font-size:16.5px}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media(max-width:900px){.cards{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.cards{grid-template-columns:1fr}}
.card{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:22px 20px;box-shadow:var(--shadow)}
.card .ic{width:40px;height:40px;border-radius:9px;display:grid;place-items:center;margin-bottom:13px;
  background:var(--cb);color:var(--c)}
.card .ic svg{width:21px;height:21px}
.card h3{font-size:18px;margin-bottom:6px}
.card p{color:var(--dim);font-size:15px}
.msg{display:grid;grid-template-columns:280px 1fr;gap:clamp(24px,4vw,52px);align-items:center}
@media(max-width:820px){.msg{grid-template-columns:1fr}}
.portrait{aspect-ratio:3/4;max-width:100%;border:1px solid var(--line);border-radius:10px;background:var(--panel);
  display:flex;flex-direction:column;justify-content:flex-end;padding:16px;gap:2px;
  background-image:repeating-linear-gradient(135deg,transparent,transparent 12px,color-mix(in srgb,var(--line) 55%,transparent) 12px,color-mix(in srgb,var(--line) 55%,transparent) 13px)}
.portrait .tag{font-size:10.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--gold)}
.portrait b{font-size:15px;font-weight:600}
.msg blockquote{margin:0;font-family:Fraunces,Georgia,serif;font-size:clamp(17px,2vw,21px);
  line-height:1.45;font-weight:600;border-left:2px solid var(--gold);padding-left:22px;color:var(--navy)}
.msg .sig{margin-top:18px;padding-left:24px;font-size:14.5px;color:var(--dim)}
.msg .sig b{color:var(--text);font-size:15.5px;font-weight:600;display:block}

/* Leadership - Chairman, Director, Principal, usi kram mein. Photo ki jagah
   khaali chhodi hui hai; school wo baad mein daalega. */
.lead3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
@media(max-width:900px){.lead3{grid-template-columns:1fr;max-width:520px}}
.ldr{background:var(--surface);border:1px solid var(--line);border-radius:12px;overflow:hidden;
  box-shadow:var(--shadow);display:flex;flex-direction:column;
  transition:transform .24s cubic-bezier(.34,1.15,.4,1),box-shadow .24s ease,border-color .24s ease}
.ldr:hover{transform:translateY(-4px);border-color:color-mix(in srgb,var(--gold) 40%,var(--line));
  box-shadow:0 18px 36px -18px rgba(13,27,62,.3)}
.ldr .pic{aspect-ratio:1/1;background:var(--panel);border-bottom:1px solid var(--line);
  display:flex;flex-direction:column;justify-content:flex-end;padding:14px;gap:2px;
  background-image:repeating-linear-gradient(135deg,transparent,transparent 12px,color-mix(in srgb,var(--line) 55%,transparent) 12px,color-mix(in srgb,var(--line) 55%,transparent) 13px)}
.ldr .pic .tag{font-size:10.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--gold)}
.ldr .bd{padding:18px 18px 22px}
.ldr h3{font-size:19px}
.ldr .rl{font-size:10.5px;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--gold);
  margin-top:5px}
.ldr blockquote{margin:14px 0 0;padding-left:16px;border-left:2px solid var(--gold);
  font-size:15px;color:var(--dim);line-height:1.6}
@media(prefers-reduced-motion:reduce){.ldr,.ldr:hover{transition:none;transform:none}}

/* Quick links - About par un aankdon ki jagah jo hata diye gaye. */
.qlinks{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
@media(max-width:760px){.qlinks{grid-template-columns:1fr}}
.qlink{display:flex;align-items:center;gap:14px;text-decoration:none;
  background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:18px 18px;
  box-shadow:var(--shadow);color:inherit;
  transition:transform .24s cubic-bezier(.34,1.15,.4,1),box-shadow .24s ease,border-color .24s ease}
.qlink:hover{transform:translateY(-4px);border-color:color-mix(in srgb,var(--c) 34%,var(--line));
  box-shadow:0 16px 32px -16px color-mix(in srgb,var(--c) 70%,transparent)}
.qlink .ic{flex:none;width:42px;height:42px;border-radius:10px;display:grid;place-items:center;
  background:var(--cb);color:var(--c)}
.qlink .ic svg{width:21px;height:21px}
.qlink b{display:block;font-family:Fraunces,Georgia,serif;font-size:17px;color:var(--navy);line-height:1.25}
.qlink span{display:block;font-size:14px;color:var(--dim);margin-top:3px}
@media(prefers-reduced-motion:reduce){.qlink,.qlink:hover{transition:none;transform:none}}
.philo{background:var(--navy);color:#dfe5f3}
.philo .wrap{padding-block:52px 56px;display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(26px,5vw,60px)}
@media(max-width:860px){.philo .wrap{grid-template-columns:1fr;gap:24px}}
.philo .eyebrow{color:var(--gold)}
.philo h2{color:#fff;font-size:clamp(23px,3vw,32px);margin-top:14px;line-height:1.16}
.philo p{color:#c2cce4;font-size:16.5px}
.philo p+p{margin-top:14px}
.philo .bears{display:grid;gap:12px;margin-bottom:20px}
.philo .bears div{display:flex;gap:12px;align-items:flex-start;font-size:16px;color:#e4e9f5}
.philo .bears i{flex:none;width:7px;height:7px;border-radius:50%;background:var(--gold);margin-top:8px}
.philo .kicker{margin-top:22px;padding-top:18px;border-top:1px solid rgba(255,255,255,.16);
               font-family:Fraunces,Georgia,serif;font-size:clamp(17px,2.2vw,21px);color:#fff;line-height:1.35}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border:1px solid var(--line);
  border-radius:10px;overflow:hidden;background:var(--surface)}
@media(max-width:820px){.stats{grid-template-columns:repeat(2,1fr)}}
.stat{padding:22px 20px;border-right:1px solid var(--line);text-align:center}
.stat:last-child{border-right:0}
@media(max-width:820px){.stat:nth-child(2){border-right:0}.stat:nth-child(1),.stat:nth-child(2){border-bottom:1px solid var(--line)}}
.stat .n{font-family:Inter,Arial,sans-serif;font-size:clamp(24px,3vw,30px);font-weight:800;letter-spacing:-.02em;
  color:var(--navy);font-variant-numeric:tabular-nums;line-height:1}
.stat .l{font-size:13px;color:var(--dim);margin-top:7px}
.journey{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
@media(max-width:900px){.journey{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.journey{grid-template-columns:1fr}}
.stage{border:1px solid var(--line);border-top:3px solid var(--c);border-radius:10px;
  background:var(--surface);padding:20px 18px;display:flex;flex-direction:column;gap:9px;min-height:150px}
.stage h3{color:var(--navy)}
.stage .cl{font-size:10.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--c)}
.stage h3{font-size:18px}
.stage p{font-size:14.5px;color:var(--dim);margin-top:auto}
.gal{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
@media(max-width:900px){.gal{grid-template-columns:repeat(2,1fr)}}
.shot{aspect-ratio:1/1;max-width:100%;border:1px solid var(--line);border-radius:10px;background:var(--panel);
  display:flex;flex-direction:column;justify-content:flex-end;padding:13px;gap:1px;
  background-image:repeating-linear-gradient(135deg,transparent,transparent 12px,color-mix(in srgb,var(--line) 55%,transparent) 12px,color-mix(in srgb,var(--line) 55%,transparent) 13px)}
.shot .tag{font-size:10px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--gold)}
.shot b{font-size:14px;font-weight:600}
.notices{display:grid;gap:10px}
.notice{background:var(--surface);border:1px solid var(--line);border-left:3px solid var(--c);
  border-radius:8px;padding:15px 18px;display:flex;flex-wrap:wrap;gap:4px 18px;align-items:baseline}
.notice .d{font-size:12.5px;color:var(--dim);white-space:nowrap;font-variant-numeric:tabular-nums}
.notice h3{font-size:15.5px;font-family:Inter,sans-serif;font-weight:600;color:var(--text);letter-spacing:0}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
@media(max-width:900px){.steps{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.steps{grid-template-columns:1fr}}
.step{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:20px 18px}
.step .n{width:30px;height:30px;border-radius:7px;background:var(--cb);color:var(--c);display:grid;place-items:center;
  font-family:Inter,sans-serif;font-weight:800;font-size:14px;margin-bottom:12px}
.step h3{font-size:17px;margin-bottom:6px}
.step p{font-size:14.5px;color:var(--dim)}
.feebig{font-family:Inter,Arial,sans-serif;font-size:25px;font-weight:800;letter-spacing:-.02em;color:var(--c);margin:7px 0 4px;
  font-variant-numeric:tabular-nums}
.enq{background:var(--navy);color:#e4e9f5}
.enq .wrap{display:grid;grid-template-columns:.95fr 1.05fr;gap:clamp(26px,4vw,54px);align-items:start}
@media(max-width:880px){.enq .wrap{grid-template-columns:1fr}}
.enq h2{color:#fff;font-size:clamp(21px,2.5vw,27px)}
.enq .eyebrow{color:var(--gold)}
.enq .lede{color:#b9c4dc;margin-top:12px}
.callcard{margin-top:22px;border:1px solid rgba(199,154,59,.4);border-radius:10px;padding:17px 19px}
.callcard .lbl{font-size:10.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--gold)}
.callcard .num{font-size:19px;margin-top:5px;user-select:all;font-variant-numeric:tabular-nums;color:#fff}
form{display:grid;gap:13px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.14);
  padding:24px 22px;border-radius:10px}
.field{display:grid;gap:5px}
.field label{font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#a8b4cd}
.field input,.field select{font-family:Inter,sans-serif;font-size:15.5px;color:#fff;
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.2);padding:11px 13px;border-radius:8px;width:100%}
.field input:focus,.field select:focus{outline:2px solid var(--gold);outline-offset:1px}
.field select option{color:#111;background:#fff}
.g2{display:grid;grid-template-columns:1fr 1fr;gap:13px}
@media(max-width:520px){.g2{grid-template-columns:1fr}}
.note{font-size:13px;color:#9aa7c2}
#thanks{display:none;background:rgba(199,154,59,.14);border:1px solid var(--gold);border-radius:8px;
  padding:15px 17px;font-size:15px;color:#fff}
.mpd{background:var(--panel);border-block:1px solid var(--line)}
.mpd .wrap{display:flex;flex-wrap:wrap;gap:16px;align-items:center;justify-content:space-between;padding-block:26px}
.mpd h3{font-size:19px;margin-bottom:5px}
.mpd p{font-size:14.5px;color:var(--dim);max-width:60ch}
footer{background:var(--navy);color:#aeb9d1;font-size:14.5px}
.fgrid{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:30px;padding-block:42px}
@media(max-width:820px){.fgrid{grid-template-columns:1fr;gap:24px}}
footer h4{font-size:10.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);margin-bottom:11px}
footer a{color:#c6cfe4;text-decoration:none;display:block;padding-block:3px}
footer a:hover{color:#fff}
.fbot{border-top:1px solid rgba(255,255,255,.14);padding-block:15px;font-size:12.5px;
  display:flex;flex-wrap:wrap;gap:8px 18px;justify-content:space-between;color:#8f9cb8}
.wa{position:fixed;right:16px;bottom:calc(16px + env(safe-area-inset-bottom,0px));z-index:60;
  width:52px;height:52px;border-radius:50%;background:#25d366;display:grid;place-items:center;
  box-shadow:0 6px 20px rgba(0,0,0,.22);text-decoration:none}
.wa svg{width:28px;height:28px}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}
.calc{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:26px 24px;box-shadow:var(--shadow)}
.calc .row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:640px){.calc .row{grid-template-columns:1fr}}
.calc label{display:block;font-size:11px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;
  color:var(--dim);margin-bottom:6px}
.calc select,.calc input{font-family:Inter,sans-serif;font-size:16px;color:var(--text);background:#fff;
  border:1px solid var(--line);border-radius:8px;padding:12px 13px;width:100%}
.calc select:focus,.calc input:focus{outline:2px solid var(--gold);outline-offset:1px}
.result{margin-top:22px;border-top:1px solid var(--line);padding-top:20px;display:grid;gap:12px}
.rline{display:flex;justify-content:space-between;gap:16px;align-items:baseline;font-size:15.5px}
.rline .v{font-variant-numeric:tabular-nums;font-weight:600}
.rline.total{border-top:1px solid var(--line);padding-top:14px;margin-top:4px}
.rline.total .k{font-family:Fraunces,Georgia,serif;font-size:19px;font-weight:700;color:var(--navy)}
.rline.total .v{font-size:23px;font-weight:800;letter-spacing:-.02em;color:var(--navy)}
.rnote{font-size:13.5px;color:var(--dim)}
.rwarn{background:var(--amber-b);border:1px solid color-mix(in srgb,var(--gold) 40%,transparent);
  color:var(--amber);border-radius:8px;padding:11px 14px;font-size:14px;font-weight:600}
.chips{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:26px}
.chip{background:var(--surface);border:1px solid var(--line);border-left:3px solid var(--c);border-radius:10px;
  padding:14px 18px}
.chip .k{font-size:11px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--dim)}
.chip .v{font-size:22px;font-weight:800;letter-spacing:-.02em;color:var(--c);font-variant-numeric:tabular-nums;margin-top:2px}
.chip .s{font-size:13px;color:var(--dim)}
.band{display:grid;grid-template-columns:110px 1fr;gap:16px;padding-block:16px;border-bottom:1px solid var(--line);align-items:start}
@media(max-width:600px){.band{grid-template-columns:1fr;gap:5px}}
.band .amt{font-size:19px;font-weight:800;color:var(--navy);font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.band .list{font-size:14.5px;color:var(--dim);line-height:1.7}
.searchwrap{margin-bottom:6px}
.pick{display:flex;gap:8px;flex-wrap:wrap}
.pick button{font-family:Inter,sans-serif;font-size:15px;font-weight:600;border:1px solid var(--line);
  background:#fff;color:var(--text);border-radius:8px;padding:10px 20px;cursor:pointer;transition:.15s}
.pick button[aria-pressed="true"]{background:var(--navy);border-color:var(--navy);color:#fff}
.kid{border:1px solid var(--line);border-radius:10px;padding:16px 18px;margin-top:12px;background:var(--panel)}
.kid .kh{font-size:11px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--gold);margin-bottom:11px}
.rline .sub{font-size:13px;color:var(--dim);font-weight:400;display:block}
.cut{text-decoration:line-through;color:var(--dim);font-weight:400;margin-right:8px}
.due{margin-top:18px;background:var(--blue-b);border:1px solid color-mix(in srgb,var(--blue) 25%,transparent);
  border-radius:8px;padding:13px 16px;font-size:14.5px;color:var(--blue);font-weight:600}
.staffrow{display:flex;align-items:center;gap:9px;margin-top:16px;font-size:15px;color:var(--text);cursor:pointer}
.staffrow input{width:17px;height:17px;accent-color:var(--gold)}
.tabs{display:flex;gap:6px;overflow-x:auto;border-bottom:1px solid var(--line);margin-bottom:30px;
  -webkit-overflow-scrolling:touch}
.tabs button{font-family:Inter,sans-serif;font-size:14.5px;font-weight:600;white-space:nowrap;
  background:none;border:0;border-bottom:2.5px solid transparent;color:var(--dim);
  padding:12px 16px;cursor:pointer;border-radius:9px 9px 0 0;
  transition:transform .24s cubic-bezier(.34,1.15,.4,1),background .24s ease,color .18s ease}
.tabs button:hover,.tabs button:focus-visible{transform:translateY(-3px);color:var(--navy);
  background:var(--panel);outline:none}
.tabs button[aria-selected="true"]{color:var(--navy);border-bottom-color:var(--gold)}
@media(prefers-reduced-motion:reduce){
  .tabs button{transition:background .2s ease,color .2s ease}
  .tabs button:hover,.tabs button:focus-visible{transform:none}
}
.pane[hidden]{display:none}
.flist{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
@media(max-width:760px){.flist{grid-template-columns:1fr}}
.fitem{background:var(--surface);border:1px solid var(--line);border-left:3px solid var(--c);
  border-radius:10px;padding:20px 22px}
.fitem h3{font-size:18px;margin-bottom:7px}
.fitem p{color:var(--dim);font-size:15px}
.fitem .spec{display:inline-block;margin-top:10px;background:var(--cb);color:var(--c);
  font-size:12px;font-weight:700;letter-spacing:.05em;padding:4px 10px;border-radius:999px}
.actgrid{display:flex;flex-wrap:wrap;gap:10px}
.act{background:var(--surface);border:1px solid var(--line);border-radius:999px;padding:9px 17px;
  font-size:14.5px;font-weight:600;color:var(--navy)}
.lead{font-size:17px;color:var(--dim);max-width:68ch;margin-bottom:26px}
.spot{background:var(--navy);color:#e4e9f5;border-radius:12px;padding:30px 28px;margin-bottom:26px}
.spot h3{color:#fff;font-size:22px;margin-bottom:10px}
.spot p{color:#c2cce4;font-size:16px;max-width:66ch}
.flist.three{grid-template-columns:repeat(3,1fr)}
@media(max-width:980px){.flist.three{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){.flist.three{grid-template-columns:1fr}}
.grp{display:flex;align-items:baseline;gap:12px;margin:30px 0 14px}
.grp:first-child{margin-top:0}
.grp h3{font-family:Fraunces,Georgia,serif;font-size:19px;font-weight:700;color:var(--navy)}
.grp span{flex:1;height:1px;background:var(--line)}
.fitem.sm h3{font-size:16.5px}
.fitem.sm p{font-size:14.5px}
.note{margin-top:22px;border-left:3px solid var(--gold);background:var(--panel);
      border-radius:0 10px 10px 0;padding:18px 20px;font-size:15.5px;color:var(--dim)}
.note b{color:var(--text);font-weight:600}
.spot .tagr{display:inline-block;margin-top:14px;border:1px solid rgba(199,154,59,.5);color:var(--gold);
  font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;padding:5px 12px;border-radius:999px}

/* ---- jis panne par aadmi khada hai, uska naam jagmagata hai ---------- */
.main a.here{color:var(--ink);border-bottom-color:var(--gold)}

/* ---- fee calculator -------------------------------------------------- */
.calc{border:1px solid var(--line);border-radius:12px;padding:20px;background:var(--surface);box-shadow:var(--shadow)}
.calc .row{display:flex;gap:16px;flex-wrap:wrap;align-items:flex-end;margin-bottom:16px}
.calc label{display:block}
.calc label>span{display:block;font-size:12px;font-weight:600;color:var(--dim);margin-bottom:5px}
.calc select,.calc input[type=date],.calc input[type=text],.calc input[type=tel],.calc input[type=email],.calc textarea{
  font-family:Inter,Arial,sans-serif;font-size:15px;padding:10px 12px;border:1px solid var(--line);
  border-radius:8px;background:#fff;color:var(--text);width:100%}
#feekids{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
@media(max-width:700px){#feekids{grid-template-columns:1fr}}
.kid{border:1px solid var(--line);border-radius:10px;padding:14px;background:var(--panel)}
.kid .kidno{font-size:10.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);margin-bottom:9px}
.kid label{margin-bottom:10px}
.k-age{font-size:13px;color:var(--dim);min-height:1px}
.k-age.good{color:var(--teal)}
.k-age.bad{color:var(--rose);font-weight:600}
.feetab{width:100%;border-collapse:collapse;margin:6px 0 14px}
.feetab th{background:var(--navy);color:#fff;font-size:10.5px;letter-spacing:.09em;text-transform:uppercase;
  padding:9px 10px;text-align:left;font-weight:700}
.feetab td{border-bottom:1px solid var(--line);padding:9px 10px;font-size:15px;color:var(--text)}
.feetab .num{text-align:right;font-variant-numeric:tabular-nums}
.feetab .conc{display:block;font-size:12.5px;color:var(--teal);margin-top:2px}
.sum{border-top:2px solid var(--navy);padding-top:12px}
.sum div{display:flex;justify-content:space-between;gap:16px;padding:5px 0;font-size:15px;color:var(--dim)}
.sum div b{color:var(--text);font-variant-numeric:tabular-nums}
.sum .big{border-top:1px solid var(--line);margin-top:7px;padding-top:11px;font-size:17px}
.sum .big span,.sum .big b{color:var(--navy);font-weight:800}
.hint{font-size:13.5px;color:var(--dim);margin-top:10px}
#cfgwarn{display:none;border-left:3px solid var(--gold);background:var(--amber-b);padding:11px 14px;
  border-radius:0 9px 9px 0;font-size:14px;color:var(--text);margin-bottom:16px}

/* ---- forms ----------------------------------------------------------- */
.formgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
@media(max-width:640px){.formgrid{grid-template-columns:1fr}}
.formgrid .wide{grid-column:1/-1}
#formnote{font-size:14px;margin-top:10px;min-height:1px}
#thanks{display:none;margin-top:14px;border-left:3px solid var(--teal);background:var(--teal-b);
  padding:13px 15px;border-radius:0 9px 9px 0;font-size:15px;color:var(--text)}

/* ---- long-form text pages ------------------------------------------- */
.prose{max-width:74ch}
.prose h2{font-size:clamp(19px,2.3vw,24px);margin:30px 0 12px}
.prose h3{font-size:17px;margin:22px 0 8px;color:var(--navy)}
.prose p{color:var(--dim);font-size:16px;margin-bottom:13px}
.prose ul{margin:0 0 14px;padding-left:20px}
.prose li{color:var(--dim);font-size:16px;margin-bottom:7px}
.prose b,.prose strong{color:var(--text);font-weight:600}
.tbl{width:100%;border-collapse:collapse;margin:8px 0 18px}
.tbl th{background:var(--navy);color:#fff;font-size:10.5px;letter-spacing:.09em;text-transform:uppercase;
  padding:9px 10px;text-align:left}
.tbl td{border-bottom:1px solid var(--line);padding:9px 10px;font-size:15px;color:var(--text);vertical-align:top}
.tbl td:first-child{font-weight:600;width:38%}

/* Chhoone par halka sa uthna - wahi harkat jo console mein har card par hai.
   Sahil, 23 September 2026: "ye sare feeke tab inko interactive bana ...
   thode se soothing colours mein bana, maza aa jaye." Rang koi nahin badalta,
   sirf card thoda upar uthta hai. Motion band ho to kuchh nahin hilta. */
.card,.step,.stage,.fitem,.shot,.act{
  transition:transform .24s cubic-bezier(.34,1.15,.4,1),box-shadow .24s ease,border-color .24s ease}
.card:hover,.step:hover,.fitem:hover{transform:translateY(-3px);
  box-shadow:0 16px 32px -18px rgba(13,27,62,.28);border-color:color-mix(in srgb,var(--c,var(--navy)) 26%,var(--line))}
.stage:hover{transform:translateY(-3px);box-shadow:0 16px 32px -18px rgba(13,27,62,.28)}
.shot:hover{transform:translateY(-3px);box-shadow:0 16px 32px -18px rgba(13,27,62,.24)}
.act:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--gold) 45%,var(--line))}
@media(prefers-reduced-motion:reduce){
  .card,.step,.stage,.fitem,.shot,.act,
  .card:hover,.step:hover,.stage:hover,.fitem:hover,.shot:hover,.act:hover{transition:none;transform:none}
}

/* Vision aur Mission - About par, do khambhon mein. */
.vm{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(26px,5vw,60px);align-items:start}
@media(max-width:860px){.vm{grid-template-columns:1fr;gap:28px}}
.vmstack{display:grid;gap:26px;max-width:80ch}
.vmstack h2{font-size:clamp(21px,2.5vw,27px)}
.vmstack p{margin-top:12px;color:var(--dim);font-size:16.5px}
.vm h2{font-size:clamp(21px,2.5vw,27px)}
.vm p{margin-top:14px;color:var(--dim);font-size:16.5px}
.vmlist{margin:0;padding:0;list-style:none;display:grid;gap:12px}
.vmlist li{position:relative;padding-left:24px;font-size:16px;color:var(--text)}
.vmlist li::before{content:"";position:absolute;left:0;top:10px;width:7px;height:7px;border-radius:50%;
  background:var(--gold)}

/* Digital stamp - wahi jo school ke chhapne wale kaagaz par hai. */
.dsign{max-width:430px;border:1.3px solid var(--navy);border-radius:10px;overflow:hidden}
.dsign .hd{background:#b3122a;color:#fff;text-align:center;font-size:11px;font-weight:800;
  letter-spacing:.04em;text-transform:uppercase;padding:7px 8px}
.dsign .bd{padding:11px 14px;font-size:12.5px;color:#26324d;line-height:1.6;text-align:center}
.dsign .bd b{color:var(--navy)}


/* ===========================================================================
   THE CAMPUS - naya roop (23 Sep 2026)

   Sahil ne pehle namoone par teen cheezein rokin: Doubt Clearing ka daayan
   aadha khaali pada tha, kadmon par ONE/TWO/THREE likha tha, aur neeche ek
   sajaawat wali goli lagi thi. Isliye yahan:

     - har cheez ke saath uski apni photo ki jagah (`.ph`) - aur us jagah par
       EK BHI SHABD nahin. School photo chadhata hai, wo wahin aa jaati hai.
     - gadhe hue label, sajaawat ki goli aur chip - ek bhi nahin
     - heading badi, aur jis hisse ka matter beech mein hai wahan heading bhi
       beech mein
     - is panne ki heading Inter mein (`.cpage`) - Fraunces ka f aur g Sahil
       ko toote hue dikhte hain. Scope sirf yahi panna hai; baaki panne bina
       unki haan ke chhue nahin jaate.
   =========================================================================== */

.cpage h1,.cpage h2,.cpage h3{font-family:Inter,Arial,sans-serif;letter-spacing:-.025em}
.cpage h2{font-weight:800}
.cpage h3{font-weight:700;letter-spacing:-.018em}

/* ---- hero ---------------------------------------------------------------- */
.chero{background:var(--navy);color:#fff}
.chero .wrap{padding-block:clamp(38px,6vw,64px) clamp(32px,5vw,52px);text-align:center;
  max-width:1000px}
.chero .eyebrow{color:var(--gold)}
.chero h1{color:#fff;font-size:clamp(32px,5.4vw,54px);margin-top:12px}
.chero .lede{margin:16px auto 0;max-width:720px;color:#d3dcf2;font-size:clamp(15.5px,1.6vw,18px);
  text-align:center;hyphens:none}
.cnums{margin-top:clamp(26px,4vw,38px);display:grid;grid-template-columns:repeat(4,1fr);
  gap:1px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.14);border-radius:12px;
  overflow:hidden}
.cnums>div{background:var(--navy);padding:16px 12px}
.cnums .n{font-size:clamp(20px,2.6vw,27px);font-weight:800;color:var(--gold);letter-spacing:-.02em}
.cnums .l{margin-top:4px;font-size:12px;color:#c3cde6;line-height:1.45}
@media(max-width:700px){.cnums{grid-template-columns:repeat(2,1fr)}}

/* ---- sticky rail --------------------------------------------------------- */
.crail{position:sticky;top:var(--navh,46px);z-index:30;background:rgba(255,255,255,.96);
  backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.crail .wrap{display:flex;gap:8px;overflow-x:auto;padding-block:11px;scrollbar-width:none}
.crail .wrap::-webkit-scrollbar{display:none}
.crail button{flex:0 0 auto;display:inline-flex;align-items:center;gap:7px;
  border:1px solid var(--line);background:#fff;color:var(--muted);border-radius:999px;
  padding:8px 15px;font:inherit;font-size:13.5px;font-weight:650;cursor:pointer;
  transition:transform .26s cubic-bezier(.34,1.56,.64,1),box-shadow .26s,border-color .2s,color .2s,background .2s}
.crail button svg{width:16px;height:16px;flex:0 0 auto}
.crail button:hover{transform:translateY(-2px);border-color:var(--t,var(--navy));color:var(--t,var(--navy));
  box-shadow:0 6px 16px rgba(13,27,62,.09)}
.crail button[aria-selected="true"]{background:var(--tb,var(--panel));border-color:var(--t,var(--navy));
  color:var(--t,var(--navy))}

/* ---- reveal on scroll ---------------------------------------------------- */
html.js .rv{opacity:0;transform:translateY(14px)}
html.js .rv.in{opacity:1;transform:none;
  transition:opacity .5s ease var(--d,0s),transform .5s cubic-bezier(.22,.9,.3,1) var(--d,0s)}

/* ---- photo ki jagah - ek bhi shabd nahin --------------------------------- */
.ph{position:relative;aspect-ratio:16/10;border-radius:11px;overflow:hidden;
  background:var(--cb,var(--panel));border:1px solid var(--line)}
.ph::after{content:"";position:absolute;inset:0;opacity:.2;
  background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230d1b3e' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'><rect x='3' y='4' width='18' height='16' rx='2'/><circle cx='8.5' cy='9.5' r='1.6'/><path d='m3 16 5-4 4 3 3-2 6 5'/></svg>") center/38px no-repeat}
.ph img{width:100%;height:100%;object-fit:cover;display:block;position:relative;z-index:1}

/* ---- feature block: matter baayein, photo daayein ------------------------ */
.cspot{background:var(--navy);color:#fff;border-radius:16px;overflow:hidden;
  display:grid;grid-template-columns:1.08fr .92fr;gap:0;align-items:stretch;
  margin-block:clamp(22px,3vw,30px)}
.cspot .tx{padding:clamp(24px,3.4vw,38px)}
.cspot h2{color:#fff;font-size:clamp(23px,3vw,31px)}
.cspot p{margin-top:13px;color:#d3dcf2;font-size:15.5px}
.cspot .ph{border:0;border-radius:0;aspect-ratio:auto;min-height:230px;background:#16264e}
.cspot .ph::after{opacity:.34;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c79a3b' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'><rect x='3' y='4' width='18' height='16' rx='2'/><circle cx='8.5' cy='9.5' r='1.6'/><path d='m3 16 5-4 4 3 3-2 6 5'/></svg>");
  background-size:46px}
@media(max-width:860px){.cspot{grid-template-columns:1fr}.cspot .ph{min-height:190px;order:-1}}

/* ---- beech mein khadi heading -------------------------------------------- */
.chead{max-width:780px;margin:clamp(24px,3.4vw,36px) auto clamp(18px,2.4vw,26px);text-align:center}
.chead h2{font-size:clamp(24px,3.2vw,34px)}
.chead p{margin-top:12px;color:var(--muted);font-size:16px;text-align:center;hyphens:none}

/* ---- group ka naam (Technology) ------------------------------------------ */
.cgrp{display:flex;align-items:center;gap:14px;margin:clamp(26px,3.4vw,36px) 0 16px}
.cgrp h3{font-size:15px;letter-spacing:.13em;text-transform:uppercase;color:var(--gold);
  font-weight:800;flex:0 0 auto}
.cgrp span{flex:1;height:1px;background:var(--line)}

/* ---- cards --------------------------------------------------------------- */
.cgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,1.8vw,20px)}
@media(max-width:940px){.cgrid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.cgrid{grid-template-columns:1fr}}
.ccard{border:1px solid var(--line);border-radius:14px;background:#fff;overflow:hidden;
  display:flex;flex-direction:column;
  transition:transform .26s cubic-bezier(.34,1.56,.64,1),box-shadow .26s,border-color .2s}
.ccard:hover{transform:translateY(-4px);border-color:var(--c,var(--navy));
  box-shadow:0 14px 34px rgba(13,27,62,.1)}
.ccard .ph{border:0;border-radius:0;border-bottom:1px solid var(--line)}
.ccard .bd{padding:16px 17px 18px;display:flex;flex-direction:column;gap:9px;flex:1}
.ccard .ic{width:30px;height:30px;border-radius:8px;display:grid;place-items:center;
  background:var(--cb,var(--panel));color:var(--c,var(--navy))}
.ccard .ic svg{width:17px;height:17px}
.ccard h3{font-size:17.5px;color:var(--navy)}
.ccard p{font-size:14.6px;color:var(--muted);line-height:1.62}

/* ---- ek line, poori chaudai ---------------------------------------------- */
.cnote{margin-top:clamp(20px,2.6vw,28px);border:1px solid var(--line);border-left:4px solid var(--gold);
  border-radius:12px;background:var(--panel);padding:17px 19px;font-size:15px;color:var(--muted)}
.cnote b{color:var(--navy)}

@media(prefers-reduced-motion:reduce){
  html.js .rv{opacity:1;transform:none}
  .crail button,.ccard{transition:none}
  .crail button:hover,.ccard:hover{transform:none}
}

/* ---- point-wise suchi (23 Sep 2026) --------------------------------------
   Sahil: "features batao point-wise - bhai ye kyun special hai." Do line ka
   parichay kaafi nahin; har cheez ke neeche wahi baat jo use khaas banati hai.
   Point ek pankti ka hai, isliye yahan justify nahin lagti - chhoti pankti
   justify hone par shabdon ke beech khaai ban jaati hai. */
.ccard ul,.cspot ul{margin:3px 0 0;padding:0;list-style:none;
  display:flex;flex-direction:column;gap:7px}
.ccard li,.cspot li{position:relative;padding-left:17px;line-height:1.55;
  text-align:left;hyphens:none}
.ccard li::before,.cspot li::before{content:"";position:absolute;left:0;top:7px;
  width:6px;height:6px;border-radius:2px;background:var(--c,var(--navy));opacity:.6}
.ccard li{font-size:14px;color:var(--muted)}
.cspot li{font-size:14.6px;color:#d3dcf2}
.cspot li::before{background:var(--gold);opacity:.9}
.cspot ul{margin-top:14px}