/* Star Educational Public School — premium visual and motion layer */
@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&family=Playfair+Display:wght@600;700;800&display=swap');

:root {
    --edu-navy: #071d35;
    --edu-navy-2: #0b3152;
    --edu-emerald: #059b72;
    --edu-emerald-bright: #11b889;
    --edu-gold: #f2b84b;
    --edu-cream: #fbf9f3;
    --edu-mist: #eef7f3;
    --edu-ink: #102a3f;
    --edu-muted: #667887;
    --edu-line: rgba(11, 49, 82, .12);
    --edu-shadow: 0 26px 70px rgba(7, 29, 53, .13);
    --edu-radius: 24px;
    --edu-font-body: 'Manrope', 'Segoe UI', Arial, sans-serif;
    --edu-font-display: 'Playfair Display', Georgia, 'Times New Roman', serif;
}

html { scroll-behavior: smooth; scroll-padding-top: 92px; }
body {
    overflow-x: hidden;
    color: var(--edu-ink);
    background: var(--edu-cream);
    font-family: var(--edu-font-body);
    -webkit-font-smoothing: antialiased;
    animation: eduPageIn .75s cubic-bezier(.2,.8,.2,1) both;
}

button,input,select,textarea { font: inherit; }
h1,h2,h3,h4,h5,h6,.section-title {
    font-family: var(--edu-font-display);
    font-weight: 700;
    letter-spacing: -.025em;
}
p,li,a,span,label,small,blockquote { text-rendering: optimizeLegibility; }

body::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: 99999;
    pointer-events: none;
    opacity: .023;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.88' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

::selection { color: white; background: var(--edu-emerald); }
:focus-visible { outline: 3px solid rgba(242,184,75,.65); outline-offset: 4px; }
@keyframes eduPageIn { from { opacity: 0; } to { opacity: 1; } }

.edu-scroll-progress { position: fixed; inset: 0 auto auto 0; z-index: 10000; width: 0; height: 3px; background: linear-gradient(90deg,var(--edu-gold),var(--edu-emerald-bright)); box-shadow: 0 0 18px rgba(242,184,75,.5); }

