/* ==========================================================================
   Miswak Brasil – home.css: só o que é da home.
   Depende de base.css. Blocos compartilhados (benefícios, avaliações, passos,
   evento, insta, faq, selos, nota) estão em base.css.
   ========================================================================== */

/* ---------- Hero ---------- */
.mw-hero{background:var(--cream);padding:16px 0 40px;overflow:hidden}
.mw-hero__inner{display:grid;gap:22px}
.mw-hero__media{position:relative;border-radius:var(--r-lg);overflow:hidden;background:var(--sand);aspect-ratio:4/3;box-shadow:var(--shadow)}
.mw-hero__media>img{width:100%;height:100%;object-fit:cover}
.mw-hero__chip{position:absolute;left:12px;bottom:12px;display:flex;align-items:center;gap:10px;padding:8px 12px 8px 8px;border-radius:14px;background:rgba(255,255,255,.95);color:var(--g900);text-decoration:none;box-shadow:var(--shadow-sm);min-height:52px;max-width:calc(100% - 24px);transition:transform .2s ease,box-shadow .2s ease}
.mw-hero__chip:hover{transform:translateY(-2px);box-shadow:var(--shadow)}
.mw-hero__chip img{width:40px;height:40px;border-radius:10px;object-fit:cover;flex:none}
.mw-hero__chip span{display:grid;line-height:1.2;min-width:0}
.mw-hero__chip small{font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--g700)}
.mw-hero__chip strong{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mw-hero__chip .mw-icon{color:var(--g700);width:18px;height:18px}
.mw-hero__texto{display:grid;gap:12px;justify-items:start}
.mw-hero__texto .mw-nota{font-size:13.5px;gap:6px;flex-wrap:nowrap;white-space:nowrap}
.mw-hero h1{font-size:clamp(32px,8.4vw,58px);letter-spacing:-.02em;line-height:1.08;text-wrap:balance}
.mw-hero__lead{font-size:16px;line-height:1.55;color:var(--muted);max-width:520px}
.mw-hero__acoes{display:grid;gap:8px;width:100%;margin-top:6px}
.mw-hero__acoes .mw-btn--comprar{min-height:56px;font-size:17px}
.mw-hero__selos{margin-top:4px;padding-right:76px} /* deixa a coluna do botão do WhatsApp livre na primeira tela */
.mw-hero__selos .mw-selo{color:var(--g800)}
main .mw-secao__cabeca h2{text-wrap:balance}
@media (min-width:600px){
  .mw-hero{padding:32px 0 56px}
  .mw-hero__acoes{grid-template-columns:auto auto;justify-content:start}
  .mw-hero__acoes .mw-btn--bloco{width:auto;min-width:220px}
}
@media (min-width:900px){
  .mw-hero{padding:48px 0 72px}
  .mw-hero__inner{grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:64px;align-items:center}
  .mw-hero__media{order:2;aspect-ratio:1/1;max-width:560px;justify-self:end}
  .mw-hero__chip{left:20px;bottom:20px;padding:10px 16px 10px 10px;gap:12px}
  .mw-hero__chip img{width:48px;height:48px}
  .mw-hero__chip strong{font-size:15px}
  .mw-hero__texto{gap:16px}
  .mw-hero__selos{padding-right:0}
  .mw-hero__lead{font-size:18px}
  .mw-hero__acoes{margin-top:10px}
}

/* ---------- Kits (cada cartão é um link para produto.html?kit=N) ---------- */
.mw-kitcards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 12px;padding-top:12px}
.mw-kitcard{position:relative;display:grid;grid-template-rows:auto 1fr;border:2px solid var(--line);border-radius:var(--r-lg);background:var(--white);color:var(--ink);text-decoration:none;overflow:visible;transition:border-color .2s ease,box-shadow .2s ease,transform .2s ease}
.mw-kitcard:hover{border-color:var(--g200);box-shadow:var(--shadow);transform:translateY(-3px)}
.mw-kitcard.is-destaque{border-color:var(--g700);box-shadow:0 0 0 4px rgba(0,152,55,.12),var(--shadow)}
.mw-kitcard__faixa{position:absolute;top:-12px;left:12px;z-index:1;font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;padding:4px 10px;border-radius:999px;background:var(--g700);color:#fff;white-space:nowrap;line-height:1.3}
.mw-kitcard__faixa--alt{background:var(--y500);color:var(--g900)}
.mw-kitcard__media{display:block;aspect-ratio:1/1;background:var(--cream);border-radius:calc(var(--r-lg) - 2px) calc(var(--r-lg) - 2px) 0 0;overflow:hidden}
.mw-kitcard__media img{width:100%;height:100%;object-fit:cover;transition:transform .4s ease}
.mw-kitcard:hover .mw-kitcard__media img{transform:scale(1.04)}
.mw-kitcard__corpo{display:grid;gap:4px;padding:12px 12px 14px;align-content:start}
.mw-kitcard__nome{font-family:var(--ff-head);font-size:19px;font-weight:600;color:var(--g900);line-height:1.15}
.mw-kitcard__dura{font-size:12px;color:var(--muted);line-height:1.35}
.mw-kitcard__preco{display:grid;gap:1px;margin-top:8px}
.mw-kitcard__preco strong{font-size:20px;font-weight:800;color:var(--g900);letter-spacing:-.01em;line-height:1.1}
.mw-kitcard__preco small{font-size:12px;color:var(--muted)}
.mw-kitcard__economia{justify-self:start;margin-top:6px;font-size:11px;font-weight:800;color:var(--g700);background:var(--g100);padding:3px 8px;border-radius:999px;white-space:nowrap}
.mw-kitcard__ver{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:44px;margin-top:10px;padding:0 12px;border-radius:12px;font-size:14px;font-weight:800;background:var(--g50);color:var(--g800);transition:background-color .2s ease,color .2s ease}
.mw-kitcard__ver .mw-icon{width:18px;height:18px;transition:transform .2s ease}
.mw-kitcard:hover .mw-kitcard__ver{background:var(--g700);color:#fff}
.mw-kitcard:hover .mw-kitcard__ver .mw-icon{transform:translateX(3px)}
.mw-kitcard.is-destaque .mw-kitcard__ver{background:var(--y500);color:var(--g900)}
.mw-kitcard.is-destaque:hover .mw-kitcard__ver{background:var(--y600);color:var(--g900)}
.mw-kitcard:focus-visible{outline:3px solid var(--y500);outline-offset:3px;border-radius:var(--r-lg)}
.mw-kits__selos{justify-content:center;margin-top:28px;row-gap:18px}
@media (max-width:359.98px){
  .mw-kitcards{gap:22px 8px}
  .mw-kitcard__corpo{padding:10px 10px 12px}
  .mw-kitcard__nome{font-size:17px}
  .mw-kitcard__preco strong{font-size:18px}
  .mw-kitcard__faixa{font-size:10px;padding:3px 8px;left:8px}
}
@media (min-width:700px){
  .mw-kitcards{grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;padding-top:14px}
  .mw-kitcard__corpo{padding:16px 16px 18px;gap:5px}
  .mw-kitcard__nome{font-size:22px}
  .mw-kitcard__dura{font-size:13px}
  .mw-kitcard__preco strong{font-size:24px}
  .mw-kitcard__preco small{font-size:13px}
  .mw-kitcard__economia{font-size:12px}
  .mw-kitcard__ver{min-height:46px;font-size:15px;margin-top:14px}
  .mw-kitcard__faixa{left:16px;font-size:12px;padding:4px 12px}
}
@media (min-width:900px){
  .mw-kitcard.is-destaque{transform:translateY(-10px)}
  .mw-kitcard.is-destaque:hover{transform:translateY(-13px)}
  .mw-kits__selos{margin-top:40px}
}

/* ---------- Avaliações: chamada no fim da lista ---------- */
.mw-avaliacoes__cta{display:grid;justify-items:center;margin-top:28px}
.mw-avaliacoes__cta .mw-btn{min-width:min(100%,320px)}

/* ---------- Chamada final (escura) ---------- */
.mw-cta{display:grid;gap:28px;align-items:center}
.mw-cta__media{border-radius:var(--r-lg);overflow:hidden;aspect-ratio:16/10;background:var(--sand)}
.mw-cta__media img{width:100%;height:100%;object-fit:cover}
.mw-cta__caixa{display:grid;gap:18px}
.mw-cta__caixa h2{font-size:clamp(30px,7vw,46px);text-wrap:balance}
.mw-cta__caixa>p:not(.mw-eyebrow){color:var(--claro);font-size:17px}
.mw-cta__acoes{display:grid;gap:8px}
.mw-cta__acoes .mw-btn--comprar{min-height:56px;font-size:17px}
.mw-cta__todos{color:#fff;border-color:rgba(255,255,255,.28)}
.mw-cta__todos:hover{background:rgba(255,255,255,.08)}
.mw-cta .mw-selos--linha .mw-selo{color:var(--claro)}
.mw-cta .mw-selos--linha .mw-icon{color:var(--y500)}
@media (max-width:400px){.mw-cta__acoes .mw-btn--comprar{font-size:16px;padding:0 12px;gap:8px}.mw-cta__acoes .mw-btn--comprar .mw-btn__preco::before{margin-right:8px}}
@media (min-width:900px){.mw-cta{grid-template-columns:1fr 1fr;gap:72px}.mw-cta__media{aspect-ratio:1/1}}
