
/* ui-enhancements.css — subtle, performant micro-interactions */
:root {
  --ease-out: cubic-bezier(.22,.61,.36,1);
  --ring: 0 0 0 3px rgba(37,99,235,.25);
}

/* Buttons and primary CTAs */
a.button, button, .btn, .cta {
  transition: transform .18s var(--ease-out), box-shadow .18s var(--ease-out), background-color .18s var(--ease-out), color .18s var(--ease-out);
}
a.button:hover, button:hover, .btn:hover, .cta:hover { transform: translateY(-1px); box-shadow: 0 8px 16px rgba(0,0,0,.08); }
a.button:active, button:active, .btn:active, .cta:active { transform: translateY(0); box-shadow: 0 4px 10px rgba(0,0,0,.06); }
a.button:focus-visible, button:focus-visible, .btn:focus-visible, .cta:focus-visible { outline: none; box-shadow: var(--ring); }

/* Links underline animation */
a:not(.button):not(.btn):not(.cta) {
  text-decoration: none;
  background-image: linear-gradient(currentColor, currentColor);
  background-position: 0 100%;
  background-repeat: no-repeat;
  background-size: 0% 1px;
  transition: background-size .2s var(--ease-out);
}
a:not(.button):not(.btn):not(.cta):hover { background-size: 100% 1px; }
a:not(.button):not(.btn):not(.cta):focus-visible { box-shadow: var(--ring); border-radius: 4px; }

/* Lang switcher lighter hover */
.lang-switcher.segmented a {
  transition: color .15s var(--ease-out);
}
.lang-switcher.segmented a:hover { color: #0b61d8; }

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce) {
  * { transition: none !important; animation: none !important; }
}


/* inline language links under H1 */
.lang-inline {
  margin: .25rem 0 1rem;
  font-size: .95rem;
  color: #475569;
}
.lang-inline a { color: inherit; text-decoration: none; }
.lang-inline a:hover { text-decoration: underline; }
.lang-inline a.cur { font-weight: 600; color: #0b61d8; }
