/* Base comum dos sites de exemplo (empresas fictícias) */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; scroll-behavior: smooth; }
body { margin: 0; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; overflow-x: clip; }
img, svg { display: block; max-width: 100%; }
h1, h2, h3, h4, p, ul, ol, figure, blockquote, dl, dd { margin: 0; }
ul, ol { padding: 0; list-style: none; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }

/* Faixa exibida só quando o exemplo é aberto fora da LP */
.pc-ribbon { display: none; }
.standalone .pc-ribbon {
  display: flex; justify-content: center; flex-wrap: wrap; gap: 4px 10px;
  padding: 10px 16px; background: #0c0b0a; color: rgba(239, 232, 220, 0.75);
  font: 500 13px/1.4 system-ui, -apple-system, "Segoe UI", sans-serif; text-align: center;
}
.pc-ribbon strong { color: #efe8dc; }
.pc-ribbon a { color: #efe8dc; text-decoration: underline; text-decoration-color: #d9493c; text-underline-offset: 3px; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
}