/*! MotionKit 1.0.0 | efeitos: reveal, stagger, hero, tilt, image3d, parallax, zoom, float, magnetic | gerado por build.mjs */
/*!
 * MotionKit — núcleo (CSS)
 * Tokens de movimento, presets e o mecanismo de revelação usado por
 * Reveal, StaggerReveal e HeroMotion. Obrigatório.
 *
 * Personalize por cliente sobrescrevendo as variáveis no seu CSS:
 *   :root { --mk-ease: cubic-bezier(.65,0,.35,1); --mk-dur: 650ms; }
 */

:root {
  --mk-intensity: 1;                       /* escala geral de distâncias e ângulos */
  --mk-duration-scale: 1;                  /* escala geral de durações */
  --mk-ease: cubic-bezier(.22, .7, .2, 1); /* curva padrão ("suave") */
  --mk-dur: calc(800ms * var(--mk-duration-scale));
  --mk-perspective: 1000px;
  --mk-glare-color: 255 255 255;           /* cor do reflexo do TiltCard (R G B) */
  --mk-glare-strength: .28;
}

/* Presets: <html data-mk-preset="sutil | equilibrado | expressivo"> */
:root[data-mk-preset="sutil"]      { --mk-intensity: .55; --mk-duration-scale: .9; }
:root[data-mk-preset="equilibrado"]{ --mk-intensity: 1;   --mk-duration-scale: 1; }
:root[data-mk-preset="expressivo"] { --mk-intensity: 1.6; --mk-duration-scale: 1.15; }

/* ---------- Revelação ----------
 * O conteúdo só é escondido quando o JS já marcou <html class="mk-js">.
 * Sem JS, tudo aparece normalmente.
 */
/* Se o elemento animado já tiver "transition" no CSS do projeto, inclua a variável:
 *   .card { transition: var(--mk-transition, opacity 0s), box-shadow .4s; }
 * (sem isso, a regra do projeto substitui a da biblioteca e a entrada perde a suavidade) */
.mk-r {
  --mk-transition:
    opacity var(--mk-dur) var(--mk-ease) var(--mk-delay, 0ms),
    transform var(--mk-dur) var(--mk-ease) var(--mk-delay, 0ms),
    filter var(--mk-dur) var(--mk-ease) var(--mk-delay, 0ms);
  transition: var(--mk-transition);
}

.mk-js [data-mk~="reveal"]:not(.mk-in),
.mk-js [data-mk~="stagger"] > :not(.mk-in),
.mk-js [data-mk~="hero"] [data-mk-step]:not(.mk-in) {
  opacity: 0;
  transform: var(--mk-from, translate3d(0, 24px, 0));
  filter: var(--mk-from-filter, none);
}

/* Rede de segurança: se o JS da biblioteca não carregar em 3 s, o conteúdo aparece. */
.mk-js:not(.mk-ready) [data-mk~="reveal"]:not(.mk-in),
.mk-js:not(.mk-ready) [data-mk~="stagger"] > :not(.mk-in),
.mk-js:not(.mk-ready) [data-mk~="hero"] [data-mk-step]:not(.mk-in) {
  animation: mk-failsafe .4s 3s forwards;
}
@keyframes mk-failsafe { to { opacity: 1; transform: none; filter: none; } }

/* ---------- Movimento reduzido ----------
 * Respeita a preferência do sistema e o modo forçado <html data-mk-motion="off">.
 */
@media (prefers-reduced-motion: reduce) {
  .mk-js [data-mk~="reveal"]:not(.mk-in),
  .mk-js [data-mk~="stagger"] > :not(.mk-in),
  .mk-js [data-mk~="hero"] [data-mk-step]:not(.mk-in) { opacity: 1; transform: none; filter: none; }
  .mk-r { transition: none; }
}
:root[data-mk-motion="off"] [data-mk~="reveal"]:not(.mk-in),
:root[data-mk-motion="off"] [data-mk~="stagger"] > :not(.mk-in),
:root[data-mk-motion="off"] [data-mk~="hero"] [data-mk-step]:not(.mk-in) { opacity: 1; transform: none; filter: none; }
:root[data-mk-motion="off"] .mk-r { transition: none; }

