/* Motion layer: hero, particles, marquee, counters, Gurudev section, progress bar */
.progress{position:fixed;top:0;left:0;height:3px;width:100%;transform-origin:0 50%;transform:scaleX(0);background:linear-gradient(90deg,var(--saffron),var(--gold));z-index:100}
.brand-mark{transition:transform .6s}
.brand:hover .brand-mark{transform:rotate(-8deg) scale(1.08)}

/* HERO */
.hero{background:#2A0F0D;color:#FFF3E0;padding:0;min-height:min(92vh,820px);display:flex;align-items:center;isolation:isolate}
.hero-bg{position:absolute;inset:0;z-index:-3;background:url(school-building.jpg) center/cover;animation:kenburns 28s ease-in-out infinite alternate}
.hero::before{content:"";position:absolute;inset:0;z-index:-2;background:linear-gradient(100deg,rgba(42,15,13,.94) 8%,rgba(91,26,24,.82) 45%,rgba(200,90,10,.45) 100%)}
.hero::after{content:"";position:absolute;inset:auto 0 0 0;height:120px;z-index:-1;background:linear-gradient(0deg,var(--ivory),transparent)}
@keyframes kenburns{from{transform:scale(1.05) translate(0,0)}to{transform:scale(1.18) translate(-2%,2%)}}
.hero .sun{z-index:-1;opacity:.35}
.hero-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:2rem;align-items:center;padding:clamp(3rem,8vw,5rem) 0 clamp(4rem,9vw,6rem)}
.hero h1{color:#fff}
.hero h1 em{color:#FFB35C}
.hero .lede{color:#F3DDBF}
.hero .badge{background:rgba(255,255,255,.12);border:1px solid rgba(255,233,199,.35);backdrop-filter:blur(6px)}
.hero .btn.ghost{color:#fff;border-color:rgba(255,255,255,.7)}
.hero .btn.ghost:hover{background:#fff;color:var(--maroon)}
.word{display:inline-block;overflow:hidden;vertical-align:bottom}
.word>span{display:inline-block;transform:translateY(110%);animation:rise .9s cubic-bezier(.2,.8,.2,1) forwards}
@keyframes rise{to{transform:none}}
.fade-up{opacity:0;transform:translateY(20px);animation:fadeup .9s .9s forwards}
.fade-up.d2{animation-delay:1.15s}.fade-up.d3{animation-delay:1.4s}.fade-up.d4{animation-delay:1.65s}
@keyframes fadeup{to{opacity:1;transform:none}}
.hero .count div{background:rgba(255,255,255,.1);border-color:rgba(255,233,199,.3);backdrop-filter:blur(6px)}
.hero .count b{color:#fff}.hero .count span{color:#F3DDBF}
.hero .count b.tick{animation:pop .35s}
@keyframes pop{50%{transform:translateY(-4px) scale(1.08)}}

/* animated logo badge */
.badge-art{position:relative;width:min(340px,80vw);aspect-ratio:1;margin-inline:auto;animation:float 6s ease-in-out infinite;filter:drop-shadow(0 20px 40px rgba(0,0,0,.45))}
.badge-art svg{width:100%;height:100%}
.badge-art .ringtext{transform-origin:200px 200px;animation:spin 60s linear infinite}
.badge-art .flame{transform-origin:60px 36px;animation:flicker 2.4s ease-in-out infinite}
.badge-art .glow{position:absolute;inset:18%;border-radius:50%;background:radial-gradient(circle,rgba(255,179,92,.55),transparent 65%);animation:pulse 3s ease-in-out infinite;z-index:-1}
@keyframes float{50%{transform:translateY(-14px)}}
@keyframes flicker{0%,100%{transform:scale(1) rotate(0)}30%{transform:scale(1.12,1.2) rotate(-3deg)}60%{transform:scale(.94,1.05) rotate(2deg)}}
@keyframes pulse{50%{transform:scale(1.25);opacity:.6}}
@media(max-width:820px){.hero-grid{grid-template-columns:1fr}.badge-art{order:-1;width:200px}}

/* particles */
.embers{position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none}
.embers i{position:absolute;bottom:-20px;width:var(--s);height:var(--s);border-radius:50%;background:radial-gradient(circle,#FFD28A,#E8751A 60%,transparent 70%);opacity:0;animation:ember var(--t) linear var(--d) infinite}
@keyframes ember{0%{transform:translate(0,0);opacity:0}10%{opacity:.9}100%{transform:translate(var(--x),-95vh);opacity:0}}

/* marquee */
.marquee{overflow:hidden;background:var(--maroon);color:#FFE9C7;padding:1rem 0;border-block:3px solid var(--saffron)}
.marquee .track{display:flex;gap:2.4rem;width:max-content;animation:scroll 55s linear infinite;font-family:var(--display);font-size:1.5rem;font-weight:600}
.marquee:hover .track{animation-play-state:paused}
.marquee .track span{display:flex;align-items:center;gap:2.4rem;white-space:nowrap}
.marquee .track span::after{content:"✦";color:var(--saffron);font-size:1rem}
.marquee .track .hot{color:#FFB35C}
@keyframes scroll{to{transform:translateX(-50%)}}

/* stats */
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:1rem;text-align:center}
.stat b{display:block;font-family:var(--display);font-size:clamp(2.6rem,7vw,4rem);color:var(--saffron-deep);line-height:1}
.stat span{display:block;margin-top:.4rem;color:var(--muted);font-size:.92rem}

/* Gurudev */
.guru{position:relative;overflow:hidden}
.guru-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(1.5rem,5vw,4rem);align-items:center}
.guru-photo{position:relative;border-radius:200px 200px 24px 24px;overflow:hidden;aspect-ratio:3/4;box-shadow:0 30px 60px rgba(0,0,0,.4);border:4px solid var(--gold);max-width:380px;margin-inline:auto}
.guru-photo img{width:100%;height:100%;object-fit:cover;object-position:50% 30%;animation:kenburns 20s ease-in-out infinite alternate}
.guru-photo::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(91,26,24,.55),transparent 45%)}
.guru-photo figcaption{position:absolute;left:0;right:0;bottom:1rem;text-align:center;z-index:2;color:#FFE9C7;font-family:var(--display);font-size:1.05rem}
.guru blockquote{font-family:var(--display);font-style:italic;font-size:clamp(1.5rem,3.6vw,2.3rem);line-height:1.3;color:#FFE9C7}
.guru cite{display:block;margin-top:1.2rem;font-style:normal;color:var(--gold);letter-spacing:.14em;text-transform:uppercase;font-size:.82rem}
.guru .halo{position:absolute;width:640px;height:640px;right:-200px;top:-200px;border-radius:50%;background:radial-gradient(circle,rgba(232,117,26,.3),transparent 65%);animation:pulse 8s ease-in-out infinite}
@media(max-width:820px){.guru-grid{grid-template-columns:1fr}}

/* building banner */
.building{position:relative;height:clamp(240px,42vw,420px);overflow:hidden;background:#222}
.building img{position:absolute;inset:-14% 0;width:100%;height:128%;object-fit:cover;will-change:transform}
.building::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(91,26,24,.7),transparent 70%)}
.building .cap{position:absolute;z-index:2;left:max(16px,calc((100% - 1120px)/2));bottom:1.6rem;color:#fff;font-family:var(--display);font-size:clamp(1.4rem,4vw,2.4rem);max-width:16ch;line-height:1.15}

/* richer reveals */
.reveal{transition:opacity .8s cubic-bezier(.2,.8,.2,1),transform .8s cubic-bezier(.2,.8,.2,1)}
.reveal.l{transform:translateX(-40px)}.reveal.r{transform:translateX(40px)}.reveal.in{transform:none}
.card,.ms,.batch{will-change:transform}
.card:hover{transform:translateY(-6px);box-shadow:0 18px 40px rgba(91,26,24,.14)}
.card{transition:transform .3s,box-shadow .3s}
.ms{transition:transform .3s}.ms:hover{transform:translateY(-8px) rotate(-1deg)}
.timeline{position:relative}
.timeline::before{content:"";position:absolute;left:-3px;top:0;width:3px;height:var(--prog,0%);background:var(--maroon);transition:height .1s}
.icon{transition:transform .4s}.card:hover .icon{transform:rotate(-8deg) scale(1.12)}

/* credit */
.credit{margin-top:2rem;padding-top:1.6rem;border-top:1px solid #4a2420;display:grid;gap:.4rem}
.credit .love{font-family:var(--display);font-size:1.25rem;color:#FFE9C7}
.credit .love .heart{color:#FF6B5B;display:inline-block;animation:beat 1.4s infinite}
@keyframes beat{0%,100%{transform:scale(1)}20%{transform:scale(1.3)}40%{transform:scale(1)}}
.credit a{text-decoration:none;border-bottom:1px dotted #C79B6B}
.credit small{color:#B99B80}

@media(prefers-reduced-motion:reduce){
  .hero-bg,.badge-art,.badge-art .ringtext,.badge-art .flame,.badge-art .glow,.embers i,.marquee .track,.guru-photo img,.guru .halo,.credit .heart{animation:none!important}
  .word>span,.fade-up{animation:none!important;opacity:1;transform:none}
  .embers{display:none}
}