/* Estilos comunes de las demos (barra de "Proyecto de muestra") */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;-webkit-font-smoothing:antialiased}
h1,h2,h3,p{margin:0}
img,svg{display:block;max-width:100%}
.demo-bar{position:sticky;top:0;z-index:100;display:flex;flex-wrap:wrap;gap:6px 16px;align-items:center;justify-content:space-between;
  padding:9px 16px;background:#f6f2fc;color:#4b3a85;border-bottom:1px solid #e3d9f5;
  font:500 13px/1.3 "DM Sans",system-ui,sans-serif}
.demo-bar a{color:#5e46a3;font-weight:600;text-decoration:none;min-height:30px;display:inline-flex;align-items:center}
.demo-bar a:hover{text-decoration:underline}
/* En las capturas para los mockups se oculta la barra */
html.shot .demo-bar{display:none}
html.shot .wa-fab{display:none}