/* ═════════════════════════════════════════════════════════════
   SANBERNARDA.COM — AUTONOMOUS MICRO-ANIMATIONS SUITE (2026)
   Suíte Completa de Micro-Animações Autônomas Contínuas (Loops):
   • Varreduras luminosas de reflexo (Sheen Sweeps)
   • Levitação flutuante orgânica de cards (Ambient Card Float)
   • Pulso atmosférico no acento do hero ("Velocidade")
   • Respiração e brilho no monograma da marca (Logo Core Shimmer)
   • Radar / Sonar contínuo em indicadores de status
   • Pulso luminoso em métricas e ROI
   • Scanner cibernético ambiente na barra de prompt
   • Flutuação idle no mascote assistente
   • Deriva suave na atmosfera e HUDs ambientes
   • Micro-onda de iluminação nas tags de tecnologia
   ═════════════════════════════════════════════════════════════ */

/* ── 1. KEYFRAMES DE ANIMAÇÕES CONTÍNUAS ───────────────────── */

/* 1.1 Varredura de reflexo / feixe de luz em loop (botões e CTAs) */
@keyframes cc-sheen-sweep {
  0% {
    transform: translateX(-160%) skewX(-20deg);
    opacity: 0;
  }
  2% {
    opacity: 0.95;
  }
  24% {
    transform: translateX(260%) skewX(-20deg);
    opacity: 0.95;
  }
  27%, 100% {
    transform: translateX(260%) skewX(-20deg);
    opacity: 0;
  }
}

/* 1.2 Varredura suave para cards e superfícies maiores */
@keyframes cc-sheen-card-sweep {
  0% {
    transform: translateX(-180%) skewX(-18deg);
    opacity: 0;
  }
  3% {
    opacity: 0.55;
  }
  32% {
    transform: translateX(280%) skewX(-18deg);
    opacity: 0.55;
  }
  35%, 100% {
    transform: translateX(280%) skewX(-18deg);
    opacity: 0;
  }
}

/* 1.3 Respiração de brilho no acento principal do Hero ("Velocidade") */
@keyframes cc-accent-breathe {
  0%, 100% {
    box-shadow: 0 0 0 rgba(255, 92, 20, 0);
    filter: brightness(1);
  }
  50% {
    box-shadow: 0 0 30px rgba(255, 92, 20, 0.5), 0 0 60px rgba(255, 92, 20, 0.25);
    filter: brightness(1.1) saturate(1.15);
  }
}

/* 1.4 Brilho contínuo no logo da marca ("Core") */
@keyframes cc-logo-glow {
  0%, 100% {
    text-shadow: 0 0 0 rgba(255, 92, 20, 0);
    filter: brightness(1);
  }
  50% {
    text-shadow: 0 0 16px rgba(255, 92, 20, 0.75), 0 0 32px rgba(255, 92, 20, 0.4);
    filter: brightness(1.15);
  }
}

/* 1.5 Levitação flutuante orgânica — Fase A (Cards ímpares) */
@keyframes cc-float-subtle-a {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-5px);
  }
}

/* 1.6 Levitação flutuante orgânica — Fase B (Cards pares) */
@keyframes cc-float-subtle-b {
  0%, 100% {
    transform: translateY(-4px);
  }
  50% {
    transform: translateY(1px);
  }
}

/* 1.7 Radar Sonar Ripple — Duplo anel contínuo */
@keyframes cc-sonar-ripple {
  0% {
    transform: scale(0.95);
    box-shadow: 0 0 0 0 rgba(255, 92, 20, 0.85);
  }
  60% {
    transform: scale(1.1);
    box-shadow: 0 0 0 8px rgba(255, 92, 20, 0);
  }
  100% {
    transform: scale(0.95);
    box-shadow: 0 0 0 0 rgba(255, 92, 20, 0);
  }
}

/* 1.8 Micro pulso de borda/brilho em kickers e badges */
@keyframes cc-badge-glow-pulse {
  0%, 100% {
    border-color: rgba(255, 92, 20, 0.3);
    box-shadow: 0 0 0 rgba(255, 92, 20, 0);
  }
  50% {
    border-color: rgba(255, 92, 20, 0.75);
    box-shadow: 0 0 14px rgba(255, 92, 20, 0.28);
  }
}

/* 1.9 Pulso suave nos blocos de métricas e ROI */
@keyframes cc-metrics-glow {
  0%, 100% {
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.12);
    border-color: rgba(255, 255, 255, 0.08);
  }
  50% {
    box-shadow: 0 8px 24px rgba(255, 92, 20, 0.18), 0 0 1px rgba(255, 92, 20, 0.5);
    border-color: rgba(255, 92, 20, 0.4);
  }
}

/* 1.10 Scanner cibernético na barra de prompt */
@keyframes cc-cyber-scan {
  0%, 100% {
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.25), 0 0 0 1px rgba(255, 92, 20, 0.15);
  }
  50% {
    box-shadow: 0 8px 32px rgba(255, 92, 20, 0.2), 0 0 0 1px rgba(255, 92, 20, 0.5), 0 0 24px rgba(255, 92, 20, 0.12);
  }
}