/* Navigation */
.navbar.fixed-top {
    min-height: 78px;
    padding: .55rem 0;
    background: rgba(255,255,255,.9) !important;
    border-bottom: 1px solid rgba(11,49,82,.08);
    box-shadow: 0 10px 36px rgba(7,29,53,.07) !important;
    backdrop-filter: blur(18px) saturate(150%);
    -webkit-backdrop-filter: blur(18px) saturate(150%);
    transition: min-height .35s ease, background .35s ease, box-shadow .35s ease;
}
.navbar.fixed-top.scrolled { min-height: 68px; background: rgba(255,255,255,.97) !important; box-shadow: 0 12px 38px rgba(7,29,53,.13) !important; }
.school-logo { height: 54px; filter: drop-shadow(0 7px 13px rgba(7,29,53,.12)); transition: height .35s ease, transform .35s ease; }
.navbar.scrolled .school-logo { height: 45px; }
.navbar-brand { color: var(--edu-navy-2) !important; font-family: var(--edu-font-display); font-size: 1.08rem; font-weight: 700; letter-spacing: -.015em; }
.nav-link { position: relative; color: #456070 !important; font-size: .9rem; font-weight: 600; }
.menu-link::after { bottom: .25rem; height: 2px; background: var(--edu-emerald); border-radius: 999px; }
.nav-link:hover, .nav-link.active { color: var(--edu-emerald) !important; }
.dropdown-menu { padding: .7rem; border: 1px solid var(--edu-line) !important; border-radius: 16px; box-shadow: var(--edu-shadow) !important; }
.dropdown-item { padding: .65rem .8rem; border-radius: 10px; font-size: .88rem; }
.dropdown-item:hover { color: var(--edu-emerald); background: var(--edu-mist); }

.btn:not(.btn-close) { position: relative; overflow: hidden; border-radius: 999px; transition: transform .3s cubic-bezier(.2,.8,.2,1), box-shadow .3s ease, background .3s ease; }
.btn:not(.btn-close)::after { content: ""; position: absolute; inset: -120% -45%; background: linear-gradient(115deg,transparent 35%,rgba(255,255,255,.16) 50%,transparent 65%); transform: translateX(-68%); transition: transform .7s ease; pointer-events: none; }
.btn:not(.btn-close):hover::after { transform: translateX(68%); }
.btn:not(.btn-close):hover { transform: translateY(-3px); box-shadow: 0 15px 32px rgba(7,29,53,.2); }
.btn-school { padding: .72rem 1.25rem; background: linear-gradient(135deg,var(--edu-emerald-bright),#047858); box-shadow: 0 12px 26px rgba(5,155,114,.25); }

/* Homepage cinematic hero */
#schoolCarousel { position: relative; isolation: isolate; overflow: hidden; margin-top: 0; background: var(--edu-navy); }
#schoolCarousel::after { content: ""; position: absolute; inset: 0; z-index: 2; pointer-events: none; opacity: .16; background-image: linear-gradient(rgba(255,255,255,.16) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.16) 1px,transparent 1px); background-size: 70px 70px; mask-image: linear-gradient(90deg,#000,transparent 78%); }
#schoolCarousel .carousel-item::before { z-index: 1; background: linear-gradient(95deg,rgba(4,23,42,.94),rgba(5,41,62,.69) 52%,rgba(5,41,62,.18)); }
.slider-img { height: min(88vh,820px); min-height: 650px; transform: scale(1.1); filter: saturate(.82); transition: transform 8s cubic-bezier(.16,.8,.2,1),filter 1s ease; }
.carousel-item.active .slider-img { transform: scale(1.015); filter: saturate(1.04); }
.carousel-caption { z-index: 4; right: auto; bottom: 24%; left: max(6%,calc((100vw - 1320px)/2)); max-width: 780px; text-align: left; }
.carousel-caption h1 { max-width: 750px; margin-bottom: 1rem; color: white; font-size: clamp(3.3rem,6.1vw,6rem); line-height: 1.02; letter-spacing: -.035em; text-wrap: balance; }
.carousel-caption p { margin-bottom: 1.7rem; color: rgba(255,255,255,.82); font-size: clamp(1.05rem,1.8vw,1.35rem); }
.edu-word { display: inline-block; overflow: hidden; vertical-align: bottom; padding-bottom: .06em; }
.edu-word > span { display: inline-block; opacity: 0; filter: blur(7px); transform: translateY(108%) rotate(2deg); }
.carousel-item.active .edu-word > span { animation: eduWordUp .85s cubic-bezier(.16,1,.3,1) forwards; animation-delay: calc(.15s + var(--word) * 70ms); }
@keyframes eduWordUp { to { opacity: 1; filter: blur(0); transform: none; } }
.carousel-item .carousel-caption > p,.carousel-item .carousel-caption > .btn { opacity: 0; transform: translateY(24px); }
.carousel-item.active .carousel-caption > p { animation: eduRise .8s .68s both; }
.carousel-item.active .carousel-caption > .btn { animation: eduRise .8s .84s both; }
@keyframes eduRise { to { opacity: 1; transform: none; } }
.carousel-indicators { z-index: 5; justify-content: flex-start; right: auto; bottom: 7%; left: max(6%,calc((100vw - 1320px)/2)); margin: 0; }
.carousel-indicators [data-bs-target] { position: relative; width: 36px; height: 4px; overflow: hidden; border: 0; border-radius: 999px; background: rgba(255,255,255,.5); transition: width .35s ease; }
.carousel-indicators .active { width: 64px; }
.carousel-indicators .active::after { content: ""; position: absolute; inset: 0; background: var(--edu-gold); transform-origin: left; animation: eduSlideTimer 4s linear forwards; }
@keyframes eduSlideTimer { from { transform: scaleX(0); } to { transform: scaleX(1); } }
.carousel-control-prev,.carousel-control-next { z-index: 6; width: 5%; }

.edu-hero-atmosphere { position: absolute; inset: 0; z-index: 3; overflow: hidden; pointer-events: none; }
.edu-orbit { position: absolute; top: 12%; right: -7%; width: min(44vw,640px); aspect-ratio: 1; border: 1px solid rgba(255,255,255,.15); border-radius: 50%; animation: eduOrbit 30s linear infinite; }
.edu-orbit::before { content: ""; position: absolute; inset: 13%; border: 1px dashed rgba(255,255,255,.13); border-radius: 50%; }
.edu-orbit::after { content: ""; position: absolute; top: 17%; left: 5%; width: 13px; height: 13px; background: var(--edu-gold); border-radius: 50%; box-shadow: 0 0 25px rgba(242,184,75,.9); }
@keyframes eduOrbit { to { transform: rotate(360deg); } }
.edu-star { position: absolute; width: var(--star-size); height: var(--star-size); opacity: .32; animation: eduStarFloat var(--star-time) ease-in-out infinite alternate; animation-delay: var(--star-delay); }
.edu-star::before,.edu-star::after { content: ""; position: absolute; background: rgba(255,255,255,.75); border-radius: 999px; }
.edu-star::before { width: 100%; height: 1px; top: 50%; }
.edu-star::after { height: 100%; width: 1px; left: 50%; }
@keyframes eduStarFloat { to { opacity: .7; transform: translate3d(14px,-25px,0) rotate(90deg); } }

/* Subpage cinematic banners */
body:not(.page-home) .page-banner { position: relative; isolation: isolate; display: grid; align-items: center; min-height: clamp(620px,72vh,780px); margin-top: 0; padding-top: 110px; overflow: hidden; background-color: var(--edu-navy); background-size: cover; background-position: center; }
body.page-about .page-banner { background-image: url('assets/images/about_front.png'); }
body.page-academics .page-banner { background-image: url('assets/images/ivan-aleksic-PDRFeeDniCk-unsplash.jpg'); }
body.page-gallery .page-banner { background-image: url('assets/images/gallery2.png'); }
body.page-contact .page-banner { background-image: url('assets/images/richard-burlton-2l9gPav_Ccs-unsplash.jpg'); }
body:not(.page-home) .page-banner::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(100deg,rgba(4,24,43,.94),rgba(5,64,72,.7),rgba(5,64,72,.25)); }
body:not(.page-home) .page-banner::after { content: ""; position: absolute; z-index: -1; right: -130px; bottom: -250px; width: 520px; height: 520px; border: 1px solid rgba(255,255,255,.2); border-radius: 50%; box-shadow: 0 0 0 80px rgba(255,255,255,.035),0 0 0 160px rgba(255,255,255,.025); animation: eduBannerBreath 6s ease-in-out infinite alternate; }
@keyframes eduBannerBreath { to { transform: scale(1.06) translate(-12px,-8px); } }
body:not(.page-home) .page-banner .container { position: relative; z-index: 2; max-width: 900px; text-align: left !important; margin-left: max(6%,calc((100vw - 1320px)/2)); }
body:not(.page-home) .page-banner h1 { color: white; font-size: clamp(3.4rem,7vw,6.3rem); line-height: 1; letter-spacing: -.035em; text-wrap: balance; }
body:not(.page-home) .page-banner p { max-width: 690px; color: rgba(255,255,255,.82); font-size: clamp(1rem,1.8vw,1.3rem); }
.edu-banner-atmosphere { position: absolute; inset: 0; z-index: 1; pointer-events: none; }

/* Homepage content composition */
body.page-home > .page-banner { position: relative; overflow: hidden; margin-top: 0; padding: 4.6rem 0; color: var(--edu-navy); background: var(--edu-cream); }
body.page-home > .page-banner::before { content: "Why Star"; position: absolute; left: 50%; top: 50%; color: rgba(7,29,53,.035); font-size: clamp(6rem,17vw,15rem); font-weight: 800; white-space: nowrap; transform: translate(-50%,-50%); }
body.page-home > .page-banner h1 { font-size: clamp(2.4rem,5vw,4.3rem); letter-spacing: -.03em; }
body.page-home > .page-banner p { color: var(--edu-muted); }
.admission-ribbon { position: relative; overflow: hidden; padding: 1rem; background: linear-gradient(90deg,var(--edu-navy),var(--edu-navy-2),var(--edu-navy)); letter-spacing: .02em; }
.admission-ribbon::after { content: ""; position: absolute; inset: 0; background: linear-gradient(100deg,transparent 30%,rgba(255,255,255,.14) 50%,transparent 70%); transform: translateX(-100%); animation: eduRibbonShine 4.5s ease-in-out infinite; }
@keyframes eduRibbonShine { 65%,100% { transform: translateX(100%); } }
.notice-board { border: 0; background: #fff4d9; }
.notice-ticker { overflow: hidden; white-space: nowrap; }
.notice-ticker span { display: inline-block; min-width: 100%; padding-left: 100%; animation: eduNoticeTicker 18s linear infinite; }
.notice-ticker:hover span { animation-play-state: paused; }
@keyframes eduNoticeTicker { to { transform: translateX(-100%); } }

section { position: relative; }
body:not(.page-home) section:not(.page-banner) { padding-top: 6rem !important; padding-bottom: 6rem !important; }
.bg-light { background: var(--edu-mist) !important; }
.feature-card,.vision-card,.card,.gcard,.event-card,.contact-info {
    position: relative;
    height: 100%;
    overflow: hidden;
    border: 1px solid var(--edu-line);
    border-radius: var(--edu-radius);
    background: rgba(255,255,255,.94);
    box-shadow: 0 14px 40px rgba(7,29,53,.075);
    transition: transform .4s cubic-bezier(.2,.8,.2,1),box-shadow .4s ease,border-color .4s ease;
}
.feature-card,.vision-card,.card,.contact-info { padding: 2rem; }
.feature-card:hover,.vision-card:hover,.card:hover,.gcard:hover,.event-card:hover,.contact-info:hover { transform: translateY(-9px); border-color: rgba(5,155,114,.28); box-shadow: var(--edu-shadow); }
.feature-card::before,.vision-card::before,.card::before { content: ""; position: absolute; width: 145px; height: 145px; right: -78px; top: -82px; border-radius: 50%; background: rgba(17,184,137,.08); transition: transform .5s ease; }
.feature-card:hover::before,.vision-card:hover::before,.card:hover::before { transform: scale(1.5); }
.feature-card i { display: inline-grid; place-items: center; width: 68px; height: 68px; color: var(--edu-emerald); background: var(--edu-mist); border-radius: 20px; box-shadow: inset 0 0 0 1px rgba(5,155,114,.1); }
.event-card { padding: 0 0 1.2rem; background: white; text-align: center; }
.event-card img,.gcard img { width: 100%; object-fit: cover; transition: transform .8s cubic-bezier(.2,.8,.2,1),filter .5s ease; }
.event-card img { height: 270px; }
.event-card:hover img,.gcard:hover img { transform: scale(1.055); filter: saturate(1.08); }
.stats-section { overflow: hidden; padding: 5.5rem 0; background: radial-gradient(circle at 80% 0,rgba(17,184,137,.22),transparent 30%),var(--edu-navy); }
.stats-section::before { content: ""; position: absolute; inset: 0; opacity: .08; background-image: linear-gradient(rgba(255,255,255,.3) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.3) 1px,transparent 1px); background-size: 46px 46px; }
.stats-section .col-md-3 { position: relative; z-index: 1; border-right: 1px solid rgba(255,255,255,.15); }
.stats-section .col-md-3:last-child { border-right: 0; }
.stats-section h2 { color: var(--edu-gold); font-family: var(--edu-font-body); font-size: clamp(3rem,5vw,4.8rem); font-weight: 800; letter-spacing: -.04em; }
.founder-quote { padding: 1.5rem 1.7rem; border-left: 4px solid var(--edu-gold); border-radius: 0 16px 16px 0; background: var(--edu-mist); }

@media (min-width: 992px) and (max-width: 1599.98px) {
    body.page-home img[src*="founder.jpg"] {
        width: min(330px, 100%);
        max-width: 330px !important;
        border-radius: 20px;
    }
}

/* Gallery lightbox */
.gcard { cursor: zoom-in; }
.edu-lightbox { position: fixed; inset: 0; z-index: 10020; display: grid; place-items: center; padding: 2rem; background: rgba(3,17,30,.92); backdrop-filter: blur(18px); opacity: 0; visibility: hidden; transition: .35s ease; }
.edu-lightbox.is-open { opacity: 1; visibility: visible; }
.edu-lightbox img { max-width: min(1150px,92vw); max-height: 84vh; border-radius: 22px; box-shadow: 0 35px 110px rgba(0,0,0,.5); transform: scale(.94); transition: transform .4s cubic-bezier(.2,.8,.2,1); }
.edu-lightbox.is-open img { transform: scale(1); }
.edu-lightbox-close { position: absolute; top: 1.25rem; right: 1.25rem; display: grid; place-items: center; width: 50px; height: 50px; color: white; background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.25); border-radius: 50%; font-size: 1.25rem; }

/* Motion system — forms are intentionally excluded */
.edu-motion-ready .edu-reveal { opacity: 0; transform: translate3d(0,42px,0) scale(.985); filter: blur(6px); transition: opacity .9s ease,transform 1s cubic-bezier(.16,1,.3,1),filter .9s ease; transition-delay: var(--edu-delay,0ms); }
.edu-motion-ready .edu-reveal.edu-left { transform: translate3d(-45px,0,0); }
.edu-motion-ready .edu-reveal.edu-right { transform: translate3d(45px,0,0); }
.edu-motion-ready .edu-reveal.is-visible { opacity: 1; transform: none; filter: blur(0); }
.edu-image-reveal,.edu-image-reveal.is-visible { clip-path: none; }
.edu-tilt { transform-style: preserve-3d; will-change: transform; transition: transform .16s ease-out,box-shadow .35s ease !important; }
.edu-tilt > * { transform: translateZ(18px); }
.edu-tilt.is-resting { transition: transform .55s cubic-bezier(.2,.8,.2,1),box-shadow .35s ease !important; }
.edu-tilt::after { content: ""; position: absolute; inset: 0; pointer-events: none; border-radius: inherit; opacity: 0; background: radial-gradient(circle 180px at var(--tilt-x,50%) var(--tilt-y,50%),rgba(255,255,255,.72),transparent 70%); transition: opacity .25s ease; }
.edu-tilt:hover::after { opacity: .55; }

/* Footer */
.school-footer { position: relative; overflow: hidden; padding-top: 5rem; background: radial-gradient(circle at 84% 0,rgba(17,184,137,.17),transparent 26%),var(--edu-navy); }
.school-footer::before { content: ""; position: absolute; width: 420px; height: 420px; right: -170px; bottom: -260px; border: 1px solid rgba(255,255,255,.1); border-radius: 50%; box-shadow: 0 0 0 70px rgba(255,255,255,.025); }
.school-footer h5 { color: var(--edu-gold); }
.developer-credit {
    position: relative;
    z-index: 1;
    margin-top: 2.25rem;
    padding: 1rem 1.25rem;
    color: rgba(255,255,255,.62);
    background: rgba(0,0,0,.16);
    border-top: 1px solid rgba(255,255,255,.08);
    font-size: .8rem;
    font-weight: 500;
    letter-spacing: .035em;
    text-align: center;
}
.developer-credit a {
    position: relative;
    margin-left: .28rem;
    color: var(--edu-gold);
    font-weight: 800;
    text-decoration: none;
}
.developer-credit a::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: -.18rem;
    left: 0;
    height: 1px;
    background: currentColor;
    transform: scaleX(0);
    transform-origin: right;
    transition: transform .3s ease;
}
.developer-credit a:hover { color: white; }
.developer-credit a:hover::after { transform: scaleX(1); transform-origin: left; }
.social-icons { display: flex; gap: .65rem; }
.social-icons a { display: grid; place-items: center; width: 40px; height: 40px; color: white; background: rgba(255,255,255,.09); border: 1px solid rgba(255,255,255,.12); border-radius: 50%; transition: transform .3s ease,background .3s ease; }
.social-icons a:hover { color: white; background: var(--edu-emerald); transform: translateY(-4px) rotate(5deg); }
.whatsapp-float { width: 58px; height: 58px; z-index: 1000; box-shadow: 0 16px 34px rgba(7,29,53,.25); }
.whatsapp-float::after { content: ""; position: absolute; inset: -7px; border: 1px solid rgba(37,211,102,.48); border-radius: 50%; animation: eduPulse 2.2s ease-out infinite; }
@keyframes eduPulse { 0% { opacity: .8; transform: scale(.82); } 80%,100% { opacity: 0; transform: scale(1.3); } }
#topBtn { width: 45px; height: 45px; padding: 0; color: white; background: var(--edu-emerald); border-radius: 50%; box-shadow: 0 12px 25px rgba(7,29,53,.2); }

