/* ═══════════════════════════════════════════════════════════════════════════
   Motion — restrained entrance animations
   ───────────────────────────────────────────────────────────────────────────
   Every rule is scoped to html.bc-motion, which inc/motion.php sets with an
   inline script — without JS nothing is ever hidden.

   assets/js/motion.js tags elements with [data-reveal] ("up", "settle" or
   "fade" for elements that already carry a transform) and adds .is-in once
   they scroll into view. Only opacity and transform are animated, so
   scrolling stays on the compositor.

   Language of the motion: one calm, decisive ease-out; short travel (18px);
   cards in a group follow each other 70 ms apart. No bounce, no loops.
   ═══════════════════════════════════════════════════════════════════════════ */

:root {
    --bc-ease-out: cubic-bezier(0.23, 1, 0.32, 1);
    --bc-reveal-duration: 900ms;
    --bc-reveal-distance: 18px;
}

/* ─── Reveal on scroll ────────────────────────────────────────────────────── */

.bc-motion [data-reveal] {
    opacity: 0;
    transition:
        opacity var(--bc-reveal-duration) var(--bc-ease-out) var(--bc-reveal-delay, 0ms),
        transform var(--bc-reveal-duration) var(--bc-ease-out) var(--bc-reveal-delay, 0ms);
}

.bc-motion [data-reveal="up"] {
    transform: translate3d(0, var(--bc-reveal-distance), 0);
}

/* Photos settle into their frame: a hair of scale, inside an overflow:hidden box. */
.bc-motion [data-reveal="settle"] {
    transform: scale(1.06);
    transition-duration: 1400ms;
}

.bc-motion [data-reveal].is-in {
    opacity: 1;
}

.bc-motion [data-reveal="up"].is-in,
.bc-motion [data-reveal="settle"].is-in {
    transform: none;
}

/* Already scrolled past when the page loaded — show without animating. */
.bc-motion [data-reveal].is-instant {
    transition: none;
}

/* ─── Hero: the first impression ──────────────────────────────────────────── */

/* The home hero photo eases out of a slight zoom once, on load. */
.bc-motion .section-hero .hero__image img {
    animation: bc-hero-settle 2400ms var(--bc-ease-out) both;
}

@keyframes bc-hero-settle {
    from {
        transform: scale(1.08);
    }
    to {
        transform: none;
    }
}

/* ─── Accessibility & print ───────────────────────────────────────────────── */

@media (prefers-reduced-motion: reduce) {
    .bc-motion [data-reveal],
    .bc-motion [data-reveal="up"],
    .bc-motion [data-reveal="settle"] {
        transform: none;
        transition: opacity 400ms ease var(--bc-reveal-delay, 0ms);
    }

    .bc-motion .section-hero .hero__image img {
        animation: none;
    }
}

@media print {
    .bc-motion [data-reveal] {
        opacity: 1 !important;
        transform: none !important;
    }
}