/* Hub — experiência premium: ciclo, núcleo e fundo */

/* Estados dos cards */
.finax-hub-node:not(.is-active):not(.is-hovered):not(:hover):not(:focus-visible) {
    opacity: 0.68;
  }
  
  .finax-hub-node:not(.is-active):not(.is-hovered) .finax-hub-node-label {
    color: rgba(241, 245, 249, 0.42);
  }
  
  .finax-hub-node:not(.is-active):not(.is-hovered) .finax-hub-node-icon {
    color: rgba(0, 198, 94, 0.38);
  }
  
  .finax-hub-node.is-hovered,
  .finax-hub-node.is-active {
    opacity: 1;
  }
  
  /* Núcleo central */
  .finax-hub-core {
    overflow: visible;
    z-index: 5;
  }
  
  .finax-hub-core-halo {
    position: absolute;
    inset: -35%;
    z-index: 0;
    border-radius: 50%;
    background: radial-gradient(
      circle at 50% 50%,
      rgba(0, 198, 94, 0.2) 0%,
      rgba(0, 198, 94, 0.06) 42%,
      transparent 68%
    );
    opacity: 0.55;
    animation: finax-hub-core-halo-breathe 6s ease-in-out infinite;
    pointer-events: none;
  }
  
  .finax-hub-stage.is-step-active .finax-hub-core-halo {
    opacity: 0.85;
    animation-duration: 3.5s;
  }
  
  .finax-hub-stage.is-step-active .finax-hub-core-glow {
    opacity: 1;
    animation-duration: 4s;
  }
  
  .finax-hub-core-brand,
  .finax-hub-core-border {
    position: relative;
    z-index: 2;
  }
  
  .finax-hub-core-glow {
    z-index: 1;
  }
  
  .finax-hub-core.is-receiving {
    animation: finax-hub-core-receive 0.65s cubic-bezier(0.22, 1, 0.36, 1);
  }
  
  @keyframes finax-hub-core-halo-breathe {
    0%,
    100% {
      opacity: 0.45;
      transform: scale(0.96);
    }
    50% {
      opacity: 0.75;
      transform: scale(1.04);
    }
  }
  
  @keyframes finax-hub-core-receive {
    0% {
      transform: translate(-50%, -50%) scale(1);
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.1),
        0 0 0 1px rgba(0, 198, 94, 0.14),
        0 20px 56px rgba(0, 0, 0, 0.32),
        0 0 56px rgba(0, 198, 94, 0.16);
    }
    45% {
      transform: translate(-50%, -50%) scale(1.035);
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.12),
        0 0 0 1px rgba(0, 198, 94, 0.32),
        0 24px 64px rgba(0, 0, 0, 0.34),
        0 0 72px rgba(0, 198, 94, 0.28);
    }
    100% {
      transform: translate(-50%, -50%) scale(1);
    }
  }
  
  /* Anéis orbitais — rotação lenta */
  .finax-hub-ring {
    animation:
      finax-hub-ring-breathe 9s ease-in-out infinite,
      finax-hub-ring-spin 48s linear infinite;
  }
  
  .finax-hub-ring--mid {
    animation:
      finax-hub-ring-breathe 9s ease-in-out infinite,
      finax-hub-ring-spin 64s linear infinite reverse;
  }
  
  @keyframes finax-hub-ring-spin {
    from {
      transform: translate(-50%, -50%) rotate(0deg);
    }
    to {
      transform: translate(-50%, -50%) rotate(360deg);
    }
  }
  
  /* Radar */
  .finax-hub-radar-ring {
    transition: stroke-opacity 400ms ease, stroke 400ms ease;
  }
  
  .finax-hub-stage.is-step-active .finax-hub-radar-ring {
    stroke-opacity: 1;
  }
  
  .finax-hub-radar-spoke {
    transition: stroke-opacity 400ms ease;
  }
  
  .finax-hub-stage.is-step-active .finax-hub-radar-spoke {
    stroke: rgba(0, 198, 94, 0.06);
  }
  
  /* Linhas — base sempre visível; energia no ativo */
  .finax-hub-link {
    transition:
      stroke 380ms ease,
      stroke-width 380ms ease,
      filter 380ms ease,
      opacity 380ms ease;
  }
  
  .finax-hub-link-energy.is-active,
  .finax-hub-link-energy.is-hovered {
    stroke-dasharray: 4 96;
    animation: finax-hub-energy-flow 2.2s linear infinite;
  }
  
  .finax-hub-link-flow-dot {
    fill: rgba(0, 223, 110, 0.95);
    filter: drop-shadow(0 0 3px rgba(0, 198, 94, 0.65));
    opacity: 0;
    transition: opacity 280ms ease;
  }
  
  .finax-hub-stage[data-active-link] .finax-hub-link-flow-dot {
    opacity: 0;
  }
  
  .finax-hub-stage[data-active-link="1"] .finax-hub-flow--1 .finax-hub-link-flow-dot,
  .finax-hub-stage[data-active-link="2"] .finax-hub-flow--2 .finax-hub-link-flow-dot,
  .finax-hub-stage[data-active-link="3"] .finax-hub-flow--3 .finax-hub-link-flow-dot,
  .finax-hub-stage[data-active-link="4"] .finax-hub-flow--4 .finax-hub-link-flow-dot,
  .finax-hub-stage[data-active-link="5"] .finax-hub-flow--5 .finax-hub-link-flow-dot,
  .finax-hub-stage[data-active-link="6"] .finax-hub-flow--6 .finax-hub-link-flow-dot,
  .finax-hub-stage[data-active-link="7"] .finax-hub-flow--7 .finax-hub-link-flow-dot,
  .finax-hub-stage[data-active-link="8"] .finax-hub-flow--8 .finax-hub-link-flow-dot {
    opacity: 1;
  }
  
  /* Partículas de fundo */
  .finax-visual-particles {
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    overflow: hidden;
  }
  
  .finax-visual-particles span {
    position: absolute;
    width: 3px;
    height: 3px;
    border-radius: 50%;
    background: rgba(0, 198, 94, 0.35);
    box-shadow: 0 0 8px rgba(0, 198, 94, 0.25);
    animation: finax-particle-float 14s ease-in-out infinite;
  }
  
  .finax-visual-particles span:nth-child(1) { left: 12%; top: 18%; animation-delay: 0s; }
  .finax-visual-particles span:nth-child(2) { left: 78%; top: 22%; animation-delay: -2.5s; }
  .finax-visual-particles span:nth-child(3) { left: 88%; top: 55%; animation-delay: -5s; }
  .finax-visual-particles span:nth-child(4) { left: 22%; top: 72%; animation-delay: -7s; }
  .finax-visual-particles span:nth-child(5) { left: 55%; top: 12%; animation-delay: -3.5s; }
  .finax-visual-particles span:nth-child(6) { left: 8%; top: 48%; animation-delay: -9s; }
  
  @keyframes finax-particle-float {
    0%,
    100% {
      opacity: 0.2;
      transform: translate(0, 0) scale(1);
    }
    50% {
      opacity: 0.65;
      transform: translate(6px, -10px) scale(1.15);
    }
  }
  
  /* Tema claro */
  [data-theme="light"] .finax-hub-node:not(.is-active):not(.is-hovered):not(:hover):not(:focus-visible) {
    opacity: 0.78;
  }
  
  [data-theme="light"] .finax-hub-node:not(.is-active):not(.is-hovered) .finax-hub-node-label {
    color: rgba(16, 24, 32, 0.48);
  }
  
  [data-theme="light"] .finax-hub-node:not(.is-active):not(.is-hovered) .finax-hub-node-icon {
    color: rgba(0, 122, 61, 0.45);
  }
  
  [data-theme="light"] .finax-hub-core-halo {
    background: radial-gradient(
      circle at 50% 50%,
      rgba(0, 198, 94, 0.14) 0%,
      rgba(0, 198, 94, 0.04) 45%,
      transparent 68%
    );
  }
  
  [data-theme="light"] .finax-visual-particles span {
    background: rgba(0, 168, 77, 0.4);
    box-shadow: 0 0 6px rgba(0, 198, 94, 0.15);
  }
  
  @media (prefers-reduced-motion: reduce) {
    .finax-hub-core-halo,
    .finax-hub-ring,
    .finax-hub-ring--mid,
    .finax-hub-core.is-receiving,
    .finax-visual-particles span {
      animation: none !important;
    }
  
    .finax-hub-link-energy.is-active,
    .finax-hub-link-energy.is-hovered {
      animation: none;
    }
  
    .finax-hub-link-flow-dot {
      display: none;
    }
  }
  