/* ============================================================
   BROWNIE DA NANÁ · Design system
   Gibi fofo: lettering com contorno, sombra sólida, stickers.
   ------------------------------------------------------------
   Cores com função fixa:
   --pink   ação (todo botão que avança o pedido) e escolhido
   --yellow preço em destaque, selos e título
   --mint   "tudo certo": aberto, grátis, confirmado
   --ink    chocolate: texto, contorno e sombra
   Formas: cards 22px · campos e opções 16px · botões 999px
   Sombra: sempre sólida, deslocada, cor ink (nunca desfocada)
   ============================================================ */
@font-face{font-family:Lilita;src:url('assets/lilita-one.woff2') format('woff2');font-display:swap}
@font-face{font-family:Nunito;src:url('assets/nunito-regular.ttf') format('truetype');font-weight:400;font-display:swap}
@font-face{font-family:Nunito;src:url('assets/nunito-bold.ttf') format('truetype');font-weight:700 900;font-display:swap}

:root{
  --bg:#FFF0E8; --paper:#FFFCF7; --ink:#3B1D10; --muted:#75503F; --choc:#7A4326;
  --pink:#FF5FA2; --yellow:#FFC93C; --mint:#8FE3C8; --whats:#5BE08A;
  --pink-soft:#FFD9E8; --yellow-soft:#FFF0C2; --mint-soft:#DDF7EE;
  --r-card:22px; --r-opt:16px; --r-pill:999px; --b:2.5px solid var(--ink);
  --sh:4px 4px 0 var(--ink); --sh-sm:3px 3px 0 var(--ink); --sh-lg:7px 7px 0 var(--ink);
  --display:Lilita,'Arial Black',sans-serif; --body:Nunito,system-ui,sans-serif;
  --ease:cubic-bezier(.16,1,.3,1);
  --h-header:66px;
  --z-cats:15; --z-header:20; --z-barra:25; --z-toast:60;
  color-scheme:light;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:76px}
body{margin:0;background:var(--bg);color:var(--ink);font:400 16px/1.55 var(--body);overflow-x:clip}
body.tem-barra{padding-bottom:84px}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer;text-align:inherit}
h1,h2,h3,h4,p,ul,ol,dl,dd{margin:0;padding:0}
ul,ol{list-style:none}
fieldset{border:0;margin:0;padding:0;min-width:0}
[hidden]{display:none!important}
:focus-visible{outline:3px solid var(--ink);outline-offset:3px;border-radius:8px}
.wrap{width:min(1120px,calc(100% - 32px));margin-inline:auto}
.skip{position:fixed;left:12px;top:12px;z-index:99;background:var(--yellow);border:var(--b);padding:10px 14px;border-radius:12px;font-weight:900;transform:translateY(-200%)}
.skip:focus{transform:none}
.ph{flex-shrink:0}

/* ---------- Lettering (a assinatura) ---------- */
.title{font-family:var(--display);font-weight:400;line-height:1;letter-spacing:.005em;display:flex;flex-direction:column;gap:.04em}
.title span{-webkit-text-stroke:3px var(--ink);paint-order:stroke fill;text-shadow:4px 4px 0 var(--ink)}
.t1{color:var(--pink)} .t2{color:var(--yellow)} .t3{color:var(--mint)}
h1.title{font-size:clamp(46px,13vw,84px)}
.title-md{font-size:clamp(34px,8.6vw,54px)}
.title-md span{-webkit-text-stroke:2.5px var(--ink);text-shadow:3px 3px 0 var(--ink)}
.sub{margin-top:14px;color:var(--muted);font-size:17px;max-width:52ch}
.nota{display:flex;align-items:flex-start;gap:8px;font-size:14px;font-weight:700;color:var(--muted)}
.nota .ph{font-size:18px;margin-top:2px;color:var(--ink)}

