/* =========================================================
   Box Star — Animações
   Baseadas em transform/opacity para performance.
   Respeita prefers-reduced-motion.
   ========================================================= */

@keyframes float-y {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-14px); }
}

@keyframes pulse-dot {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.5; transform: scale(0.85); }
}

@keyframes pulse-ring {
    0% { box-shadow: 0 0 0 0 rgba(31, 185, 85, 0.5); }
    100% { box-shadow: 0 0 0 18px rgba(31, 185, 85, 0); }
}

@keyframes cta-glow-pulse {
    0%, 100% { box-shadow: 0 8px 30px rgba(139, 46, 255, 0.35), 0 0 0 0 rgba(139, 46, 255, 0.5); }
    50% { box-shadow: 0 8px 40px rgba(139, 46, 255, 0.6), 0 0 0 9px rgba(139, 46, 255, 0); }
}

@keyframes scroll-line {
    0% { transform: scaleY(0); transform-origin: top; opacity: 1; }
    50% { transform: scaleY(1); transform-origin: top; }
    51% { transform-origin: bottom; }
    100% { transform: scaleY(0); transform-origin: bottom; opacity: 0.4; }
}

@keyframes spin-slow {
    from { transform: translateX(-50%) rotate(0deg); }
    to { transform: translateX(-50%) rotate(360deg); }
}

@keyframes spin-slow-reverse {
    from { transform: translateX(-50%) rotate(360deg); }
    to { transform: translateX(-50%) rotate(0deg); }
}

@keyframes marquee {
    from { transform: translate3d(-50%, 0, 0); }
    to { transform: translate3d(0, 0, 0); }
}

