/* Progressive motion: content remains readable without JavaScript. */
@view-transition { navigation: auto; }
:root { --motion-ease: cubic-bezier(.22,1,.36,1); scroll-behavior: smooth; }
::view-transition-old(root) { animation: page-out 140ms ease both; }
::view-transition-new(root) { animation: page-in 260ms var(--motion-ease) both; }
@keyframes page-out { to { opacity: 0; } }
@keyframes page-in { from { opacity: 0; transform: translateY(6px); } }
a { -webkit-tap-highlight-color: transparent; }
a:focus-visible, button:focus-visible { outline: 2px solid #6868d9; outline-offset: 6px; }
@media (hover: hover) and (pointer: fine) {
 a img { transition: scale 650ms var(--motion-ease), filter 400ms ease; }
 a:hover img { scale: 1.025; }
 a:active img { scale: 1.01; }
 a[href^="mailto:"], nav a { transition: opacity 220ms ease; }
 nav a:hover, a[href^="mailto:"]:hover { opacity: .6; }
 a[data-motion-cta] { transition: translate 300ms var(--motion-ease), box-shadow 300ms ease; }
 a[data-motion-cta]:hover { translate: 0 -3px; box-shadow: 0 8px 24px #00000015; }
 a[data-motion-cta]:active { translate: 0 0; }
}
@media (prefers-reduced-motion: reduce) {
 :root { scroll-behavior: auto; }
 *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
 ::view-transition-old(root), ::view-transition-new(root) { animation: none; }
}
/* Consistent feedback for every interactive target. */
a, button, [role="button"], [data-nested-link] {
 cursor: pointer;
 transition: opacity 240ms ease, translate 350ms var(--motion-ease), box-shadow 350ms ease, background-color 240ms ease;
}
@media (hover: hover) and (pointer: fine) {
 a:hover, button:hover, [role="button"]:hover, [data-nested-link]:hover { opacity: .78; }
 a:has(img):hover { opacity: 1; }
 button:hover, [role="button"]:hover { translate: 0 -2px; }
 a:active, button:active, [role="button"]:active { opacity: .65; }
}
::view-transition-old(root) { animation-duration: 220ms; }
::view-transition-new(root) { animation-duration: 460ms; }
@media (prefers-reduced-motion: reduce) {
 a, button, [role="button"], [data-nested-link] { transition: none !important; }
 ::view-transition-old(root), ::view-transition-new(root) { animation: none; }
}
