/* Motion, loaded last. Only opacity, transform, colour, shadow and filter animate.
 * Signature movement (S3): the photo-finish line sweeps along the régua da reta to the
 * main race distance. It lives on the ruler, not on the LCP photo, so LCP is untouched. */

/* photo-finish sweep (mockup) */
.sweep-clip { position: absolute; left: 0; right: 0; top: -48px; bottom: -2px; overflow: hidden; pointer-events: none; z-index: 3; }
.sweep { position: absolute; inset: 0; transform: translateX(calc((var(--m) / var(--track-len) - 1) * 100%)); animation: sweep 1.9s var(--ease) .45s both; }
.sweep::before { content: ""; position: absolute; right: 0; top: 0; bottom: 0; width: 90px; background: linear-gradient(to right, rgba(194, 80, 42, 0), rgba(194, 80, 42, .12)); }
.sweep::after { content: ""; position: absolute; right: -1px; top: 0; bottom: 0; width: 2px; background: var(--color-ink); box-shadow: 0 0 0 1px var(--color-bg); }
@keyframes sweep { from { transform: translateX(-100%); } }

@keyframes spin { to { transform: rotate(360deg); } }

/* reveal on scroll — once, 12px */
[data-reveal] { opacity: 0; transform: translateY(12px); transition: opacity var(--dur-slow) var(--ease), transform var(--dur-slow) var(--ease); }
[data-reveal].is-in { opacity: 1; transform: none; }
[data-reveal-group] > * { transition-delay: 0ms; }
[data-reveal-group] > *:nth-child(2) { transition-delay: 60ms; }
[data-reveal-group] > *:nth-child(3) { transition-delay: 120ms; }
[data-reveal-group] > *:nth-child(4) { transition-delay: 180ms; }

/* height never animates: rows expand through grid-template-rows */
.collapsible { display: grid; grid-template-rows: 0fr; transition: grid-template-rows var(--dur-base) var(--ease); }
.collapsible.is-open { grid-template-rows: 1fr; }
.collapsible > * { overflow: hidden; min-height: 0; visibility: hidden; transition: visibility 0s var(--dur-base); }
.collapsible.is-open > * { visibility: visible; transition-delay: 0s; }

/* panels of filters and tabs fade in */
.panel:not([hidden]), [data-filter-list] > * { animation: fadein var(--dur-base) var(--ease) both; }
@keyframes fadein { from { opacity: 0; transform: translateY(4px); } }

/* cookie banner slides up */
.cookie { animation: rise var(--dur-slow) var(--ease) both; }
@keyframes rise { from { opacity: 0; transform: translateY(16px); } }

html { scroll-behavior: smooth; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    animation-delay: 0s !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
  [data-reveal] { opacity: 1; transform: none; }
}
/* links inside a closed accordion answer are out of the tab order and of the layout */
.collapsible:not(.is-open) a { display: none; }
