/* =========================================================
   CAMPANHA TEMPORÁRIA — BLACK NOVEMBER
   Tudo escopado em html[data-campanha="black-november"].
   Para desativar: remova o atributo data-campanha do <html>
   (ou apague este arquivo e o <link> no index.html).
   ========================================================= */

/* Elementos exclusivos da campanha: escondidos fora dela.
   Especificidade (0,2,1) acima de .link/.link--bn, para o desligamento
   valer sem depender da ordem das regras. */
html:not([data-campanha="black-november"]) .bn-only { display: none; }

html[data-campanha="black-november"] {
  --gold: #ffc629;
  --gold-deep: #ff9f00;
  --ink: #07080c;
  --panel: #12141b;
  --panel-line: rgba(255, 198, 41, 0.22);
  --bn-text: #f4f5f8;
  --bn-muted: #a9afbf;
}

html[data-campanha="black-november"] body {
  color: var(--bn-text);
  background:
    radial-gradient(70% 38% at 50% 0%, rgba(255, 198, 41, 0.20), transparent 70%),
    radial-gradient(60% 30% at 0% 60%, rgba(255, 159, 0, 0.10), transparent 70%),
    radial-gradient(60% 30% at 100% 85%, rgba(255, 198, 41, 0.10), transparent 70%),
    var(--ink);
}

html[data-campanha="black-november"] a:focus-visible { outline-color: var(--gold); }

/* ---------- Faixa animada no topo ---------- */
.bn-ticker {
  overflow: hidden;
  padding-top: env(safe-area-inset-top);
  background: var(--gold);
  color: #0b0b0f;
  border-bottom: 2px solid #0b0b0f;
}

/* As duas metades do trilho são idênticas: deslocar -50% fecha o loop sem salto */
.bn-ticker__track {
  display: flex;
  width: max-content;
  animation: bn-marquee 26s linear infinite;
}

.bn-ticker__track span {
  padding: 8px 22px;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  white-space: nowrap;
}

.bn-ticker__track span::after {
  content: "✈";
  margin-left: 22px;
}

@keyframes bn-marquee {
  to { transform: translateX(-50%); }
}

/* ---------- Capa: vídeo com clima noturno/dourado ---------- */
html[data-campanha="black-november"] .profile__cover-img,
html[data-campanha="black-november"] .profile__cover-video {
  filter: saturate(0.85) contrast(1.08) brightness(0.82);
}

html[data-campanha="black-november"] .profile__cover-overlay {
  background: linear-gradient(
    180deg,
    rgba(7, 8, 12, 0.45) 0%,
    rgba(7, 8, 12, 0.05) 40%,
    rgba(7, 8, 12, 0.60) 82%,
    var(--ink) 100%
  );
}

html[data-campanha="black-november"] .profile__site {
  color: var(--gold);
  border-color: var(--panel-line);
  background: rgba(7, 8, 12, 0.55);
}

html[data-campanha="black-november"] .profile__avatar {
  background: linear-gradient(135deg, var(--gold), var(--gold-deep));
  box-shadow: 0 0 0 1px rgba(255, 198, 41, 0.35), 0 10px 40px rgba(255, 198, 41, 0.30);
}

html[data-campanha="black-november"] .profile__avatar img { border-color: var(--ink); }

html[data-campanha="black-november"] .profile__name { color: #fff; }
html[data-campanha="black-november"] .profile__badge { color: var(--gold); }

html[data-campanha="black-november"] .profile__handle {
  color: var(--gold);
  background: rgba(255, 198, 41, 0.12);
  border: 1px solid var(--panel-line);
}

html[data-campanha="black-november"] .profile__bio { color: var(--bn-muted); }

/* ---------- CTA principal: card dourado ---------- */
.link--bn {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 6px;
  padding: 22px 20px 20px;
  overflow: hidden;
  color: #0b0b0f;
  border: 0;
  border-radius: 22px;
  background:
    radial-gradient(120% 120% at 100% 0%, rgba(255, 255, 255, 0.45), transparent 50%),
    linear-gradient(135deg, #ffd24a 0%, #ffb300 100%);
  box-shadow: 0 0 0 1px rgba(255, 220, 120, 0.6), 0 18px 50px rgba(255, 179, 0, 0.35);
  animation: bn-glow 2.4s ease-in-out infinite;
}

/* Fita de aviso (listras diagonais) no topo do card */
.link--bn::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 8px;
  background: repeating-linear-gradient(-45deg, #0b0b0f 0 10px, #ffc629 10px 20px);
}

/* Reflexo de luz atravessando o card */
.link--bn::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(105deg, transparent 40%, rgba(255, 255, 255, 0.55) 50%, transparent 60%);
  transform: translateX(-170%) skewX(-18deg);
  animation: bn-sheen 3.8s ease-in-out infinite;
}

@keyframes bn-sheen {
  0%, 70% { transform: translateX(-170%) skewX(-18deg); }
  88%, 100% { transform: translateX(170%) skewX(-18deg); }
}

@keyframes bn-glow {
  0%, 100% { box-shadow: 0 0 0 1px rgba(255, 220, 120, 0.6), 0 18px 46px rgba(255, 179, 0, 0.30); }
  50% { box-shadow: 0 0 0 1px rgba(255, 220, 120, 0.9), 0 22px 64px rgba(255, 179, 0, 0.60); }
}

.bn__tag {
  margin-top: 8px;
  padding: 4px 10px;
  font-size: 0.66rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--gold);
  background: #0b0b0f;
  border-radius: 999px;
}

