/* r42 — adaptação mobile da vitrine pública. Desktop preservado. */
@view-transition { navigation: auto; }
::view-transition-old(root) { animation: .13s ease-in both qpm-out; }
::view-transition-new(root) { animation: .22s cubic-bezier(.16,1,.3,1) both qpm-in; }
@keyframes qpm-out { to { opacity:.6; transform:translateY(-4px); } }
@keyframes qpm-in { from { opacity:.65; transform:translateY(7px); } }

.qpm-dock { display:none; }
.banner-pause { min-height:44px; padding:0 12px; border:1px solid #d7e1cc; border-radius:10px; background:#fff; color:#24470a; font:700 12px Inter,system-ui,sans-serif; cursor:pointer; }
.banner-pause:focus-visible,.banner-ctrl .dot:focus-visible { outline:3px solid #174ea6; outline-offset:2px; }
.banner-overlay .b-preco,.banner-overlay .b-vendas { display:block; }

@media (max-width:767px) {
  :root { --qpm-dock-h:68px; }
  html { scroll-padding-top:106px; }
  body { overflow-x:clip; padding-bottom:calc(var(--qpm-dock-h) + env(safe-area-inset-bottom, 0px)); }
  body.qpm-product { padding-bottom:86px; }
  .qpm-dock {
    position:fixed; inset:auto 0 0; z-index:55;
    display:grid; grid-template-columns:repeat(4,minmax(0,1fr));
    min-height:var(--qpm-dock-h); padding:4px max(8px,env(safe-area-inset-right,0px)) calc(4px + env(safe-area-inset-bottom,0px)) max(8px,env(safe-area-inset-left,0px));
    background:#fff; border-top:1px solid #dce5d2;
    box-shadow:0 -5px 18px rgba(27,56,14,.1);
    font-family:Inter,system-ui,sans-serif;
  }
  .qpm-dock a {
    min-width:0; min-height:56px; display:flex; flex-direction:column;
    align-items:center; justify-content:center; gap:2px;
    color:#36523a; text-decoration:none; font-size:11px; line-height:1.2;
    font-weight:700; border-radius:12px; transition:background .16s,color .16s,transform .12s;
  }
  .qpm-dock a svg { width:22px; height:22px; stroke:currentColor; stroke-width:1.9; fill:none; stroke-linecap:round; stroke-linejoin:round; }
  .qpm-dock a[aria-current="page"] { color:#24470a; background:#edf5e3; }
  .qpm-dock a:active { transform:scale(.94); }
  .qpm-dock a:focus-visible { outline:3px solid #174ea6; outline-offset:-3px; }
  .qpm-product .qpm-dock { display:none; }

  /* Cabeçalho: marca reconhecível e busca de largura real no telefone. */
  .storebar { position:sticky; top:0; z-index:50; }
  .storebar .sb-in { display:grid; grid-template-columns:minmax(0,1fr); gap:5px; padding:7px 14px 9px; }
  .storebar .sb-logo { justify-self:start; min-height:35px; align-items:center; }
  .storebar .sb-brand { display:block; font-size:20px; }
  .storebar .sb-tile { width:32px; height:32px; border-radius:9px; }
  .storebar .sb-tile svg { width:25px; height:25px; }
  .storebar .sb-busca,.storebar .buscawrap { width:100%; min-width:0; }
  .storebar .sb-busca input,.storebar #busca { width:100%; min-height:44px; font-size:16px; }
  .storebar .sb-busca button,.storebar .sb-lupa { min-width:44px; min-height:44px; }
  .storebar .sb-cats,.storebar .chips { display:none; }
  .storebar .sb-trust { display:none; }
  .sb-trust-mobile { padding:5px 15px; background:#ecf4df; color:#304c21; font-size:12px; font-weight:700; }
  .sb-trilha { padding:10px 15px 0; font-size:12px; overflow-wrap:anywhere; }
  .sb-trilha + main { scroll-margin-top:106px; }

  /* Vitrine: o conteúdo de cada categoria chega antes do banner genérico. */
  html[data-pagina]:not([data-pagina="home"]) .banner-dinamico { display:none; }
  html[data-pagina]:not([data-pagina="home"]) .atalhos {
    display:flex; gap:3px; overflow-x:auto; overscroll-behavior-x:contain;
    scroll-snap-type:x proximity; padding:9px 10px 7px; scrollbar-width:none;
  }
  html[data-pagina]:not([data-pagina="home"]) .atalhos::-webkit-scrollbar { display:none; }
  html[data-pagina]:not([data-pagina="home"]) .atalhos a {
    flex:0 0 76px; min-height:61px; scroll-snap-align:center;
    font-size:11.5px; text-align:center;
  }
  html[data-pagina] .atalhos a:active .at-ic { transform:scale(.91); }
  html[data-pagina] .at-ic { transition:transform .14s cubic-bezier(.16,1,.3,1),border-color .14s; }
  html[data-pagina] .wrap { padding-left:12px; padding-right:12px; padding-bottom:22px; }
  html[data-pagina] .promo { display:none; }
  html[data-pagina] .banner-dinamico { position:relative; margin:12px 0 8px; min-height:222px; }
  html[data-pagina] .banner-trilho { min-height:178px; }
  html[data-pagina] .banner-slide { border:0; border-radius:16px; min-height:178px; }
  html[data-pagina] .banner-slide img { height:178px; object-fit:cover; }
  html[data-pagina] .banner-overlay { padding:22px 13px 12px; }
  html[data-pagina] .banner-overlay .b-nome { font-size:13px; line-height:1.25; margin-bottom:2px; }
  html[data-pagina] .banner-overlay .b-preco { font-size:22px; line-height:1.1; }
  html[data-pagina] .banner-ctrl { gap:1px; margin-top:0; }
  html[data-pagina] .banner-pause { position:absolute; top:9px; left:9px; z-index:2; min-height:44px; background:rgba(18,43,11,.86); color:#fff; border-color:rgba(255,255,255,.6); }
  html[data-pagina] .banner-ctrl .dot {
    min-width:44px; min-height:44px; border-radius:0; background:none;
    display:grid; place-items:center;
  }
  html[data-pagina] .banner-ctrl .dot::after { content:""; width:7px; height:7px; border-radius:99px; background:#c9d2c0; transition:width .18s,background .18s; }
  html[data-pagina] .banner-ctrl .dot[aria-current="true"]::after { width:18px; background:var(--brand-cta); }
  html[data-pagina] .banner-ctrl .dot[aria-current="true"] { background:none; }
  html[data-pagina] .destaques { margin:16px 0 6px; }
  html[data-pagina] .dest-slide { min-height:126px; }
  html[data-pagina] .dest-ctrl button { min-width:40px; min-height:44px; }
  html[data-pagina] section { scroll-margin-top:112px; }
  html[data-pagina] .sec-head { gap:7px; padding:3px 0; }
  html[data-pagina] .sec-head h2 { font-size:19px; line-height:1.15; }
  html[data-pagina] .sec-head .count { font-size:12px; }
  html[data-pagina] .sec-head .vertodos { min-height:44px; }
  html[data-pagina] .ordenar { gap:7px; padding:4px 0 10px; }
  html[data-pagina] .ordenar button { min-height:44px; }
  html[data-pagina] .card { border-radius:13px; border:1px solid #e3e9d9; box-shadow:0 2px 8px rgba(28,52,16,.05); }
  html[data-pagina] .card:active { transform:scale(.975); }
  html[data-pagina] .info .name { font-size:13.5px; line-height:1.35; }
  html[data-pagina] .price .now { font-size:20px; font-variant-numeric:tabular-nums; }
  html[data-pagina] .tag-desc { font-variant-numeric:tabular-nums; }
  html[data-pagina] .grpbanner { min-height:65px; }
  html[data-pagina] footer { padding-bottom:10px; }

  /* Página de grupos: escolha rápida, amostra real compacta. */
  body.qpm-groups .gp { display:flex; flex-direction:column; }
  body.qpm-groups .hero { order:0; gap:16px; padding:18px 0 16px; }
  body.qpm-groups .hero h1 { font-size:clamp(30px,8.5vw,39px); line-height:1.04; }
  body.qpm-groups .hero .sub { font-size:15px; line-height:1.45; margin-top:8px; }
  body.qpm-groups .hero-acoes { margin-top:14px; gap:9px; }
  body.qpm-groups .hero .cta { min-height:48px; font-size:16px; }
  body.qpm-groups .garantias { gap:5px 12px; font-size:12px; }
  body.qpm-groups .chat { max-width:none; padding:10px; border-radius:17px; box-shadow:0 3px 14px rgba(31,45,20,.08); }
  body.qpm-groups .chat-topo { padding-bottom:7px; margin-bottom:7px; }
  body.qpm-groups .bolha { display:grid; grid-template-columns:94px minmax(0,1fr); gap:7px; align-items:start; padding:6px; animation:none; }
  body.qpm-groups .bolha img { width:94px; height:94px; aspect-ratio:1; }
  body.qpm-groups .bolha p { padding:1px 0 0; font-size:12px; line-height:1.35; }
  body.qpm-groups .bolha .hora { grid-column:2; text-align:left; padding:0; }
  body.qpm-groups #grupos { order:1; scroll-margin-top:112px; padding-top:6px; }
  body.qpm-groups .faixa { order:2; padding-top:15px; }
  body.qpm-groups .sec:not(#grupos) { order:3; }
  body.qpm-groups .fecho { order:4; }
  body.qpm-groups .rodape { order:5; }
  body.qpm-groups .grupo { padding:13px; border-radius:15px; box-shadow:0 2px 8px rgba(31,45,20,.05); }
  body.qpm-groups .grupo .em { width:54px; height:54px; border-radius:13px; }
  body.qpm-groups .grupo + .grupo { margin-top:12px; padding-top:13px; border-top:1px solid rgba(31,45,20,.08); }
  body.qpm-groups .gname { font-size:18px; }
  body.qpm-groups .grupo p { font-size:13px; }
  body.qpm-groups .btn { min-height:48px; }
  body.qpm-groups .trilho { scroll-padding-inline:2px; }
  body.qpm-groups .oferta { flex-basis:136px; }

  /* Produto: preço e compra aparecem mais cedo, sem competir com a barra fixa. */
  body.qpm-product .fig img { height:min(72vw,310px); aspect-ratio:auto; object-fit:contain; }
  body.qpm-product .hero { padding-top:4px; }
  body.qpm-product .hero-info h1 { font-size:22px; line-height:1.13; }
  body.qpm-product .precobox { padding:14px; box-shadow:0 2px 8px rgba(31,45,20,.06); }
  body.qpm-product .preco { font-variant-numeric:tabular-nums; }
  body.qpm-product .bl,body.qpm-product .ben { box-shadow:none; }
  body.qpm-product .dor,body.qpm-product .sol { border-left-width:1px; }
  body.qpm-product .fixa { padding-bottom:env(safe-area-inset-bottom,0px); }
  body.qpm-product .fixa a:active { transform:scale(.97); }

  body.qpm-legal main { padding:20px 16px 42px; }
  body.qpm-legal h1 { font-size:clamp(28px,8vw,36px); }
  body.qpm-legal h2 { font-size:21px; line-height:1.2; }
  body.qpm-legal p,body.qpm-legal li { font-size:15px; line-height:1.6; overflow-wrap:anywhere; }
  body.qpm-error .box { margin:22px 14px; padding:28px 22px; }

  /* Guias públicos vinculados ao painel: leitura sem zoom horizontal. */
  body.qpm-tutorial { padding:16px 14px 30px; font-size:16px; line-height:1.55; }
  body.qpm-tutorial .wrap { width:100%; min-width:0; }
  body.qpm-tutorial .step { padding:16px; }
  body.qpm-tutorial .step p,body.qpm-tutorial .step li { font-size:14px; }
  body.qpm-tutorial .code-block { max-width:100%; overscroll-behavior-x:contain; }
  body.qpm-tutorial .back { min-height:44px; }
}

@media (max-width:359px) {
  .qpm-dock a { font-size:11px; }
  body.qpm-groups .bolha { grid-template-columns:78px minmax(0,1fr); }
  body.qpm-groups .bolha img { width:78px; height:78px; }
}

@media (prefers-reduced-motion:reduce) {
  @view-transition { navigation: none; }
  ::view-transition-old(root),::view-transition-new(root) { animation-duration:.01ms; }
  .qpm-dock a,html[data-pagina] .card,html[data-pagina] .at-ic,html[data-pagina] .banner-ctrl .dot::after { transition:none; }
  body.qpm-groups .bolha { animation:none; }
}

/* r43: a fileira de pontos + pausar dos Destaques (10 itens) passava da largura do celular e criava rolagem lateral */
@media (max-width:480px){
  html[data-pagina] .dest-ctrl{gap:0;max-width:100%}
  html[data-pagina] .dest-ctrl button{min-width:0;width:26px;min-height:44px}
  html[data-pagina] .dest-ctrl .pausa{width:auto;min-width:56px;padding:0 6px}
}