/* ============================================================
   Ajustes do site próprio bellarecestas.com (29/09/2026)
   Objetivo principal: WhatsApp BEM visível (antes era discreto)
   ============================================================ */

/* Em cada cesta: link verde "Tirar dúvida no WhatsApp" logo abaixo do botão */
.cat-duvida-whats{
  display:flex;align-items:center;justify-content:center;gap:8px;
  margin-top:10px;padding:10px 12px;
  border-radius:12px;
  background:#E3F6E9;color:#137A3A;
  font-size:14px;font-weight:600;text-decoration:none;
  transition:background .2s ease;
}
.cat-duvida-whats:hover{background:#d2f0dc;}
.cat-duvida-whats svg{width:18px;height:18px;flex:0 0 18px;}

/* Botões de WhatsApp do topo/hero em verde WhatsApp (reconhecimento imediato) */
.btn.btn-whats{background:#1FAF54;color:#fff;}
.btn.btn-whats:hover{background:#178f44;}

/* Fonte mínima de 14px (padrão do Rafael) */
.cookie-banner p,.cookie-banner .btn{font-size:14px;}

/* Sem balão flutuante: o rodapé não precisa mais reservar espaço pra ele */
.footer-bottom{padding-right:0;}

/* ============================================================
   TOPO: carrinho + ícone do WhatsApp + menu, agrupados à direita
   ============================================================ */
.header-acoes{display:flex;align-items:center;gap:10px;}
.nav-whats-btn{
  display:flex;align-items:center;justify-content:center;
  width:44px;height:44px;border-radius:14px;flex-shrink:0;
  background:#1FAF54;color:#fff;
  box-shadow:0 6px 16px rgba(31,175,84,.35);
  transition:transform .2s ease, box-shadow .2s ease;
}
.nav-whats-btn:hover{transform:translateY(-2px);box-shadow:0 10px 22px rgba(31,175,84,.45);}
.nav-whats-btn svg{width:24px;height:24px;}
@media(min-width:860px){.nav-whats-btn{display:none;}} /* no computador já tem o botão escrito */
@media(max-width:400px){
  .header-inner{padding:12px 16px;}
  .header-acoes{gap:8px;}
  .logo img{height:42px;}
}

/* ============================================================
   MENU MODERNO (3 risquinhos no celular)
   Efeitos do catálogo aprovado: fundo aurora, vidro fosco,
   entrada em cascata (só movimento, o conteúdo nunca fica invisível)
   ============================================================ */
.menu-fundo{
  position:fixed;inset:0;z-index:290;
  background:rgba(30,32,24,.38);
  backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);
  opacity:0;pointer-events:none;transition:opacity .35s ease;
}
html.menu-aberto .menu-fundo{opacity:1;pointer-events:auto;}
html.menu-aberto, html.menu-aberto body{overflow:hidden;}

.mobile-nav.menu-moderno{
  inset:0 0 0 auto;
  width:min(90vw,410px);
  padding:0;gap:0;display:block;
  background:#F8F7F0;
  border-radius:28px 0 0 28px;
  box-shadow:none; /* sombra só com o menu aberto (fechado ela aparecia na borda da página) */
  overflow:hidden;
  transform:translateX(105%);
  transition:transform .5s cubic-bezier(.2,.9,.25,1);
}
.mobile-nav.menu-moderno.open{transform:translateX(0);box-shadow:-20px 0 60px rgba(30,32,24,.25);}
/* o estilo antigo deixava todo link grande e com linha embaixo: zera aqui */
.menu-moderno a{font-family:'Jost',sans-serif;font-size:inherit;padding:0;border:0;color:inherit;text-decoration:none;}

/* Fundo aurora: manchas de cor que se movem devagar */
.menu-aurora{position:absolute;inset:0;overflow:hidden;pointer-events:none;}
.menu-aurora span{position:absolute;border-radius:50%;filter:blur(60px);opacity:.55;will-change:transform;}
.menu-aurora .ma1{width:300px;height:300px;background:#A1B59C;top:-110px;right:-90px;animation:menuFlutua1 13s ease-in-out infinite;}
.menu-aurora .ma2{width:260px;height:260px;background:#F2B48C;top:38%;left:-130px;animation:menuFlutua2 16s ease-in-out infinite;}
.menu-aurora .ma3{width:240px;height:240px;background:#EBCB7A;bottom:-110px;right:-60px;animation:menuFlutua3 15s ease-in-out infinite;}
@keyframes menuFlutua1{50%{transform:translate(-60px,70px) scale(1.15);}}
@keyframes menuFlutua2{50%{transform:translate(70px,-50px) scale(1.2);}}
@keyframes menuFlutua3{50%{transform:translate(-50px,-60px) scale(1.1);}}

.menu-conteudo{
  position:relative;z-index:1;height:100%;overflow-y:auto;
  padding:18px 18px 28px;display:flex;flex-direction:column;gap:16px;
}
/* Entrada em cascata: cada bloco desliza um pouquinho depois do anterior */
.menu-conteudo > *, .menu-cat{
  transform:translateX(28px);
  transition:transform .55s cubic-bezier(.2,.9,.25,1);
  transition-delay:calc(var(--i,0) * 55ms);
}
.mobile-nav.open .menu-conteudo > *, .mobile-nav.open .menu-cat{transform:none;}
.menu-categorias{transform:none !important;display:flex;flex-direction:column;gap:10px;}

.menu-topo{display:flex;align-items:center;justify-content:space-between;}
.menu-topo img{height:44px;width:auto;}
.menu-moderno .menu-fechar{
  width:44px;height:44px;border-radius:50%;padding:0;
  display:flex;align-items:center;justify-content:center;
  background:rgba(255,255,255,.7);border:1px solid rgba(255,255,255,.9);
  box-shadow:0 4px 14px rgba(43,42,34,.1);color:var(--text);cursor:pointer;
  transition:transform .25s ease;
}
.menu-moderno .menu-fechar:hover{transform:rotate(90deg);}
.menu-moderno .menu-fechar svg{width:20px;height:20px;}

.menu-saudacao{font-family:'Marcellus',serif;font-size:26px;line-height:1.2;color:var(--text);margin:4px 0 0;}

/* Atalhos rápidos (vidro fosco) */
.menu-atalhos{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;}
.menu-atalho{
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;
  padding:14px 6px;border-radius:18px;cursor:pointer;
  background:rgba(255,255,255,.6);
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  border:1px solid rgba(255,255,255,.85);
  box-shadow:0 6px 18px rgba(43,42,34,.07);
  font-family:'Jost',sans-serif;font-size:14px;font-weight:600;color:var(--text);
  transition:transform .2s ease, box-shadow .2s ease;
}
.menu-atalho:hover{transform:translateY(-3px);box-shadow:0 12px 24px rgba(43,42,34,.12);}
.menu-atalho svg{width:24px;height:24px;color:var(--sage-darker);}
.menu-moderno .menu-atalho-whats{background:#1FAF54;border-color:#1FAF54;color:#fff;box-shadow:0 8px 20px rgba(31,175,84,.35);}
.menu-atalho-whats svg{color:#fff;}

.menu-rotulo{font-size:14px;font-weight:700;text-transform:uppercase;letter-spacing:1px;color:var(--text-muted);margin-top:4px;}

/* Cartões das categorias com foto */
.menu-cat{
  display:flex;align-items:center;gap:14px;
  padding:10px 14px 10px 10px;border-radius:20px;
  background:rgba(255,255,255,.62);
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  border:1px solid rgba(255,255,255,.9);
  box-shadow:0 6px 18px rgba(43,42,34,.07);
}
.menu-cat:active{transform:scale(.98);}
.menu-cat img{width:58px;height:58px;border-radius:14px;object-fit:cover;flex-shrink:0;}
.menu-cat-txt{flex:1;min-width:0;display:flex;flex-direction:column;}
.menu-cat-txt strong{font-family:'Marcellus',serif;font-weight:400;font-size:20px;color:var(--text);line-height:1.2;}
.menu-cat-txt small{font-size:14px;color:var(--text-muted);}
.menu-cat-seta{
  width:34px;height:34px;border-radius:50%;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
  background:var(--cream);color:var(--sage-darker);
}
.menu-cat-seta svg{width:16px;height:16px;}
/* Categoria onde a pessoa está agora */
.menu-cat.menu-cat-atual{background:#fff;border:2px solid var(--sage-dark);}
.menu-cat.menu-cat-atual small{color:var(--sage-darker);font-weight:600;}
.menu-cat.menu-cat-atual .menu-cat-seta{background:var(--sage-dark);color:#fff;}

.menu-links{display:flex;gap:10px;flex-wrap:wrap;}
.menu-links a{
  padding:10px 16px;border-radius:999px;
  background:rgba(255,255,255,.55);border:1px solid rgba(87,105,79,.18);
  font-size:15px;font-weight:600;color:var(--text);
}

.menu-loja{
  display:flex;align-items:center;gap:12px;margin-top:auto;
  padding:14px;border-radius:20px;
  background:var(--sage-darker);color:#fff;
}
.menu-moderno .menu-loja{color:#fff;}
.menu-loja-icone{
  width:40px;height:40px;border-radius:12px;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.16);
}
.menu-loja-icone svg{width:20px;height:20px;}
.menu-loja > span:last-child{min-width:0;flex:1;}
.menu-loja strong{display:block;font-size:15px;}
.menu-loja small{display:block;font-size:14px;opacity:.85;}

@media (prefers-reduced-motion:reduce){
  .menu-aurora span{animation:none;}
  .menu-conteudo > *, .menu-cat{transition:none;transform:none;}
}

/* Celular: na página inicial a FOTO vem primeiro e o texto depois (04/10/2026, pedido do Rafael) */
@media(max-width:899px){
  .hero-grid > .hero-image-wrap{order:-1;}
  .hero-grid{gap:28px;}
  .hero:has(.hero-image-wrap){padding-top:20px;}
}

/* Endereço de entrega no carrinho (04/10/2026): número + complemento lado a lado */
.wa-modal-linha{display:grid;grid-template-columns:1fr 1.6fr;gap:12px;}
.wa-modal-opcional{font-size:12px;font-weight:500;text-transform:none;letter-spacing:0;color:var(--text-muted);}
.wa-modal-dica{font-size:14px;color:var(--text-muted);margin:-6px 0 16px;}
