/* ================= v2: checkout redesenhado + celular ================= */
.so-cel{display:none}
.invalido{border-color:var(--vermelho)!important;background:#FFF5F4!important}

/* sacola / checkout */
.sacola{background:var(--fundo)}
.sacola::before{content:"";display:block;height:10px;flex:none;background:url(../img/azulejo.svg) 0 0/40px 40px}
.sac-topo{display:grid;grid-template-columns:44px 1fr 44px;align-items:center;gap:8px;padding:12px 16px 6px;border:0;background:none}
.sac-topo h2{grid-column:2;text-align:center;background:none;padding:0;font:600 1.45rem/1.1 var(--f-display);font-variation-settings:"SOFT" 100,"WONK" 1}
.sac-topo .fechar{grid-column:3;justify-self:end}
.sac-voltar{grid-column:1;grid-row:1;width:44px;height:44px;border-radius:50%;border:0;background:#fff;display:grid;place-items:center;box-shadow:0 4px 12px -6px rgba(46,26,28,.4)}
.sac-voltar svg{width:20px;height:20px}
.sac-voltar[hidden]{display:none}
.passos-ck{list-style:none;margin:6px 16px 4px;padding:0;display:flex;counter-reset:p}
.passos-ck[hidden]{display:none}
.passos-ck li{flex:1;counter-increment:p;position:relative;text-align:center;font-size:.78rem;font-weight:700;color:rgba(46,26,28,.45);padding-top:34px}
.passos-ck li::before{content:counter(p);position:absolute;top:0;left:50%;translate:-50% 0;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:#fff;border:2px solid var(--linha);font-size:.85rem;z-index:1}
.passos-ck li+li::after{content:"";position:absolute;top:13px;right:50%;width:100%;height:2px;background:var(--linha)}
.passos-ck li.atual{color:var(--texto)}
.passos-ck li.atual::before{background:var(--pri);border-color:var(--pri);color:#fff}
.passos-ck li.ok{color:var(--texto)}
.passos-ck li.ok::before{content:"✓";background:var(--texto);border-color:var(--texto);color:#fff}
.passos-ck li.ok+li::after{background:var(--texto)}
.sac-corpo{padding:12px 16px 20px}
.sac-rodape{background:var(--fundo);border-top:1px solid var(--linha);box-shadow:0 -14px 24px -18px rgba(46,26,28,.35);padding:14px 16px calc(14px + env(safe-area-inset-bottom))}
.linha-total{font-size:1.05rem}
.linha-total span:first-child{font-weight:600}
.nota{margin:2px 0 12px}

.item{grid-template-columns:72px 1fr 32px;align-items:start;gap:12px;padding:12px;margin-bottom:10px;background:#fff;border:0;border-radius:18px;box-shadow:0 6px 16px -12px rgba(46,26,28,.5)}
.item-img{width:72px}
.item-info{min-width:0}
.item h4{font-size:1.02rem}
.item-linha{display:flex;align-items:center;justify-content:space-between;margin-top:8px}
.item-linha b{font-weight:800}
.qtd{margin:0;background:var(--fundo)}
.qtd button{background:#fff}
.item .rm{width:32px;height:32px;border-radius:50%;background:var(--fundo);text-decoration:none;opacity:.7;font-size:1.1rem;padding:0}
.item.novo{animation:destaca 1.6s ease}
@keyframes destaca{0%{box-shadow:0 0 0 3px var(--lima)}100%{box-shadow:0 6px 16px -12px rgba(46,26,28,.5)}}
.item-ok{font-style:normal;font-weight:800;color:#5c7a1c}
.continuar{width:100%;margin-top:4px;padding:14px;border:2px dashed var(--linha);border-radius:16px;background:none;font-weight:700;opacity:.8}

.form label.txt{margin:16px 0 8px;font-size:.95rem}
.form label.txt:first-child{margin-top:4px}
.form label.txt small{font-weight:500;opacity:.6}
.form input[type=text],.form textarea{border-width:2px;padding:13px 14px;font-size:16px}
.radio{display:grid;grid-template-columns:22px 1fr auto;align-items:center;gap:12px;padding:14px;margin-bottom:8px;border-radius:16px}
.radio input{margin:0}
.radio-txt b{font-size:.98rem}
.radio-txt small{display:block;font-size:.82rem;line-height:1.3;margin-top:2px}
.radio .tag{font-size:.75rem;font-weight:800;padding:5px 9px;border-radius:99px;background:var(--fundo);white-space:nowrap}
.radio:has(input:checked){border-color:var(--pri);background:#FFF7F9;box-shadow:none}
.radio:has(input:checked) .tag{background:var(--pri);color:#fff}
.radio.off{opacity:.45}
.extra{padding:0}
.duas{grid-template-columns:1fr 1.2fr}
.resumo{padding:0;margin:0 0 6px;border-radius:16px;background:#fff;box-shadow:0 6px 16px -12px rgba(46,26,28,.5)}
.resumo summary{display:flex;justify-content:space-between;gap:10px;padding:14px 16px;cursor:pointer;font-weight:700;list-style:none}
.resumo summary::after{content:"ver";font-size:.78rem;font-weight:800;color:var(--vermelho);text-decoration:underline;margin-left:6px}
.resumo[open] summary::after{content:"fechar"}
.resumo summary span{flex:1;min-width:0}
.resumo>div{display:flex;justify-content:space-between;gap:10px;padding:6px 16px;font-size:.9rem}
.resumo>div small{opacity:.6}
.resumo .resumo-ent{border-top:1px dashed var(--linha);margin-top:4px;padding-bottom:14px;padding-top:10px}
.erro{margin-top:12px}

.sucesso{padding:24px 6px}
.sucesso .check{width:84px;height:84px;margin:6px auto 14px;border-radius:50%;background:var(--wa);color:#fff;font-size:2.6rem;font-weight:800;display:grid;place-items:center;box-shadow:0 0 0 10px rgba(37,211,102,.15);animation:surge .5s cubic-bezier(.2,1.6,.4,1)}
@keyframes surge{from{scale:.3;opacity:0}}
.sucesso .num{font-size:2.3rem}
.sucesso-tot{font-weight:800;margin:4px 0 12px}
.sucesso p{line-height:1.5}
.sucesso .btn{margin-top:8px;min-height:46px;font-size:.92rem}
.sucesso .btn svg{color:var(--wa)}

.pd-acoes{grid-template-columns:1fr}

@media (max-width:760px){
  .so-cel{display:inline}.so-desk{display:none!important}
  button.so-cel,div.so-cel{display:block}

  /* topo da loja mais enxuto */
  .cab{padding:22px 0 16px;background:radial-gradient(circle at 100% 0,var(--rosinha) 0 26%,transparent 26.3%)}
  .cab .titulo{font-size:2.35rem;padding-right:64px}
  .cab p{font-size:.98rem;margin-top:8px}
  .cab-adesivo{width:56px;top:16px;right:14px}
  .passos{flex-wrap:nowrap;gap:6px;margin-top:14px}
  .passos li{padding:5px 11px 5px 5px;font-size:.8rem;gap:6px;box-shadow:0 6px 14px -10px rgba(46,26,28,.5)}
  .passos b{width:22px;height:22px;font-size:.72rem}

  /* busca rola junto; categorias compactas */
  .barra{position:static;padding:6px 0 4px;border:0}
  .busca{height:44px}
  .btn-filtro{height:44px;padding:0 16px}
  .chips{padding-top:10px}
  .chip{padding:7px 14px;font-size:.88rem}
  .contagem{margin:14px 0 12px}
  .contagem span{font-size:1.25rem}

  /* cards */
  .card .parc{display:none}
  .card h3{font-size:.95rem;margin-top:9px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .card .preco{font-size:.95rem}
  .card-img{border-radius:16px}
  .selo{top:9px;left:9px;font-size:.62rem;padding:6px 8px}
  .selo.promo{right:50px}
  .fav{width:34px;height:34px;top:8px;right:8px}
  .fav svg{width:17px;height:17px}

  /* filtros em folha que sobe */
  .painel{position:fixed;z-index:85;left:0;right:0;bottom:0;max-height:86dvh;overflow:auto;margin:0;border-radius:24px 24px 0 0;padding:0 18px calc(16px + env(safe-area-inset-bottom));box-shadow:0 -20px 50px -20px rgba(46,26,28,.5)}
  .painel.aberto{display:grid;grid-template-columns:1fr;gap:20px;animation:sobe .3s ease}
  @keyframes sobe{from{translate:0 40px;opacity:0}}
  .painel-topo{display:flex!important;justify-content:space-between;align-items:center;position:sticky;top:0;background:#fff;padding:16px 0 6px;z-index:2;font:600 1.4rem var(--f-display)}
  .painel-topo .fechar{position:static;float:none;margin:0;box-shadow:none;background:var(--fundo)}
  #aplicar{position:sticky;bottom:0;box-shadow:0 -10px 20px 6px #fff}

  /* peça em folha com puxador */
  .produto::before{content:"";display:block;width:44px;height:5px;border-radius:9px;background:rgba(46,26,28,.22);margin:10px auto 0}
  .produto>.fechar{top:8px;margin:0 12px 0 0}
  .pd-galeria{margin-top:-36px}
  .pd-main{aspect-ratio:auto;height:min(58dvh,470px)}
  .pd-thumbs button{width:54px}
  .pd-info .titulo{font-size:2rem}
  .pd-acoes{grid-template-columns:1fr 56px;gap:8px;margin:18px -16px 0;padding:10px 16px calc(10px + env(safe-area-inset-bottom));border-top:1px solid var(--linha);box-shadow:0 -14px 24px -18px rgba(46,26,28,.35)}
  .pd-acoes #comprar-ja{padding:0;min-height:52px}
  .pd-acoes #comprar-ja svg{width:24px;height:24px}
  .pd-acoes a.btn{grid-column:1/-1}
  .compartilhar{margin-top:12px}

  /* checkout ocupa a tela */
  .sacola{width:100vw}
  .toast{top:auto;bottom:calc(84px + env(safe-area-inset-bottom))}
}
.pd-acoes .btn{white-space:nowrap}

/* v3: fechar sobreposto (sem empurrar o conteúdo) */
.produto>.fechar{position:sticky;top:12px;float:none;display:grid;place-items:center;margin:12px 12px -56px auto;z-index:6}
.pd{clear:none}
@media (max-width:760px){.produto>.fechar{top:10px;margin:-6px 12px -50px auto}.pd-galeria{margin-top:0}.pd{padding-top:8px}.pd-main{height:min(56dvh,470px)}}
@media (max-width:760px) and (max-height:700px){.pd-main{height:48dvh}}
@media (min-width:521px) and (max-width:760px){.sacola{width:min(480px,100vw)}.pd,.combina{max-width:560px;margin-inline:auto}.pd-acoes{margin-inline:-16px}}
.pd-main img{object-position:50% 25%}