/* Julia Pescados — paleta da logo: vinho, laranja, azul-petróleo e pêssego claro */
:root {
  --lata: #9c2417;
  --lata-escuro: #6f1710;
  --lata-claro: #f8ddd6;
  --creme: #fdf0e2;
  --papel: #fffaf4;
  --kraft: #f4dcc0;
  --marinho: #0b4a5c;
  --marinho-claro: #dcedf1;
  --ouro: #f79a2e;
  --ouro-escuro: #8a4a00;
  --tinta: #0f3340;
  --suave: #5a5f66;
  --linha: rgba(11, 74, 92, .22);
  --regua: #0b4a5c;
  --ok: #1d7a43;
  --alerta: #8a5d00;
  --perigo: #b3261e;
  --raio: 10px;
  --titulo: 'Alfa Slab One', 'Rockwell', 'Arial Black', serif;
  --rotulo: 'Barlow Condensed', 'Arial Narrow', sans-serif;
  --corpo: 'Hanken Grotesk', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --suave-ease: cubic-bezier(.16, 1, .3, 1);
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scrollbar-color: var(--marinho) var(--creme); scroll-behavior: smooth; }
body { margin: 0; font-family: var(--corpo); color: var(--tinta); background: var(--creme); line-height: 1.5; font-size: 16px; -webkit-font-smoothing: antialiased; }
h1, h2, h3 { font-family: var(--titulo); font-weight: 400; line-height: 1.04; margin: 0; letter-spacing: -.01em; text-wrap: balance; }
button { font: inherit; cursor: pointer; }
input, select, textarea { font: inherit; color: inherit; }
img { max-width: 100%; display: block; }
a { color: var(--lata-escuro); text-underline-offset: 3px; }
:focus-visible { outline: 3px solid var(--ouro); outline-offset: 2px; box-shadow: 0 0 0 5px var(--marinho); border-radius: 4px; }
::selection { background: var(--ouro); color: var(--marinho); }
input, textarea { caret-color: var(--lata); }
::-webkit-scrollbar { width: 12px; height: 12px; } ::-webkit-scrollbar-track { background: var(--creme); } ::-webkit-scrollbar-thumb { background: var(--marinho); border: 3px solid var(--creme); border-radius: 99px; }

.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; border: 2px solid var(--marinho); border-radius: 8px; padding: 10px 22px; font-family: var(--rotulo); font-weight: 700; font-size: 18px; letter-spacing: .06em; text-transform: uppercase; line-height: 1.1; background: var(--lata); color: var(--papel); text-decoration: none; transition: transform .25s var(--suave-ease), background .15s, color .15s; }
.btn:hover { background: var(--lata-escuro); transform: translateY(-2px); }
.btn:active { transform: translateY(0) scale(.98); }
.btn.mar { background: var(--marinho); color: var(--papel); }
.btn.mar:hover { background: #073644; }
.btn.claro { background: var(--kraft); color: var(--marinho); }
.btn.claro:hover { background: #dac99f; }
.btn.linha { background: transparent; color: var(--marinho); }
.btn.linha:hover { background: var(--marinho); color: var(--papel); }
.btn.pequeno { padding: 6px 13px; font-size: 15px; border-width: 1.5px; }
.btn.verde { background: var(--ok); color: #fff; }
.btn[disabled] { opacity: .45; pointer-events: none; }

.logo { display: inline-flex; flex-direction: column; align-items: flex-start; line-height: 1; text-decoration: none; }
.logo-marca { display: inline-flex; flex-direction: row; align-items: center; gap: 10px; text-decoration: none; }
.logo-marca img { display: block; width: 64px; height: 64px; border-radius: 50%; flex: none; }
.logo-marca span { display: flex; flex-direction: column; line-height: 1; }
.logo-marca b { font-family: var(--titulo); font-weight: 400; font-size: 30px; color: var(--lata); letter-spacing: -.01em; }
.logo-marca small { font-family: var(--rotulo); font-size: 13px; letter-spacing: .5em; font-weight: 700; color: var(--marinho); margin: 5px 0 0 2px; }
.logo-marca.branca b { color: var(--ouro); } .logo-marca.branca small { color: var(--creme); }
.logo b { font-family: var(--titulo); font-weight: 400; font-size: 34px; color: var(--lata); letter-spacing: -.01em; text-shadow: 2px 2px 0 var(--ouro); }
.logo small { font-family: var(--rotulo); font-size: 13px; letter-spacing: .5em; font-weight: 700; color: var(--marinho); margin: 5px 0 0 2px; }
.logo svg { width: 78px; height: 8px; margin: 3px 0 0 1px; color: var(--marinho); }
.logo.branca b { color: var(--ouro); text-shadow: 2px 2px 0 var(--lata); } .logo.branca small { color: var(--creme); }

.chip { display: inline-block; font-family: var(--rotulo); font-size: 14px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; padding: 1px 9px; border-radius: 4px; background: var(--marinho-claro); color: var(--marinho); border: 1.5px solid currentColor; line-height: 1.5; }
.chip.ok { background: #d9efe0; color: #14633a; } .chip.alerta { background: #fbe6b0; color: #6b4700; }
.chip.perigo { background: var(--lata-claro); color: #8f1810; } .chip.laranja { background: #fde7ad; color: #6b4700; }
.chip.rosa { background: #f6d6e3; color: #86204a; } .chip.cinza { background: #e9e5da; color: #5a4338; }

.motoboy-pin { background: var(--lata); color: #fff; width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; box-shadow: 0 2px 8px rgba(0,0,0,.35); border: 3px solid var(--papel); font-size: 11px; font-weight: 800; }
.destino-pin { background: var(--marinho); width: 22px; height: 22px; border-radius: 50% 50% 50% 0; transform: rotate(-45deg); border: 3px solid var(--papel); box-shadow: 0 2px 6px rgba(0,0,0,.35); }
.base-pin { background: var(--marinho); color: var(--ouro); padding: 4px 9px; border-radius: 4px; font-family: var(--rotulo); font-size: 14px; letter-spacing: .05em; text-transform: uppercase; font-weight: 700; white-space: nowrap; box-shadow: 0 2px 6px rgba(0,0,0,.3); }
.aviso-demo { background: var(--marinho); color: var(--creme); font-family: var(--rotulo); font-size: 15px; letter-spacing: .06em; text-transform: uppercase; padding: 6px 14px; text-align: center; font-weight: 600; }
.aviso-demo a { color: var(--ouro); }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
[hidden] { display: none !important; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } * { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; } }