/* 1.11 Flutuação e respiração do mascote assistente */
@keyframes cc-mascot-hover-idle {
  0%, 100% {
    transform: translateY(0) rotate(0deg);
  }
  50% {
    transform: translateY(-6px) rotate(1.2deg);
  }
}

/* 1.12 Deriva atmosférica da aurora de fundo */
@keyframes cc-aurora-drift {
  0%, 100% {
    opacity: 0.5;
    transform: scale(1);
  }
  50% {
    opacity: 0.75;
    transform: scale(1.04);
  }
}

/* 1.13 Micro-nudge do scroll indicator */
@keyframes cc-scroll-nudge {
  0%, 20%, 50%, 80%, 100% {
    transform: translateY(0);
  }
  40% {
    transform: translateY(6px);
  }
  60% {
    transform: translateY(2px);
  }
}

/* 1.14 Respiração ambiente dos HUDs */
@keyframes cc-hud-breathe {
  0%, 100% {
    opacity: 0.35;
  }
  50% {
    opacity: 0.65;
  }
}

/* ── 2. BRILHO / REFLEXO EM BOTÕES (LOOP CONTÍNUO) ─────────── */

html body :is(
  .btn-nav-cta, .btn-hero, .btn-cta, .btn-solid,
  .signup-strip__btn, .mobile-menu__cta,
  .nav-account__btn--primary, .ctaform-submit, .ctaform__submit,
  .ctaform-fasttrack__btn, .probsol-cta-bar__btn,
  .pc-btn-cta--featured, .prompt-bar__send, .cc-sheen-btn
):not(.btn-nav-cta--ghost):not(.btn-hero-sec),
html.cc-brut body :is(
  .btn-nav-cta, .btn-hero, .btn-cta, .btn-solid,
  .signup-strip__btn, .mobile-menu__cta,
  .nav-account__btn--primary, .ctaform-submit, .ctaform__submit,
  .ctaform-fasttrack__btn, .probsol-cta-bar__btn,
  .pc-btn-cta--featured, .prompt-bar__send, .cc-sheen-btn
):not(.btn-nav-cta--ghost):not(.btn-hero-sec),
html.cc-brut body #main-content :is(
  .btn-nav-cta, .btn-hero, .btn-cta
):not(.btn-nav-cta--ghost):not(.btn-hero-sec) {
  position: relative !important;
  overflow: hidden !important;
  isolation: isolate !important;
}

html body :is(
  .btn-nav-cta, .btn-hero, .btn-cta, .btn-solid,
  .signup-strip__btn, .mobile-menu__cta,
  .nav-account__btn--primary, .ctaform-submit, .ctaform__submit,
  .ctaform-fasttrack__btn, .probsol-cta-bar__btn,
  .pc-btn-cta--featured, .prompt-bar__send, .cc-sheen-btn
):not(.btn-nav-cta--ghost):not(.btn-hero-sec)::after,
html.cc-brut body :is(
  .btn-nav-cta, .btn-hero, .btn-cta, .btn-solid,
  .signup-strip__btn, .mobile-menu__cta,
  .nav-account__btn--primary, .ctaform-submit, .ctaform__submit,
  .ctaform-fasttrack__btn, .probsol-cta-bar__btn,
  .pc-btn-cta--featured, .prompt-bar__send, .cc-sheen-btn
):not(.btn-nav-cta--ghost):not(.btn-hero-sec)::after,
html.cc-brut body #main-content :is(
  .btn-nav-cta, .btn-hero, .btn-cta
):not(.btn-nav-cta--ghost):not(.btn-hero-sec)::after {
  content: '' !important;
  display: block !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  background: linear-gradient(
    105deg,
    transparent 15%,
    rgba(255, 255, 255, 0.15) 36%,
    rgba(255, 255, 255, 0.85) 50%,
    rgba(255, 255, 255, 0.15) 64%,
    transparent 85%
  ) !important;
  pointer-events: none !important;
  z-index: 1 !important;
  will-change: transform, opacity !important;
  animation: cc-sheen-sweep 3.8s cubic-bezier(0.25, 1, 0.5, 1) infinite !important;
  transform: translateX(-160%) skewX(-20deg) !important;
}

.btn-nav-cta.btn-hero::after {
  animation-delay: 0.6s !important;
}
.signup-strip__btn::after {
  animation-delay: 1.4s !important;
}
.prompt-bar__send::after {
  animation-delay: 2.2s !important;
}

/* Conteúdo interno garantido acima do reflexo */
html body :is(
  .btn-nav-cta, .btn-hero, .btn-cta, .btn-solid,
  .signup-strip__btn, .mobile-menu__cta,
  .nav-account__btn--primary, .ctaform-submit, .ctaform__submit,
  .ctaform-fasttrack__btn, .probsol-cta-bar__btn,
  .pc-btn-cta--featured, .prompt-bar__send, .cc-sheen-btn
) :is(.btn-inner, span, i, svg) {
  position: relative !important;
  z-index: 2 !important;
}

/* ── 3. ACENTO VIVO NO HERO & LOGO DA MARCA ────────────────── */

/* Palavra "Velocidade" no título */
html.cc-brut body .hero-title-v3 .hero-line.accent,
html.cc-brut body .hero-title-v3 .accent,
.hero-title-v3 .accent {
  animation: cc-accent-breathe 4.5s ease-in-out infinite !important;
  display: inline-block;
  will-change: filter, box-shadow;
}