/* ---------- Componentes base ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:54px;padding:12px 26px;background:var(--pink);color:var(--ink);font-weight:900;font-size:17px;border:var(--b);border-radius:var(--r-pill);box-shadow:var(--sh);white-space:nowrap;transition:transform .18s var(--ease),box-shadow .18s var(--ease),background .2s}
.btn .ph{font-size:21px}
.btn span{padding-left:10px;border-left:2px solid color-mix(in srgb,var(--ink) 35%,transparent)}
.btn:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--ink)}
.btn:active{transform:translate(3px,3px);box-shadow:1px 1px 0 var(--ink)}
.btn-lg{min-height:60px;padding:14px 30px;font-size:18px}
.btn-block{width:100%}
.btn-whats{background:var(--whats)}
.btn.is-off{background:var(--paper);color:var(--muted);box-shadow:none;border-style:dashed}
.btn.is-off:hover{transform:none}
.link{display:inline-flex;align-items:center;gap:8px;font-weight:900;font-size:15px;text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:2px;min-height:44px}
.link:hover{text-decoration-color:var(--pink)}
.link .ph{font-size:18px}
.icon-btn{width:48px;height:48px;display:grid;place-items:center;border:var(--b);border-radius:var(--r-pill);background:var(--paper);font-size:22px;box-shadow:var(--sh-sm);transition:transform .18s var(--ease),background .2s}
.icon-btn:hover{background:var(--yellow);transform:translate(-1px,-1px)}
.c-pink{background:var(--pink)} .c-yellow{background:var(--yellow)} .c-mint{background:var(--mint)}
.passo-ic{flex-shrink:0;width:52px;height:52px;display:grid;place-items:center;border:var(--b);border-radius:18px;box-shadow:var(--sh-sm);font-size:26px;transform:rotate(-5deg)}
.tags{display:flex;flex-wrap:wrap;gap:6px}
.tag{display:inline-flex;align-items:center;gap:5px;padding:3px 9px;border:2px solid var(--ink);border-radius:var(--r-pill);background:var(--paper);font-weight:900;font-size:12px;line-height:1.3}
.tag .ph{font-size:14px}
.preco{font:400 22px/1 var(--display);display:flex;flex-direction:column;gap:3px}
.preco small{font:700 11px/1 var(--body);color:var(--muted)}
.mais{flex-shrink:0;width:44px;height:44px;display:grid;place-items:center;background:var(--pink);border:var(--b);border-radius:50%;box-shadow:var(--sh-sm);font-size:20px;transition:transform .18s var(--ease),box-shadow .18s var(--ease)}
.mais.tem{background:var(--mint)}
.mais b{font:400 20px/1 var(--display)}
.stepper{display:inline-flex;align-items:center;border:var(--b);border-radius:var(--r-pill);background:var(--paper);flex-shrink:0}
.stepper button{width:48px;height:49px;display:grid;place-items:center;font-size:19px;border-radius:50%}
.stepper button:hover:not(:disabled){background:var(--yellow-soft)}
.stepper button:disabled{opacity:.3;cursor:default}
.stepper output{min-width:22px;text-align:center;font:400 20px/1 var(--display)}
.stepper-sm button{width:40px;height:39px;font-size:16px}
.stepper-sm output{font-size:18px}

/* ---------- Aviso de demonstração e header ---------- */
.demo{display:flex;align-items:center;justify-content:center;gap:8px;padding:7px 16px;background:var(--ink);color:var(--paper);font-weight:700;font-size:13px;text-align:center}
.demo .ph{font-size:16px;color:var(--yellow)}
.header{position:sticky;top:0;z-index:var(--z-header);background:color-mix(in srgb,var(--bg) 94%,transparent);backdrop-filter:blur(8px);border-bottom:var(--b)}
.header-in{display:flex;align-items:center;justify-content:space-between;min-height:var(--h-header);gap:14px}
.logo{display:flex;align-items:center;gap:8px}
.logo-mark{width:46px;height:46px;transition:transform .4s var(--ease)}
.logo:hover .logo-mark{transform:rotate(-10deg) scale(1.06)}
.wm{display:flex;flex-direction:column;align-items:flex-start;line-height:.9}
.wm-1{font:900 8.5px/1 var(--body);letter-spacing:.14em;color:var(--yellow);background:var(--ink);padding:4px 7px 3px;border-radius:var(--r-pill);transform:rotate(-4deg);margin:0 0 -2px -2px;position:relative;z-index:1}
.wm-2{font:400 29px/1 var(--display);color:var(--pink);-webkit-text-stroke:2px var(--ink);paint-order:stroke fill;text-shadow:2px 2px 0 var(--ink)}
.nav{display:none;gap:28px;font-weight:900;font-size:15px}
.nav a:hover{text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:2px}
.header-acts{display:flex;align-items:center;gap:10px}
.status{display:none;align-items:center;gap:6px;padding:6px 12px;border:2px solid var(--ink);border-radius:var(--r-pill);background:var(--paper);font-weight:900;font-size:13px;white-space:nowrap}
.status.is-aberto{background:var(--mint)}
.status .ph{font-size:16px}
.sacola-btn{position:relative;width:48px;height:48px;display:grid;place-items:center;background:var(--yellow);border:var(--b);border-radius:50%;box-shadow:var(--sh-sm);font-size:23px;transition:transform .18s var(--ease)}
.sacola-btn:hover{transform:translate(-1px,-1px) rotate(-6deg)}
.sacola-btn b{position:absolute;right:-7px;top:-7px;min-width:24px;height:24px;padding:0 5px;display:grid;place-items:center;background:var(--pink);border:2px solid var(--ink);border-radius:var(--r-pill);font:400 14px/1 var(--display)}
.sacola-btn.pula{animation:pula .6s var(--ease)}
@keyframes pula{30%{transform:translateY(-9px) rotate(-12deg) scale(1.12)}60%{transform:translateY(2px) rotate(6deg)}}

