/* ============================================================
   SmileCare — Scroll-Reveal Animations
   Uses native IntersectionObserver — no libraries, no cost
   Elements with [data-reveal] fade/slide in when scrolled into view
   ============================================================ */

/* ---- Base reveal state (hidden before trigger) ---- */
[data-reveal] {
    opacity: 0;
    transform: translateY(28px);
    transition: opacity .6s cubic-bezier(.16,1,.3,1),
                transform .6s cubic-bezier(.16,1,.3,1);
    will-change: opacity, transform;
}

/* ---- Variants: direction of motion ---- */
[data-reveal="fade"] {
    transform: none;
}
[data-reveal="left"] {
    transform: translateX(-40px);
}
[data-reveal="right"] {
    transform: translateX(40px);
}
[data-reveal="scale"] {
    transform: scale(.94);
}

/* ---- Triggered state (visible) ---- */
[data-reveal].is-visible {
    opacity: 1;
    transform: translate(0, 0) scale(1);
}

/* ---- Stagger delays for grouped children ---- */
[data-reveal][data-reveal-delay="1"]  { transition-delay: .08s; }
[data-reveal][data-reveal-delay="2"]  { transition-delay: .16s; }
[data-reveal][data-reveal-delay="3"]  { transition-delay: .24s; }
[data-reveal][data-reveal-delay="4"]  { transition-delay: .32s; }
[data-reveal][data-reveal-delay="5"]  { transition-delay: .40s; }
[data-reveal][data-reveal-delay="6"]  { transition-delay: .48s; }
[data-reveal][data-reveal-delay="7"]  { transition-delay: .56s; }
[data-reveal][data-reveal-delay="8"]  { transition-delay: .64s; }

/* ---- Respect reduced-motion preference ---- */
@media (prefers-reduced-motion: reduce) {
    [data-reveal] {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
    }
}