/* hidratei clone - carrinho, drawer, checkout PIX e obrigado.
   Mobile-first: tudo compacto, alvos de toque >= 44px, input com 16px (evita zoom no iOS). */
:root{
  --hd-azul:#4dccec; --hd-azul-esc:#2fa8c9;
  --hd-txt:#23272b; --hd-mut:#6b7280;
  --hd-cinza:#f6f8f9; --hd-borda:#e5e9ec;
  --hd-ok:#137a3f; --hd-ok-bg:#e9f8ef;
  --hd-pix:#32bcad; --hd-pix-esc:#26a396;
  --hd-sombra:0 6px 24px rgba(16,24,40,.08);
  --hd-raio:14px;
}
html.hd-lock,html.hd-lock body{overflow:hidden!important}
/* paginas funcionais (checkout/obrigado): o widget flutuante do tema cobre o botao
   de pagar no celular - fica escondido so nelas */
body.hd-func .pl-widget,body.hd-func [data-pl-widget-abrir]{display:none!important}
body.hd-func .pl-widget-layer{display:none!important}

/* ---------- tipografia/util ---------- */
.hd-h1{font-size:1.45rem;line-height:1.2;margin:0 0 6px;font-weight:700;letter-spacing:-.01em}
.hd-h2{font-size:1.3rem;line-height:1.25;margin:0 0 8px;font-weight:700}
.hd-h4{font-size:.82rem;text-transform:uppercase;letter-spacing:.07em;margin:0 0 12px;font-weight:700;color:#41474d}
.hd-muted{color:var(--hd-mut);font-size:.88rem;line-height:1.45;margin:0 0 14px}
.hd-ok{color:var(--hd-ok)!important}
.hd-link{background:none;border:0;padding:0;color:#5b6470;font-size:.82rem;text-decoration:underline;cursor:pointer;font-family:inherit}
.hd-spin{display:inline-block;width:14px;height:14px;border:2px solid rgba(255,255,255,.45);border-top-color:#fff;
  border-radius:50%;animation:hd-spin .7s linear infinite;vertical-align:-2px;margin-right:6px}
@keyframes hd-spin{to{transform:rotate(360deg)}}

/* ---------- botao ---------- */
.hd-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:12px 20px;
  border-radius:12px;border:1px solid transparent;font-family:inherit;font-size:.95rem;font-weight:700;line-height:1.1;
  cursor:pointer;text-decoration:none;transition:transform .06s ease,background .15s,border-color .15s,opacity .15s;
  -webkit-tap-highlight-color:transparent}
.hd-btn:active{transform:scale(.985)}
.hd-btn--pri{background:var(--hd-txt);color:#fff}
.hd-btn--pri:hover{background:#111}
.hd-btn--ghost{background:#fff;color:var(--hd-txt);border-color:#d5dbe1}
.hd-btn--ghost:hover{border-color:#a9b4bf}
.hd-btn--full{width:100%;display:flex}
.hd-btn--grande{min-height:52px;font-size:1rem}
.hd-btn[disabled]{opacity:.6;cursor:progress}

/* ---------- icone PIX (glifo oficial, branco sobre tile teal) ---------- */
/* tile do PIX: SIMBOLO OFICIAL (o losango de 4 lobos do Banco Central), branco
   sobre o verde-agua da marca. Ver PIX_D/PIX_VB no hd.js. */
.hd-pixico{display:inline-flex;align-items:center;justify-content:center;background:var(--hd-pix);
  border-radius:27%;flex:0 0 auto;color:#fff;overflow:hidden;box-shadow:inset 0 -1px 0 rgba(0,0,0,.05)}
.hd-pixico svg{width:68%;height:68%;display:block}
.hd-pixico--xs{width:26px;height:26px;border-radius:8px}
.hd-pixico--sm{width:32px;height:32px;border-radius:9px}
.hd-pixico--md{width:42px;height:42px;border-radius:11px}
.hd-pixico--lg{width:52px;height:52px;border-radius:14px}

/* ---------- selo/regra ---------- */
.hd-selo{background:var(--hd-pix);color:#fff;font-size:.62rem;font-weight:800;letter-spacing:.08em;
  padding:4px 8px;border-radius:20px;white-space:nowrap;margin-left:auto}
.hd-regra{display:flex;align-items:center;gap:8px;color:#3d4650;font-size:.82rem;line-height:1.3;margin-top:14px}
.hd-regra svg{color:var(--hd-ok);flex:0 0 auto}
.hd-regra--box{background:var(--hd-ok-bg);border:1px solid #cdebd8;border-radius:10px;padding:10px 12px;margin-top:16px}

/* ---------- drawer ---------- */
.hd-drawer{position:fixed;inset:0;z-index:9990;display:none}
.hd-drawer.on{display:block}
.hd-drawer__bg{position:absolute;inset:0;background:rgba(10,15,20,.5);opacity:0;transition:opacity .25s}
.hd-drawer.on .hd-drawer__bg{opacity:1}
.hd-drawer__panel{position:absolute;top:0;right:0;height:100%;width:min(420px,100%);background:#fff;display:flex;
  flex-direction:column;transform:translateX(100%);transition:transform .28s cubic-bezier(.4,0,.2,1);
  box-shadow:-10px 0 34px rgba(0,0,0,.16)}
.hd-drawer.on .hd-drawer__panel{transform:none}
.hd-drawer__head{display:flex;align-items:center;justify-content:space-between;padding:16px 18px;border-bottom:1px solid var(--hd-borda)}
.hd-drawer__head h2{font-size:.95rem;font-weight:800;margin:0;letter-spacing:.06em;text-transform:uppercase}
.hd-x{background:none;border:0;font-size:26px;line-height:1;cursor:pointer;color:#6b7280;padding:0 4px}
.hd-drawer__body{flex:1;overflow-y:auto;padding:14px 18px}
.hd-drawer__foot{border-top:1px solid var(--hd-borda);padding:14px 18px calc(16px + env(safe-area-inset-bottom))}
.hd-item{display:flex;gap:12px;padding:6px 0}
.hd-item__img{flex:0 0 84px;width:84px;height:84px;border-radius:10px;overflow:hidden;background:var(--hd-cinza);display:block}
.hd-item__img img{width:100%;height:100%;object-fit:contain}
.hd-item__info{flex:1;min-width:0}
.hd-item__tit{display:block;font-size:.9rem;line-height:1.3;color:var(--hd-txt);text-decoration:none;font-weight:600;margin-bottom:4px}
.hd-item__un{font-size:.76rem;color:var(--hd-mut);text-transform:uppercase;letter-spacing:.06em}
.hd-item__preco{font-weight:800;font-size:1.05rem;margin-top:2px}
.hd-item__rm{margin-top:6px;background:none;border:0;color:#98a2ad;font-size:.78rem;text-decoration:underline;cursor:pointer;padding:0;font-family:inherit}
.hd-resumo{display:flex;flex-direction:column;gap:6px;margin-bottom:12px}
.hd-resumo>div{display:flex;justify-content:space-between;font-size:.9rem;color:#4a525b}
.hd-resumo__tot{border-top:1px solid var(--hd-borda);padding-top:9px;margin-top:3px;color:var(--hd-txt);align-items:baseline}
.hd-resumo__tot strong{font-size:1.2rem}
.hd-vertudo{display:block;text-align:center;margin-top:10px;font-size:.82rem;color:#5b6470;text-decoration:underline}
.hd-vazio{text-align:center;padding:34px 8px}
.hd-vazio p{font-size:1rem;margin:8px 0 16px}
.hd-vazio__ico{font-size:2.2rem;line-height:1}

/* ---------- toast ---------- */
.hd-toast{position:fixed;left:50%;bottom:22px;transform:translate(-50%,18px);background:#23272b;color:#fff;
  padding:12px 18px;border-radius:30px;font-size:.86rem;z-index:9999;opacity:0;pointer-events:none;transition:.22s;
  max-width:min(92vw,420px);text-align:center;box-shadow:var(--hd-sombra)}
.hd-toast.on{opacity:1;transform:translate(-50%,0)}
.hd-toast--ok{background:#137a3f}
.hd-toast--aviso{background:#b4530a}

/* ---------- modal ---------- */
.hd-modal{position:fixed;inset:0;z-index:9995;display:flex;align-items:center;justify-content:center;padding:18px}
.hd-modal__bg{position:absolute;inset:0;background:rgba(10,15,20,.55);opacity:0;transition:opacity .2s}
.hd-modal.on .hd-modal__bg{opacity:1}
.hd-modal__box{position:relative;background:#fff;border-radius:18px;padding:22px 20px 18px;width:min(420px,100%);
  box-shadow:0 20px 60px rgba(0,0,0,.24);transform:translateY(14px) scale(.98);opacity:0;transition:.22s;text-align:center}
.hd-modal.on .hd-modal__box{transform:none;opacity:1}
.hd-modal__ico{width:52px;height:52px;border-radius:50%;background:#fff3e6;color:#b4530a;display:flex;
  align-items:center;justify-content:center;margin:0 auto 12px}
.hd-modal__ico svg{width:26px;height:26px}
.hd-modal__box h3{margin:0 0 8px;font-size:1.08rem;font-weight:800}
.hd-modal__txt{font-size:.88rem;line-height:1.5;color:#4a525b;margin-bottom:18px}
.hd-modal__txt b{color:var(--hd-txt)}
.hd-modal__acoes{display:flex;flex-direction:column;gap:9px}

/* ---------- pagina do carrinho ---------- */
.hd-cart{display:grid;grid-template-columns:1fr;gap:22px;padding:22px 0 56px;max-width:1000px;margin:0 auto}
.hd-cart__linha{display:grid;grid-template-columns:88px 1fr;gap:14px;padding:16px 0;border-top:1px solid var(--hd-borda);
  border-bottom:1px solid var(--hd-borda);align-items:start}
.hd-cart__img{width:88px;height:88px;background:var(--hd-cinza);border-radius:10px;overflow:hidden;display:block}
.hd-cart__img img{width:100%;height:100%;object-fit:contain}
.hd-cart__tit{font-weight:700;font-size:.98rem;color:var(--hd-txt);text-decoration:none;display:block;line-height:1.3}
.hd-cart__un{font-size:.76rem;color:var(--hd-mut);text-transform:uppercase;letter-spacing:.06em;margin:4px 0}
.hd-cart__preco{font-size:1.15rem;font-weight:800}
.hd-cart__acoes{display:flex;gap:16px;margin-top:8px;align-items:center}
.hd-cart__resumo{background:var(--hd-cinza);border-radius:var(--hd-raio);padding:20px}
.hd-cart__vazio{text-align:center;padding:56px 12px;max-width:420px;margin:0 auto}
.hd-cart__vazio .hd-btn{margin-top:8px}
.hd-l{display:flex;justify-content:space-between;font-size:.9rem;padding:5px 0;color:#4a525b}
.hd-l--total{border-top:1px solid #dde3e8;margin-top:9px;padding-top:11px;color:var(--hd-txt);align-items:baseline}
.hd-l--total strong{font-size:1.22rem}
.hd-voltar{display:inline-block;margin:0 0 10px;font-size:.82rem;color:#5b6470;text-decoration:none}
.hd-voltar:hover{text-decoration:underline}
.hd-continuar{display:block;text-align:center;margin-top:12px;font-size:.84rem;color:#4a525b;text-decoration:underline}
.hd-pagamento-ok{display:flex;align-items:center;justify-content:center;gap:6px;margin-top:14px;font-size:.78rem;color:var(--hd-mut)}

/* ---------- checkout ---------- */
.hd-ck{display:grid;grid-template-columns:1fr;gap:22px;padding:20px 0 40px;max-width:1040px;margin:0 auto}
.hd-ck__sub{margin-bottom:18px}
.hd-bloco{background:#fff;border:1px solid var(--hd-borda);border-radius:var(--hd-raio);padding:16px 14px;margin-bottom:14px}
.hd-bloco h2{font-size:.8rem;text-transform:uppercase;letter-spacing:.08em;margin:0 0 14px;color:#41474d;
  display:flex;align-items:center;gap:8px;font-weight:800}
.hd-bloco h2 i{display:inline-flex;width:22px;height:22px;border-radius:50%;background:var(--hd-txt);color:#fff;
  align-items:center;justify-content:center;font-style:normal;font-size:.74rem;font-weight:700;flex:0 0 auto}
.hd-g2{display:grid;grid-template-columns:1fr;gap:12px}
.hd-f{display:flex;flex-direction:column;gap:5px;margin-bottom:12px;min-width:0}
.hd-f>span{font-size:.76rem;color:#5b6470;font-weight:700;letter-spacing:.02em}
.hd-f input{border:1px solid #d6dde3;border-radius:10px;padding:13px 13px;font-size:16px;font-family:inherit;
  background:#fff;color:var(--hd-txt);width:100%;box-sizing:border-box;transition:border-color .15s,box-shadow .15s;
  -webkit-appearance:none;appearance:none}
.hd-f input::placeholder{color:#a6b0ba}
.hd-f input:focus{outline:none;border-color:var(--hd-pix);box-shadow:0 0 0 3px rgba(50,188,173,.16)}
.hd-f input:user-invalid{border-color:#d9534f}
.hd-cep-info{display:flex;align-items:center;gap:7px;font-size:.8rem;line-height:1.35;border-radius:9px;
  padding:9px 11px;margin:-4px 0 12px}
.hd-cep-info--load{background:#eef4f7;color:#41586b}
.hd-cep-info--ok{background:var(--hd-ok-bg);color:var(--hd-ok);border:1px solid #cdebd8}
.hd-cep-info--erro{background:#fdecec;color:#a12b26;border:1px solid #f6cfcd}
.hd-cep-info .hd-spin{border-color:rgba(65,88,107,.3);border-top-color:#41586b}
.hd-pixcard{display:flex;align-items:center;gap:12px;border:2px solid var(--hd-pix);border-radius:12px;
  padding:12px;background:#f1fbfa}
.hd-pixcard__txt{min-width:0;flex:1}
.hd-pixcard__txt strong{display:block;font-size:1rem;font-weight:800}
.hd-pixcard__txt span{font-size:.78rem;color:#5b6470}
.hd-bullets{list-style:none;margin:12px 0 0;padding:0;display:flex;flex-direction:column;gap:7px}
.hd-bullets li{display:flex;gap:8px;align-items:flex-start;font-size:.82rem;color:#4a525b;line-height:1.35}
.hd-bullets svg{color:var(--hd-ok);flex:0 0 auto;margin-top:1px}
/* barra do rodape: FIXA no celular/tablet (acao sempre ao alcance do dedo) e volta
   ao fluxo normal no desktop (>=900px), onde o resumo ja e sticky ao lado. */
.hd-cta{position:fixed;left:0;right:0;bottom:0;z-index:40;padding:10px 16px calc(10px + env(safe-area-inset-bottom));
  background:#fff;border-top:1px solid var(--hd-borda);box-shadow:0 -8px 24px rgba(16,24,32,.10);
  animation:hd-bar-sobe .22s ease-out}
@keyframes hd-bar-sobe{from{transform:translateY(14px);opacity:.35}to{transform:none;opacity:1}}
@keyframes hd-dot{0%,100%{opacity:.3;transform:scale(.8)}50%{opacity:1;transform:scale(1)}}
.hd-cta__in{max-width:560px;margin:0 auto}
.hd-cta__dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#d39a00;
  vertical-align:middle;margin-right:4px;animation:hd-dot 1.5s ease-in-out infinite}
.hd-cta__nota{text-align:center;font-size:.76rem;color:var(--hd-mut);margin:8px 0 0}
.hd-cta__nota b{color:var(--hd-txt)}
.hd-aside{background:var(--hd-cinza);border-radius:var(--hd-raio);padding:18px}
.hd-aside__item{display:flex;gap:11px;align-items:center;padding-bottom:14px;border-bottom:1px solid #dfe5ea;margin-bottom:12px}
.hd-aside__item img{width:58px;height:58px;object-fit:contain;background:#fff;border-radius:9px;flex:0 0 auto}
.hd-aside__item div{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.hd-aside__item strong{font-size:.83rem;line-height:1.25;font-weight:600}
.hd-aside__item span{font-size:.74rem;color:var(--hd-mut)}
.hd-aside__item b{font-size:.9rem;white-space:nowrap}
.hd-selos{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.hd-selos span{display:inline-flex;align-items:center;gap:5px;font-size:.74rem;color:#4a525b;background:#fff;
  border:1px solid #dfe5ea;border-radius:20px;padding:6px 10px}
.hd-selos svg{color:var(--hd-ok)}

/* ---------- painel do PIX ---------- */
.hd-pix{background:#fff;border:1px solid var(--hd-borda);border-radius:var(--hd-raio);padding:18px 16px;
  box-shadow:var(--hd-sombra);scroll-margin-top:14px}
.hd-pix__head{display:flex;align-items:center;gap:11px;margin-bottom:14px}
.hd-pix__headtxt{flex:1;min-width:0}
.hd-pix__headtxt strong{display:block;font-size:1rem;font-weight:800}
.hd-pix__headtxt span{font-size:.76rem;color:var(--hd-mut)}
.hd-pix__timer{font-variant-numeric:tabular-nums;font-size:.86rem;font-weight:800;color:#b4530a;
  background:#fff5e9;border-radius:20px;padding:6px 11px;white-space:nowrap}
.hd-pix__reuso{background:#eef4f7;color:#41586b;border-radius:9px;padding:9px 11px;font-size:.78rem;
  line-height:1.35;margin-bottom:12px}
.hd-pix__qr{display:flex;justify-content:center;padding:14px;background:#fff;border:1px solid var(--hd-borda);
  border-radius:12px;margin-bottom:14px}
.hd-pix__qr img{width:min(240px,72vw);height:auto;display:block;image-rendering:pixelated}
.hd-pix__valor{text-align:center;font-size:1.6rem;font-weight:800;letter-spacing:-.02em}
.hd-pix__pedido{text-align:center;font-size:.8rem;color:var(--hd-mut);margin:3px 0 14px}
.hd-pix__pedido b{color:var(--hd-txt);letter-spacing:.02em}
.hd-pix__copia{display:block;margin-bottom:6px}
.hd-pix__copia input{display:block;width:100%;box-sizing:border-box;border:1px solid #d6dde3;border-radius:10px;
  padding:12px;font-size:11px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;color:#4a525b;
  background:#fafcfd;cursor:copy;text-overflow:ellipsis}
.hd-pix__dica{margin:0 0 12px;font-size:.72rem;line-height:1.35;color:var(--hd-mut);text-align:center}
.hd-f--erro>span{color:#c0392b}
.hd-f--erro input{border-color:#d9534f!important;box-shadow:0 0 0 3px rgba(217,83,79,.13)}
.hd-pix__status{text-align:center;font-size:.84rem;color:#41586b;background:#eef4f7;border-radius:9px;
  padding:10px;margin-bottom:12px;line-height:1.4}
.hd-pix__status--erro{background:#fdecec;color:#a12b26}
.hd-pix__outro{display:block;margin:14px auto 0}
.hd-pix .hd-btn--ghost{margin-bottom:2px}

/* ---------- obrigado ---------- */
.hd-obg{max-width:620px;margin:0 auto;padding:26px 0 56px;text-align:center}
.hd-obg__box{background:#fff}
.hd-obg__ico{width:64px;height:64px;border-radius:50%;background:var(--hd-ok-bg);color:var(--hd-ok);
  display:flex;align-items:center;justify-content:center;margin:0 auto 14px}
.hd-obg__ico svg{width:30px;height:30px}
.hd-obg__ico--n{background:#eef1f4;color:#6b7280;font-size:1.6rem;font-weight:800}
.hd-obg__sub{color:#5b6470;font-size:.92rem;margin:0 0 20px}
.hd-obg__card{text-align:left;background:var(--hd-cinza);border-radius:var(--hd-raio);padding:18px;margin-bottom:16px}
.hd-obg__ln{display:flex;gap:11px;align-items:center;padding-bottom:12px;margin-bottom:10px;
  border-bottom:1px solid #e1e7ec}
.hd-obg__ln img{width:56px;height:56px;object-fit:contain;background:#fff;border-radius:9px;flex:0 0 auto}
.hd-obg__ln div{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.hd-obg__ln strong{font-size:.85rem;line-height:1.25;font-weight:600}
.hd-obg__ln span{font-size:.74rem;color:var(--hd-mut)}
.hd-obg__ln b{font-size:.9rem;white-space:nowrap}
.hd-obg__aviso{background:#fff8e8;border:1px solid #f4dfae;border-radius:12px;padding:14px 15px;font-size:.85rem;
  line-height:1.5;color:#6b5320;margin-bottom:18px;text-align:left}
.hd-obg__aviso2{display:block;margin-top:7px;color:#7a6229}
.hd-obg__guarde{font-size:.78rem;color:var(--hd-mut);margin-top:14px}

/* ---------- frete gratis + data prevista (calculada na visita) ---------- */
.hd-frete{display:flex;align-items:flex-start;gap:10px;background:linear-gradient(180deg,#f1fbf5,#e9f8ef);
  border:1px solid #c7ebd6;border-radius:12px;padding:11px 12px;margin:16px 0 2px}
.hd-frete--ck{margin:14px 0 16px}
.hd-frete--obg{margin:0 0 16px;text-align:left}
.hd-frete__ico{flex:0 0 auto;display:inline-flex;color:var(--hd-ok);margin-top:2px}
.hd-frete__ico svg{width:20px;height:20px}
.hd-frete__txt{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px;line-height:1.32}
.hd-frete__txt strong{font-size:.9rem;font-weight:800;color:#11603a}
.hd-frete__txt span{font-size:.82rem;color:#2f4a3c}
.hd-frete__txt b{font-weight:800}
.hd-frete__txt small{font-size:.74rem;color:#5c7768;line-height:1.3}
.hd-frete__tag{flex:0 0 auto;align-self:center;background:#fff;border:1px solid #bfe6cf;color:var(--hd-ok);
  font-size:.76rem;font-weight:800;padding:4px 8px;border-radius:8px;white-space:nowrap}
.hd-frete__data,.hd-regra__data,.hd-l [data-hd-prazo]{color:#11603a;font-weight:800;white-space:nowrap}
.hd-l__pix{display:inline-flex;align-items:center;gap:6px}
.hd-pix__prazo{display:flex;align-items:center;justify-content:center;gap:7px;flex-wrap:wrap;text-align:center;
  font-size:.8rem;color:#2f4a3c;margin:-4px 0 12px;line-height:1.35}
.hd-pix__prazo svg{color:var(--hd-ok);flex:0 0 auto;width:17px;height:17px}
@media (max-width:430px){
  .hd-frete{padding:10px;gap:8px}
  .hd-frete__txt strong{font-size:.85rem}
  .hd-frete__txt span{font-size:.78rem}
  .hd-frete__txt small{font-size:.71rem}
  .hd-frete__tag{font-size:.7rem;padding:3px 6px}
  .hd-frete__ico svg{width:18px;height:18px}
}

/* ---------- recomendacoes ---------- */
.hd-recs{margin:34px 0 10px}
.hd-recs__tit{font-size:1.05rem;font-weight:700;letter-spacing:.02em;margin:0 0 16px;text-transform:uppercase;text-align:center}
.hd-recs__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}

/* ---------- responsivo ---------- */
/* CHECKOUT COMPACTO NO CELULAR. Medido antes: 11 campos empilhados de 90px (990px),
   caixa de frete 106px e resumo 424px davam 2,86 telas so de checkout.
   Aqui: pares curtos em 2 colunas (CEP+Numero, Complemento+Bairro, Cidade+UF),
   input de 44px (fonte 16px continua, senao o iOS da zoom), rotulos e caixas menores. */
@media (max-width:599px){
  .hd-ck{gap:16px;padding:12px 0 118px}   /* 118px = altura da barra fixa + folga */
  .hd-ck__sub{font-size:.82rem;line-height:1.4;margin-bottom:12px}
  .hd-h1{font-size:1.28rem;margin-bottom:4px}
  .hd-g2{gap:10px}
  .hd-g2--cep{grid-template-columns:1.35fr 1fr}
  .hd-g2--par{grid-template-columns:1.15fr 1fr}
  .hd-g2--cidade{grid-template-columns:1fr 74px}
  .hd-f{gap:4px;margin-bottom:8px}
  .hd-f>span{font-size:.72rem}
  /* 44px de area de toque; scroll-margin evita o input ficar atras do CTA fixo */
  .hd-f input{padding:11px;min-height:44px;line-height:1.25;border-radius:9px;scroll-margin-bottom:130px}
  .hd-bloco{margin-bottom:10px}
  .hd-bloco h2{margin:0 0 10px;font-size:.76rem;letter-spacing:.06em}
  .hd-bloco h2 i{width:20px;height:20px;font-size:.7rem}
  .hd-cep-info{margin:-2px 0 9px;padding:8px 10px;font-size:.76rem}
  .hd-frete{margin:10px 0 2px;padding:9px 10px;gap:8px;border-radius:10px}
  .hd-frete--ck{margin:10px 0 12px}
  .hd-frete__ico svg{width:17px;height:17px}
  .hd-frete__txt strong{font-size:.85rem}
  .hd-frete__txt span{font-size:.78rem}
  /* a nota "sem valor minimo / prazo conta da confirmacao" se repete no bloco 2 e no resumo */
  .hd-frete--ck .hd-frete__txt small{display:none}
  .hd-frete__tag{font-size:.72rem;padding:3px 7px}
  .hd-regra--box{padding:8px 10px;margin-top:10px;font-size:.76rem;line-height:1.28;border-radius:9px}
  .hd-pixcard{padding:10px;gap:10px;border-radius:11px}
  .hd-pixcard__txt strong{font-size:.92rem}
  .hd-pixcard__txt span{font-size:.73rem}
  .hd-bullets{margin:9px 0 0;gap:5px}
  .hd-bullets li{font-size:.78rem}
  .hd-cta{padding:8px 14px calc(8px + env(safe-area-inset-bottom))}
  .hd-cta .hd-btn--grande{min-height:48px;font-size:.95rem}
  .hd-cta__nota{font-size:.71rem;margin-top:5px}
  .hd-aside{padding:14px;border-radius:12px}
  .hd-aside .hd-h4{font-size:.74rem;margin-bottom:9px}
  .hd-aside__item{gap:9px;padding-bottom:10px;margin-bottom:9px}
  .hd-aside__item img{width:46px;height:46px;border-radius:8px}
  .hd-aside__item strong{font-size:.79rem}
  .hd-aside__item span{font-size:.72rem}
  .hd-aside__item b{font-size:.84rem}
  .hd-l{padding:3px 0;font-size:.85rem}
  .hd-l--total{margin-top:6px;padding-top:8px}
  .hd-l--total strong{font-size:1.08rem}
  .hd-selos{margin-top:10px;gap:6px}
  .hd-selos span{font-size:.68rem;padding:4px 8px}
  .hd-continuar{margin-top:9px;font-size:.8rem}
  /* painel do PIX tambem mais enxuto no celular */
  .hd-pix{padding:14px 13px}
  .hd-pix__head{gap:9px;margin-bottom:11px}
  .hd-pix__timer{font-size:.8rem;padding:5px 9px}
  .hd-pix__qr{padding:10px;margin-bottom:11px}
  .hd-pix__valor{font-size:1.45rem}
  .hd-pix__pedido{margin:2px 0 11px}
}
@media (min-width:600px) and (max-width:899px){
  .hd-ck{padding-bottom:122px}       /* barra fixa tambem vale no tablet */
}
@media (min-width:600px){
  .hd-g2{grid-template-columns:1fr 1fr}
  .hd-g2--cidade{grid-template-columns:1fr 110px}
  .hd-h1{font-size:1.7rem}
  .hd-cart__linha{grid-template-columns:106px 1fr}
  .hd-cart__img{width:106px;height:106px}
  .hd-bloco{padding:20px 18px;margin-bottom:16px}
  .hd-recs__grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
}
@media (min-width:900px){
  .hd-h1{font-size:1.9rem}
  .hd-ck{grid-template-columns:1fr 330px;gap:34px;align-items:start;padding:26px 0 60px}
  .hd-aside{position:sticky;top:16px}
  .hd-cta{position:static;background:none;padding:0;margin-top:10px;border:0;box-shadow:none;animation:none}
  .hd-cta__in{max-width:520px;margin:0}
  .hd-ck .hd-bloco{margin-bottom:18px}
  .hd-cart{grid-template-columns:1fr 320px;gap:34px;align-items:start;padding:26px 0 60px}
  .hd-cart__resumo{position:sticky;top:16px}
  .hd-recs__grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
  .hd-pix{max-width:520px}
}
@media (max-width:420px){
  .hd-bloco{border-radius:12px;padding:14px 12px}
  .hd-pixcard{gap:10px;padding:10px}
  .hd-pixcard__txt span{font-size:.72rem}
  .hd-selo{font-size:.56rem;padding:3px 7px}
  .hd-pix__valor{font-size:1.42rem}
  .hd-cta__nota{font-size:.68rem}
}
@media (prefers-reduced-motion:reduce){
  .hd-drawer__panel,.hd-toast,.hd-modal__box,.hd-modal__bg,.hd-drawer__bg{transition:none!important}
  .hd-cta,.hd-cta__dot{animation:none!important}
}

/* ================= CHECKOUT NO PADRAO DO CHECKOUT DA HIDRATEI (Shopify) =================
   Desktop: coluna do formulario a esquerda + PAINEL DE RESUMO COLORIDO (#46c1ed, cor
   do checkout real) ocupando a altura toda a direita. Celular: uma coluna, barra de
   resumo recolhivel no topo e CTA fixo no rodape. So PIX. */

/* no checkout o site vira checkout: some o menu/busca e o rodape do tema */
html.hd-rota-ck .shopify-section-group-header-group,
html.hd-rota-ck .shopify-section-group-footer-group,
html.hd-rota-ck .skip-to-content{display:none!important}
html.hd-rota-ck #main{padding-top:0!important}

.hd-ck{display:block;padding:0;margin:0;max-width:none}
.hd-top{display:flex;align-items:center;gap:12px;min-height:62px;padding:11px 16px;
  border-bottom:1px solid var(--hd-borda);background:#fff}
.hd-top__logo{flex:1;display:flex;justify-content:center;text-decoration:none;min-width:0}
.hd-top__logo img{display:block;height:36px;width:auto}
.hd-top__volta,.hd-top__bag{display:inline-flex;align-items:center;gap:6px;color:var(--hd-txt);
  text-decoration:none;font-size:.8rem;font-weight:600;flex:0 0 auto}
.hd-top__volta{border-radius:10px;padding:6px 10px;border:1px solid var(--hd-borda);background:#fff}
.hd-top__volta span{display:none}
.hd-top__bag{position:relative;width:38px;height:38px;justify-content:center;border-radius:50%;background:var(--hd-cinza)}
.hd-top__bag b{position:absolute;top:-4px;right:-3px;min-width:18px;height:18px;border-radius:9px;
  background:var(--hd-txt);color:#fff;font-size:.65rem;font-weight:800;display:flex;align-items:center;
  justify-content:center;padding:0 4px}

/* barra de resumo do celular */
.hd-resbar{display:flex;align-items:center;justify-content:space-between;width:100%;gap:12px;
  padding:14px 16px;border:0;border-bottom:1px solid var(--hd-borda);background:#f4f5f6;
  font:inherit;color:var(--hd-txt);cursor:pointer;text-align:left}
.hd-resbar__t{display:inline-flex;align-items:center;gap:6px;font-size:.92rem;font-weight:600}
.hd-resbar__t svg{transition:transform .18s}
.hd-resbar[aria-expanded="true"] .hd-resbar__t svg{transform:rotate(180deg)}
.hd-resbar__p{font-size:1.04rem;font-weight:800;white-space:nowrap}

/* coluna do formulario */
.hd-ck__col{padding:20px 16px 0;max-width:520px;margin:0 auto;width:100%;box-sizing:border-box}
.hd-ck__h1{font-size:1.42rem;line-height:1.2;margin:0 0 5px;letter-spacing:-.01em}
.hd-ck__sub{font-size:.85rem;color:var(--hd-mut);margin:0 0 20px;line-height:1.4}
.hd-sec{margin-bottom:22px}
.hd-sec__h{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:10px}
.hd-sec__h h2{font-size:1.1rem;font-weight:600;margin:0;letter-spacing:-.01em}
.hd-sec__aux{font-size:.72rem;color:var(--hd-mut);text-align:right;line-height:1.25}
.hd-sec__obs{font-size:.73rem;color:var(--hd-mut);margin:7px 0 0}

/* campos - cara de checkout (borda fina, raio 12, altura confortavel, rotulo curto) */
.hd-f{position:relative;display:flex;flex-direction:column;gap:5px;margin-bottom:10px;min-width:0}
.hd-f>span{font-size:.77rem;color:#6b7177;font-weight:500;letter-spacing:.01em}
.hd-f input{border:1px solid #d9d9d9;border-radius:12px;padding:12px 14px;font-size:16px;font-family:inherit;
  background:#fff;color:var(--hd-txt);width:100%;box-sizing:border-box;min-height:47px;line-height:1.25;
  transition:border-color .15s,box-shadow .15s;-webkit-appearance:none;appearance:none}
.hd-f input::placeholder{color:#9aa1a8}
.hd-f input:focus{outline:none;border-color:#0a7ea4;box-shadow:0 0 0 3px rgba(70,193,237,.22)}
.hd-f input:user-invalid{border-color:#d9534f}
.hd-f--ico input{padding-right:44px}
.hd-f__ico{position:absolute;right:13px;bottom:14px;color:#8b939a;display:inline-flex;pointer-events:none}

/* pagamento */
.hd-seg{display:flex;gap:8px;align-items:flex-start;font-size:.77rem;line-height:1.4;
  color:var(--hd-mut);margin:0 0 11px}
.hd-seg svg{flex:0 0 auto;margin-top:1px;color:#7b848b}
.hd-pixcard{border:1.5px solid #0a7ea4;border-radius:12px;padding:12px 14px;background:#f5fcff}
.hd-radio{width:22px;height:22px;border-radius:50%;background:#0a7ea4;color:#fff;display:inline-flex;
  align-items:center;justify-content:center;flex:0 0 auto}
.hd-radio svg{width:13px;height:13px}
.hd-pag__txt{font-size:.77rem;line-height:1.45;color:var(--hd-mut);margin:10px 0 0}

/* forma de frete */
.hd-fretebox{display:flex;align-items:center;gap:11px;background:#f4f5f6;border-radius:12px;padding:12px 14px}
.hd-fretebox__ico{flex:0 0 auto;color:#137a3f;display:inline-flex}
.hd-fretebox__ico svg{width:22px;height:22px}
.hd-fretebox__txt{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px;line-height:1.32}
.hd-fretebox__txt b{font-size:.88rem;font-weight:700}
.hd-fretebox__txt span{font-size:.79rem;color:#5b6470}
.hd-fretebox__tag{flex:0 0 auto;font-size:.82rem;font-weight:800;color:#137a3f;white-space:nowrap}
.hd-deal{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:.84rem;margin:2px 0 0}
.hd-deal__de{color:var(--hd-mut)}
.hd-deal__pct{background:var(--hd-ok-bg);color:var(--hd-ok);font-size:.72rem;font-weight:800;
  padding:2px 7px;border-radius:20px}

/* PAINEL DE RESUMO */
.hd-resumo{display:none;background:#46c1ed;color:#fff;padding:20px 16px 30px}
.hd-resumo.on{display:block}
.hd-resumo__h{font-size:1rem;font-weight:700;margin:0 0 13px;color:#fff}
.hd-resumo__item{display:flex;align-items:center;gap:12px;margin-bottom:11px}
.hd-resumo__thumb{position:relative;flex:0 0 auto;width:58px;height:58px;border-radius:12px;background:#fff;
  display:flex;align-items:center;justify-content:center;padding:5px;box-sizing:border-box}
.hd-resumo__thumb img{max-width:100%;max-height:100%;object-fit:contain;display:block}
.hd-resumo__thumb b{position:absolute;top:-6px;right:-6px;min-width:20px;height:20px;border-radius:10px;
  background:#5c5f62;color:#fff;font-size:.7rem;font-weight:800;display:flex;align-items:center;
  justify-content:center;padding:0 4px}
.hd-resumo__nome{flex:1;min-width:0;font-size:.88rem;line-height:1.3;font-weight:500}
.hd-resumo__pr{flex:0 0 auto;font-size:.9rem;font-weight:800;white-space:nowrap}
.hd-resumo__deal{display:flex;align-items:center;gap:8px;font-size:.82rem;margin:0 0 12px;flex-wrap:wrap}
.hd-resumo__deal s{opacity:.75}
.hd-resumo__deal b{font-weight:800}
.hd-resumo__deal em{font-style:normal;font-size:.71rem;font-weight:800;background:#fff;
  color:#0a7ea4;padding:2px 7px;border-radius:20px}
.hd-resumo__lin{display:flex;align-items:baseline;justify-content:space-between;gap:12px;
  font-size:.87rem;padding:4px 0;color:rgba(255,255,255,.95)}
.hd-resumo__lin b{font-weight:700}
.hd-resumo__lin--suave{color:rgba(255,255,255,.8);font-size:.8rem}
.hd-resumo__lin--suave i{font-style:normal;font-weight:700;color:#fff}
.hd-resumo__tot{display:flex;align-items:baseline;gap:8px;justify-content:flex-end;
  border-top:1px solid rgba(255,255,255,.5);margin-top:11px;padding-top:11px}
.hd-resumo__tot span{margin-right:auto;font-size:1.04rem;font-weight:700}
.hd-resumo__tot em{font-style:normal;font-size:.72rem;opacity:.85}
.hd-resumo__tot strong{font-size:1.22rem;font-weight:800;letter-spacing:-.01em}
.hd-resumo__selos{display:flex;flex-wrap:wrap;gap:7px;margin-top:15px}
.hd-resumo__selos span{display:inline-flex;align-items:center;gap:5px;font-size:.71rem;font-weight:600;
  background:rgba(255,255,255,.2);border:1px solid rgba(255,255,255,.4);border-radius:20px;padding:5px 9px}
.hd-resumo__selos svg{width:13px;height:13px}
.hd-resumo__edit{display:inline-block;margin-top:15px;color:#fff;font-size:.81rem;
  text-decoration:underline;opacity:.92}
@media (max-width:999px){
  /* espaco para o CTA fixo, que continua sempre ao alcance do dedo */
  .hd-ck__col{padding-bottom:112px}
}
@media (min-width:600px){
  .hd-ck__col{padding:28px 24px 0;max-width:560px}
  .hd-ck__h1{font-size:1.66rem}
  .hd-sec__h h2{font-size:1.18rem}
  .hd-f input{min-height:48px}
  .hd-sec{margin-bottom:26px}
}
@media (min-width:1000px){
  /* checkout real: formulario na coluna 1, painel colorido na coluna 2 dobrando as
     duas linhas (chega no topo da pagina, como no Shopify) */
  html.hd-rota-ck #main > .container{max-width:none!important;padding-left:0!important;padding-right:0!important}
  .hd-ck{display:grid;grid-template-columns:minmax(0,1fr) clamp(360px,42vw,600px);
    grid-template-rows:auto 1fr;align-items:stretch}
  .hd-top{grid-column:1;grid-row:1;min-height:72px;padding:14px 30px}
  .hd-top__logo img{height:40px}
  .hd-top__volta span{display:inline}
  .hd-ck__col{grid-column:1;grid-row:2;max-width:560px;padding:30px 34px 60px;
    justify-self:end;align-self:start}
  .hd-resbar{display:none}
  .hd-resumo{display:flex;flex-direction:column;grid-column:2;grid-row:1 / span 2;
    padding:30px 30px 36px;min-height:100%}
  .hd-resumo__h{font-size:1.06rem;margin-bottom:16px}
  .hd-resumo__thumb{width:64px;height:64px}
  .hd-resumo__nome{font-size:.92rem}
  .hd-resumo__pr{font-size:.94rem}
  .hd-resumo__tot strong{font-size:1.28rem}
  .hd-resumo__edit{margin-top:auto;padding-top:18px}
  /* no desktop a barra volta ao fluxo, dentro da coluna do formulario */
  .hd-cta{position:static;background:none;padding:0;margin-top:14px;border:0;box-shadow:none;animation:none}
  .hd-cta__in{max-width:560px;margin:0}
}

/* pares de campo curtos lado a lado tambem no celular (compacto) e no tablet */
@media (max-width:999px){
  .hd-g2{grid-template-columns:1fr 1fr;gap:10px}
  .hd-g2--rua{grid-template-columns:1.65fr 1fr}
  .hd-g2--par{grid-template-columns:1.15fr 1fr}
  .hd-g2--cidade{grid-template-columns:1fr 84px}
}
@media (min-width:600px){
  .hd-g2--rua{grid-template-columns:1.65fr 1fr}
  .hd-g2--cidade{grid-template-columns:1fr 110px}
}
/* tablet 900-999: o checkout ainda e o de celular, entao o CTA volta a ficar fixo */
@media (min-width:900px) and (max-width:999px){
  .hd-cta{position:fixed;left:0;right:0;bottom:0;z-index:40;
    padding:10px 16px calc(10px + env(safe-area-inset-bottom));background:#fff;
    border-top:1px solid var(--hd-borda);box-shadow:0 -8px 24px rgba(16,24,32,.10)}
  .hd-cta__in{max-width:560px;margin:0 auto}
}

/* ===== FALHA DO GATEWAY (caixa no formulario, com retry e WhatsApp) ===== */
.hd-falha{display:block;margin:0 0 18px;padding:16px 18px;border-radius:14px;
  background:#fff6f5;border:1px solid #f3c9c4;box-shadow:0 1px 2px rgba(16,24,32,.04)}
.hd-falha__dica{display:block;margin-top:10px;color:#5b6470;font-size:.78rem;line-height:1.35}
.hd-falha>strong{display:block;font-size:1rem;font-weight:700;color:#8f2c22;margin:0 0 6px}
.hd-falha>p{margin:0 0 12px;font-size:.9rem;line-height:1.45;color:#5d3b36}
.hd-falha>small{display:block;margin:10px 0 0;font-size:.72rem;color:#9b7a75}
.hd-falha__acoes{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.hd-falha__acoes .hd-btn{width:auto;min-width:150px;min-height:44px;padding:10px 18px;text-decoration:none;
  display:inline-flex;align-items:center;justify-content:center}
@media (max-width:600px){
  .hd-falha{padding:14px}
  .hd-falha__acoes{flex-direction:column;align-items:stretch}
  .hd-falha__acoes .hd-btn{width:100%}
}
/* ===== ESPACO RESERVADO DA BARRA FIXA =====
   Esta regra PRECISA ficar depois de `.hd-ck{display:block;padding:0}` (bloco do checkout
   estilo Shopify): mesma especificidade, entao quem vem por ultimo ganha. Sem isso o fim do
   resumo ficava atras da barra fixa no celular (o dbg_bar pegou: padding-bottom 0px). */
@media (max-width:599px){ .hd-ck{padding-bottom:118px} }
@media (min-width:600px) and (max-width:999px){ .hd-ck{padding-bottom:122px} }
/* rotulo auxiliar dos blocos (ex.: "O pedido e o rastreio chegam por e-mail") atrapalha
   no celular: quebra em 2 linhas e espreme o titulo. Some no mobile, aparece no desktop. */
@media (max-width:599px){ .hd-sec__aux{display:none} }