/**
 * ARANOX Motion Design Framework
 * Release: AW2_146
 * Dependência: AW2_145 Design System Premium
 */

:root{
  --arx-motion-fast:180ms;
  --arx-motion-base:300ms;
  --arx-motion-slow:760ms;
  --arx-motion-xslow:1200ms;
  --arx-motion-ease:cubic-bezier(.2,.8,.2,1);
  --arx-motion-ease-out:cubic-bezier(.16,1,.3,1);
  --arx-motion-ease-in-out:cubic-bezier(.65,0,.35,1);
  --arx-motion-distance:32px;
  --arx-motion-scale:.965;
}

/* Base */
[data-arx-motion]{
  will-change:transform,opacity,filter;
}

[data-arx-motion="fade-up"],
.arx-motion-fade-up{
  opacity:0;
  transform:translate3d(0,var(--arx-motion-distance),0);
}

[data-arx-motion="fade-down"],
.arx-motion-fade-down{
  opacity:0;
  transform:translate3d(0,calc(var(--arx-motion-distance) * -1),0);
}

[data-arx-motion="fade-left"],
.arx-motion-fade-left{
  opacity:0;
  transform:translate3d(var(--arx-motion-distance),0,0);
}

[data-arx-motion="fade-right"],
.arx-motion-fade-right{
  opacity:0;
  transform:translate3d(calc(var(--arx-motion-distance) * -1),0,0);
}

[data-arx-motion="scale"],
.arx-motion-scale{
  opacity:0;
  transform:scale(var(--arx-motion-scale));
}

[data-arx-motion="blur"],
.arx-motion-blur{
  opacity:0;
  filter:blur(14px);
  transform:translate3d(0,18px,0) scale(.985);
}

[data-arx-motion].is-arx-visible,
.arx-motion-fade-up.is-arx-visible,
.arx-motion-fade-down.is-arx-visible,
.arx-motion-fade-left.is-arx-visible,
.arx-motion-fade-right.is-arx-visible,
.arx-motion-scale.is-arx-visible,
.arx-motion-blur.is-arx-visible{
  opacity:1;
  filter:none;
  transform:none;
  transition:
    opacity var(--arx-motion-slow) var(--arx-motion-ease-out),
    transform var(--arx-motion-slow) var(--arx-motion-ease-out),
    filter var(--arx-motion-slow) var(--arx-motion-ease-out);
}

/* Delay utilities */
[data-arx-delay="1"]{transition-delay:70ms!important}
[data-arx-delay="2"]{transition-delay:140ms!important}
[data-arx-delay="3"]{transition-delay:210ms!important}
[data-arx-delay="4"]{transition-delay:280ms!important}
[data-arx-delay="5"]{transition-delay:350ms!important}
[data-arx-delay="6"]{transition-delay:420ms!important}
[data-arx-delay="7"]{transition-delay:490ms!important}
[data-arx-delay="8"]{transition-delay:560ms!important}

/* Stagger automático */
[data-arx-stagger]>*{
  opacity:0;
  transform:translate3d(0,22px,0);
  transition:
    opacity var(--arx-motion-slow) var(--arx-motion-ease-out),
    transform var(--arx-motion-slow) var(--arx-motion-ease-out);
}

[data-arx-stagger].is-arx-visible>*{
  opacity:1;
  transform:none;
}

[data-arx-stagger].is-arx-visible>*:nth-child(2){transition-delay:70ms}
[data-arx-stagger].is-arx-visible>*:nth-child(3){transition-delay:140ms}
[data-arx-stagger].is-arx-visible>*:nth-child(4){transition-delay:210ms}
[data-arx-stagger].is-arx-visible>*:nth-child(5){transition-delay:280ms}
[data-arx-stagger].is-arx-visible>*:nth-child(6){transition-delay:350ms}
[data-arx-stagger].is-arx-visible>*:nth-child(7){transition-delay:420ms}
[data-arx-stagger].is-arx-visible>*:nth-child(8){transition-delay:490ms}

/* Pointer glow */
.arx-motion-pointer{
  position:relative;
  isolation:isolate;
  overflow:hidden;
}

.arx-motion-pointer::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  opacity:0;
  background:
    radial-gradient(
      circle at var(--arx-motion-x,50%) var(--arx-motion-y,50%),
      rgba(66,217,223,.14),
      transparent 30%
    );
  transition:opacity var(--arx-motion-base) ease;
}

.arx-motion-pointer:hover::before{
  opacity:1;
}

/* Tilt */
.arx-motion-tilt{
  transform-style:preserve-3d;
  transition:transform var(--arx-motion-base) var(--arx-motion-ease);
}

.arx-motion-tilt>*{
  transform:translateZ(18px);
}

/* Magnetic */
.arx-motion-magnetic{
  transition:transform var(--arx-motion-fast) var(--arx-motion-ease);
  will-change:transform;
}

/* Float */
.arx-motion-float{
  animation:arxMotionFloat 6s ease-in-out infinite;
}

.arx-motion-float--slow{
  animation-duration:9s;
}