/* Logo "Core" */
.logo-core,
.logo .logo-core {
  animation: cc-logo-glow 5.5s ease-in-out infinite !important;
  display: inline-block;
  will-change: text-shadow, filter;
}

/* ── 4. LEVITAÇÃO CONTÍNUA EM CARDS DE DESTAQUE ────────────── */

.probsol-card.psc-card-v2:nth-child(odd),
.pricing-card--featured {
  animation: cc-float-subtle-a 6s ease-in-out infinite !important;
  will-change: transform;
}

.probsol-card.psc-card-v2:nth-child(even) {
  animation: cc-float-subtle-b 6.8s ease-in-out infinite !important;
  animation-delay: 0.8s !important;
  will-change: transform;
}

/* ── 5. PULSO CONTÍNUO EM KICKERS E BADGES ─────────────────── */

.psc-head__kicker,
.hero-kicker,
.techstack-kicker,
.cs2-kicker,
.sec-head__label {
  animation: cc-badge-glow-pulse 4.8s ease-in-out infinite !important;
  will-change: border-color, box-shadow;
}

.psc-head__kicker::after,
.psc-col__head-badge::after,
.hero-kicker::after,
.techstack-kicker::after,
.cc-sheen-badge::after {
  content: '' !important;
  display: block !important;
  position: absolute !important;
  top: -20% !important;
  left: 0 !important;
  width: 60% !important;
  height: 140% !important;
  background: linear-gradient(
    90deg,
    transparent 0%,
    rgba(255, 255, 255, 0.45) 50%,
    transparent 100%
  ) !important;
  pointer-events: none !important;
  z-index: 1 !important;
  animation: cc-sheen-sweep 5.2s cubic-bezier(0.22, 1, 0.36, 1) infinite !important;
  animation-delay: 1.8s !important;
  transform: translateX(-180%) skewX(-20deg) !important;
}

/* ── 6. PULSO EM MÉTRICAS & BARRA DE PROMPT CYBER-SCAN ─────── */

.psc-metrics,
.metric-box,
.proof-metric {
  animation: cc-metrics-glow 5s ease-in-out infinite !important;
  will-change: border-color, box-shadow;
}

.prompt-bar,
.cc-prompt-dock.is-visible,
.prompt-bar-wrap {
  animation: cc-cyber-scan 6s ease-in-out infinite !important;
  will-change: box-shadow;
}

.cc-prompt-dock.is-hidden,
.cc-prompt-dock:not(.is-visible) {
  animation: none !important;
  will-change: auto !important;
}

/* ── 7. MASCOTE ASSISTENTE EM FLUTAÇÃO IDLE ────────────────── */

.robo-companion {
  animation: cc-mascot-hover-idle 4.2s ease-in-out infinite !important;
  will-change: transform;
}

.cc-prompt-dock__mascot {
  animation: none !important;
  transform: none !important;
  will-change: auto !important;
}

/* ── 8. DERIVA ATMOSFÉRICA & STATUS RADAR ──────────────────── */

.hero-atmosphere,
.ps-atmosphere {
  animation: cc-aurora-drift 12s ease-in-out infinite !important;
  will-change: transform, opacity;
}

.status-dot,
.badge-dot,
.live-dot,
.robo-status-dot,
.nav-available__dot,
.radar-blip {
  animation: cc-sonar-ripple 2.4s cubic-bezier(0.4, 0, 0.6, 1) infinite !important;
  display: inline-block !important;
  border-radius: 50% !important;
}

.hero-scroll-cta {
  animation: cc-scroll-nudge 3s ease infinite !important;
}

.ahud {
  animation: cc-hud-breathe 6s ease-in-out infinite !important;
}

/* ── 9. MICRO-INTERAÇÕES DE HOVER E CLIQUE ─────────────────── */

html body :is(
  .btn-nav-cta, .btn-hero, .btn-cta, .btn-solid,
  .signup-strip__btn, .mobile-menu__cta,
  .nav-account__btn--primary, .ctaform-submit, .ctaform__submit,
  .ctaform-fasttrack__btn, .probsol-cta-bar__btn,
  .pc-btn-cta--featured, .prompt-bar__send, .cc-sheen-btn
):not(.btn-nav-cta--ghost):not(.btn-hero-sec):hover::after,
html.cc-brut body :is(
  .btn-nav-cta, .btn-hero, .btn-cta, .btn-solid,
  .signup-strip__btn, .mobile-menu__cta,
  .nav-account__btn--primary, .ctaform-submit, .ctaform__submit,
  .ctaform-fasttrack__btn, .probsol-cta-bar__btn,
  .pc-btn-cta--featured, .prompt-bar__send, .cc-sheen-btn
):not(.btn-nav-cta--ghost):not(.btn-hero-sec):hover::after,
html.cc-brut body #main-content :is(
  .btn-nav-cta, .btn-hero, .btn-cta
):not(.btn-nav-cta--ghost):not(.btn-hero-sec):hover::after {
  animation: cc-sheen-sweep 1.1s cubic-bezier(0.2, 0.8, 0.2, 1) infinite !important;
}

