/* Shared, restrained micro-interactions for every page. */
:where(button:not(:disabled), a[href], summary, [role="button"]) {
  -webkit-tap-highlight-color: transparent;
}

:where(button, a[href], summary, [role="button"], input, select, textarea):focus-visible {
  outline: 2px solid rgba(76, 224, 196, 0.78);
  outline-offset: 3px;
}

:where(a[href] > span[aria-hidden="true"], button > span[aria-hidden="true"], summary > span[aria-hidden="true"]) {
  display: inline-block;
  transition: transform 180ms cubic-bezier(0.2, 0.75, 0.2, 1);
}

:where(button:not(:disabled), a[href], [role="button"]):active {
  translate: 0 1px;
}

@media (hover: hover) and (pointer: fine) {
  :where(button:not(:disabled), [role="button"]):hover {
    filter: brightness(1.035);
  }

  :where(a[href]:hover > span[aria-hidden="true"], button:hover > span[aria-hidden="true"], summary:hover > span[aria-hidden="true"]) {
    transform: translate(2px, -2px);
  }
}

:where(.eyebrow-dot) {
  animation: micro-dot-glow 3.2s ease-in-out infinite;
}

.micro-motion-ready .micro-reveal {
  opacity: 0;
  transform: translateY(9px);
  transition: opacity 480ms ease, transform 480ms cubic-bezier(0.2, 0.75, 0.2, 1);
  transition-delay: var(--micro-delay, 0ms);
}

.micro-motion-ready .micro-reveal.micro-visible {
  opacity: 1;
  transform: translateY(0);
}

@keyframes micro-dot-glow {
  0%, 100% { box-shadow: 0 0 0 4px rgba(37, 200, 186, 0.1); }
  50% { box-shadow: 0 0 0 6px rgba(37, 200, 186, 0.17); }
}

@media (prefers-reduced-motion: reduce) {
  :where(.eyebrow-dot) { animation: none !important; }
  :where(a[href] > span[aria-hidden="true"], button > span[aria-hidden="true"], summary > span[aria-hidden="true"]) {
    transition: none !important;
  }
  :where(button:not(:disabled), a[href], [role="button"]):active { translate: none; }
  .micro-motion-ready .micro-reveal,
  .micro-motion-ready .micro-reveal.micro-visible {
    opacity: 1;
    transform: none;
    transition: none;
  }
}