/* ---------- Hero ---------- */
.hero{display:grid;gap:26px;padding-block:30px 46px}
.lead{margin-block:18px 22px;font-size:18px;max-width:34ch}
.hero-actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px 24px}
.hero-art{position:relative;height:300px;display:grid;place-items:center}
.sun{position:absolute;width:290px;height:290px;border-radius:50%;background:repeating-linear-gradient(180deg,var(--yellow) 0 20px,var(--yellow-soft) 20px 28px);border:var(--b)}
.polaroid{position:absolute;padding:8px 8px 26px;background:var(--paper);border:var(--b);border-radius:10px;box-shadow:var(--sh-lg);transition:transform .5s var(--ease)}
.polaroid img{border:2px solid var(--ink);border-radius:5px;aspect-ratio:1;object-fit:cover;background:var(--yellow-soft)}
.p-a{width:190px;transform:rotate(5deg) translateX(26px)}
.p-b{width:150px;transform:rotate(-11deg) translate(-96px,22px)}
.hero-art:hover .p-a{transform:rotate(2deg) translate(34px,-6px)}
.hero-art:hover .p-b{transform:rotate(-15deg) translate(-110px,22px)}
.burst{position:absolute;right:0;top:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;width:112px;height:112px;padding:14px;background:var(--pink);font:900 10.5px/1.1 var(--body);clip-path:polygon(50% 0%,59.6% 14.3%,75% 6.7%,76.2% 23.8%,93.3% 25%,85.7% 40.4%,100% 50%,85.7% 59.6%,93.3% 75%,76.2% 76.2%,75% 93.3%,59.6% 85.7%,50% 100%,40.4% 85.7%,25% 93.3%,23.8% 76.2%,6.7% 75%,14.3% 59.6%,0% 50%,14.3% 40.4%,6.7% 25%,23.8% 23.8%,25% 6.7%,40.4% 14.3%);transform:rotate(10deg)}
.burst b{font:400 30px/1 var(--display);display:block}
.sticker{position:absolute;left:0;bottom:6px;display:inline-flex;align-items:center;gap:7px;padding:9px 14px;background:var(--mint);border:var(--b);border-radius:14px;box-shadow:var(--sh);font-weight:900;font-size:13px;transform:rotate(-5deg)}
.sticker .ph{font-size:18px}

/* ---------- Faixa de marca ---------- */
.band{background:var(--pink);border-block:var(--b);overflow:hidden;transform:rotate(-1.2deg);margin:-4px -8px;position:relative;z-index:3}
.band-track{display:flex;width:max-content}
.band-set{display:flex;align-items:center;gap:22px;padding:10px 11px;font:400 23px/1 var(--display);white-space:nowrap}
.band-set span{color:var(--paper);-webkit-text-stroke:2px var(--ink);paint-order:stroke fill;text-shadow:2px 2px 0 var(--ink)}
.band-set span:nth-of-type(2n){color:var(--yellow)}
.band-set .ph{font-size:20px}
@media (prefers-reduced-motion:no-preference){.band-track{animation:band 44s linear infinite}@keyframes band{to{transform:translateX(-50%)}}}

