/* Shared motion for all pages, including the community and its forms. */
:root {
  --motion-ease: cubic-bezier(.22, .61, .36, 1);
  --motion-duration: 300ms;
}
html { scroll-behavior: auto; scroll-padding-top: 0; }
section[id], [id="add-photo"], [id="consent"] { scroll-margin-top: 96px; }
.community-preview__grid { scroll-behavior: auto; }

a, button, input, select, textarea, input::file-selector-button {
  transition-property: color, background-color, border-color, box-shadow, opacity;
  transition-duration: var(--motion-duration);
  transition-timing-function: var(--motion-ease);
}
.link-arrow, .nav-sign-arrow, .agenda-ribbon__arrow,
.route-map strong, .day-card {
  transition: transform 400ms var(--motion-ease), opacity var(--motion-duration) var(--motion-ease);
}
.day-card__image, .community-preview__item img, .community-photo img {
  transition: transform 650ms var(--motion-ease);
}
.site-nav > a:not(.nav-book)::after { transition: transform 400ms var(--motion-ease); }
.menu-more::after { transition: transform 400ms var(--motion-ease); }

/* Outlined actions keep the same surface, text and border in every state. */
.button--light:hover, .button--dark:not(.menu-more):hover,
.button--light:focus-visible, .button--dark:not(.menu-more):focus-visible {
  color: inherit;
  background: transparent;
  border-color: currentColor;
}
:is(a, button):is(:hover, :focus-visible) .link-arrow { transform: translateX(5px); }
:is(a, button):disabled .link-arrow { transform: none; }
.agenda-ribbon:focus-visible .agenda-ribbon__arrow { transform: translateX(8px); }
.day-card:focus-visible .day-card__image,
.community-preview__item:focus-visible img { transform: scale(1.035); }
.community-back:is(:hover, :focus-visible),
.community-hero__action:is(:hover, :focus-visible),
.community-footer a:is(:hover, :focus-visible),
.site-footer a:is(:hover, :focus-visible) { opacity: .78; }

@media (hover: hover) and (pointer: fine) {
  .day-card:hover { transform: translateY(-4px); }
  .nav-book:hover .nav-sign-arrow { transform: translateX(4px); }
}
@media (min-width: 721px) {
  .menu-more:is(:hover, :focus-visible)::after { transform: translateY(1px) rotate(45deg); }
}
@media (max-width: 720px) {
  section[id], [id="add-photo"], [id="consent"] { scroll-margin-top: 84px; }
  .menu-more:is(:hover, :focus-visible) { color: inherit; background: transparent; border-color: currentColor; }
}
@media (prefers-reduced-motion: reduce) {
  html, .community-preview__grid { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
  .reveal { opacity: 1; transform: none; }
  :is(a, button):is(:hover, :focus-visible) .link-arrow,
  .agenda-ribbon:is(:hover, :focus-visible) .agenda-ribbon__arrow,
  .day-card:is(:hover, :focus-visible),
  .day-card:is(:hover, :focus-visible) .day-card__image,
  .community-preview__item:is(:hover, :focus-visible) img,
  .community-photo:hover img,
  .nav-book:hover .nav-sign-arrow,
  .route-map:hover strong { transform: none; }
  .menu-more:is(:hover, :focus-visible)::after { transform: translateY(-3px) rotate(45deg); }
}