/* Barra de apresentação Marco Zero + interações comuns dos projetos conceito.
   Cores do Manual de Marca 2026. */
.mzd-bar { position: sticky; top: 0; z-index: 9999; display: flex; align-items: center; gap: 16px; padding: 10px 20px; background: #1D1D1B; color: #fff; font: 500 13px/1.3 'Montserrat', 'Segoe UI', sans-serif; box-shadow: 0 1px 0 rgba(255,255,255,.08), 0 6px 20px rgba(0,0,0,.25); }
.mzd-bar img { height: 26px; width: auto; display: block; }
.mzd-chip { padding: 5px 10px; border-radius: 999px; background: rgba(1,167,254,.14); color: #01A7FE; font-weight: 700; letter-spacing: .5px; font-size: 11px; text-transform: uppercase; white-space: nowrap; }
.mzd-info { color: rgba(255,255,255,.7); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mzd-info b { color: #fff; }
.mzd-sp { flex: 1; }
.mzd-btn { display: inline-flex; align-items: center; gap: 6px; padding: 9px 16px; border-radius: 999px; font-weight: 700; font-size: 13px; color: #fff !important; text-decoration: none; white-space: nowrap; transition: filter .2s, transform .2s; }
.mzd-btn:hover { filter: brightness(1.12); transform: translateY(-1px); }
.mzd-ghost { box-shadow: inset 0 0 0 1px rgba(255,255,255,.25); }
.mzd-main { background: linear-gradient(135deg, #0146C8, #09358E); }
.mzd-x { background: none; border: none; color: rgba(255,255,255,.5); font-size: 20px; cursor: pointer; padding: 0 4px; }
@media (max-width: 760px) { .mzd-info, .mzd-ghost { display: none; } .mzd-bar { padding: 8px 12px; gap: 10px; } .mzd-bar img { height: 22px; } }

.mzd-toast { position: fixed; left: 50%; bottom: 28px; z-index: 10000; transform: translate(-50%, 20px); opacity: 0; max-width: calc(100% - 32px); padding: 14px 20px; border-radius: 14px; background: #1D1D1B; color: #fff; font: 500 14px/1.45 'Montserrat', 'Segoe UI', sans-serif; box-shadow: 0 18px 40px rgba(0,0,0,.3); transition: opacity .3s, transform .3s; pointer-events: none; }
.mzd-toast.on { opacity: 1; transform: translate(-50%, 0); }
.mzd-toast b { color: #01A7FE; }

/* entrada no scroll (desligada nas capturas e para quem pede menos movimento) */
html.mzd-anim .rv { opacity: 0; transform: translateY(26px); transition: opacity .8s cubic-bezier(.2,.7,.2,1), transform .8s cubic-bezier(.2,.7,.2,1); }
html.mzd-anim .rv.in { opacity: 1; transform: none; }

/* FAQ */
.faq-item .faq-a { display: none; padding: 0 0 22px; line-height: 1.65; font-weight: 400; }
.faq-item.open .faq-a { display: block; animation: mzdIn .4s ease both; }
.faq-q { cursor: pointer; }
.faq-q span { transition: transform .3s; }
.faq-item.open .faq-q span { transform: rotate(45deg); }
@keyframes mzdIn { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }
@keyframes mzdBump { 50% { transform: scale(1.25); } }
.bump { animation: mzdBump .4s ease; }
