/* Opt-in motion only. Page typography, colours and layout remain page-owned. */
.at-motion-scope {
  --at-motion-duration: 760ms;
  --at-motion-hover-duration: 240ms;
  --at-motion-disclosure-duration: 280ms;
  --at-motion-ease: cubic-bezier(.22, .61, .36, 1);
  --at-motion-reveal-ease: cubic-bezier(.25, .46, .45, .94);
  --at-motion-distance: 16px;
  --at-motion-lift: 2px;
  --at-motion-arrow-distance: 3px;
  --at-motion-focus-color: var(--at-blue, #1e64d4);
}

/* No pending/hidden state: content stays visible without JavaScript. */
.at-motion-scope .at-reveal.at-is-revealing {
  animation: at-motion-reveal var(--at-motion-duration) var(--at-motion-reveal-ease);
}
@keyframes at-motion-reveal {
  from { opacity: .7; transform: translateY(var(--at-motion-distance)); }
  to { opacity: 1; transform: none; }
}

.at-motion-scope .at-hover-lift {
  transition: transform var(--at-motion-hover-duration) var(--at-motion-ease),
    border-color var(--at-motion-hover-duration) var(--at-motion-ease);
}
.at-motion-scope .at-motion-button {
  transition: background-color var(--at-motion-hover-duration) var(--at-motion-ease),
    color var(--at-motion-hover-duration) var(--at-motion-ease),
    border-color var(--at-motion-hover-duration) var(--at-motion-ease),
    box-shadow var(--at-motion-hover-duration) var(--at-motion-ease),
    transform var(--at-motion-hover-duration) var(--at-motion-ease);
}
.at-motion-scope .at-link-arrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.at-motion-scope .at-link-arrow .at-link-label { min-width: 0; }
.at-motion-scope .at-link-arrow .at-link-icon {
  display: inline-block;
  flex: none;
  text-decoration: none;
  transition: transform var(--at-motion-hover-duration) var(--at-motion-ease);
}
.at-motion-scope a.at-link-arrow:hover,
.at-motion-scope a.at-link-arrow:focus-visible { text-decoration: none; }
.at-motion-scope .at-link-arrow:hover .at-link-label,
.at-motion-scope .at-link-arrow:focus-visible .at-link-label {
  text-decoration: underline;
  text-underline-offset: .2em;
  text-decoration-thickness: 1px;
}
.at-motion-scope .at-link-arrow:focus-visible,
.at-motion-scope .at-motion-button:focus-visible {
  outline: 3px solid var(--at-motion-focus-color);
  outline-offset: 5px;
}
.at-motion-scope .at-hover-lift:focus-within,
.at-motion-scope .at-motion-button:focus-visible {
  transform: translateY(calc(-1 * var(--at-motion-lift)));
}
.at-motion-scope .at-link-arrow:focus-visible .at-link-icon {
  transform: translateX(var(--at-motion-arrow-distance));
}
@media (hover: hover) and (pointer: fine) {
  .at-motion-scope .at-hover-lift:hover,
  .at-motion-scope .at-motion-button:hover {
    transform: translateY(calc(-1 * var(--at-motion-lift)));
  }
  .at-motion-scope .at-link-arrow:hover .at-link-icon {
    transform: translateX(var(--at-motion-arrow-distance));
  }
}

/* Focus must never wait for a reveal. These rules also support explicit opt-out. */
.at-motion-scope .at-reveal:focus-within,
.at-motion-scope .at-no-motion,
.at-motion-scope .at-no-motion .at-link-icon,
.at-motion-scope[data-at-motion="off"] :is(.at-reveal, .at-hover-lift, .at-motion-button, .at-link-icon) {
  animation: none !important;
  transition: none !important;
  transform: none !important;
}
@media (prefers-reduced-motion: reduce) {
  .at-motion-scope :is(.at-reveal, .at-hover-lift, .at-motion-button, .at-link-icon) {
    animation: none !important;
    transition: none !important;
    transform: none !important;
  }
}
