/* =========================================================
   TRANSIÇÃO "ÁREA DO CLIENTE" → LOGIN
   No clique, uma mira trava no botão e o site aproxima em direção a
   ele até a cor do login cobrir a tela (assets/js/transicao-login.js).
   Aqui ficam a mira, a vinheta e o véu, e os elementos fixos que
   somem durante a saída.
   ========================================================= */
.em-transicao .cursor,
.em-transicao .cursor-ring,
.em-transicao .raio-x,
.em-transicao .cta-fixa,
.em-transicao .fab-topo { opacity: 0 !important; transition: opacity 0.15s; }

/* Nada responde ao mouse enquanto a página se afasta */
.em-transicao body { pointer-events: none; }

/* O botão mirado ganha um halo na cor de destaque */
.btn.is-mirado {
  box-shadow: 0 0 0 4px var(--accent-halo), 0 0 28px var(--accent-halo);
  transition: box-shadow 0.3s ease-out;
}

/* Mira: quatro cantos em L em volta do botão + pulso no centro */
.mira-alvo {
  position: fixed;
  z-index: 10000;
  pointer-events: none;
  will-change: transform, opacity;
}
.mira-alvo i {
  position: absolute;
  width: 14px;
  height: 14px;
  border: 0 solid var(--accent);
  opacity: 0;
  will-change: transform, opacity;
}
.mira-alvo i:nth-child(1) { top: 0;    left: 0;  border-top-width: 2px;    border-left-width: 2px;  border-top-left-radius: 4px; }
.mira-alvo i:nth-child(2) { top: 0;    right: 0; border-top-width: 2px;    border-right-width: 2px; border-top-right-radius: 4px; }
.mira-alvo i:nth-child(3) { bottom: 0; left: 0;  border-bottom-width: 2px; border-left-width: 2px;  border-bottom-left-radius: 4px; }
.mira-alvo i:nth-child(4) { bottom: 0; right: 0; border-bottom-width: 2px; border-right-width: 2px; border-bottom-right-radius: 4px; }
.mira-alvo b {
  position: absolute;
  inset: -6px;
  border: 1px solid var(--accent-border);
  border-radius: 999px;
  opacity: 0;
}

/* Vinheta e véu: camadas da tela inteira por cima do site */
.transicao-vinheta,
.transicao-veu {
  position: fixed;
  inset: 0;
  pointer-events: none;
}
.transicao-vinheta { z-index: 9998; opacity: 0; }
.transicao-veu { z-index: 10001; clip-path: circle(0px at 50% 50%); }