/* ─────────────────────────────────────────────────────────────
   Base compartilhada das páginas de demonstração.
   Só primitivas: reset, layout, responsividade e os selos de
   honestidade. Cor, tipografia e composição são de cada página.
   ───────────────────────────────────────────────────────────── */

*,*::before,*::after{box-sizing:border-box;}

html{-webkit-text-size-adjust:100%;}

body{
  margin:0;
  min-height:100%;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}

img,svg{max-width:100%;display:block;}
a{color:inherit;}
h1,h2,h3,p,ul{margin:0;}
ul{padding:0;list-style:none;}

:focus-visible{outline:2px solid currentColor;outline-offset:3px;}

.wrap{
  width:100%;
  max-width:var(--wrap,1080px);
  margin-inline:auto;
  padding-inline:var(--gut,clamp(20px,5vw,56px));
}

.stack{display:flex;flex-direction:column;}
.row{display:flex;flex-wrap:wrap;}

/* ── selo de conceito: a tarja que impede a página de ser
      confundida com o site oficial do estabelecimento ────────── */
.selo{
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:12px;
  line-height:1.5;
  letter-spacing:.04em;
  text-align:center;
  padding:9px clamp(16px,4vw,32px);
}

/* ── marcador de conteúdo de exemplo ──────────────────────────
      Todo bloco cujo conteúdo eu não pude verificar recebe isso,
      pra ninguém confundir amostra com informação real.        */
.exemplo{position:relative;}
.exemplo::before{
  content:"conteúdo de exemplo";
  position:absolute;
  top:0;
  right:0;
  transform:translateY(-50%);
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:10px;
  letter-spacing:.1em;
  text-transform:uppercase;
  padding:3px 8px;
  border-radius:2px;
  opacity:.75;
  pointer-events:none;
}

/* ── utilidades ───────────────────────────────────────────────── */
.tabular{font-variant-numeric:tabular-nums;}
.scroll-x{overflow-x:auto;}
.balance{text-wrap:balance;}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
    scroll-behavior:auto !important;
  }
}