/* Barra superior común a todas las demos */
.demobar {
  position: sticky; top: 0; z-index: 100; height: 44px;
  display: flex; align-items: center; gap: 16px; padding: 0 16px;
  background: #09090b; color: #c4c4cc; font: 500 13px/1 Inter, system-ui, sans-serif;
  border-bottom: 1px solid rgba(255, 255, 255, .08);
}
.demobar a { color: #f4f4f5; text-decoration: none; }
.demobar__back b { font-family: "Bricolage Grotesque", Inter, sans-serif; font-weight: 800; letter-spacing: -0.03em; font-size: 15px; }
.demobar > span { flex: 1; text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.demobar__cta { background: #c6f432; color: #09090b !important; padding: 7px 14px; border-radius: 99px; font-weight: 600; white-space: nowrap; }
@media (max-width: 560px) { .demobar > span { display: none; } .demobar__cta { margin-left: auto; } }