/* RESET + BASE - herdado do Sinapse */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:96px}
body{
  font-family:var(--font-sans);
  font-size:var(--fs-14);
  line-height:var(--lh-base);
  letter-spacing:var(--ls-snug);
  color:var(--ink-2);
  background:var(--bg);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  font-feature-settings:'cv02','cv03','cv04','ss01';
  transition:background-color var(--t-slow) var(--e-out),color var(--t-slow) var(--e-out);
}
h1,h2,h3,h4{color:var(--ink);font-weight:600;letter-spacing:var(--ls-tight);line-height:var(--lh-tight)}
a{color:inherit;text-decoration:none;cursor:pointer}
button,input,textarea,select{font:inherit;color:inherit}
button{background:none;border:none;cursor:pointer}
::selection{background:var(--accent);color:#fff}
:focus-visible{outline:none;box-shadow:var(--focus);border-radius:var(--r-xs)}
code,kbd,samp,pre{font-family:var(--font-mono);font-size:.92em}
hr{border:none;border-top:1px solid var(--line)}
img,svg{max-width:100%}

.ic{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round;flex:none}
.ic-fill{fill:currentColor;stroke:none}

.skip{position:absolute;left:-9999px;top:8px;z-index:200;background:var(--accent);color:#fff;padding:10px 16px;border-radius:var(--r-md);font-weight:600;font-size:var(--fs-13)}
.skip:focus{left:8px}

/* Cabecalho de impressao (index/loja/pedidos): escondido na tela por
   padrao. css/print.css so carrega com media="print", entao a regra que
   reexibe isso no papel nunca chegaria a rodar se o display:none tambem
   morasse la dentro - precisa estar aqui, numa folha sempre carregada. */
.print-only{display:none}

/* - texturas assinatura - */
.mesh{position:relative}
.mesh::before{
  content:'';position:absolute;inset:0;pointer-events:none;
  background-image:linear-gradient(var(--mesh-line) 1px,transparent 1px),linear-gradient(90deg,var(--mesh-line) 1px,transparent 1px);
  background-size:var(--mesh-size) var(--mesh-size);
  -webkit-mask-image:radial-gradient(ellipse 80% 70% at 50% 0%,#000 0%,transparent 78%);
  mask-image:radial-gradient(ellipse 80% 70% at 50% 0%,#000 0%,transparent 78%);
}
.grain::after{
  content:'';position:absolute;inset:0;pointer-events:none;opacity:var(--grain-op);mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)'/%3E%3C/svg%3E");
}