/* Movimento e microinterações. Sem loops ou dependências externas. */
.button {
  overflow: hidden;
  isolation: isolate;
  transition: background .2s, box-shadow .3s, transform .25s cubic-bezier(.2,.8,.3,1);
}
.button:not(.mobile-contact) { position: relative; }
.strip-star { display: inline-block; }
.button::after {
  content: '';
  position: absolute;
  inset: -50% auto -50% -55%;
  width: 35%;
  background: linear-gradient(90deg, transparent, #ffffff38, transparent);
  transform: skewX(-18deg);
  pointer-events: none;
}
.button .arrow { transition: transform .25s; }
.desktop-nav a { position: relative; }
.desktop-nav a::after {
  content: '';
  position: absolute;
  bottom: -7px;
  left: 0;
  width: 100%;
  height: 1px;
  background: var(--lime);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .25s;
}
.hero-art {
  transform: perspective(1100px) rotateX(var(--art-x, 0deg)) rotateY(var(--art-y, 0deg));
  transition: transform .35s ease-out, border-color .3s, box-shadow .35s;
}
.hero-art::before {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: radial-gradient(circle at var(--light-x, 50%) var(--light-y, 50%), #c6ef0018, transparent 65%);
  opacity: 0;
  z-index: 3;
  pointer-events: none;
  transition: opacity .35s;
}
.hero-art.is-tracking::before { opacity: 1; }
.hero-art.is-tracking { border-color: #c6ef0060; box-shadow: 0 18px 50px #0005; }
.mascots-image { transition: transform .7s cubic-bezier(.2,.75,.25,1); }
.title-spark, .round-spark .icon, .niche-icon, .service-icon, .contact-decoration, .strip-star {
  transition: transform .55s cubic-bezier(.2,.75,.25,1), color .3s;
}
.niche-card, .service-card, .portfolio-card {
  transition: transform .3s cubic-bezier(.2,.75,.25,1), border-color .3s, box-shadow .3s, background .3s;
}
.portfolio-frame img { transition: transform .6s cubic-bezier(.2,.75,.25,1); }
.portfolio-filter, .carousel-controls button { transition: background .2s, color .2s, border-color .2s, transform .2s; }
.step > span { transition: color .25s, transform .3s; }
.contact-panel { transition: box-shadow .4s; }
.portfolio-card { transform-origin: center; }
.portfolio-grid { padding-top: 7px; margin-top: -7px; }
.button:focus-visible .arrow { transform: translateX(3px); }
.desktop-nav a:focus-visible::after { transform: scaleX(1); }
.service-card:focus-within, .portfolio-card:focus-within { border-color: #c6ef0090; }

@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  .button:hover { transform: translateY(-3px); box-shadow: 0 8px 30px #c6ef0026; }
  .button-dark:hover { box-shadow: 0 8px 24px #0003; }
  .button:hover::after { animation: buust-sheen .7s ease-out; }
  .button:hover .arrow { transform: translateX(4px); }
  .button:active { transform: translateY(0) scale(.98); }
  .desktop-nav a:hover::after { transform: scaleX(1); }
  .hero-copy h1:hover .title-spark { transform: rotate(102deg) scale(1.1); }
  .hero-art:hover .mascots-image { transform: scale(1.035); }
  .hero-art:hover .round-spark .icon { transform: rotate(90deg); }
  .use-strip:hover .strip-star { transform: rotate(90deg); }
  .niche-card:hover, .service-card:hover { transform: translateY(-6px); border-color: #c6ef0065; box-shadow: 0 16px 32px #0004; }
  .niche-card:hover .niche-icon, .service-card:hover .service-icon { transform: translateY(-3px) rotate(-6deg); color: var(--lime); }
  .portfolio-card:hover { transform: translateY(-4px); border-color: #c6ef0065; }
  .portfolio-card:hover .portfolio-frame img { transform: scale(1.035); }
  .portfolio-filter:hover { transform: translateY(-2px); }
  .carousel-controls button:hover:not(:disabled) { transform: scale(1.08); }
  .carousel-controls button:active:not(:disabled) { transform: scale(.95); }
  .step:hover > span { transform: translateX(4px); color: #e0ff5a; }
  .contact-panel:hover { box-shadow: 0 0 50px #c6ef0014; }
  .contact-panel:hover .contact-decoration { transform: rotate(35deg) scale(1.04); }
}

@media (prefers-reduced-motion: no-preference) {
  .hero-copy .status-dot { animation: buust-pulse 2.1s ease-out 2; }
  .title-spark { animation: buust-spark 2.2s ease-in-out 2; }
  .hero-art .round-spark { animation: buust-float 4.4s ease-in-out 1; }
}
@keyframes buust-sheen { from { left: -55%; } to { left: 130%; } }
@keyframes buust-pulse { 0% { box-shadow: 0 0 0 0 #c6ef0045; } 75%, 100% { box-shadow: 0 0 0 9px #c6ef0000; } }
@keyframes buust-spark { 0%, 100% { transform: rotate(12deg); } 50% { transform: rotate(32deg) scale(1.08); } }
@keyframes buust-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-7px); } }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
  .hero-art, .button:hover, .button:active, .button:focus-visible .arrow { transform: none; }
  .hero-art::before { display: none; }
}