/*!
 * MotionKit — estilos dos efeitos
 * Cada bloco corresponde a um módulo JS. Se não usar um módulo, pode
 * remover o bloco (ou usar o build para gerar só o que precisa).
 * Seletores com :where() têm especificidade zero: o CSS do projeto sempre vence.
 */

/* @module tilt -------------------------------------------------- */
:where(.mk-tilt) { transform-origin: center; }
:where(.mk-tilt--3d) { transform-style: preserve-3d; }
.mk-tilt--active { transition: none !important; }
:where(.mk-tilt--glare) { position: relative; }
.mk-glare {
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  opacity: 0;
  background: radial-gradient(circle at var(--mk-gx, 50%) var(--mk-gy, 50%),
    rgb(var(--mk-glare-color) / var(--mk-glare-strength)), transparent 60%);
  transition: opacity .4s ease;
}
.mk-tilt--active .mk-glare { opacity: 1; }
/* Teclado / toque: destaque estável, sem inclinação */
:where([data-mk~="tilt"]) { transition: translate .35s var(--mk-ease); }
:where([data-mk~="tilt"]):focus-within { translate: 0 -4px; }

/* @module image3d ----------------------------------------------- */
:where(.mk-image3d) { perspective: none; }
:where(.mk-image3d) > :first-child {
  transform-style: preserve-3d;
  transform-origin: 50% 50%;
  will-change: transform;
  backface-visibility: hidden;
}

/* @module parallax ---------------------------------------------- */
:where(.mk-parallax) { overflow: hidden; }
:where(.mk-parallax) > :first-child { will-change: transform; }
:where(.mk-parallax) > img,
:where(.mk-parallax) > picture > img,
:where(.mk-parallax) > video { width: 100%; height: 100%; object-fit: cover; }

/* @module zoom -------------------------------------------------- */
:where(.mk-zoom) { overflow: hidden; }
.mk-zoom--inview > :first-child {
  transform: scale(var(--mk-zoom-from, 1.12));
  transition: transform var(--mk-zoom-dur, 1600ms) var(--mk-ease);
}
.mk-zoom--inview.mk-zoom--in > :first-child { transform: scale(var(--mk-zoom-to, 1)); }
.mk-zoom--hover > :first-child { transition: transform .7s var(--mk-ease); }
.mk-zoom--hover:hover > :first-child,
.mk-zoom--hover:focus-within > :first-child { transform: scale(var(--mk-zoom-hover, 1.06)); }

/* @module float ------------------------------------------------- */
[data-mk~="float"] {
  animation: mk-float var(--mk-float-dur, 6s) ease-in-out var(--mk-float-delay, 0s) infinite alternate;
}
[data-mk~="float"].mk-paused,
.mk-scrolling [data-mk~="float"] { animation-play-state: paused; }
@keyframes mk-float {
  from {
    translate: calc(var(--mk-float-x, 0px) * -1) calc(var(--mk-float-y, 12px) * -1);
    rotate: calc(var(--mk-float-r, 2deg) * -1);
  }
  to {
    translate: var(--mk-float-x, 0px) var(--mk-float-y, 12px);
    rotate: var(--mk-float-r, 2deg);
  }
}

/* @module magnetic ---------------------------------------------- */
:where(.mk-magnetic) { transition: translate .6s cubic-bezier(.3, 1.5, .5, 1); }
:where(.mk-magnetic--active) { transition-duration: .18s; transition-timing-function: ease-out; }
:where(.mk-magnetic) [data-mk-inner] { display: inline-block; transition: translate .6s cubic-bezier(.3, 1.5, .5, 1); }

/* ---------- Movimento reduzido ---------- */
@media (prefers-reduced-motion: reduce) {
  [data-mk~="float"], .mk-enter { animation: none !important; }
  .mk-zoom--inview > :first-child { transform: none; transition: none; }
  ::view-transition-group(*), ::view-transition-old(*), ::view-transition-new(*) { animation: none !important; }
}
:root[data-mk-motion="off"] [data-mk~="float"],
:root[data-mk-motion="off"] .mk-enter { animation: none !important; }
:root[data-mk-motion="off"] .mk-zoom--inview > :first-child { transform: none; transition: none; }