/* FAQ da home */
.faq{max-width:820px;margin:0 auto}
details.q{border-bottom:1px solid var(--line)}
details.q:first-of-type{border-top:1px solid var(--line)}
details.q summary{list-style:none;display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:58px;font-weight:600;font-size:15px;cursor:pointer;padding:8px 0}
details.q summary::-webkit-details-marker{display:none}
details.q summary::after{content:'+';font-size:21px;color:var(--taupe-dark);flex-shrink:0}
details.q[open] summary::after{content:'\2212'}
.qa{padding:0 0 18px;color:var(--muted);font-size:14.5px;max-width:680px}

/* ---- Convivencia com o Elementor -------------------------------------
   O Elementor aplica img{height:auto} e paddings de container que
   sobrescrevem o design system. Aqui devolvemos o comportamento do
   prototipo com especificidade suficiente, sem usar !important. */

body .elementor .e-con,body .elementor .e-con-inner{--container-max-width:100%;max-width:none;width:100%;padding:0;margin:0}
body .elementor .e-con>.elementor-widget,body .elementor .e-con-inner>.elementor-widget{width:100%;max-width:none}
body .elementor .elementor-widget-container{margin:0;padding:0}
body .elementor .elementor-element{--widgets-spacing:0px 0px}

/* Imagens que precisam preencher o container */
body .elementor .hero-img img,
body .elementor .cat-c img,
body .elementor .col-card img,
body .elementor .promo-img img,
body .elementor .news-img img,
body .elementor .pimg img,
body .elementor .cimg img,
body .elementor .gal-main img,
body .elementor .gal-thumbs img,
body .elementor .cbanner-in img{width:100%;height:100%;object-fit:cover}
body .elementor .hero-img img{height:clamp(300px,50vh,440px);object-position:center 20%}
@media (min-width:1024px){body .elementor .hero-img img{height:100%;min-height:0;object-position:center 15%}}

/* [hidden] precisa vencer os display:grid/flex do design system */
[hidden]{display:none!important}

/* Secoes da home montadas em container do Elementor */
body .elementor .e-con.aur-sec{padding:56px 0}
body .elementor .e-con.aur-sec-topo0{padding-top:0}
body .elementor .e-con.aur-news{padding:56px 0}
body .elementor .e-con.aur-wrap,
body .elementor .e-con.aur-wrap>.e-con-inner{max-width:1240px;margin:0 auto;padding:0 20px}
@media (min-width:960px){body .elementor .e-con.aur-wrap,body .elementor .e-con.aur-wrap>.e-con-inner{padding:0 32px}}


/* ===== Campo de busca (.bx-form) =====
   O SVG da lupa não tem width/height no HTML. Sem regra de CSS ele
   esticava até a largura do container — no menu lateral virava uma
   lupa gigante. O tamanho é travado aqui. */

.bx-form{display:flex;align-items:center;gap:8px;flex-wrap:wrap;
  border:1px solid var(--line-deep,#E0D0D0);border-radius:var(--r-sm,8px);
  padding:7px 10px;background:var(--card,#fff)}
.bx-form:focus-within{border-color:var(--taupe,#C48B93)}
.bx-form > svg{width:18px;height:18px;flex:0 0 18px;color:var(--muted,#736368)}
.bx-form input[type=search]{flex:1 1 110px;min-width:0;border:0;background:transparent;
  font:inherit;font-size:14px;color:var(--ink,#2A2224);padding:4px 0;outline:none;
  -webkit-appearance:none;appearance:none}
.bx-form input[type=search]::placeholder{color:var(--muted,#736368);opacity:1}
.bx-form input[type=search]::-webkit-search-cancel-button{-webkit-appearance:none}
.bx-form button{flex:0 1 auto;border:0;cursor:pointer;font:inherit;font-size:13px;
  font-weight:600;letter-spacing:.02em;padding:8px 14px;border-radius:var(--r-sm,8px);
  background:var(--taupe-dark,#8C5560);color:#fff;transition:background .18s ease}
.bx-form button:hover,.bx-form button:focus-visible{background:var(--ink,#2A2224)}

/* Em coluna estreita (menu lateral) o botão cai para a linha de baixo
   e ocupa a largura toda, em vez de espremer o campo. */
@supports (container-type:inline-size){
  .bx-form{container-type:inline-size}
}
@container (max-width:220px){
  .bx-form button{flex:1 1 100%}
}


/* Preço de faixa no item da sacola */
.cfaixa{display:block;font-size:12px;color:var(--taupe-dark,#8C5560);font-weight:600;margin-top:2px}