.btn-nav-cta i,
.btn-hero i,
.btn-inner i,
.btn-inner svg,
.psc-card-cta i,
.proof__roster-cta i,
.ctaform-fasttrack__btn i,
.nav-account__btn i,
.mobile-menu__cta i,
a i[data-lucide^="arrow"],
button i[data-lucide^="arrow"],
a svg.lucide-arrow-right,
a svg.lucide-arrow-up-right {
  display: inline-block !important;
  transition: transform 0.26s cubic-bezier(0.2, 0.8, 0.2, 1) !important;
  will-change: transform;
}

.btn-nav-cta:hover i[data-lucide="arrow-right"],
.proof__roster-cta:hover i[data-lucide="arrow-right"],
.ctaform-fasttrack__btn:hover i[data-lucide="arrow-right"],
.nav-account__btn:hover i[data-lucide="arrow-right"],
.mobile-menu__cta:hover i[data-lucide="arrow-right"],
a:hover i[data-lucide="arrow-right"],
button:hover i[data-lucide="arrow-right"],
a:hover svg.lucide-arrow-right {
  transform: translateX(5px) !important;
}

.btn-hero:hover i[data-lucide="arrow-up-right"],
.btn-hero:hover svg.lucide-arrow-up-right,
.psc-card-cta:hover i[data-lucide="arrow-up-right"],
.psc-card-cta:hover svg.lucide-arrow-up-right,
a:hover i[data-lucide="arrow-up-right"],
button:hover i[data-lucide="arrow-up-right"],
a:hover svg.lucide-arrow-up-right {
  transform: translate3d(4px, -4px, 0) !important;
}

.probsol .psc-chips span,
.psc-chips span,
.tech-chip,
.chip,
.tag-pill {
  transition: transform 0.22s cubic-bezier(0.2, 0.8, 0.2, 1), box-shadow 0.22s ease, border-color 0.22s ease, background-color 0.22s ease !important;
  will-change: transform;
}

.probsol .psc-chips span:hover,
.psc-chips span:hover,
.tech-chip:hover,
.chip:hover,
.tag-pill:hover {
  transform: translateY(-2px) scale(1.04) !important;
  box-shadow: 0 4px 14px rgba(255, 92, 20, 0.2) !important;
}

.btn-nav-cta:active,
.signup-strip__btn:active,
.probsol-cta-bar__btn:active,
.btn-cta:active,
.nav-account__btn:active,
.mobile-menu__cta:active,
.psc-card-cta:active,
.prompt-bar__send:active,
.cc-tactile-btn:active {
  transform: scale(0.972) !important;
}

