/* ==========================================================================
   MOLDURAS — filete de ouro neon
   Carregar por ÚLTIMO: este arquivo vence os demais por ordem de cascata,
   e apagá-lo devolve o site ao traço neutro sem tocar em mais nada.

   Vale para BLOCO — cartão, painel, caixa que contém conteúdo.
   NÃO vale para controle — botão, chip, campo, paginação. Se tudo brilhar,
   nada se destaca, e o dourado deixaria de marcar hierarquia para virar
   ruído. Esses seguem com --line.

   O filete é 1px. O brilho vem de box-shadow, que não engrossa o traço nem
   desloca layout.
   ========================================================================== */

/* ---------- Repouso ---------- */
.card,
.pcard,
.depo,
.rec,
.prova,
.cta-forte,
.hero-carousel,
.gate,
.ia,
.q,
.mfile,
.comments-locked,
.body,
.login-card {
  border-color: var(--ouro-dim);
}

/* ---------- Aceso ---------- */
.card:hover,
.pcard:hover,
.depo:hover,
.rec:hover,
.mfile:hover {
  border-color: var(--ouro);
  box-shadow: 0 0 22px var(--ouro-glow);
}

.rec:hover,
.rec:focus-visible {
  border-color: var(--ouro);
  box-shadow: 0 18px 44px rgba(0, 0, 0, 0.5), 0 0 26px var(--ouro-glow);
}

.q[data-aberto] {
  border-color: var(--ouro);
  box-shadow:
    0 0 0 1px var(--ouro-dim),
    0 0 26px var(--ouro-glow),
    inset 0 0 34px rgba(240, 194, 75, 0.09);
}

/* O modal e o assistente flutuam sobre a página: o filete substitui o anel
   prateado que os separava do fundo. */
.gate { box-shadow: var(--shadow-lg), 0 0 0 1px var(--ouro-dim); }
.ia { box-shadow: var(--shadow-lg), 0 0 0 1px var(--ouro-dim); }

/* Blocos com brilho azul próprio mantêm os dois: o azul é do bloco, o ouro
   é da moldura. */
.cta-forte { box-shadow: 0 0 34px rgba(240, 194, 75, 0.13); }
.prova { box-shadow: 0 0 30px rgba(240, 194, 75, 0.10); }

/* ---------- Botões do bloco de assinatura ---------- */
.cta-forte .pbtn.primary,
.cta-forte .pbtn.ghost,
.foot-cta .pbtn.primary,
.foot-cta .pbtn.ghost {
  border-color: var(--ouro-dim);
}
.cta-forte .pbtn.primary:hover,
.cta-forte .pbtn.ghost:hover,
.cta-forte .pbtn:focus-visible,
.foot-cta .pbtn.primary:hover,
.foot-cta .pbtn.ghost:hover,
.foot-cta .pbtn:focus-visible {
  border-color: var(--ouro);
  box-shadow: 0 0 0 1px var(--ouro-dim), 0 0 24px var(--ouro-glow);
}

/* ---------- Exceção: o botão do carrossel ----------
   Controle não leva ouro (ver o topo deste arquivo), mas este é o único
   botão que fica sobre fotografia e concentra a ação do hero. O filete o
   separa da imagem — que é o mesmo trabalho que a moldura faz nos blocos.
   Acende para ouro pleno no hover e no foco. */
.hero-carousel .pbtn.primary,
.hero-carousel .pbtn.ghost {
  border-color: var(--ouro-dim);
}
.hero-carousel .pbtn.primary:hover,
.hero-carousel .pbtn.ghost:hover,
.hero-carousel .pbtn.primary:focus-visible,
.hero-carousel .pbtn.ghost:focus-visible {
  border-color: var(--ouro);
  box-shadow:
    0 0 0 1px var(--ouro-dim),
    0 0 24px var(--ouro-glow);
  color: #fff;
  text-shadow: 0 0 14px rgba(255, 255, 255, 0.4);
}

@media (prefers-reduced-motion: reduce) {
  .card:hover, .pcard:hover, .depo:hover, .mfile:hover { box-shadow: none; }
}