/*
 * Scroll-triggered reveal for the school website (all templates, inner pages included).
 * reveal.js adds `reveal-on` to <html> and tags the blocks; without JS nothing is hidden.
 */
.reveal-on body { overflow-x: clip; }

.reveal-on [data-reveal] {
    opacity: 0;
    translate: 0 28px;
    transition: opacity .7s cubic-bezier(.2, .65, .3, 1), translate .7s cubic-bezier(.2, .65, .3, 1);
    will-change: opacity, translate;
}
.reveal-on [data-reveal="left"] { translate: -40px 0; }
.reveal-on [data-reveal="right"] { translate: 40px 0; }
[dir="rtl"].reveal-on [data-reveal="left"], .reveal-on [dir="rtl"] [data-reveal="left"] { translate: 40px 0; }
[dir="rtl"].reveal-on [data-reveal="right"], .reveal-on [dir="rtl"] [data-reveal="right"] { translate: -40px 0; }
.reveal-on [data-reveal="zoom"] { translate: 0 16px; scale: .96; transition-property: opacity, translate, scale; }

.reveal-on [data-reveal].is-revealed { opacity: 1; translate: 0 0; scale: 1; }

/* Stacked columns: slide up only */
@media (max-width: 991px) {
    .reveal-on [data-reveal="left"],
    .reveal-on [data-reveal="right"],
    [dir="rtl"].reveal-on [data-reveal="left"],
    [dir="rtl"].reveal-on [data-reveal="right"] { translate: 0 28px; }
    .reveal-on [data-reveal].is-revealed { translate: 0 0; }
}

@media (prefers-reduced-motion: reduce) {
    .reveal-on [data-reveal] { opacity: 1; translate: none; scale: none; transition: none; }
}