.bn__title {
  font-size: clamp(2rem, 11vw, 2.7rem);
  font-weight: 800;
  line-height: 0.95;
  letter-spacing: -0.03em;
  text-transform: uppercase;
}

.bn__title em { display: block; font-style: normal; }

.bn__sub {
  max-width: 28ch;
  font-size: 0.92rem;
  font-weight: 600;
  line-height: 1.35;
  color: rgba(11, 11, 15, 0.78);
}

/* Botão em largura total, caixa alta, com sombra e contorno dourado fino */
.bn__btn {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-height: 56px;
  margin-top: 12px;
  padding: 14px 22px;
  font-size: 1.02rem;
  font-weight: 800;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--gold);
  background: #0b0b0f;
  border-radius: 999px;
  box-shadow: 0 10px 26px rgba(0, 0, 0, 0.38), inset 0 0 0 1.5px rgba(255, 198, 41, 0.45);
  transition: transform 0.18s ease;
}

/* Seta com leve vai-e-vem contínuo (só transform: barato para o celular) */
.bn__btn span {
  display: inline-block;
  font-size: 1.15em;
  animation: bn-nudge 1.3s ease-in-out infinite;
}

@keyframes bn-nudge {
  0%, 100% { transform: translateX(0); }
  50% { transform: translateX(5px); }
}

.link--bn:active { transform: scale(0.98); }

/* Anel de foco dourado sumiria no card dourado: aqui é branco */
html[data-campanha="black-november"] .link--bn:focus-visible { outline-color: #fff; }

@media (hover: hover) {
  .link--bn:hover { transform: translateY(-3px); }
  .link--bn:hover .bn__btn { transform: translateY(-2px); }
}

/* ---------- Demais links: cards escuros com detalhe dourado ---------- */
html[data-campanha="black-november"] .link:not(.link--bn) {
  color: var(--bn-text);
  border: 1px solid var(--panel-line);
  background: linear-gradient(180deg, #171a23, var(--panel));
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.45), inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

html[data-campanha="black-november"] .link__title { color: #fff; }
html[data-campanha="black-november"] .link__sub { color: var(--bn-muted); }

html[data-campanha="black-november"] .link:not(.link--bn) .link__icon {
  color: #0b0b0f;
  background: linear-gradient(135deg, #ffd24a, #ffa800);
  box-shadow: none;
}

/* WhatsApp mantém o verde reconhecível. `.link.link--wa-soft` iguala a
   especificidade da regra genérica acima (0,4,1) e vence por vir depois. */
html[data-campanha="black-november"] .link.link--wa-soft .link__icon {
  color: #fff;
  background: linear-gradient(135deg, #25d366, #12934a);
}

html[data-campanha="black-november"] .link:not(.link--bn) .link__arrow { color: var(--gold); }
html[data-campanha="black-november"] .link.link--wa-soft .link__arrow { color: #25d366; }

@media (hover: hover) {
  html[data-campanha="black-november"] .link:not(.link--bn):hover {
    border-color: rgba(255, 198, 41, 0.65);
    box-shadow: 0 12px 34px rgba(255, 179, 0, 0.18);
  }
  html[data-campanha="black-november"] .link:not(.link--bn):not(.link--wa-soft):hover .link__icon {
    background: linear-gradient(135deg, #ffe07a, #ffb300);
  }
}

/* ---------- Trilha, redes e rodapé ---------- */
html[data-campanha="black-november"] .flightpath { color: rgba(255, 198, 41, 0.55); }
html[data-campanha="black-november"] .flightpath path[fill="#5aa9d6"] { fill: var(--gold); }

html[data-campanha="black-november"] .socials a {
  color: var(--gold);
  border-color: var(--panel-line);
  background: var(--panel);
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.45);
}

@media (hover: hover) {
  html[data-campanha="black-november"] .socials a:hover {
    color: #0b0b0f;
    background: var(--gold);
    border-color: var(--gold);
  }
}

html[data-campanha="black-november"] .foot { color: var(--bn-muted); }

@media (prefers-reduced-motion: reduce) {
  .bn-ticker__track { animation: none; }
  .link--bn { animation: none; }
  .link--bn::after { animation: none; display: none; }
  .bn__btn span { animation: none; }
}