/* =========================================
   mousecursor.css — mouse negative cursor
   (dot gradiente + aumento suave + negativo sem “fundo”)
   ========================================= */

@media (hover: hover) and (pointer: fine) {
  body.has-mouse-cursor,
  body.has-mouse-cursor a,
  body.has-mouse-cursor button,
  body.has-mouse-cursor [role="button"] {
    cursor: none;
  }

  .cb-cursor {
    /* ajustes finos */
    --cb-size: 44px;        /* diâmetro do círculo grande */
    --cb-dot: 0.22;         /* escala do dot (bolinha) */
    --cb-pointer: 0.12;     /* escala em links/botões */
    --cb-lg: 1.55;          /* escala grande */
    --cb-text: 1.35;

    /* >>> proximidade (JS lê daqui) <<< */
    --cb-prox-radius: 110;  /* antes 160; menor = ativa bem mais perto */
    --cb-prox-start: 0.75;  /* 0..1: começa a agir só no "miolo" do raio (bem perto) */
    --cb-invert-start: 0.60;/* 0..1: negativo só liga quando estiver mais perto ainda */

    /* controles (JS) */
    --cb-scale: 0;          /* escala do círculo grande */
    --cb-invert: 0;         /* 0..1 (liga/desliga negativo) */

    position: fixed;
    top: 0;
    left: 0;
    z-index: 9999;
    pointer-events: none;
    contain: layout style size;
    will-change: transform;
    opacity: 0;
    transition: opacity 320ms var(--ease, ease);
  }

  /* DOT (bolinha) — AGORA COM GRADIENTE */
  .cb-cursor::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;

    width: var(--cb-size);
    height: var(--cb-size);
    border-radius: 999px;

    transform: translate(-50%, -50%) scale(var(--cb-dot));

    /* >>> gradiente da marca <<< */
    background: var(--g-brand);

    /* melhora a leitura em fundos escuros/claros (sem virar “fundo”) */
    box-shadow:
      0 0 0 1px rgba(255, 255, 255, 0.10),
      0 10px 26px rgba(11, 18, 32, 0.18);

    /* quando negativo liga, o dot some (clean) */
    opacity: calc(1 - var(--cb-invert));
    transition: opacity 180ms var(--ease, ease);
  }

  /* CÍRCULO DE NEGATIVO — NÃO TEM FUNDO VISÍVEL */
  .cb-cursor::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;

    width: var(--cb-size);
    height: var(--cb-size);
    border-radius: 999px;

    transform: translate(-50%, -50%) scale(var(--cb-scale));
    opacity: var(--cb-invert);

    /* tamanho suave (mantém sua transição premium) */
    transition:
      transform 780ms var(--ease, ease),
      opacity 160ms var(--ease, ease);

    /* alpha mínimo só pra ativar backdrop-filter */
    background: rgba(255, 255, 255, 0.001);

    /* borda/sombra sutil pra leitura do círculo */
    box-shadow:
      0 0 0 1px rgba(11, 18, 32, 0.10),
      0 18px 50px rgba(11, 18, 32, 0.10);

    mix-blend-mode: normal;
  }

  /* NEGATIVO (robusto) — prioridade: backdrop-filter invert */
  @supports ((-webkit-backdrop-filter: invert(1)) or (backdrop-filter: invert(1))) {
    .cb-cursor::after {
      -webkit-backdrop-filter: invert(1) contrast(1.05);
      backdrop-filter: invert(1) contrast(1.05);
    }
  }

  /* Fallback: mix-blend-mode exclusion */
  @supports not ((-webkit-backdrop-filter: invert(1)) or (backdrop-filter: invert(1))) {
    @supports (mix-blend-mode: exclusion) {
      .cb-cursor::after {
        background: #fff; /* branco + exclusion = inverte o que está embaixo */
        mix-blend-mode: exclusion;
      }
    }

    /* fallback final */
    @supports not (mix-blend-mode: exclusion) {
      .cb-cursor::after {
        background: rgba(11, 18, 32, 0.10);
        opacity: calc(var(--cb-invert) * 0.25);
      }
    }
  }

  .cb-cursor-text {
    position: absolute;
    top: 0;
    left: 0;

    width: calc(var(--cb-size) - 10px);
    height: calc(var(--cb-size) - 10px);

    display: flex;
    align-items: center;
    justify-content: center;

    transform: translate(-50%, -50%) scale(0.85) rotate(8deg);
    opacity: 0;

    color: #fff;
    font-size: 14px;
    line-height: 1;
    letter-spacing: -0.01em;

    transition:
      transform 780ms var(--ease, ease),
      opacity 420ms var(--ease, ease);
  }

  /* visível */
  .cb-cursor.-visible {
    opacity: 1;
    --cb-scale: var(--cb-dot);
    --cb-invert: 0;
  }

  /* pointer mode */
  .cb-cursor.-pointer {
    --cb-scale: var(--cb-pointer);
    --cb-invert: 0;
    opacity: 0.92;
  }

  /* click feedback */
  .cb-cursor.-active::after {
    transform: translate(-50%, -50%) scale(0.16);
    transition-duration: 160ms;
  }

  /* texto opcional */
  .cb-cursor.-text .cb-cursor-text {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1) rotate(0deg);
  }

  @media (prefers-reduced-motion: reduce) {
    .cb-cursor,
    .cb-cursor::before,
    .cb-cursor::after,
    .cb-cursor-text {
      transition: none !important;
    }
  }
}