/* Card movement uses translate so the existing slanted brand tiles keep their rotation. */
.motion-card{--motion-accent:18,200,187;position:relative;isolation:isolate;overflow:hidden;animation:seven-card-float var(--float-duration,6s) ease-in-out var(--motion-delay,0s) infinite,seven-card-glow 5s ease-in-out var(--motion-delay,0s) infinite;animation-play-state:paused;will-change:auto;transition:border-color .25s,box-shadow .25s}
.motion-card.motion-visible{animation-play-state:running}
.motion-card::after{content:'';position:absolute;inset:0;z-index:2;pointer-events:none;border-radius:inherit;background:linear-gradient(110deg,transparent 32%,rgba(255,255,255,.03) 42%,rgba(255,255,255,.17) 50%,rgba(255,255,255,.03) 58%,transparent 68%);background-size:300% 100%;background-position:180% 0;animation:seven-card-shine 8s ease-in-out var(--shine-delay,0s) infinite;animation-play-state:paused}
.motion-card.motion-visible::after{animation-play-state:running}
.motion-card:hover,.motion-card:focus-within{animation-play-state:paused;border-color:rgba(var(--motion-accent),.85);box-shadow:0 0 0 1px rgba(var(--motion-accent),.2),0 14px 38px rgba(var(--motion-accent),.16)}
body:has(dialog[open]) .motion-card,body:has(dialog[open]) .motion-card::after{animation-play-state:paused}
.floating.motion-card,.art-months span:nth-child(3n).motion-card{--motion-accent:249,188,51}
.metrics{grid-template-columns:repeat(4,minmax(0,1fr))}
.metrics>div.motion-card{border:1px solid #1d4b60;background:#072941;padding:16px 14px;border-radius:10px;min-width:0;gap:12px;flex-wrap:wrap}
.metrics strong{display:inline-block;font-variant-numeric:tabular-nums;min-width:2.3ch}
.steps li.motion-card{border:1px solid #21475d;background:#06243d;padding:24px;border-radius:10px}
.faq details.motion-card{padding:20px;border:1px solid #24465d;margin-bottom:12px;border-radius:10px}
.preview-event.motion-card{padding:15px 12px;border:1px solid #214c60;margin-block:10px;background:#082b46;border-radius:8px}
.art-months span.motion-card{--float-duration:7s;animation-name:seven-tile-float,seven-card-glow}
.count-accessible{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip-path:inset(50%)!important;white-space:nowrap!important;border:0!important}
@keyframes seven-card-float{0%,100%{translate:0 0}50%{translate:0 -6px}}
@keyframes seven-tile-float{0%,100%{translate:0 0}50%{translate:0 -2px}}
@keyframes seven-card-glow{0%,100%{box-shadow:0 7px 20px rgba(var(--motion-accent),.03),0 0 0 1px rgba(var(--motion-accent),.02)}50%{box-shadow:0 13px 36px rgba(var(--motion-accent),.14),0 0 0 1px rgba(var(--motion-accent),.18)}}
@keyframes seven-card-shine{0%,18%{background-position:180% 0;opacity:0}24%{opacity:1}45%{background-position:-80% 0;opacity:1}51%,100%{background-position:-80% 0;opacity:0}}
@media(max-width:800px){.metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.metrics>div.motion-card{padding:13px 11px}.steps li.motion-card{padding:20px}}
@media(prefers-reduced-motion:reduce){.motion-card,.motion-card.motion-visible,.motion-card::after,.motion-card.motion-visible::after{animation:none!important;translate:none!important;transition:none!important}.motion-card{box-shadow:0 5px 20px rgba(var(--motion-accent),.06)}.motion-card::after{display:none}}