@keyframes fade-up {
    from { opacity: 0; transform: translateY(28px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes fade-in {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes scale-in {
    from { opacity: 0; transform: scale(0.92); }
    to { opacity: 1; transform: scale(1); }
}

@keyframes border-flow {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

@keyframes shimmer {
    0% { background-position: -200% 0; }
    100% { background-position: 200% 0; }
}

@keyframes cursor-blink {
    0%, 49% { opacity: 1; }
    50%, 100% { opacity: 0; }
}

@keyframes footer-signal-scan {
    from { transform: translateX(0); }
    to { transform: translateX(340%); }
}

@keyframes footer-signal-pulse {
    0% { left: -14px; opacity: 0; }
    3%, 91% { opacity: 1; }
    96%, 100% { left: calc(100% + 14px); opacity: 0; }
}

@keyframes footer-signal-glitch {
    0%, 2%, 13%, 32%, 47%, 66%, 82%, 100% { opacity: 0; transform: translateX(0) scaleX(0.12); }
    3% { opacity: 1; transform: translateX(-20px) scaleX(1.28); }
    5% { opacity: 0.16; transform: translateX(14px) scaleX(0.62); }
    7% { opacity: 0.95; transform: translateX(-8px) scaleX(1.08); }
    9% { opacity: 0; transform: translateX(7px) scaleX(0.24); }
    34% { opacity: 0.88; transform: translateX(17px) scaleX(1.4); }
    37% { opacity: 0.12; transform: translateX(-12px) scaleX(0.5); }
    40% { opacity: 1; transform: translateX(6px) scaleX(1.14); }
    43% { opacity: 0; transform: translateX(-4px) scaleX(0.18); }
    68% { opacity: 1; transform: translateX(-16px) scaleX(1.32); }
    71% { opacity: 0.2; transform: translateX(11px) scaleX(0.58); }
    74% { opacity: 0.92; transform: translateX(-5px) scaleX(1.06); }
    77% { opacity: 0; transform: translateX(8px) scaleX(0.2); }
    84% { opacity: 0.82; transform: translateX(12px) scaleX(1.18); }
    87% { opacity: 0; transform: translateX(-10px) scaleX(0.3); }
}

@keyframes footer-signal-aura {
    0%, 100% { opacity: 0.24; transform: scaleY(0.72); }
    50% { opacity: 0.56; transform: scaleY(1); }
}

@keyframes footer-signal-noise {
    0%, 100% { opacity: 0.06; transform: translateX(-7px); }
    50% { opacity: 0.2; transform: translateX(7px); }
}

@keyframes footer-rail-flicker {
    0%, 100% { opacity: 0.54; }
    7%, 10%, 39%, 43%, 68%, 73% { opacity: 1; }
    8%, 41%, 71% { opacity: 0.18; }
}

@keyframes footer-rail-disruption {
    0%, 100% { opacity: 0.9; transform: translateX(0) scaleX(1); filter: brightness(1); }
    50% { opacity: 1; transform: translateX(0) scaleX(1); filter: brightness(1.18); }
}

@keyframes footer-beam-blink {
    0%, 46%, 54%, 78%, 86%, 100% { opacity: 1; }
    47%, 51%, 79%, 82% { opacity: 0; }
    52%, 83% { opacity: 0.26; }
}

@keyframes footer-rgb-split {
    0%, 100% { opacity: 0.28; transform: translateX(-2px); }
    50% { opacity: 0.58; transform: translateX(2px); }
}

@keyframes footer-shard-drop {
    0%, 7%, 22%, 49%, 65%, 87%, 100% { opacity: 0; transform: translateX(0) scaleY(0.08); }
    9% { opacity: 0.88; transform: translateX(-8px) scaleY(0.88); }
    11% { opacity: 0.22; transform: translateX(7px) scaleY(0.42); }
    13% { opacity: 0.96; transform: translateX(-3px) scaleY(1); }
    16% { opacity: 0.34; transform: translateX(5px) scaleY(0.72); }
    19% { opacity: 0; transform: translateX(-4px) scaleY(0.18); }
    51% { opacity: 0.78; transform: translateX(9px) scaleY(0.84); }
    54% { opacity: 0.18; transform: translateX(-6px) scaleY(0.5); }
    57% { opacity: 1; transform: translateX(3px) scaleY(1); }
    61% { opacity: 0; transform: translateX(-5px) scaleY(0.12); }
    89% { opacity: 0.9; transform: translateX(-7px) scaleY(0.92); }
    92% { opacity: 0.28; transform: translateX(8px) scaleY(0.58); }
    95% { opacity: 0.86; transform: translateX(-2px) scaleY(1); }
    98% { opacity: 0; transform: translateX(5px) scaleY(0.14); }
}

@keyframes footer-cyber-flicker {
    0%, 12%, 17%, 38%, 44%, 66%, 73%, 91%, 100% { opacity: 0.12; filter: brightness(1); }
    13% { opacity: 0.55; filter: brightness(1.8); }
    15% { opacity: 0.04; filter: brightness(0.7); }
    39% { opacity: 0.72; filter: brightness(2); }
    42% { opacity: 0.18; filter: brightness(1.2); }
    67% { opacity: 0.6; filter: brightness(1.7); }
    70% { opacity: 0; filter: brightness(0.6); }
    92% { opacity: 0.68; filter: brightness(1.9); }
    95% { opacity: 0.16; filter: brightness(1); }
}

@keyframes footer-cyber-sweep {
    0%, 5% { opacity: 0; transform: translateX(0) skewX(-8deg); }
    9% { opacity: 0.78; }
    47% { opacity: 0.42; transform: translateX(198%) skewX(7deg); }
    51% { opacity: 0; transform: translateX(212%) skewX(-5deg); }
    63% { opacity: 0; transform: translateX(212%) skewX(-5deg); }
    67% { opacity: 0.66; }
    96% { opacity: 0.32; transform: translateX(402%) skewX(6deg); }
    100% { opacity: 0; transform: translateX(410%) skewX(-4deg); }
}

@keyframes footer-cyber-tear {
    0%, 18%, 24%, 48%, 54%, 77%, 84%, 100% { opacity: 0; transform: translateX(0) skewX(-8deg); }
    19% { opacity: 0.76; transform: translateX(-18px) skewX(-13deg); }
    21% { opacity: 0.18; transform: translateX(14px) skewX(7deg); }
    23% { opacity: 0.62; transform: translateX(-6px) skewX(-4deg); }
    49% { opacity: 0.82; transform: translateX(24px) skewX(11deg); }
    51% { opacity: 0.22; transform: translateX(-12px) skewX(-9deg); }
    53% { opacity: 0.7; transform: translateX(7px) skewX(5deg); }
    78% { opacity: 0.9; transform: translateX(-21px) skewX(-12deg); }
    81% { opacity: 0.26; transform: translateX(16px) skewX(8deg); }
    83% { opacity: 0.68; transform: translateX(-5px) skewX(-3deg); }
}

@keyframes footer-glitch-flash {
    0%, 11%, 18%, 33%, 41%, 57%, 65%, 78%, 87%, 100% { opacity: 0; transform: translateX(0) scaleY(0.18); filter: brightness(1); }
    12% { opacity: 0.92; transform: translateX(-19px) scaleY(1); filter: brightness(1.9); }
    14% { opacity: 0.16; transform: translateX(14px) scaleY(0.46); filter: brightness(0.8); }
    16% { opacity: 0.74; transform: translateX(-6px) scaleY(0.86); filter: brightness(1.6); }
    34% { opacity: 0.84; transform: translateX(23px) scaleY(0.74); filter: brightness(2); }
    36% { opacity: 0.1; transform: translateX(-17px) scaleY(0.34); filter: brightness(0.7); }
    39% { opacity: 0.68; transform: translateX(8px) scaleY(1); filter: brightness(1.7); }
    58% { opacity: 1; transform: translateX(-25px) scaleY(0.9); filter: brightness(2.2); }
    61% { opacity: 0.22; transform: translateX(18px) scaleY(0.5); filter: brightness(0.9); }
    63% { opacity: 0.72; transform: translateX(-7px) scaleY(0.82); filter: brightness(1.8); }
    79% { opacity: 0.88; transform: translateX(21px) scaleY(1); filter: brightness(2.1); }
    82% { opacity: 0.12; transform: translateX(-14px) scaleY(0.38); filter: brightness(0.7); }
    85% { opacity: 0.66; transform: translateX(5px) scaleY(0.76); filter: brightness(1.6); }
}

@keyframes footer-status-pulse {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.6; transform: scale(0.76); }
}

/* ---------------------------------------------------------
   Scroll reveal (ativado via IntersectionObserver em JS)
   --------------------------------------------------------- */
[data-reveal] {
    opacity: 0;
    transform: translateY(32px);
    transition: opacity 0.8s var(--ease), transform 0.8s var(--ease);
    transition-delay: var(--reveal-delay, 0s);
}
[data-reveal].is-visible {
    opacity: 1;
    transform: translateY(0);
}
[data-reveal="scale"] { transform: scale(0.94); }
[data-reveal="scale"].is-visible { transform: scale(1); }
[data-reveal="left"] { transform: translateX(-36px); }
[data-reveal="left"].is-visible { transform: translateX(0); }
[data-reveal="right"] { transform: translateX(36px); }
[data-reveal="right"].is-visible { transform: translateX(0); }

/* Contadores numéricos */
.is-counting .counter-number { animation: fade-in 0.4s ease; }

/* Tilt 3D nos cards de serviço (JS aplica --rx/--ry) */
.tilt-card {
    transform: perspective(900px) rotateX(var(--ry, 0deg)) rotateY(var(--rx, 0deg)) translateZ(0);
}

/* Partículas em canvas */
.particles-canvas { position: absolute; inset: 0; z-index: 0; pointer-events: none; }

/* Loading/skeleton simples usado no calendário */
.skeleton {
    background: linear-gradient(90deg, rgba(255,255,255,0.03) 25%, rgba(255,255,255,0.07) 37%, rgba(255,255,255,0.03) 63%);
    background-size: 400% 100%;
    animation: shimmer 1.4s ease infinite;
    border-radius: var(--radius-sm);
}

/* ---------------------------------------------------------
   Acessibilidade — respeita prefers-reduced-motion
   --------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.001ms !important;
        scroll-behavior: auto !important;
    }
    [data-reveal] { opacity: 1 !important; transform: none !important; }
    .hero-logo { animation: none !important; }
    .footer-signal::before { opacity: 0.58 !important; transform: none !important; }
    .footer-signal::after { opacity: 0.28 !important; transform: none !important; }
    /* Exceções solicitadas: o Hero, a faixa tecnológica e o glitch do rodapé continuam animando. */
    .footer-signal__cyber {
        animation-duration: 2.6s !important;
        animation-iteration-count: infinite !important;
    }
    .footer-signal__cyber::before {
        animation-duration: 4.8s !important;
        animation-iteration-count: infinite !important;
    }
    .footer-signal__cyber::after {
        animation-duration: 2.15s !important;
        animation-iteration-count: infinite !important;
    }
    .footer-signal__flash {
        animation-duration: 2.35s !important;
        animation-iteration-count: infinite !important;
    }
    .footer-signal__rail {
        animation-duration: 4.8s !important;
        animation-iteration-count: infinite !important;
    }
    .footer-signal__beam {
        animation-duration: 5.6s !important;
        animation-iteration-count: infinite !important;
    }
    .footer-signal__pulse {
        animation-duration: 5.6s !important;
        animation-iteration-count: infinite !important;
    }
    .footer-signal__fragment {
        animation-duration: 2.65s !important;
        animation-iteration-count: infinite !important;
    }
    .footer-signal__shard {
        animation-duration: var(--shard-speed) !important;
        animation-iteration-count: infinite !important;
    }
    .hero-rotator { transition-duration: 0.35s !important; }
    .hero-rotator__cursor {
        animation-duration: 0.9s !important;
        animation-iteration-count: infinite !important;
    }
    .tech-marquee__track {
        animation-duration: var(--marquee-duration, 34s) !important;
        animation-iteration-count: infinite !important;
    }
    .floating-card {
        animation-duration: 7s !important;
        animation-iteration-count: infinite !important;
    }
}