/* Demo niche sites (examples/*.html): shared reset + MBO demo bar. Each demo has its own design inline. */
@font-face { font-family: "Manrope"; font-weight: 400 800; font-display: swap; src: url("../assets/fonts/manrope-cyrillic.woff2") format("woff2"); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Manrope"; font-weight: 400 800; font-display: swap; src: url("../assets/fonts/manrope-latin.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+2000-206F, U+20AC, U+2122, U+2212; }

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 130px; -webkit-text-size-adjust: 100%; }
body { margin: 0; font: 16px/1.6 "Manrope", system-ui, sans-serif; -webkit-font-smoothing: antialiased; overflow-x: hidden; }
a { color: inherit; text-decoration: none; }
h1, h2, h3, h4, p, figure { margin: 0; }
ul, ol { margin: 0; padding: 0; list-style: none; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
img, svg { display: block; max-width: 100%; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { animation: none !important; transition: none !important; } }

/* MBO demo bar */
.demo-bar {
  position: sticky; top: 0; z-index: 60;
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  min-height: 46px; padding: 0 20px; font: 600 13.5px/1.3 "Manrope", system-ui, sans-serif; color: #f4f2f8;
  background: linear-gradient(90deg, #2e1065, #4c1d95); border-bottom: 1px solid rgba(255,255,255,.12);
}
.demo-bar a { color: #fff; }
.demo-bar p { margin: 0; }
.demo-bar p a { font-weight: 800; text-decoration: underline; text-underline-offset: 3px; }
.demo-bar__back { display: inline-block; padding: 12px 0; white-space: nowrap; }
.demo-bar__btn { flex-shrink: 0; padding: 9px 16px; border-radius: 999px; font-weight: 800; background: linear-gradient(135deg, #9b5cff, #7c3aed); box-shadow: 0 6px 20px -6px rgba(139,92,246,.8); }
@media (max-width: 720px) {
  .demo-bar { padding: 0 12px; font-size: 12.5px; }
  .demo-bar__note, .demo-bar__back { display: none; }
}

/* Demo toast for fake forms */
.demo-toast {
  position: fixed; left: 50%; bottom: 24px; z-index: 70; width: min(92vw, 460px);
  padding: 14px 18px; border-radius: 14px; font: 600 14px/1.45 "Manrope", system-ui, sans-serif; color: #fff;
  background: #1e1533; box-shadow: 0 20px 50px -10px rgba(0,0,0,.5); border: 1px solid rgba(167,139,250,.4);
  transform: translate(-50%, 140%); transition: transform .45s cubic-bezier(.2,.8,.2,1);
}
.demo-toast.is-on { transform: translate(-50%, 0); }