/* ---------- Cardápio ---------- */
.cardapio{padding-block:26px 30px}
.infos{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.infos li,.infos a{display:inline-flex;align-items:center;gap:6px}
.infos li{padding:6px 12px;border:2px solid var(--ink);border-radius:var(--r-pill);background:var(--paper);font-weight:900;font-size:13px}
.infos li.is-aberto{background:var(--mint)}
.infos .ph{font-size:16px}
.infos a:hover{text-decoration:underline;text-underline-offset:3px}
.repetir{display:flex;align-items:center;gap:14px;width:100%;max-width:520px;margin-top:22px;padding:12px 16px 12px 12px;background:var(--mint-soft);border:var(--b);border-radius:var(--r-card);box-shadow:var(--sh);transition:transform .18s var(--ease)}
.repetir:hover{transform:translate(-2px,-2px)}
.repetir>span:nth-child(2){flex:1;min-width:0;display:flex;flex-direction:column}
.repetir b{font:400 19px/1.2 var(--display)}
.repetir small{font-size:13px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.repetir>.ph{font-size:22px}
.cats{position:sticky;top:0;z-index:var(--z-cats);margin-top:26px;background:color-mix(in srgb,var(--bg) 94%,transparent);backdrop-filter:blur(8px);border-block:var(--b)}
.cats-in{display:flex;gap:8px;padding-block:10px;overflow-x:auto;scrollbar-width:none;width:100%;padding-inline:16px}
.cats-in::-webkit-scrollbar{display:none}
.cat-chip{flex-shrink:0;display:inline-flex;align-items:center;gap:7px;min-height:44px;padding:8px 15px;border:var(--b);border-radius:var(--r-pill);background:var(--paper);font-weight:900;font-size:14px;transition:background .2s,box-shadow .2s var(--ease),transform .2s var(--ease)}
.cat-chip .ph{font-size:19px}
.cat-chip:hover{background:var(--yellow-soft)}
.cat-chip.is-on{background:var(--yellow);box-shadow:var(--sh-sm);transform:translate(-1px,-1px)}
.cat{padding-top:40px}
.cat-head{display:flex;align-items:center;gap:14px;margin-bottom:18px}
.cat-ic{flex-shrink:0;width:50px;height:50px;display:grid;place-items:center;background:var(--yellow);border:var(--b);border-radius:50%;box-shadow:var(--sh-sm);font-size:25px}
.cat:nth-of-type(3n+2) .cat-ic{background:var(--pink)} .cat:nth-of-type(3n) .cat-ic{background:var(--mint)}
.cat-head h3{font:400 28px/1.05 var(--display)}
.cat-head p{color:var(--muted);font-size:14.5px;line-height:1.35;margin-top:3px}
.grid{display:grid;gap:14px}
.card{background:var(--paper);border:var(--b);border-radius:var(--r-card);box-shadow:var(--sh);transition:transform .2s var(--ease),box-shadow .2s var(--ease)}
.card:hover{transform:translate(-2px,-3px);box-shadow:var(--sh-lg)}
.card:hover .mais{transform:rotate(90deg)}
.card:active{transform:translate(2px,2px);box-shadow:1px 1px 0 var(--ink)}
.card-btn{display:grid;grid-template-columns:118px 1fr;gap:14px;width:100%;height:100%;padding:10px;border-radius:calc(var(--r-card) - 3px)}
.card-foto{align-self:start;border:var(--b);border-radius:15px;overflow:hidden;background:var(--yellow-soft)}
.card-foto img{width:100%;aspect-ratio:1;object-fit:cover;transition:transform .5s var(--ease)}
.card:hover .card-foto img{transform:scale(1.06) rotate(-1.5deg)}
.card-info{display:flex;flex-direction:column;gap:6px;min-width:0;padding:2px 2px 2px 0}
.card-nome{font:400 20px/1.1 var(--display)}
.card-desc{color:var(--muted);font-size:14px;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.card-pe{display:flex;align-items:flex-end;justify-content:space-between;gap:10px;margin-top:auto;padding-top:4px}
.selo{align-self:flex-start;display:inline-flex;align-items:center;gap:5px;padding:4px 10px;background:var(--pink);border:2px solid var(--ink);border-radius:var(--r-pill);font-weight:900;font-size:12px;transform:rotate(-2deg)}
.selo .ph{font-size:14px}
.card-destaque{background:var(--yellow-soft)}

/* ---------- Como funciona ---------- */
.como{padding-block:64px}
.passos{display:grid;gap:26px;margin-top:34px;counter-reset:p}
.passos li{display:grid;grid-template-columns:auto 1fr;column-gap:16px;align-items:start}
.passos .passo-ic{grid-row:span 2}
.passos li:nth-child(2) .passo-ic{transform:rotate(4deg)}
.passos h3{font:400 23px/1.1 var(--display)}
.passos p{color:var(--muted);margin-top:4px;max-width:30ch}

/* ---------- Entrega ---------- */
.entrega{background:var(--yellow);border-block:var(--b);padding-block:56px;background-image:radial-gradient(color-mix(in srgb,var(--ink) 16%,transparent) 1.2px,transparent 1.2px);background-size:16px 16px}
.entrega-in{display:grid;gap:22px}
.entrega-card,.horario-card{background:var(--paper);border:var(--b);border-radius:var(--r-card);box-shadow:var(--sh-lg);padding:24px 20px}
.bairros{display:grid;gap:8px;margin-block:22px 16px}
.bairros li{display:flex;align-items:center;gap:10px;padding:10px 14px;border:2px solid var(--ink);border-radius:var(--r-opt);font-weight:700}
.bairros li:first-child{background:var(--mint-soft)}
.bairros .ph{font-size:20px}
.bairros span{flex:1}
.bairros b{font:400 18px/1 var(--display)}
.horario-card h3{font:400 26px/1.1 var(--display);margin-block:14px 12px}
.horarios{margin-bottom:16px}
.horarios li{display:flex;justify-content:space-between;gap:12px;padding:8px 12px;border-radius:12px;font-weight:700}
.horarios li.is-hoje{background:var(--yellow-soft);outline:2px solid var(--ink)}
.horarios li.is-off{color:var(--muted)}
.horarios b{font-weight:900}

/* ---------- Dúvidas ---------- */
.duvidas{padding-block:64px}
.duvidas-in{display:grid;gap:28px}
.faq{display:grid;gap:12px}
.faq details{background:var(--paper);border:var(--b);border-radius:var(--r-card);box-shadow:var(--sh-sm);transition:box-shadow .2s var(--ease)}
.faq details[open]{box-shadow:var(--sh);background:var(--pink-soft)}
.faq summary{display:flex;align-items:center;gap:12px;min-height:60px;padding:12px 16px;font:400 19px/1.2 var(--display);cursor:pointer;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary .ph:first-child{font-size:24px}
.faq summary .ph:last-child{margin-left:auto;font-size:18px;transition:transform .3s var(--ease)}
.faq details[open] summary .ph:last-child{transform:rotate(180deg)}
.faq p{padding:0 18px 18px 52px;max-width:58ch}

/* ---------- Rodapé ---------- */
.footer{background:var(--pink);border-top:var(--b);padding-block:34px}
.footer-in{display:grid;gap:18px;justify-items:start;font-weight:700}
.footer .wm-2{color:var(--yellow)}
.footer-links{display:flex;gap:12px}

/* ---------- Barra da sacola (celular) ---------- */
.barra{position:fixed;left:12px;right:12px;bottom:max(12px,env(safe-area-inset-bottom));z-index:var(--z-barra);display:flex;align-items:center;gap:12px;min-height:60px;padding:8px 20px 8px 10px;background:var(--pink);border:var(--b);border-radius:var(--r-pill);box-shadow:var(--sh);font-weight:900;font-size:17px;animation:sobe .5s var(--ease)}
.barra-qtd{position:relative;width:42px;height:42px;display:grid;place-items:center;background:var(--paper);border:2px solid var(--ink);border-radius:50%;font-size:21px}
.barra-qtd b{position:absolute;right:-6px;top:-6px;min-width:22px;height:22px;display:grid;place-items:center;background:var(--yellow);border:2px solid var(--ink);border-radius:var(--r-pill);font:400 13px/1 var(--display)}
.barra-txt{flex:1}
.barra-total{font:400 21px/1 var(--display)}
@keyframes sobe{from{transform:translateY(120%)}}
.toast{position:fixed;left:50%;top:78px;z-index:var(--z-toast);display:flex;align-items:center;gap:8px;padding:10px 18px;background:var(--mint);border:var(--b);border-radius:var(--r-pill);box-shadow:var(--sh);font-weight:900;font-size:14px;white-space:nowrap;transform:translate(-50%,-160px);transition:transform .45s var(--ease);pointer-events:none}
.toast.on{transform:translate(-50%,0)}
.toast .ph{font-size:19px}

/* ---------- Entrada ao rolar ---------- */
@media (prefers-reduced-motion:no-preference){
  .js .rv{opacity:0;translate:0 20px}
  .js .rv.in{opacity:1;translate:0 0;transition:opacity .6s var(--ease),translate .6s var(--ease);transition-delay:calc(var(--i,0)*70ms)}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}

/* ---------- A partir de tablet ---------- */
@media (min-width:720px){
  .wrap{width:min(1120px,calc(100% - 56px))}

  .grid{grid-template-columns:1fr 1fr;gap:18px}
  .card-btn{grid-template-columns:140px 1fr;padding:12px}
  .card-destaque{grid-column:span 2}
  .card-destaque .card-btn{grid-template-columns:240px 1fr;gap:22px}
  .card-destaque .card-nome{font-size:32px}
  .card-destaque .card-desc{font-size:16px;max-width:38ch}
  .card-destaque .card-info{padding-block:10px;gap:10px}
  .card-destaque .preco{font-size:30px}
  .grid:has(.card-destaque)>.card:last-child:nth-child(even),
  .grid:not(:has(.card-destaque))>.card:last-child:nth-child(odd){grid-column:span 2}
  .passos{grid-template-columns:repeat(3,1fr);gap:30px}
  .passos li{grid-template-columns:1fr;row-gap:8px}
  .passos .passo-ic{grid-row:auto;margin-bottom:8px}
  .passos li:nth-child(2){margin-top:26px}
  .passos li:nth-child(3){margin-top:52px}
  .entrega-in{grid-template-columns:1.5fr 1fr;align-items:start;gap:30px}
  .entrega-card{padding:34px}
  .horario-card{transform:rotate(2deg);margin-top:30px}
  .bairros{grid-template-columns:1fr 1fr}
  .footer-in{grid-template-columns:auto 1fr auto;align-items:center;gap:40px}
  .cats-in{padding-inline:0;width:min(1120px,calc(100% - 56px))}
}
@media (min-width:960px){
  body.tem-barra{padding-bottom:0}
  .barra{display:none}
  .nav{display:flex}
  .hero{grid-template-columns:1.05fr 1fr;align-items:center;gap:40px;padding-block:56px 84px}
  .lead{font-size:20px}
  .hero-art{height:480px}
  .sun{width:430px;height:430px}
  .p-a{width:290px;padding:11px 11px 38px;transform:rotate(5deg) translateX(50px)}
  .p-b{width:220px;padding:10px 10px 32px;transform:rotate(-11deg) translate(-150px,50px)}
  .hero-art:hover .p-a{transform:rotate(2deg) translate(60px,-8px)}
  .hero-art:hover .p-b{transform:rotate(-15deg) translate(-172px,50px)}
  .burst{width:140px;height:140px;right:2%;top:2%;font-size:12.5px}
  .burst b{font-size:38px}
  .sticker{left:2%;bottom:8%;font-size:15px;padding:11px 18px}
  .band-set{font-size:28px;padding-block:13px}
  .cardapio{padding-top:44px}
  .como,.duvidas{padding-block:96px}
  .entrega{padding-block:84px}
  .duvidas-in{grid-template-columns:.8fr 1.2fr;gap:50px;align-items:start}
  .duvidas-in>.title{position:sticky;top:150px}
}

/* ---------- v3: loja direta, menos coisa com cara de botão ---------- */
.sacola-btn{position:fixed;right:14px;top:10px;z-index:var(--z-header)}
.marca{display:flex;flex-direction:column;align-items:center;gap:4px;padding-top:8px}
.marca-nana{width:132px;height:132px}
.marca .wm{align-items:center}
.marca .wm-1{font-size:13px;padding:6px 12px 5px;margin:0 0 -6px}
.marca .wm-2{font-size:82px;-webkit-text-stroke:4px var(--ink);text-shadow:5px 5px 0 var(--ink)}
.infos{flex-direction:column;align-items:center;gap:6px;margin-top:18px;text-align:center}
.infos li{padding:0;border:0;background:none;font-weight:700;font-size:15px;color:var(--muted);flex-wrap:wrap;justify-content:center}
.infos .ph{font-size:18px;color:var(--ink)}
.infos b{font-weight:900;color:var(--ink)}
.infos b::before{content:"· "}
.infos b.is-aberto{background:var(--mint);padding:0 8px;border-radius:var(--r-pill)}
.infos b.is-aberto::before{content:""}
.repetir{margin-inline:auto}
.cats{margin-top:24px;border-top:0}
.cats-in{gap:26px;justify-content:center;padding-block:0}
.cat-chip,.cat-chip:hover,.cat-chip.is-on{min-height:52px;padding:0;border:0;border-radius:0;background:none;box-shadow:none;transform:none;font-size:15px;color:var(--muted);border-bottom:4px solid transparent}
.cat-chip:hover{color:var(--ink)}
.cat-chip.is-on{color:var(--ink);border-bottom-color:var(--pink)}
.tag{padding:0;border:0;background:none;font-weight:700;font-size:13px;color:var(--muted)}
.entrega{padding-block:44px}
.entrega-card{max-width:760px;margin-inline:auto}
.fatos{display:grid;gap:18px;margin-top:22px}
.fatos dt{display:flex;align-items:center;gap:8px;font:400 20px/1.1 var(--display);margin-bottom:3px}
.fatos dt .ph{font-size:22px}
.fatos dd{color:var(--muted)}
.fatos dd b{color:var(--ink);font-weight:900}
@media (min-width:960px){.marca-nana{width:150px;height:150px}.marca .wm-2{font-size:96px}.entrega{padding-block:64px}.sacola-btn{right:24px;top:16px;width:56px;height:56px;font-size:26px}}
.cats-in{justify-content:flex-start;gap:20px;padding-right:76px}
@media (min-width:720px){.cats-in{justify-content:center;gap:30px;padding-right:0}}
.infos li{flex-wrap:nowrap}
.infos li:nth-child(2){flex-wrap:wrap}
@media (max-width:719px){.demo{padding-right:74px;justify-content:flex-start;text-align:left}}

/* ---------- v5: foto ocupa a lateral inteira do card, preço em uma linha ---------- */
.card{overflow:hidden}
.card-btn,.card-destaque .card-btn{grid-template-columns:116px 1fr;gap:0;padding:0;align-items:stretch}
.card-foto{align-self:stretch;border:0;border-right:var(--b);border-radius:0;min-height:124px}
.card-foto img{height:100%;aspect-ratio:auto}
.card-info{padding:12px 12px 12px 14px;gap:4px}
.card-pe{align-items:center;padding-top:8px}
.preco{flex-direction:row;align-items:baseline;gap:6px;flex-wrap:wrap}
.preco small{font-size:12px}
.mais{width:40px;height:40px;font-size:18px}
@media (min-width:720px){.card-btn,.card-destaque .card-btn{grid-template-columns:150px 1fr}.card-info{padding:16px 16px 16px 18px}}
.preco{flex-direction:column;align-items:flex-start;gap:2px;flex-wrap:nowrap}
.card-foto img{position:absolute;inset:0;width:100%;height:100%}
.card-foto{position:relative}

/* ---------- v6: entrega com mapa e conferência de endereço ---------- */
.entrega-in{display:grid;gap:18px;grid-template-columns:1fr}
.entrega-card{max-width:none;margin:0;padding:22px 18px}
.mapa{position:relative;z-index:0;height:260px;border:var(--b);border-radius:var(--r-card);box-shadow:var(--sh-lg);overflow:hidden;background:var(--paper)}
.mapa .leaflet-container{font:inherit}
.mapa-erro{display:flex;gap:8px;padding:20px;font-weight:700;color:var(--muted)}
.form-area{display:grid;gap:10px;margin-top:18px}
.form-area .link{justify-self:center}
.area-res{display:flex;gap:10px;align-items:flex-start;margin-top:14px;padding:12px 14px;border:var(--b);border-radius:var(--r-opt);background:var(--yellow-soft);font-size:15px}
.area-res>.ph{font-size:24px;margin-top:1px}
.area-res.is-ok{background:var(--mint)}
.area-res.is-fora{background:var(--pink-soft)}
.area-res .link{display:flex;margin-top:2px}
.entrega-fatos{display:grid;gap:10px;margin-top:20px;padding-top:18px;border-top:2px dashed color-mix(in srgb,var(--ink) 35%,transparent)}
.entrega-fatos li{display:flex;gap:10px;align-items:flex-start;color:var(--muted);font-size:15px}
.entrega-fatos .ph{font-size:20px;color:var(--ink);margin-top:1px}
.entrega-fatos b{color:var(--ink);font-weight:900}
@media (min-width:860px){.entrega-in{grid-template-columns:1fr 1.15fr;align-items:stretch;gap:28px}.mapa{order:2;height:auto;min-height:480px}.entrega-card{padding:32px}}

/* v9: rolagem no celular */
@media (pointer:coarse){.mapa,.mapa .leaflet-container{touch-action:pan-y}}
.cats-in{position:relative;overscroll-behavior-x:contain}

/* ---------- v10: entrega sem fundo amarelo, ícone nos títulos, motinha na pista ---------- */
.entrega{background:none;background-image:none;border-block:0;padding-block:8px 44px}
.sec-head{display:flex;align-items:center;gap:14px}
.sec-head .cat-ic{width:54px;height:54px;font-size:27px;transform:rotate(-6deg)}
.sec-head .cat-ic.c-mint{background:var(--mint)} .sec-head .cat-ic.c-pink{background:var(--pink)}
.duvidas-in>.sec-head{align-self:start}
.pista{position:relative;height:46px;margin-bottom:26px;overflow:hidden;border-bottom:3px dashed var(--ink)}
.pista .ph{position:absolute;left:0;bottom:1px;font-size:38px;color:var(--ink)}
@media (prefers-reduced-motion:no-preference){
  .pista .ph{animation:moto 9s linear infinite}
  @keyframes moto{from{transform:translateX(-60px)}to{transform:translateX(100vw)}}
}
@media (prefers-reduced-motion:reduce){.pista .ph{left:12%}}
@media (min-width:960px){.entrega{padding-block:8px 72px}.duvidas-in>.sec-head{position:sticky;top:90px}}

/* ---------- v11: pagamento, horário e contato no lugar do FAQ ---------- */
.infos-fim{padding-block:8px 56px}
.infos-fim-in{display:grid;gap:26px}
.infos-fim li{display:grid;grid-template-columns:auto 1fr;column-gap:14px;row-gap:2px;align-items:center}
.infos-fim .cat-ic{grid-row:span 2;align-self:start;transform:rotate(-5deg)}
.infos-fim .cat-ic.c-pink{background:var(--pink)} .infos-fim .cat-ic.c-yellow{background:var(--yellow)} .infos-fim .cat-ic.c-mint{background:var(--mint)}
.infos-fim h2{font:400 24px/1.1 var(--display)}
.infos-fim p{color:var(--muted);max-width:36ch}
.infos-fim p b{color:var(--ink);font-weight:900}
.infos-fim .link{min-height:36px;color:var(--ink)}
@media (min-width:860px){.infos-fim-in{grid-template-columns:repeat(3,1fr);gap:36px}.infos-fim{padding-block:8px 84px}}

/* v12: menos texto */
.cat-head{margin-bottom:16px}
.entrega-nota{margin-top:18px}
.infos-fim li{row-gap:0}

/* ilustrações no lugar das fotos: cabem inteiras, sem zoom no toque */
.card:hover .card-foto img{transform:none}
.card-foto img,.item img,.junto-btn img,.prod-topo img{object-fit:cover}