/* Refined interactions layer; never hides content until JavaScript is available. */
:root { --portfolio-motion-ease: cubic-bezier(.22, 1, .36, 1); }
.hero__actions .button,
.contact__button,
.project-card,
.case-card,
.service-card {
  transition: box-shadow .32s var(--portfolio-motion-ease),
              border-color .32s var(--portfolio-motion-ease),
              background-color .32s var(--portfolio-motion-ease);
}
.project-card:hover, .case-card:hover, .service-card:hover {
  border-color: rgba(133, 117, 255, .5);
  box-shadow: 0 22px 55px rgba(37, 31, 92, .13);
}
.button--primary { position: relative; overflow: hidden; }
.button--primary::after {
  content: ''; position: absolute; top: 0; left: -110%; width: 70%; height: 100%;
  transform: skewX(-22deg); background: linear-gradient(90deg, transparent, rgba(255,255,255,.22), transparent);
  pointer-events: none; transition: left .85s var(--portfolio-motion-ease);
}
.button--primary:hover::after { left: 135%; }
.security-trap { position: absolute !important; left: -10000px !important; width: 1px !important;
  height: 1px !important; overflow: hidden !important; opacity: 0 !important; pointer-events: none !important; }
@media (prefers-reduced-motion: reduce) {
  .button--primary::after { display: none; }
  .project-card, .case-card, .service-card { transition: none; }
}