/* Loaded by conclave.html and about.html. Content is visible until JS is ready. */
/* Keep the original number in flow while decorative digit reels roll over it. */
.stats [data-odometer] { position: relative; }
.stats [data-odometer] span { width: auto; height: auto; color: inherit; }
.stats [data-odometer] .odometer-value { opacity: 0; }
.stats [data-odometer] .odometer-reels { position: absolute; top: 0; left: 0; display: flex; }
.stats [data-odometer] .odometer-digit { position: relative; height: 1.3em; overflow: hidden; }
.stats [data-odometer] .odometer-size { visibility: hidden; }
.stats [data-odometer] .odometer-strip { position: absolute; top: 0; left: 0; }
.stats [data-odometer] .odometer-strip span { display: block; height: 1.3em; line-height: 1.3; }
@media (prefers-reduced-motion: reduce) {
    .stats [data-odometer] .odometer-value { opacity: 1; }
    .stats [data-odometer] .odometer-reels { display: none; }
}
/* Measured along the existing day marker rails; takes no layout space. */
[data-scroll-progress] { position: relative; }
.timeline-progress {
    position: absolute;
    width: 3px;
    border-radius: 3px;
    background: #e2dcd1;
    pointer-events: none;
    overflow: hidden;
}
.timeline-progress::after {
    content: "";
    position: absolute;
    inset: 0;
    background: #e0511f;
    transform: scaleY(var(--timeline-progress, 0));
    transform-origin: top;
    transition: transform 450ms cubic-bezier(0.22, 1, 0.36, 1);
}
.timeline-progress-ready .day-marker::after { opacity: 0; }
@media (prefers-reduced-motion: reduce) {
    .timeline-progress::after { transform: none; transition: none; }
}
/* The frame owns the entrance; its image owns the hover zoom. This keeps
   both transforms independent and preserves the existing gallery geometry. */
.gallery .snapshot-frame {
    min-width: 0;
    height: 253px;
    border-radius: 16px;
    overflow: hidden;
}
.gallery .snapshot-frame:nth-child(1) { grid-column: span 4; }
.gallery .snapshot-frame:nth-child(2) { grid-column: span 8; }
.gallery .snapshot-frame:nth-child(3) { grid-column: span 7; }
.gallery .snapshot-frame:nth-child(4) { grid-column: span 5; }
.gallery .snapshot-frame img {
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 0;
    transition: transform 600ms cubic-bezier(0.22, 1, 0.36, 1);
}
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
    .gallery .snapshot-frame:hover img { transform: scale(1.06); }
}
@media (max-width: 767px) {
    .gallery .snapshot-frame:nth-child(n) {
        grid-column: span 1;
        height: 170px;
        border-radius: 10px;
    }
}
@media (prefers-reduced-motion: reduce) {
    .gallery .snapshot-frame img { transition: none; }
}
html.conclave-animations-ready body { overflow-x: clip; }
html.conclave-animations-ready [data-animate] {
    opacity: 0;
    transition-property: opacity, transform;
    transition-duration: var(--entrance-duration, 700ms);
    transition-delay: var(--entrance-delay, 0ms);
    transition-timing-function: cubic-bezier(0.22, 1, 0.36, 1);
}
html.conclave-animations-ready [data-animate="fade-up"] { transform: translateY(40px); }
/* Direction names indicate the starting side. */
html.conclave-animations-ready [data-animate="fade-left"] { transform: translateX(-40px); }
html.conclave-animations-ready [data-animate="fade-right"] { transform: translateX(40px); }
html.conclave-animations-ready [data-animate="zoom-in"] { transform: scale(.96); }
html.conclave-animations-ready [data-animate].is-visible { opacity: 1; }
html.conclave-animations-ready [data-animate]:not([data-animate="fade-in"]).is-visible {
    transform: none;
}
/* Fade-only leaves existing carousel positioning transforms intact. */
html.conclave-animations-ready [data-animate="fade-in"] { transition-property: opacity; }
@media (prefers-reduced-motion: reduce) {
    html.conclave-animations-ready [data-animate] { opacity: 1; transition: none; }
    html.conclave-animations-ready [data-animate]:not([data-animate="fade-in"]) { transform: none; }
}
@media print {
    html.conclave-animations-ready [data-animate] { opacity: 1; transition: none; }
    html.conclave-animations-ready [data-animate]:not([data-animate="fade-in"]) { transform: none; }
}