.arx-motion-float--reverse{
  animation-direction:reverse;
}

/* Pulse */
.arx-motion-pulse{
  animation:arxMotionPulse 3.6s ease-in-out infinite;
}

/* Orbital */
.arx-motion-orbit{
  transform-origin:center;
  animation:arxMotionOrbit 18s linear infinite;
}

.arx-motion-orbit--reverse{
  animation-direction:reverse;
}

.arx-motion-orbit--slow{
  animation-duration:30s;
}

/* Shimmer */
.arx-motion-shimmer{
  position:relative;
  overflow:hidden;
}

.arx-motion-shimmer::after{
  content:"";
  position:absolute;
  inset:-120% -40%;
  pointer-events:none;
  background:linear-gradient(115deg,transparent 42%,rgba(255,255,255,.25) 50%,transparent 58%);
  transform:translateX(-60%) rotate(10deg);
  animation:arxMotionShimmer 5s ease-in-out infinite;
}

/* Connector */
.arx-motion-connector{
  position:relative;
  overflow:hidden;
}

.arx-motion-connector::after{
  content:"";
  position:absolute;
  left:0;
  top:50%;
  width:100%;
  height:2px;
  transform:translateY(-50%);
  background:
    linear-gradient(
      90deg,
      transparent,
      var(--arx-cyan-500),
      var(--arx-green-500),
      transparent
    );
  background-size:220% 100%;
  animation:arxMotionConnector 3.2s linear infinite;
}

/* Counter */
[data-arx-counter]{
  font-variant-numeric:tabular-nums;
}

/* Progress */
.arx-motion-progress{
  position:relative;
  overflow:hidden;
}

.arx-motion-progress::after{
  content:"";
  position:absolute;
  left:0;
  bottom:0;
  width:var(--arx-progress,0%);
  height:3px;
  background:linear-gradient(90deg,var(--arx-cyan-500),var(--arx-green-500));
  transition:width var(--arx-motion-xslow) var(--arx-motion-ease-out);
}

/* Scroll progress */
.arx-scroll-progress{
  position:fixed;
  top:0;
  left:0;
  z-index:9999;
  width:100%;
  height:3px;
  pointer-events:none;
  background:transparent;
}

.arx-scroll-progress__bar{
  width:0;
  height:100%;
  background:linear-gradient(90deg,var(--arx-cyan-500),var(--arx-blue-600),var(--arx-violet-500));
  box-shadow:0 0 18px rgba(66,217,223,.35);
  transform-origin:left center;
}

/* Section transition accent */
.arx-motion-section{
  position:relative;
}

.arx-motion-section::after{
  content:"";
  position:absolute;
  left:50%;
  bottom:0;
  width:min(78%,980px);
  height:1px;
  transform:translateX(-50%);
  background:linear-gradient(90deg,transparent,rgba(66,217,223,.24),transparent);
}

/* Automatic global enhancement: opt-in safe selectors */
:where(.tc-page,.rai-page,.esg-page,.sic-page,.compliance-page) :where(.tc-btn,.rai-btn,.arx-button){
  transition:
    transform var(--arx-motion-base) var(--arx-motion-ease),
    box-shadow var(--arx-motion-base) var(--arx-motion-ease),
    border-color var(--arx-motion-base) var(--arx-motion-ease);
}

:where(.tc-page,.rai-page,.esg-page,.sic-page,.compliance-page) :where(.tc-btn,.rai-btn,.arx-button):hover{
  transform:translateY(-3px);
}

/* Keyframes */
@keyframes arxMotionFloat{
  0%,100%{transform:translate3d(0,0,0)}
  50%{transform:translate3d(0,-12px,0)}
}

@keyframes arxMotionPulse{
  0%,100%{opacity:.55;transform:scale(.94)}
  50%{opacity:1;transform:scale(1.06)}
}

@keyframes arxMotionOrbit{
  to{transform:rotate(360deg)}
}

@keyframes arxMotionShimmer{
  0%,70%,100%{transform:translateX(-70%) rotate(10deg)}
  85%{transform:translateX(70%) rotate(10deg)}
}

@keyframes arxMotionConnector{
  to{background-position:220% 0}
}

@media(max-width:760px){
  :root{
    --arx-motion-distance:22px;
  }

  .arx-motion-tilt{
    transform:none!important;
  }
}

@media(prefers-reduced-motion:reduce){
  [data-arx-motion],
  [data-arx-stagger]>*,
  .arx-motion-fade-up,
  .arx-motion-fade-down,
  .arx-motion-fade-left,
  .arx-motion-fade-right,
  .arx-motion-scale,
  .arx-motion-blur{
    opacity:1!important;
    filter:none!important;
    transform:none!important;
    transition:none!important;
  }

  .arx-motion-float,
  .arx-motion-pulse,
  .arx-motion-orbit,
  .arx-motion-shimmer::after,
  .arx-motion-connector::after{
    animation:none!important;
  }

  .arx-scroll-progress{
    display:none;
  }
}