@media (max-width: 991.98px) {
    .navbar-collapse { margin-top: .75rem; padding: 1rem; background: white; border: 1px solid var(--edu-line); border-radius: 18px; box-shadow: var(--edu-shadow); }
    .slider-img { min-height: 690px; }
    .edu-orbit { display: none; }
    body:not(.page-home) .page-banner { min-height: 600px; }
    body:not(.page-home) .page-banner .container { margin-left: auto; text-align: center !important; }
}

@media (max-width: 767.98px) {
    .navbar.fixed-top { min-height: 70px; }
    .school-logo { height: 43px; }
    .navbar-brand span { max-width: 205px; font-size: .82rem; white-space: normal; line-height: 1.15; }
    .slider-img { min-height: 650px; height: 82vh; }
    .carousel-caption { right: 25px; bottom: 20%; left: 25px; }
    .carousel-caption h1 { font-size: clamp(2.7rem,12vw,4rem); }
    .carousel-caption p { font-size: 1rem; }
    .carousel-indicators { bottom: 7%; left: 25px; }
    .carousel-control-prev,.carousel-control-next { display: none; }
    #schoolCarousel::after { background-size: 45px 45px; }
    body:not(.page-home) .page-banner { min-height: 540px; padding-top: 95px; }
    body:not(.page-home) .page-banner h1 { font-size: clamp(3rem,14vw,4.8rem); }
    body:not(.page-home) section:not(.page-banner) { padding-top: 4rem !important; padding-bottom: 4rem !important; }
    body.page-home > .page-banner h1 { max-width: 320px; margin-right: auto; margin-left: auto; padding: 0 .75rem; font-size: 1.85rem; line-height: 1.15; white-space: normal; overflow-wrap: normal; }
    .stats-section .col-md-3 { padding: 1.25rem 0; border-right: 0; border-bottom: 1px solid rgba(255,255,255,.14); }
    .stats-section .col-md-3:last-child { border-bottom: 0; }
    .highlight { margin-right: 16px; margin-left: 16px; padding: 38px 22px; }
    .edu-motion-ready .edu-reveal,.edu-motion-ready .edu-reveal.edu-left,.edu-motion-ready .edu-reveal.edu-right { transform: translateY(24px); filter: none; }
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *,*::before,*::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
    .edu-motion-ready .edu-reveal { opacity: 1; transform: none; filter: none; }
    .edu-image-reveal { clip-path: none; }
    .edu-tilt { transform: none !important; }
    .notice-ticker span { padding-left: 0; animation: none; white-space: normal; }
}
