:root { --sw-amber: #ffaf1f; }
/* VIP com o mesmo header/rodapé do site (07/10/2026). O menu da master é fixo: empurra o conteúdo */
body { padding-top: 0; }
#mainNavbar ~ main, header + .bf-topbar + main { padding-top: 0; }
/* ============================================================
   FAIXA FIXA DE BLACK FRIDAY (retângulo amarelo sob o header)
   Fica escondida acima do topo e desce/gruda ao rolar a página.
   --bf-navh é medido no JS (altura do navbar, que encolhe no scroll).
   ============================================================ */
.bf-topbar {
    position: fixed;
    top: 0;                             /* ancorado no topo; sai/entra via translateY */
    left: 0; right: 0;
    z-index: 1020;                      /* logo abaixo do navbar fixed-top (1030) */
    background: var(--sw-amber);
    color: #000;
    border-top: 1px solid rgba(0, 0, 0, .18);
    box-shadow: 0 8px 24px rgba(0, 0, 0, .28);
    transform: translateY(-100%);       /* escondido: 100% ACIMA da viewport (não vaza atrás do navbar) */
    transition: transform .35s cubic-bezier(.22, 1, .36, 1);
    will-change: transform;
}
/* visível: desce e para logo abaixo do navbar (altura medida no JS) */
.bf-topbar.show { transform: translateY(var(--bf-navh, 64px)); }

.bf-topbar-inner {
    max-width: 1180px; margin: 0 auto;
    display: flex; align-items: center; gap: 14px;
    padding: 9px 18px;
    font-size: 14px; font-weight: 600;
}
.bf-topbar-tag {
    display: inline-flex; align-items: center; gap: 6px;
    font-weight: 800; letter-spacing: .3px; text-transform: uppercase;
    font-size: 13px; white-space: nowrap;
    padding: 3px 10px; border-radius: 999px;
    background: #000; color: var(--sw-amber);
}
.bf-topbar-tag i { font-size: 14px; }
.bf-topbar-text { flex: 1 1 auto; line-height: 1.25; }
.bf-topbar-text b { font-weight: 800; }
.bf-topbar-count {
    display: inline-flex; align-items: center; gap: 8px;
    font-variant-numeric: tabular-nums; white-space: nowrap;
}
.bf-topbar-count .u { display: inline-flex; align-items: baseline; gap: 2px; font-size: 12px; font-weight: 700; }
.bf-topbar-count .u b {
    font-size: 15px; font-weight: 800;
    background: rgba(0, 0, 0, .12); border-radius: 5px; padding: 1px 5px;
}
.bf-topbar-cta {
    white-space: nowrap; text-decoration: none;
    font-weight: 800; font-size: 13px;
    color: var(--sw-amber); background: #000;
    padding: 7px 16px; border-radius: 999px;
    transition: transform .2s ease, background .2s ease;
}
.bf-topbar-cta:hover { transform: translateY(-1px); color: var(--sw-amber); background: #1a1a1a; }

@media (max-width: 767px) {
    .bf-topbar-inner { gap: 10px; padding: 8px 12px; font-size: 12.5px; }
    /* no mobile prioriza tag + contagem + CTA; texto longo some */
    .bf-topbar-text { display: none; }
    .bf-topbar-count { flex: 1 1 auto; justify-content: center; }
    .bf-topbar-tag { font-size: 12px; padding: 3px 8px; }
}

/* menu do site é fixed-top: o topo da VIP começa abaixo dele */
main { padding-top: 84px; }
@media (max-width: 991px) { main { padding-top: 72px; } }
/* botão "Schedule DEMO" do menu igual ao da Black */
#mainNavbar .btn-secondary-custom, #schedule_Cabecario_Mobile { background: #ffcb4b !important; color: #000 !important; border-color: #000 !important; border-radius: 6px !important; }
.btn-secondary-custom { background: #ffcb4b !important; color: #000 !important; border-color: #ffcb4b !important; border-radius: 6px !important; }