.prompt-bar__input:focus,
.ctaform-input:focus,
.form-control:focus,
input[type="text"]:focus,
input[type="email"]:focus,
textarea:focus {
  border-color: var(--dv-orange, #FF5C14) !important;
  box-shadow: 0 0 0 3px rgba(255, 92, 20, 0.26), 0 8px 24px rgba(0, 0, 0, 0.18) !important;
}

/* ── 10. ACESSIBILIDADE (PREFERS-REDUCED-MOTION) ────────────── */

@media (prefers-reduced-motion: reduce) {
  html body :is(.btn-nav-cta, .btn-hero, .btn-cta, .signup-strip__btn, .mobile-menu__cta, .nav-account__btn--primary)::after,
  .psc-head__kicker::after,
  .psc-col__head-badge::after,
  .hero-kicker::after,
  .techstack-kicker::after,
  .status-dot,
  .badge-dot,
  .live-dot,
  .robo-status-dot,
  .nav-available__dot,
  .radar-blip,
  .hero-scroll-cta,
  .ahud,
  .hero-title-v3 .accent,
  .logo-core,
  .probsol-card.psc-card-v2,
  .pricing-card--featured,
  .psc-head__kicker,
  .psc-metrics,
  .metric-box,
  .proof-metric,
  .prompt-bar,
  .cc-prompt-dock,
  .robo-companion,
  .hero-atmosphere {
    animation: none !important;
    transform: none !important;
  }

  html body :is(.btn-nav-cta, .btn-hero, .btn-cta, .signup-strip__btn, .mobile-menu__cta, .nav-account__btn--primary)::after,
  .psc-head__kicker::after,
  .psc-col__head-badge::after,
  .hero-kicker::after,
  .techstack-kicker::after {
    display: none !important;
  }
}

/* ── 11. HUD TOOLTIP AUTO-DISMISS & CLEANUP ────────────── */

.hud-tooltip {
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transform: translateY(8px) scale(0.98) !important;
  transition: opacity 0.16s ease, transform 0.16s ease, visibility 0.16s ease !important;
}

.hud-tooltip.hud-tooltip--visible {
  visibility: visible !important;
  opacity: 1 !important;
  display: block !important;
  transform: translateY(0) scale(1) !important;
}

.hud-tooltip:not(.hud-tooltip--visible) {
  visibility: hidden !important;
  opacity: 0 !important;
  display: none !important;
  border-color: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* ── 12. POPUP DO CHAT & BUBBLE DO MASCOTE — DESCARTE COMPLETO ─ */

.robo-companion-bubble[hidden],
.robo-companion-bubble:not(.is-visible) {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
  border-color: transparent !important;
  border: none !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

.robo-companion-bubble[hidden]::before,
.robo-companion-bubble:not(.is-visible)::before,
.robo-companion-bubble[hidden] .robo-companion-bubble__tail,
.robo-companion-bubble:not(.is-visible) .robo-companion-bubble__tail {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  border: none !important;
}

.cc-prompt-chat[hidden],
.cc-prompt-dock:not(.is-chat-open) .cc-prompt-chat {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
  border: none !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* ── 13. PROMPT DOCK INNER — ZERO MOLDURA RESIDUAL ──────────── */

html body .cc-prompt-dock:not(.is-chat-open) .cc-prompt-dock__inner {
  border: 0 !important;
  border-color: transparent !important;
  box-shadow: none !important;
  background: transparent !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

html body .cc-prompt-dock.is-hidden,
html body .cc-prompt-dock:not(.is-visible) {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
  border: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

html body .cc-prompt-dock.is-hidden *,
html body .cc-prompt-dock:not(.is-visible) * {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* ── 14. ARREDONDAMENTO CONCÊNTRICO EM MOLDURAS & POPUPS ────── */

html body .cc-prompt-dock,
html body .cc-prompt-dock.is-chat-open,
html body .cc-prompt-dock.is-chat-expanded,
html body .cc-prompt-dock .cc-prompt-dock__inner,
html body .cc-prompt-dock.is-chat-open .cc-prompt-dock__inner,
html body .cc-prompt-dock.is-chat-expanded .cc-prompt-dock__inner,
html body .cc-prompt-dock .cc-prompt-chat,
html body .cc-prompt-dock.is-chat-open .cc-prompt-chat,
html body .cc-prompt-dock.is-chat-expanded .cc-prompt-chat,
html body .cs2-popup__panel,
html body .nav-account__pop,
html body .mobile-menu__inner {
  border-radius: var(--cc-r-xl, 24px) !important;
}

html body .hud-tooltip,
html body .robo-companion-bubble,
html body .robo-companion-bubble::before {
  border-radius: var(--cc-r-md, 16px) !important;
}

html body .cc-prompt-dock .cc-prompt,
html body .cc-prompt-dock .cc-prompt__bar,
html body .cc-prompt-dock .cc-prompt__attach,
html body .cc-prompt-dock .cc-prompt__mic,
html body .cc-prompt-dock .cc-prompt__send {
  border-radius: var(--cc-r-pill, 9999px) !important;
}

/* ── 15. KEYFRAMES DE TELEMETRIA, MÉTRICAS & FEEDBACK ───────── */

/* 15.1 Pulso de Telemetria e Glow em Números e Estatísticas */
@keyframes cc-telemetry-glow {
  0%, 100% {
    filter: drop-shadow(0 0 0 rgba(255, 92, 20, 0));
    transform: scale(1);
  }
  50% {
    filter: drop-shadow(0 0 10px rgba(255, 92, 20, 0.45));
    transform: scale(1.02);
  }
}

/* 15.2 Feixe de Luz Contínuo nas Barras de Progresso e Métricas */
@keyframes cc-progress-beam {
  0% {
    background-position: -200% 0;
  }
  100% {
    background-position: 200% 0;
  }
}

/* 15.3 Micro-Oscilação Rítmica nos Ícones de Lista e Features */
@keyframes cc-icon-energy {
  0%, 100% {
    transform: translateY(0) scale(1);
  }
  50% {
    transform: translateY(-2.5px) scale(1.08);
  }
}

/* 15.4 Feixe Luminoso em Linhas Divisórias / Hairlines */
@keyframes cc-hairline-flow {
  0% {
    opacity: 0.25;
    filter: brightness(1);
  }
  50% {
    opacity: 0.85;
    filter: brightness(1.35) drop-shadow(0 0 4px rgba(255, 92, 20, 0.5));
  }
  100% {
    opacity: 0.25;
    filter: brightness(1);
  }
}

/* ── 16. APLICAÇÃO DA NOVA CAMADA DE MICRO-ANIMAÇÕES ────────── */

/* 16.1 Números de Alto Impacto com Pulso Telemetry */
.proof__stat-num,
.cs-metric__val,
.stat-num,
.pc-head__num,
.hero-chip__num,
.cs2-gauge__val,
.svp-dcard__num,
.stat-item strong {
  display: inline-block;
  animation: cc-telemetry-glow 5.5s ease-in-out infinite !important;
  will-change: transform, filter;
}

/* 16.2 Barras de Progresso e Indicadores com Fluxo Contínuo */
.cs2-bar i,
.cc-prompt-chat__briefing-fill,
.proc-bar__fill {
  background-size: 200% 100% !important;
  background-image: linear-gradient(
    90deg,
    rgba(255, 92, 20, 0.9) 0%,
    rgba(255, 200, 150, 1) 50%,
    rgba(255, 92, 20, 0.9) 100%
  ) !important;
  animation: cc-progress-beam 3s linear infinite !important;
}

/* 16.3 Ícones de Features e Destaques com Energia Rítmica */
.spec-feature__icon,
.faq-trigger i,
.pc-feat i,
.val-card__icon,
.test-card__stars,
.cs2-tag i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.25s cubic-bezier(0.23, 1, 0.32, 1);
}

.spec-feature:hover .spec-feature__icon,
.faq-item:hover .faq-trigger i,
.pc-feat:hover i {
  transform: translateY(-3px) scale(1.15) !important;
  color: var(--dv-orange, #ff5c14) !important;
}

/* 16.4 Linhas de Grade e Divisórias com Hairline Glow Flow */
.hud-line,
.nav-divider,
.hero-waves-divider,
.stats-strip,
.footer-divider {
  animation: cc-hairline-flow 7s ease-in-out infinite !important;
}

/* ── 17. KEYFRAMES DE ENERGIA TÁTIL & MICRO-FEEDBACK ────────── */

/* 17.1 Pulso Concêntrico em Botões Flutuantes / CTAs de Ação */
@keyframes cc-cta-ring-pulse {
  0% {
    box-shadow: 0 0 0 0 rgba(255, 92, 20, 0.6), 0 8px 24px rgba(0, 0, 0, 0.25);
  }
  70% {
    box-shadow: 0 0 0 12px rgba(255, 92, 20, 0), 0 12px 32px rgba(0, 0, 0, 0.35);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(255, 92, 20, 0), 0 8px 24px rgba(0, 0, 0, 0.25);
  }
}

/* 17.2 Onda Sonora / Equalizador no Botão de Voz e Mic */
@keyframes cc-mic-energy-breathe {
  0%, 100% {
    transform: scale(1);
    color: rgba(255, 255, 255, 0.7);
  }
  50% {
    transform: scale(1.12);
    color: var(--dv-orange, #ff5c14);
    filter: drop-shadow(0 0 8px rgba(255, 92, 20, 0.6));
  }
}

/* 17.3 Ping Sutil de Status Online em Tempo Real */
@keyframes cc-ping-radar {
  0% {
    transform: scale(1);
    opacity: 0.7;
  }
  60%, 100% {
    transform: scale(2.1);
    opacity: 0;
  }
}

/* 17.4 Shimmer Orgânico em Chips de Ação Rápida */
@keyframes cc-chip-ambient-hover {
  0%, 100% {
    transform: translateY(0);
    border-color: rgba(255, 255, 255, 0.12);
  }
  50% {
    transform: translateY(-2px);
    border-color: rgba(255, 92, 20, 0.4);
  }
}

/* ── 18. APLICAÇÃO DA CAMADA DE ENERGIA TÁTIL ───────────────── */

/* 18.1 Pulso de Atenção Rítmica no CTA Flutuante de Contato / WhatsApp */
.dcb-btn-wa,
.cft-wa,
.floating-cta {
  animation: cc-cta-ring-pulse 3.8s infinite ease-out !important;
}

/* 18.2 Micro-Respiração no Botão de Ditado e Áudio */
.cc-prompt__mic {
  animation: cc-mic-energy-breathe 4s ease-in-out infinite !important;
}

/* 18.3 Indicador Online com Micro-Ping Suave */
.cc-prompt-chat__online i,
.sc-head__status,
.cs-hud__status i {
  position: relative !important;
  display: inline-block !important;
}

.cc-prompt-chat__online i::after,
.sc-head__status::after,
.cs-hud__status i::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background: inherit;
  animation: cc-ping-radar 2.8s cubic-bezier(0.16, 1, 0.3, 1) infinite;
  pointer-events: none;
}

/* 18.4 Chips de Filtro e Atalhos com Flutuação Orgânica em Cascata */
.cc-prompt-dock__chip:nth-child(odd),
.cases-filter__btn:nth-child(odd) {
  animation: cc-chip-ambient-hover 6s ease-in-out infinite !important;
}
.cc-prompt-dock__chip:nth-child(even),
.cases-filter__btn:nth-child(even) {
  animation: cc-chip-ambient-hover 6s ease-in-out 3s infinite !important;
}

/* 18.5 Efeito de Elevação Suave e Reativa em Todos os Cards */
.spec-card,
.test-card,
.pricing-card,
.cs2-card,
.value-card,
.blog-card {
  transition: transform 0.35s cubic-bezier(0.23, 1, 0.32, 1),
              box-shadow 0.35s cubic-bezier(0.23, 1, 0.32, 1),
              border-color 0.35s ease !important;
}

.spec-card:hover,
.test-card:hover,
.pricing-card:hover,
.cs2-card:hover,
.value-card:hover,
.blog-card:hover {
  transform: translateY(-6px) scale(1.01) !important;
  box-shadow: 0 20px 48px rgba(0, 0, 0, 0.3), 0 0 20px rgba(255, 92, 20, 0.12) !important;
}

/* ── 19. KEYFRAMES DE TIPOGRAFIA CINÉTICA & DETALHES VISUAIS ── */

/* 19.1 Cintilação Suave nas Estrelas de Avaliação */
@keyframes cc-star-twinkle {
  0%, 100% {
    transform: scale(1);
    opacity: 0.9;
    filter: drop-shadow(0 0 0 rgba(255, 180, 0, 0));
  }
  50% {
    transform: scale(1.22);
    opacity: 1;
    filter: drop-shadow(0 0 6px rgba(255, 180, 0, 0.8));
    color: #ffb800 !important;
  }
}

/* 19.2 Brilho Rítmico em Kickers e Badges de Título */
@keyframes cc-kicker-glow {
  0%, 100% {
    filter: brightness(1) drop-shadow(0 0 0 rgba(255, 92, 20, 0));
  }
  50% {
    filter: brightness(1.25) drop-shadow(0 0 8px rgba(255, 92, 20, 0.5));
  }
}

/* 19.3 Varredura Luminosa em Mockups e Mídias de Cases */
@keyframes cc-media-sheen-sweep {
  0% {
    transform: translateX(-160%) skewX(-25deg);
    opacity: 0;
  }
  3% {
    opacity: 0.45;
  }
  25% {
    transform: translateX(260%) skewX(-25deg);
    opacity: 0.45;
  }
  28%, 100% {
    transform: translateX(260%) skewX(-25deg);
    opacity: 0;
  }
}

/* 19.4 Micro-Rotação ao Interagir com Toggles de Tema/Som */
@keyframes cc-toggle-spin-hover {
  0% {
    transform: rotate(0deg) scale(1);
  }
  50% {
    transform: rotate(18deg) scale(1.1);
  }
  100% {
    transform: rotate(0deg) scale(1);
  }
}

/* ── 20. APLICAÇÃO DE DETALHES CINÉTICOS & CINTILAÇÃO ────────── */

/* 20.1 Estrelas de Avaliação com Efeito Cintilante Alternado */
.test-card__stars i:nth-child(1),
.proof__quote-stars i:nth-child(1) {
  animation: cc-star-twinkle 4s ease-in-out infinite !important;
}
.test-card__stars i:nth-child(2),
.proof__quote-stars i:nth-child(2) {
  animation: cc-star-twinkle 4s ease-in-out 0.8s infinite !important;
}
.test-card__stars i:nth-child(3),
.proof__quote-stars i:nth-child(3) {
  animation: cc-star-twinkle 4s ease-in-out 1.6s infinite !important;
}
.test-card__stars i:nth-child(4),
.proof__quote-stars i:nth-child(4) {
  animation: cc-star-twinkle 4s ease-in-out 2.4s infinite !important;
}
.test-card__stars i:nth-child(5),
.proof__quote-stars i:nth-child(5) {
  animation: cc-star-twinkle 4s ease-in-out 3.2s infinite !important;
}

/* 20.2 Kickers e Subtítulos com Brilho Atmosférico */
.sec-kicker,
.hero-kicker,
.page-hero__kicker,
.proof__kicker,
.spec-head__kicker,
.techstack-head__tag {
  animation: cc-kicker-glow 6s ease-in-out infinite !important;
}

/* 20.3 Varredura Luminosa nos Cards de Portfólio / Cases */
.work-card,
.case-media,
.cases-portfolio__item,
.cs2-card__media {
  position: relative;
  overflow: hidden;
}

.work-card::before,
.cases-portfolio__item::before,
.cs2-card__media::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 60%;
  height: 100%;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(255, 255, 255, 0.12),
    transparent
  );
  pointer-events: none;
  z-index: 2;
  animation: cc-media-sheen-sweep 9s ease-in-out infinite !important;
}

/* 20.4 Micro-Animação nos Controles de Tema e Som */
.theme-toggle:hover i,
.sound-toggle:hover i {
  animation: cc-toggle-spin-hover 0.6s cubic-bezier(0.23, 1, 0.32, 1) !important;
}

/* ── 21. KEYFRAMES DE BIO-RITMO & FÍSICA TÁTIL ──────────────── */

/* 21.1 Impulso Cinético Horizontal em Setas e Indicadores */
@keyframes cc-arrow-kinetic-nudge {
  0%, 100% {
    transform: translateX(0);
  }
  50% {
    transform: translateX(4px);
  }
}

/* 21.2 Halo de Luz e Micro-Escala nos Avatares */
@keyframes cc-avatar-halo-pulse {
  0%, 100% {
    box-shadow: 0 0 0 0 rgba(255, 92, 20, 0);
  }
  50% {
    box-shadow: 0 0 0 4px rgba(255, 92, 20, 0.4), 0 8px 16px rgba(0, 0, 0, 0.25);
  }
}

/* 21.3 Pulso Dinâmico no Botão de Enviar Quando Ativo */
@keyframes cc-send-ready-pulse {
  0%, 100% {
    transform: scale(1);
    box-shadow: 0 0 0 0 rgba(255, 92, 20, 0.5);
  }
  50% {
    transform: scale(1.08);
    box-shadow: 0 0 16px rgba(255, 92, 20, 0.8);
  }
}

/* 21.4 Respiração Bio-Rítmica nas Tags do Header */
@keyframes cc-nav-badge-breathe {
  0%, 100% {
    filter: brightness(1);
    transform: scale(1);
  }
  50% {
    filter: brightness(1.2);
    transform: scale(1.03);
  }
}

/* ── 22. APLICAÇÃO DE FÍSICA TÁTIL & CINÉTICA ───────────────── */

/* 22.1 Setas de CTA e Links com Impulso Contínuo */
.cases-hero-link i,
.btn-solid i,
.btn-cta i,
.footer-contact-link .footer-arr,
.hero-cta__sub i {
  display: inline-block;
  animation: cc-arrow-kinetic-nudge 2.2s ease-in-out infinite !important;
}

/* 22.2 Avatares de Clientes e Time com Halo Orgânico */
.proof__quote-author img,
.team-card__avatar,
.test-card__avatar,
.test-author__avatar {
  transition: transform 0.3s ease, box-shadow 0.3s ease !important;
}

.proof__quote-author:hover img,
.team-card:hover .team-card__avatar,
.test-card:hover .test-card__avatar {
  animation: cc-avatar-halo-pulse 3s infinite ease-in-out !important;
  transform: scale(1.06) !important;
}

/* 22.3 Botão de Envio de Mensagem com Efeito de Prontidão */
.cc-prompt__send:not(:disabled):not(.is-empty) {
  animation: cc-send-ready-pulse 2.8s ease-in-out infinite !important;
}

/* 22.4 Badges e Tags de Navegação com Bio-Ritmo */
.nav-brand__badge,
.pc-head__tag,
.sc-head__tag {
  animation: cc-nav-badge-breathe 5s ease-in-out infinite !important;
}

/* 22.5 Interatividade Dinâmica no FAQ */
.faq-item {
  transition: border-color 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease !important;
}

.faq-item:hover {
  transform: translateX(4px) !important;
  border-color: rgba(255, 92, 20, 0.45) !important;
  box-shadow: -4px 0 16px rgba(255, 92, 20, 0.15) !important;
}

/* ── 23. KEYFRAMES DE PROVA SOCIAL, SCORES & PLANOS ─────────── */

/* 23.1 Pulso de Alta Eficiência nos Badges de Score 100 / Métricas */
@keyframes cc-score-badge-glow {
  0%, 100% {
    filter: drop-shadow(0 0 0 rgba(0, 230, 118, 0));
    transform: scale(1);
  }
  50% {
    filter: drop-shadow(0 0 10px rgba(0, 230, 118, 0.65));
    transform: scale(1.04);
  }
}

/* 23.2 Aura Perimetral Contínua no Plano em Destaque */
@keyframes cc-featured-plan-aura {
  0%, 100% {
    box-shadow: 0 12px 36px rgba(0, 0, 0, 0.25), 0 0 0 1px rgba(255, 92, 20, 0.3);
  }
  50% {
    box-shadow: 0 20px 54px rgba(255, 92, 20, 0.22), 0 0 0 1.5px rgba(255, 92, 20, 0.75), 0 0 28px rgba(255, 92, 20, 0.25);
  }
}

/* 23.3 Levitação e Indicador de Scroll Suave */
@keyframes cc-scroll-bob {
  0%, 100% {
    transform: translateY(0);
    opacity: 0.8;
  }
  50% {
    transform: translateY(6px);
    opacity: 1;
    color: var(--dv-orange, #ff5c14);
  }
}

/* 23.4 Micro-Onda Luminosa nos Logos da Faixa Marquee */
@keyframes cc-marquee-logo-pulse {
  0%, 100% {
    opacity: 0.7;
    filter: grayscale(1) brightness(1);
  }
  50% {
    opacity: 1;
    filter: grayscale(0) brightness(1.2) drop-shadow(0 0 6px rgba(255, 92, 20, 0.4));
  }
}

/* ── 24. APLICAÇÃO DE PROVA SOCIAL & DETALHES DE ALTO VALOR ─── */

/* 24.1 Badges de Nota 100 e Eficiência */
.cs-hud__val,
.speed-badge,
.pc-score,
.techstack-score,
.score-100 {
  display: inline-block;
  animation: cc-score-badge-glow 4.2s ease-in-out infinite !important;
  will-change: transform, filter;
}

/* 24.2 Card de Plano / Assinatura em Destaque */
.pricing-card--featured,
.pc-card--featured,
.pricing-card.is-featured,
.pricing-card:nth-child(2) {
  animation: cc-featured-plan-aura 5s ease-in-out infinite !important;
  will-change: box-shadow;
}

/* 24.3 Indicadores de Rolagem e Setas de Exploração */
.hero-scroll-hint,
.mouse-wheel,
.scroll-arrow {
  animation: cc-scroll-bob 2.5s ease-in-out infinite !important;
}

/* 24.4 Micro-Interatividade nos Links do Rodapé */
.footer-links a,
.footer-legal a {
  display: inline-block;
  transition: transform 0.22s cubic-bezier(0.23, 1, 0.32, 1),
              color 0.22s ease,
              text-shadow 0.22s ease !important;
}

.footer-links a:hover,
.footer-legal a:hover {
  transform: translateX(4px) !important;
  color: var(--dv-orange, #ff5c14) !important;
  text-shadow: 0 0 12px rgba(255, 92, 20, 0.4) !important;
}

.footer-contact-link {
  display: flex !important;
  width: 100% !important;
  box-sizing: border-box !important;
  transition: transform 0.22s cubic-bezier(0.23, 1, 0.32, 1),
              border-color 0.22s ease,
              background 0.22s ease,
              color 0.22s ease,
              box-shadow 0.22s ease !important;
}

.footer-contact-link:hover {
  transform: translateX(4px) !important;
  border-color: var(--dv-orange, #ff5c14) !important;
  box-shadow: 0 0 12px rgba(255, 92, 20, 0.2) !important;
}