/* ============================================================
   E4 TÊXTIL — REFINO (carrega por último; precedência total)
   Foco: minimalismo, respiro, sofisticação. Usa !important
   pontualmente para vencer o CSS nativo do WooCommerce/WP.
   ============================================================ */

/* ---------------------------------------------------------------
   1) RESPIRO GERAL
   --------------------------------------------------------------- */
.section { padding: var(--sp-24) 0; }
.section--tight { padding: var(--sp-12) 0; }
.section-head { margin-bottom: var(--sp-10); align-items: flex-end; }
.eyebrow { letter-spacing: var(--ls-widest); font-size: 11px; color: var(--text-tertiary); }
.h2 { font-weight: var(--fw-light); letter-spacing: var(--ls-wide); }
.container { padding-left: var(--sp-8); padding-right: var(--sp-8); }
@media (max-width: 768px) {
  .section { padding: var(--sp-16) 0; }
  .container { padding-left: var(--sp-5); padding-right: var(--sp-5); }
}

/* ---------------------------------------------------------------
   2) GRIDS DE PRODUTO — mais espaço entre cards (sem "grudar")
   --------------------------------------------------------------- */
.grid-4, .grid-3 { column-gap: var(--sp-8); row-gap: var(--sp-12); }
.woocommerce ul.products,
.woocommerce-page ul.products { column-gap: var(--sp-8) !important; row-gap: var(--sp-12) !important; }
@media (max-width: 768px) {
  .grid-4, .grid-3 { column-gap: var(--sp-4); row-gap: var(--sp-8); }
  .woocommerce ul.products { column-gap: var(--sp-4) !important; row-gap: var(--sp-8) !important; }
}

/* ---------------------------------------------------------------
   3) CARD DE PRODUTO — minimalista e emoldurado
   --------------------------------------------------------------- */
.product-card { gap: var(--sp-4); }
.product-card__media {
  background: #fff;
  border: 1px solid var(--ui-border-muted);
  border-radius: var(--radius-lg);
  transition: border-color var(--t-base), box-shadow var(--t-base);
}
.product-card:hover .product-card__media {
  border-color: var(--ui-border-strong);
  box-shadow: 0 10px 30px rgba(0,0,0,0.06);
}
.product-card__media .product-card__img,
.product-card__media img { object-fit: contain !important; }

/* favoritar discreto */
.product-card__top { justify-content: flex-end; }
.product-card__fav { width: 36px; height: 36px; background: rgba(255,255,255,0.85); box-shadow: 0 1px 4px rgba(0,0,0,0.06); }
.product-card__fav .icon { width: 18px; height: 18px; }

/* botão comprar — surge suave, sem cobrir nada (fica sobre a base da imagem) */
.product-card__buy { border-radius: var(--radius-pill); font-size: var(--fs-sm); padding: 11px 18px; }

/* corpo do card — hierarquia: eyebrow (linha) → nome (leve) → preço (destaque) */
.product-card__body { gap: 5px; padding: var(--sp-2) 2px 0; text-align: left; }
.product-card__eyebrow {
  font-family: var(--font-display); font-size: 10px; font-weight: var(--fw-medium);
  letter-spacing: var(--ls-widest); text-transform: uppercase; color: var(--text-tertiary);
}
.product-card__name {
  font-family: var(--font-body); font-size: var(--fs-md); font-weight: 200;
  line-height: 1.4; letter-spacing: var(--ls-tight); color: var(--color-ink);
  min-height: 2.8em; transition: color var(--t-base);
}
.product-card:hover .product-card__name { color: var(--text-secondary); }
.price-row { margin-top: var(--sp-2); align-items: baseline; gap: 6px; }
.price { font-family: var(--font-ui); font-size: var(--fs-xl); font-weight: var(--fw-semibold); letter-spacing: var(--ls-tight); color: var(--color-ink); }
.price-note { font-size: 10px; color: var(--text-tertiary); letter-spacing: var(--ls-wide); text-transform: uppercase; }
.price-card-note { flex-basis: 100%; font-family: var(--font-ui); font-size: 11px; color: var(--text-tertiary); }
.stars svg { width: 13px; height: 13px; }

/* ---------------------------------------------------------------
   4) NAVEGAÇÃO (barra única de ícones)
   --------------------------------------------------------------- */
.nav-bar { border-top: 1px solid var(--ui-border-muted); background: var(--color-paper); }
.cat-bar__track { display: flex; justify-content: center; align-items: center; gap: var(--sp-10); flex-wrap: wrap; padding: var(--sp-3) 0; }
.cat-bar__item {
  display: inline-flex; align-items: center; gap: var(--sp-2);
  font-family: var(--font-display); font-size: var(--fs-sm); font-weight: var(--fw-medium);
  letter-spacing: var(--ls-wide); text-transform: uppercase;
  color: var(--text-secondary); transition: color var(--t-base);
}
.cat-bar__item:hover { color: var(--color-ink); }
.cat-bar__icon { width: 19px; height: 19px; stroke-width: 1.4; flex-shrink: 0; }

/* ---------------------------------------------------------------
   4b) CABEÇALHO TRANSPARENTE (home, sobre o 1º slide do hero)
   --------------------------------------------------------------- */
.site-header--overlay {
  position: absolute; top: 38px; left: 0; right: 0; z-index: var(--z-header);
  background: transparent; box-shadow: none; border-bottom: none;
  padding-top: 34px; /* respiro do cabeçalho até a topbar (≈57px ao centro do conteúdo) */
}
.site-header--overlay .header-row { min-height: 80px; padding-top: var(--sp-3); padding-bottom: var(--sp-3); }
.site-header--overlay .nav-bar { background: transparent; border-top-color: rgba(255,255,255,0.18); }
/* transição suave de cor ao trocar de slide */
.site-header--overlay .brand img { transition: filter var(--t-slow); }
.site-header--overlay .icon-btn, .site-header--overlay .cat-bar__item,
.site-header--overlay .header-search input, .site-header--overlay .header-search .icon { transition: color var(--t-slow), background var(--t-slow), border-color var(--t-slow); }
/* o hero recebe respiro no topo para não ficar sob o cabeçalho */
.home main > .hero .hero__slide { padding-top: 200px; }
@media (max-width: 768px) { .home main > .hero .hero__slide { padding-top: 150px; } }
/* ao rolar (sólido), volta ao topo compacto padrão */
.site-header--overlay.is-stuck { padding-top: 0; }
.site-header--overlay.is-stuck .header-row { min-height: var(--header-height); padding-top: 0; padding-bottom: 0; }

/* ESTADO CLARO: slide com banner CLARO (texto preto) → cabeçalho preto p/ casar */
.site-header--overlay.site-header--on-light .brand img { filter: none; }
.site-header--overlay.site-header--on-light .icon-btn { color: var(--color-ink); }
.site-header--overlay.site-header--on-light .icon-btn:hover { background: var(--ui-surface-muted); }
.site-header--overlay.site-header--on-light .cat-bar__item { color: var(--text-secondary); }
.site-header--overlay.site-header--on-light .cat-bar__item:hover { color: var(--color-ink); }
.site-header--overlay.site-header--on-light .nav-bar { border-top-color: var(--ui-border-muted); }
.site-header--overlay.site-header--on-light .header-search input { background: rgba(0,0,0,0.04); border-color: var(--ui-border); color: var(--color-ink); }
.site-header--overlay.site-header--on-light .header-search input::placeholder { color: var(--text-muted); }
.site-header--overlay.site-header--on-light .header-search .icon { color: var(--text-secondary); }
.site-header--overlay.site-header--on-light .icon-btn__badge { border-color: var(--color-paper); }

/* cores claras sobre o hero escuro */
.site-header--overlay .brand img { filter: brightness(0) invert(1); }
.site-header--overlay .icon-btn { color: #fff; }
.site-header--overlay .icon-btn:hover { background: rgba(255,255,255,0.14); }
.site-header--overlay .cat-bar__item { color: rgba(255,255,255,0.85); }
.site-header--overlay .cat-bar__item:hover { color: #fff; }
.site-header--overlay .header-search input {
  background: rgba(255,255,255,0.12); border-color: rgba(255,255,255,0.32); color: #fff;
}
.site-header--overlay .header-search input::placeholder { color: rgba(255,255,255,0.75); }
.site-header--overlay .header-search .icon { color: rgba(255,255,255,0.85); }
.site-header--overlay .icon-btn__badge { border-color: var(--color-ink); }

/* ao rolar: cabeçalho sólido fixo (texto escuro) */
.site-header--overlay.is-stuck {
  position: fixed; top: 0;
  background: var(--color-paper); box-shadow: var(--shadow-header);
  animation: e4HeaderDrop var(--t-base) ease;
}
.site-header--overlay.is-stuck .nav-bar { border-top-color: var(--ui-border-muted); }
.site-header--overlay.is-stuck .brand img { filter: none; }
.site-header--overlay.is-stuck .icon-btn { color: var(--color-ink); }
.site-header--overlay.is-stuck .cat-bar__item { color: var(--text-secondary); }
.site-header--overlay.is-stuck .cat-bar__item:hover { color: var(--color-ink); }
.site-header--overlay.is-stuck .header-search input { background: var(--ui-surface); border-color: var(--ui-border); color: var(--color-ink); }
.site-header--overlay.is-stuck .header-search input::placeholder { color: var(--text-muted); }
.site-header--overlay.is-stuck .header-search .icon { color: var(--text-secondary); }
@keyframes e4HeaderDrop { from { transform: translateY(-100%); } to { transform: translateY(0); } }

/* ---------------------------------------------------------------
   4b-2) LOGO MAIOR (+40%), BUSCA MAIOR, SETAS DO HERO
   --------------------------------------------------------------- */
.site-header .brand img { height: 48px; }            /* logo principal +40% (34 -> ~48) */
.header-search input { padding-top: 14px; padding-bottom: 14px; font-size: var(--fs-md); }
.hero__nav { z-index: 6; }                            /* garante as setas clicáveis */

/* Cabeçalho equilibrado: logo à esquerda | busca centralizada | ícones à direita */
@media (min-width: 769px) {
  .header-row { display: grid; grid-template-columns: 1fr minmax(0, 600px) 1fr; align-items: center; column-gap: var(--sp-6); }
  .header-row .brand { justify-self: start; }
  .header-row .header-search { justify-self: center; width: 100%; max-width: 600px; margin: 0; }
  .header-row .header-actions { justify-self: end; margin-left: 0; }
}
@media (max-width: 768px) { .header-search { max-width: 620px; } }

/* ---------------------------------------------------------------
   4c) SELOS DE CONFIANÇA (destaque + ícones animados)
   --------------------------------------------------------------- */
.trust-section { padding: var(--sp-12) 0; background: var(--ui-surface); }
.trust.trust--cards {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--sp-5);
}
.trust__item {
  display: flex; align-items: center; gap: var(--sp-4);
  background: var(--color-paper); border: 1px solid var(--ui-border-muted);
  border-radius: var(--radius-lg); padding: var(--sp-5) var(--sp-5);
  transition: border-color var(--t-base), box-shadow var(--t-base), transform var(--t-base);
}
.trust__item:hover { border-color: var(--ui-border-strong); box-shadow: 0 10px 28px rgba(0,0,0,0.07); transform: translateY(-2px); }
.trust__icon {
  flex-shrink: 0; width: 52px; height: 52px; border-radius: var(--radius-circle);
  background: var(--color-ink); color: #fff;
  display: inline-flex; align-items: center; justify-content: center;
  overflow: hidden;
}
.trust__icon .icon { width: 26px; height: 26px; stroke-width: 1.5; }
.trust__txt h5 { margin: 0 0 2px; font-family: var(--font-display); font-size: var(--fs-base); letter-spacing: var(--ls-wide); text-transform: uppercase; font-weight: var(--fw-medium); color: var(--color-ink); }
.trust__txt p { margin: 0; font-size: var(--fs-sm); color: var(--text-secondary); }
@media (max-width: 900px) { .trust.trust--cards { grid-template-columns: 1fr 1fr; } }
@media (max-width: 520px) { .trust.trust--cards { grid-template-columns: 1fr; } }

/* ícones animados (no hover do selo) — respeita prefers-reduced-motion */
@media (prefers-reduced-motion: no-preference) {
  .trust__item--truck:hover .icon   { animation: e4Truck 0.7s ease; }
  .trust__item--shield:hover .icon  { animation: e4Pulse 0.7s ease; }
  .trust__item--refresh:hover .icon { animation: e4Spin 0.8s ease; }
  .trust__item--info:hover .icon    { animation: e4Bounce 0.7s ease; }
}
@keyframes e4Truck { 0%{transform:translateX(0)} 40%{transform:translateX(7px)} 60%{transform:translateX(-4px)} 100%{transform:translateX(0)} }
@keyframes e4Pulse { 0%{transform:scale(1)} 45%{transform:scale(1.18)} 100%{transform:scale(1)} }
@keyframes e4Spin { from{transform:rotate(0)} to{transform:rotate(360deg)} }
@keyframes e4Bounce { 0%{transform:translateY(0)} 35%{transform:translateY(-5px)} 70%{transform:translateY(2px)} 100%{transform:translateY(0)} }

/* ---------------------------------------------------------------
   4d) LOGO (proporção correta, nunca achatada)
   --------------------------------------------------------------- */
.brand img { width: auto !important; height: 34px; }
.footer-brand img { width: auto !important; height: 38px !important; margin-bottom: var(--sp-5); object-fit: contain; }

/* ---------------------------------------------------------------
   5) WOOCOMMERCE — carrinho, checkout, conta (vence o nativo)
   --------------------------------------------------------------- */
/* inputs uniformes e elegantes; remove foco verde nativo */
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce-page input[type="text"], .woocommerce-page input[type="email"],
.woocommerce-page input[type="tel"], .woocommerce-page input[type="password"],
.woocommerce-page input[type="number"], .woocommerce-page select, .woocommerce-page textarea,
.select2-container .select2-selection {
  background: var(--color-paper) !important;
  border: 1px solid var(--ui-border) !important;
  border-radius: var(--radius-md) !important;
  padding: 12px 14px !important;
  font-family: var(--font-body) !important;
  font-size: var(--fs-base) !important;
  color: var(--color-ink) !important;
  box-shadow: none !important;
  min-height: 46px;
}
.woocommerce form .form-row input.input-text:focus,
.woocommerce-page input:focus, .woocommerce-page select:focus, .woocommerce-page textarea:focus {
  border-color: var(--color-ink) !important; outline: none !important; box-shadow: none !important;
}
.woocommerce form .form-row.woocommerce-invalid input.input-text { border-color: var(--fn-danger) !important; }
.woocommerce form .form-row.woocommerce-validated input.input-text { border-color: var(--ui-border) !important; }
.woocommerce .form-row label { font-family: var(--font-body); font-size: var(--fs-sm); color: var(--text-secondary); margin-bottom: 6px; }

/* tabelas (carrinho / pedido) */
.woocommerce table.shop_table {
  border: 1px solid var(--ui-border-muted) !important;
  border-radius: var(--radius-lg) !important;
  border-collapse: separate !important; border-spacing: 0 !important;
  overflow: hidden;
}
.woocommerce table.shop_table th {
  font-family: var(--font-display) !important; text-transform: uppercase;
  letter-spacing: var(--ls-wide); font-size: var(--fs-sm) !important; font-weight: var(--fw-medium);
  color: var(--text-secondary) !important; padding: var(--sp-4) var(--sp-4) !important;
}
.woocommerce table.shop_table td { padding: var(--sp-4) var(--sp-4) !important; vertical-align: middle; border-top: 1px solid var(--ui-border-muted) !important; }
.woocommerce table.shop_table img { width: 64px !important; height: 64px !important; object-fit: contain !important; border: 1px solid var(--ui-border-muted); border-radius: var(--radius-md); background: #fff; }
.woocommerce a.remove { color: var(--color-ink) !important; font-weight: 400; border: 1px solid var(--ui-border); width: 24px; height: 24px; line-height: 22px; }
.woocommerce a.remove:hover { background: var(--color-ink) !important; color: #fff !important; }

/* totais / caixas */
.woocommerce .cart_totals, .woocommerce-checkout #order_review,
.woocommerce .cart-collaterals .cart_totals {
  background: var(--ui-surface); border: 1px solid var(--ui-border-muted);
  border-radius: var(--radius-lg); padding: var(--sp-6);
}
.woocommerce .cart_totals h2, .woocommerce-checkout h3,
.woocommerce-checkout #order_review_heading {
  font-family: var(--font-display); text-transform: uppercase; letter-spacing: var(--ls-wide);
  font-size: var(--fs-xl); font-weight: var(--fw-light); margin-bottom: var(--sp-4);
}
.woocommerce-checkout #order_review_heading { margin-top: 0; }

/* largura das páginas: WC ocupa tudo, conteúdo fica em coluna estreita */
.entry-content--narrow { margin-top: var(--sp-10); max-width: 760px; }
.entry-content--wide { margin-top: var(--sp-8); max-width: none; }

/* layout do carrinho via GRID (sem float — evita o footer subir por baixo) */
.woocommerce-cart .woocommerce { display: block; }
@media (min-width: 992px) {
  .woocommerce-cart .woocommerce {
    display: grid !important; grid-template-columns: minmax(0, 1fr) 360px;
    gap: var(--sp-10); align-items: start;
  }
  .woocommerce-cart .woocommerce > .woocommerce-notices-wrapper { grid-column: 1 / -1; }
  .woocommerce-cart form.woocommerce-cart-form { grid-column: 1 !important; float: none !important; width: auto !important; margin: 0 !important; }
  .woocommerce-cart .cart-collaterals { grid-column: 2 !important; float: none !important; width: auto !important; }
  .woocommerce-cart .cart-collaterals .cart_totals { width: 100% !important; float: none !important; }
}
.woocommerce-cart .cart-collaterals .cross-sells { margin-top: var(--sp-8); }

/* checkout: 2 colunas (form | resumo) via grid */
@media (min-width: 992px) {
  .woocommerce-checkout form.checkout.woocommerce-checkout { display: grid !important; grid-template-columns: minmax(0,1fr) 380px; gap: var(--sp-12); align-items: start; }
  .woocommerce-checkout form.checkout #customer_details { grid-column: 1; grid-row: 1 / span 2; }
  .woocommerce-checkout form.checkout #order_review_heading { grid-column: 2; grid-row: 1; margin-top: 0; }
  .woocommerce-checkout form.checkout #order_review { grid-column: 2; grid-row: 2; }
}
.woocommerce #payment { background: transparent !important; border-radius: var(--radius-md); }
.woocommerce #payment ul.payment_methods { border: 1px solid var(--ui-border-muted); border-radius: var(--radius-md); background: #fff; }

/* botões já herdam o estilo pill preto de woocommerce.css */

/* avisos */
.woocommerce-message, .woocommerce-info, .woocommerce-error, .woocommerce-noreviews, .cart-empty {
  border-radius: var(--radius-md) !important; background: var(--ui-surface) !important;
  border: 1px solid var(--ui-border-muted) !important; border-left: 3px solid var(--color-ink) !important;
  font-family: var(--font-body); color: var(--color-ink-soft);
}

/* minha conta */
.woocommerce-account .woocommerce-MyAccount-navigation a { border-radius: var(--radius-md); }

/* breadcrumb com mais ar */
.breadcrumbs { padding: var(--sp-6) 0 0; font-size: var(--fs-sm); }

/* page-hero (títulos de página) mais sóbrio */
.page-hero { padding: var(--sp-12) 0 var(--sp-8); border-bottom: 1px solid var(--ui-border-muted); margin-bottom: var(--sp-10); }
.page-hero .h1 { font-weight: var(--fw-light); }

/* ---------------------------------------------------------------
   6) PDP — hierarquia clara, tamanhos menores, sem repetição
   --------------------------------------------------------------- */
.single-product .summary.entry-summary { padding-top: var(--sp-2); }
.single-product .summary.entry-summary > * { margin: 0 0 var(--sp-6); }

/* título: menor, peso leve (não mais o display 40px uppercase gigante) */
.single-product div.product .product_title {
  font-family: var(--font-body) !important;
  font-size: var(--fs-2xl) !important; font-weight: 200 !important;
  line-height: 1.25 !important; letter-spacing: var(--ls-tight) !important;
  text-transform: none !important; margin: 0 0 var(--sp-5) !important; color: var(--color-ink);
}
/* preço: o destaque principal, com respiro do título */
.single-product div.product p.price,
.single-product div.product .summary .price {
  font-family: var(--font-ui) !important; font-size: var(--fs-3xl) !important;
  font-weight: var(--fw-semibold) !important; color: var(--color-ink) !important; margin: 0 0 var(--sp-4) !important;
  line-height: 1.1 !important;
}
.single-product div.product p.price del { font-size: var(--fs-lg) !important; opacity: .6; font-weight: 400 !important; }
/* selo "no Pix" ao lado do preço em destaque */
.single-product div.product p.price .e4-pix-tag,
.single-product div.product .summary .price .e4-pix-tag {
  display: inline-block; margin-left: var(--sp-2); vertical-align: middle;
  font-family: var(--font-ui) !important; font-size: var(--fs-sm) !important;
  font-weight: var(--fw-semibold) !important; letter-spacing: var(--ls-wide) !important;
  text-transform: uppercase; color: #2db38a !important; line-height: 1 !important;
}
/* bloco de pagamento dinâmico (Pix + cartão + bandeiras) */
.single-product .pdp-pay { margin: var(--sp-5) 0; padding: var(--sp-5); background: var(--ui-surface); border: 1px solid var(--ui-border-muted); border-radius: var(--radius-lg); }
.single-product .pdp-pay__row { display: flex; align-items: center; gap: var(--sp-3); }
.single-product .pdp-pay__row + .pdp-pay__row { margin-top: var(--sp-3); }
.single-product .pdp-pay__icon { flex-shrink: 0; width: 40px; height: 40px; border-radius: var(--radius-circle); background: var(--color-ink); color: #fff; display: inline-flex; align-items: center; justify-content: center; }
.single-product .pdp-pay__icon .icon { width: 22px; height: 22px; }
.single-product .pdp-pay__row--pix .pdp-pay__icon { background: #2db38a; } /* verde Pix sutil */
.single-product .pdp-pay__text { font-family: var(--font-ui); font-size: var(--fs-base); color: var(--text-secondary); line-height: 1.35; }
.single-product .pdp-pay__text strong { color: var(--color-ink); font-weight: var(--fw-semibold); }
.single-product .pdp-pay__flags { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; margin-top: var(--sp-4); padding-top: var(--sp-4); border-top: 1px solid var(--ui-border-muted); }
.single-product .pdp-pay__flags img { height: 20px; width: auto; display: block; background: #fff; border: 1px solid var(--ui-border); border-radius: var(--radius-xs); padding: 3px 6px; box-sizing: content-box; }
/* descrição curta: texto de apoio discreto */
.single-product .woocommerce-product-details__short-description {
  font-size: var(--fs-base); line-height: var(--lh-lg); color: var(--text-secondary);
  padding: var(--sp-4) 0; border-top: 1px solid var(--ui-border-muted); border-bottom: 1px solid var(--ui-border-muted);
}
.single-product .woocommerce-product-details__short-description p { margin: 0 0 var(--sp-2); }
.single-product .woocommerce-product-details__short-description p:last-child { margin: 0; }
/* galeria emoldurada */
.single-product .woocommerce-product-gallery { position: relative; border: 1px solid var(--ui-border-muted); border-radius: var(--radius-lg); overflow: hidden; background: #fff; }
/* setas prev/next na galeria (FlexSlider directionNav ativado em inc/woocommerce.php) */
.single-product .flex-direction-nav { list-style: none; margin: 0 !important; padding: 0 !important; }
.single-product .flex-direction-nav li { margin: 0 !important; }
.single-product .flex-direction-nav a {
  position: absolute !important; top: 50%; transform: translateY(-50%); z-index: 5;
  display: flex !important; align-items: center; justify-content: center;
  width: 44px; height: 44px; border-radius: var(--radius-circle);
  background: rgba(255,255,255,.92); border: 1px solid var(--ui-border); color: var(--color-ink);
  font-size: 0 !important; text-indent: 0 !important; text-shadow: none !important; opacity: 1 !important;
  box-shadow: var(--shadow-sm); transition: background var(--t-fast), color var(--t-fast), border-color var(--t-fast);
}
.single-product .flex-direction-nav a:hover { background: var(--color-ink); color: #fff; border-color: var(--color-ink); }
.single-product .flex-direction-nav a.flex-disabled { opacity: .3 !important; cursor: default; box-shadow: none; }
.single-product .flex-direction-nav a.flex-disabled:hover { background: rgba(255,255,255,.92); color: var(--color-ink); border-color: var(--ui-border); }
.single-product .flex-direction-nav .flex-prev { left: 14px; right: auto; }
.single-product .flex-direction-nav .flex-next { right: 14px; left: auto; }
.single-product .flex-direction-nav a::before {
  content: ""; display: block; width: 10px; height: 10px; background: none;
  border-left: 2px solid currentColor; border-bottom: 2px solid currentColor;
}
.single-product .flex-direction-nav .flex-prev::before { transform: rotate(45deg); margin-left: 4px; }
.single-product .flex-direction-nav .flex-next::before { transform: rotate(-135deg); margin-right: 4px; }
/* form de compra */
.single-product form.cart { margin: var(--sp-5) 0 !important; }
.single-product form.cart .quantity input.qty { min-height: 48px; }
.single-product .product_meta { font-size: var(--fs-xs); color: var(--text-tertiary); margin-top: var(--sp-5); }
.single-product .product_meta a { color: var(--text-secondary); }
/* abas: títulos menores */
.single-product .woocommerce-tabs .panel h2 { font-size: var(--fs-lg) !important; font-weight: var(--fw-light); text-transform: uppercase; letter-spacing: var(--ls-wide); }
/* relacionados: título de seção menor */
.single-product .related.products > h2, .single-product .upsells.products > h2 { font-size: var(--fs-xl) !important; font-weight: var(--fw-light); margin-bottom: var(--sp-6); }

/* ---------------------------------------------------------------
   7) RELACIONADOS / UPSELLS — slider horizontal com dots
   --------------------------------------------------------------- */
.woocommerce .related.products ul.products.e4-slider,
.woocommerce .upsells.products ul.products.e4-slider {
  display: flex !important; grid-template-columns: none !important;
  overflow-x: auto; overflow-y: hidden; scroll-snap-type: x mandatory;
  gap: var(--sp-6) !important; margin: 0 !important; padding: var(--sp-1) 0 var(--sp-4);
  scroll-behavior: smooth; scrollbar-width: none; -ms-overflow-style: none;
}
.woocommerce .related.products ul.products.e4-slider::-webkit-scrollbar,
.woocommerce .upsells.products ul.products.e4-slider::-webkit-scrollbar { display: none; height: 0; }
.woocommerce .related.products ul.products.e4-slider > li.product,
.woocommerce .upsells.products ul.products.e4-slider > li.product {
  flex: 0 0 clamp(220px, 30%, 300px) !important; width: clamp(220px, 30%, 300px) !important;
  scroll-snap-align: start; margin: 0 !important;
}
@media (max-width: 1024px) { .woocommerce .related.products ul.products.e4-slider > li.product { flex-basis: 44% !important; width: 44% !important; } }
@media (max-width: 640px)  { .woocommerce .related.products ul.products.e4-slider > li.product { flex-basis: 74% !important; width: 74% !important; } }

.e4-slider-dots { display: flex; justify-content: center; gap: 8px; margin-top: var(--sp-5); margin-bottom: 15px; flex-wrap: wrap; }
/* respiro entre os relacionados (com os dots) e o rodapé */
.single-product .related.products, .single-product .upsells.products { margin-bottom: var(--sp-12) !important; }
.e4-slider-dots button { width: 7px; height: 7px; padding: 0; border: none; border-radius: var(--radius-pill); background: var(--neutral-400); cursor: pointer; transition: width var(--t-base), background var(--t-base); }
.e4-slider-dots button.is-active { width: 26px; background: var(--color-ink); }

/* ---------------------------------------------------------------
   8) LIVE SEARCH — painel de autocomplete (lista + preview)
   --------------------------------------------------------------- */
.header-search.has-live-search { position: relative; }
.e4-search-panel {
  position: absolute; top: calc(100% + 10px); left: 0;
  width: min(760px, 92vw); display: flex; text-align: left;
  background: var(--color-paper); border: 1px solid var(--ui-border-muted);
  border-radius: var(--radius-lg); box-shadow: var(--shadow-lg); overflow: hidden;
  opacity: 0; visibility: hidden; transform: translateY(-6px);
  transition: opacity var(--t-base), transform var(--t-base), visibility var(--t-base);
  z-index: var(--z-popover); max-height: 72vh;
}
.e4-search-panel.is-open { opacity: 1; visibility: visible; transform: translateY(0); }

.e4-search-list { flex: 1 1 auto; min-width: 0; overflow-y: auto; max-height: 72vh; padding: var(--sp-3); }
.e4-search-msg { padding: var(--sp-6) var(--sp-4); color: var(--text-secondary); font-family: var(--font-body); font-size: var(--fs-base); }
.e4-search-group + .e4-search-group { margin-top: var(--sp-2); }
.e4-search-group__title { font-family: var(--font-display); font-size: 10px; letter-spacing: var(--ls-widest); text-transform: uppercase; color: var(--text-tertiary); padding: var(--sp-3) var(--sp-3) var(--sp-2); }
.e4-search-item { display: flex; align-items: center; gap: var(--sp-3); padding: var(--sp-2) var(--sp-3); border-radius: var(--radius-md); color: var(--color-ink); }
.e4-search-item.is-active, .e4-search-item:hover { background: var(--ui-surface-muted); }
.e4-search-item__thumb { flex: 0 0 46px; width: 46px; height: 46px; border-radius: var(--radius-sm); overflow: hidden; background: #fff; border: 1px solid var(--ui-border-muted); }
.e4-search-item__thumb img { width: 100%; height: 100%; object-fit: contain; }
.e4-search-item__txt { display: flex; flex-direction: column; min-width: 0; gap: 2px; }
.e4-search-item__name { font-family: var(--font-body); font-size: var(--fs-base); font-weight: 300; color: var(--color-ink); line-height: 1.3; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.e4-search-item__price { font-family: var(--font-ui); font-size: var(--fs-sm); font-weight: var(--fw-semibold); color: var(--color-ink); }
.e4-search-all { display: block; text-align: center; margin-top: var(--sp-3); padding: var(--sp-3); font-family: var(--font-display); font-size: var(--fs-sm); letter-spacing: var(--ls-wide); text-transform: uppercase; color: var(--color-ink); border-top: 1px solid var(--ui-border-muted); }
.e4-search-all:hover { background: var(--ui-surface-muted); }

.e4-search-preview { flex: 0 0 250px; border-left: 1px solid var(--ui-border-muted); padding: var(--sp-4); background: var(--ui-surface); display: flex; flex-direction: column; }
.e4-search-preview:empty { display: none; }
.e4-prev-media { aspect-ratio: 1/1; background: #fff; border: 1px solid var(--ui-border-muted); border-radius: var(--radius-md); overflow: hidden; margin-bottom: var(--sp-3); }
.e4-prev-media img { width: 100%; height: 100%; object-fit: contain; }
.e4-prev-eyebrow { font-family: var(--font-display); font-size: 10px; letter-spacing: var(--ls-wider); text-transform: uppercase; color: var(--text-tertiary); }
.e4-prev-name { font-family: var(--font-body); font-weight: 200; font-size: var(--fs-md); line-height: 1.3; margin: 4px 0 6px; color: var(--color-ink); }
.e4-prev-short { font-size: var(--fs-sm); color: var(--text-secondary); line-height: 1.4; margin: 0 0 var(--sp-3); }
.e4-prev-price { font-family: var(--font-ui); font-size: var(--fs-lg); font-weight: var(--fw-semibold); color: var(--color-ink); margin-bottom: var(--sp-3); }
.e4-prev-cta { margin-top: auto; }

/* o painel é claro mesmo quando o cabeçalho está transparente */
.site-header--overlay .e4-search-panel { color: var(--color-ink); }
@media (max-width: 900px) { .e4-search-preview { display: none; } .e4-search-panel { width: min(560px, 92vw); } }

/* ---------------------------------------------------------------
   17) VARIAÇÕES DE PRODUTO (seletor de cor) — PDP
   --------------------------------------------------------------- */
.woocommerce div.product form.cart .variations { width: 100%; margin-bottom: var(--sp-5); border-collapse: collapse; }
.woocommerce div.product form.cart .variations td { padding: 0; border: none; }
.woocommerce div.product form.cart .variations tr + tr td { padding-top: var(--sp-4); }
.woocommerce div.product form.cart .variations label { font-family: var(--font-display); font-size: 11px; letter-spacing: var(--ls-wide); text-transform: uppercase; color: var(--text-tertiary); }
.woocommerce div.product form.cart .variations select { min-width: 220px; }
.woocommerce div.product form.cart .reset_variations { display: inline-block; margin-top: var(--sp-2); font-size: var(--fs-sm); color: var(--text-tertiary); text-decoration: underline; }
.woocommerce div.product .woocommerce-variation-price { margin: var(--sp-4) 0; font-family: var(--font-ui); }
.woocommerce div.product .woocommerce-variation-availability { font-size: var(--fs-sm); color: var(--text-secondary); }

/* ---------------------------------------------------------------
   18) PDP — ABAS (Descrição / Informação adicional / Avaliações)
   Redesenho completo: a aparência padrão do WooCommerce é toda
   sobrescrita abaixo (nav em underline, tabela de specs enxuta,
   avaliações sem caixas cinzas). !important só onde o WC/WP
   define display/background inline com maior especificidade.
   --------------------------------------------------------------- */
.single-product .woocommerce-tabs { margin-top: var(--sp-16); border-top: 1px solid var(--ui-border-muted); padding-top: var(--sp-10); }

.single-product .woocommerce-tabs ul.tabs.wc-tabs {
  display: flex; flex-wrap: wrap; gap: var(--sp-8); list-style: none;
  margin: 0 0 var(--sp-10); padding: 0; border-bottom: 1px solid var(--ui-border-muted);
  background: none; border-radius: 0;
}
.single-product .woocommerce-tabs ul.tabs.wc-tabs::before,
.single-product .woocommerce-tabs ul.tabs.wc-tabs::after { display: none; }
.single-product .woocommerce-tabs ul.tabs.wc-tabs li {
  margin: 0 !important; padding: 0 !important; background: none !important; border: none !important; border-radius: 0 !important;
}
.single-product .woocommerce-tabs ul.tabs.wc-tabs li a {
  display: inline-block; padding: var(--sp-2) 0 var(--sp-4); margin-bottom: -1px;
  font-family: var(--font-display); font-size: var(--fs-sm); font-weight: var(--fw-medium);
  letter-spacing: var(--ls-widest); text-transform: uppercase; color: var(--text-tertiary);
  border-bottom: 2px solid transparent; transition: color var(--t-base), border-color var(--t-base);
}
.single-product .woocommerce-tabs ul.tabs.wc-tabs li a:hover { color: var(--color-ink); }
.single-product .woocommerce-tabs ul.tabs.wc-tabs li.active a { color: var(--color-ink); border-bottom-color: var(--color-ink); }

/* título repetido dentro do painel (já aparece na aba acima) */
.single-product .woocommerce-Tabs-panel > h2,
.single-product .woocommerce-Reviews-title { display: none; }

.single-product .woocommerce-Tabs-panel { max-width: 720px; }
.single-product .woocommerce-Tabs-panel--description ul { list-style: none; padding-left: 0; }
.single-product .woocommerce-Tabs-panel--description ul li { position: relative; padding-left: var(--sp-5); color: var(--text-secondary); }
.single-product .woocommerce-Tabs-panel--description ul li + li { margin-top: var(--sp-2); }
.single-product .woocommerce-Tabs-panel--description ul li::before { content: ""; position: absolute; left: 0; top: 11px; width: 6px; height: 1px; background: var(--color-ink); }
.single-product .woocommerce-Tabs-panel--description ul li strong { color: var(--color-ink); font-weight: var(--fw-semibold); }

/* Informação adicional — tabela de specs enxuta, sem grade/zebra */
.single-product table.woocommerce-product-attributes { width: 100%; max-width: 720px; border-collapse: collapse; background: none; }
.single-product table.woocommerce-product-attributes tbody tr { border-bottom: 1px solid var(--ui-border-muted); }
.single-product table.woocommerce-product-attributes tbody tr:nth-child(even) { background: none !important; }
.single-product table.woocommerce-product-attributes th,
.single-product table.woocommerce-product-attributes td { padding: var(--sp-4) 0 !important; border: none !important; background: none !important; vertical-align: top; }
.single-product table.woocommerce-product-attributes th {
  width: 40%; max-width: 200px; text-align: left; font-family: var(--font-display); font-size: 11px;
  letter-spacing: var(--ls-wider); text-transform: uppercase; color: var(--text-tertiary); font-weight: var(--fw-regular);
}
.single-product table.woocommerce-product-attributes td { font-family: var(--font-body); font-size: var(--fs-md); color: var(--color-ink); font-style: normal; }
.single-product table.woocommerce-product-attributes td p { margin: 0; font-style: normal; }

/* Avaliações */
.single-product .woocommerce-noreviews { background: none; border: none; padding: 0; margin: 0 0 var(--sp-6); font-family: var(--font-body); font-size: var(--fs-md); color: var(--text-secondary); }
.single-product #review_form_wrapper { margin-top: var(--sp-2); max-width: 560px; }
.single-product #respond .comment-reply-title { display: block; font-family: var(--font-display); font-size: var(--fs-lg); font-weight: var(--fw-light); text-transform: none; letter-spacing: 0; color: var(--color-ink); margin-bottom: var(--sp-5); }
.single-product #respond .comment-notes { font-size: var(--fs-sm); color: var(--text-tertiary); }
.single-product #respond p { margin-top: var(--sp-4); }
.single-product #respond label { display: block; font-family: var(--font-body); font-size: var(--fs-sm); color: var(--text-secondary); margin-bottom: var(--sp-1); }
.single-product #respond .required { color: var(--fn-danger); }
.single-product .form-submit input#submit {
  font-family: var(--font-display); text-transform: uppercase; letter-spacing: var(--ls-wide); font-size: var(--fs-base);
  font-weight: var(--fw-medium); background: var(--color-primary); color: var(--color-primary-contrast);
  border: 1px solid var(--color-primary); border-radius: var(--radius-pill); padding: 12px 28px; cursor: pointer; transition: background var(--t-base);
}
.single-product .form-submit input#submit:hover { background: var(--color-primary-hover); }

/* ---------------------------------------------------------------
   19) RELACIONADOS / UPSELLS — setas de navegação do slider
   --------------------------------------------------------------- */
.e4-slider-wrap { position: relative; }
.e4-slider-nav {
  position: absolute; top: 40%; transform: translateY(-50%); z-index: 4;
  width: 44px; height: 44px; border-radius: var(--radius-circle);
  background: var(--color-paper); border: 1px solid var(--ui-border); box-shadow: var(--shadow-sm);
  color: var(--color-ink); display: flex; align-items: center; justify-content: center;
  cursor: pointer; opacity: 1; transition: opacity var(--t-base), background var(--t-base);
}
.e4-slider-nav:hover { background: var(--ui-surface-muted); }
.e4-slider-nav .icon { width: 20px; height: 20px; }
.e4-slider-nav--prev { left: -22px; }
.e4-slider-nav--next { right: -22px; }
.e4-slider-nav.is-disabled { opacity: 0; pointer-events: none; }
@media (max-width: 900px) { .e4-slider-nav { display: none; } }

/* ---------------------------------------------------------------
   20) LISTAGENS (loja/categoria) — cabeçalho, descrição e toolbar
   woocommerce_content() imprime h1.page-title + descrição crus;
   aqui eles ganham a mesma hierarquia do .page-hero do tema.
   --------------------------------------------------------------- */
.e4-shop h1.page-title,
.e4-single h1.page-title {
  font-family: var(--font-display); font-size: var(--fs-4xl); font-weight: var(--fw-light);
  letter-spacing: var(--ls-wide); text-transform: uppercase; margin: var(--sp-4) 0 0;
}
.term-description { max-width: 68ch; margin-top: var(--sp-4); }
.term-description p { color: var(--text-secondary); font-size: var(--fs-md); line-height: 1.65; margin: 0; }
.term-description p + p { margin-top: var(--sp-3); }
.term-description .term-specs {
  display: flex; flex-wrap: wrap; gap: var(--sp-2); margin-top: var(--sp-5);
}
.term-description .term-specs span {
  font-family: var(--font-ui); font-size: var(--fs-sm); color: var(--text-secondary);
  border: 1px solid var(--ui-border-muted); background: var(--ui-surface);
  border-radius: var(--radius-pill); padding: 6px 14px; white-space: nowrap;
}
/* toolbar por hook (e4_shop_toolbar_open/close) — mata os floats nativos */
.shop-toolbar { margin-top: var(--sp-8); }
.shop-toolbar .woocommerce-result-count,
.shop-toolbar .woocommerce-ordering { float: none !important; margin: 0 !important; }
/* o clearfix nativo do WC (::before display:table) vira item fantasma no grid
   e empurra o 1º produto para a 2ª célula — remove nos dois pseudo-elementos */
.woocommerce ul.products::before,
.woocommerce ul.products::after,
.woocommerce-page ul.products::before,
.woocommerce-page ul.products::after { content: none !important; display: none !important; }

/* ---------------------------------------------------------------
   21) HOME — banner promocional sem imagem sustenta o texto claro
   --------------------------------------------------------------- */
.promo { background: var(--ui-surface-inverted); }

/* ---------------------------------------------------------------
   22) CONTEÚDO EDITORIAL — lede, FAQ (details/summary)
   --------------------------------------------------------------- */
.entry-content .lede { font-size: var(--fs-2xl); line-height: var(--lh-2xl); }
.entry-content details {
  border: 1px solid var(--ui-border-muted); border-radius: var(--radius-md);
  background: #fff; padding: var(--sp-4) var(--sp-5);
}
.entry-content details + details { margin-top: var(--sp-3); }
.entry-content details summary {
  cursor: pointer; list-style: none; position: relative; padding-right: 32px;
  font-family: var(--font-body); font-weight: var(--fw-medium); color: var(--color-ink);
}
.entry-content details summary::-webkit-details-marker { display: none; }
.entry-content details summary::after {
  content: "+"; position: absolute; right: 2px; top: 50%; transform: translateY(-50%);
  font-family: var(--font-ui); font-size: var(--fs-lg); color: var(--text-tertiary);
}
.entry-content details[open] summary::after { content: "–"; }
.entry-content details p { margin-top: var(--sp-3); color: var(--text-secondary); font-size: var(--fs-base); line-height: 1.6; }
.entry-content details ul { margin-top: var(--sp-3); color: var(--text-secondary); }

/* ---------------------------------------------------------------
   23) SOBRE — vitrine das linhas
   --------------------------------------------------------------- */
.about-lines { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--sp-5); }
.about-line {
  display: flex; align-items: center; gap: var(--sp-4);
  border: 1px solid var(--ui-border-muted); border-radius: var(--radius-lg);
  background: #fff; padding: var(--sp-3) var(--sp-5) var(--sp-3) var(--sp-3);
  transition: border-color var(--t-base), box-shadow var(--t-base);
}
.about-line:hover { border-color: var(--color-ink); box-shadow: var(--shadow-sm); }
.about-line__media {
  flex: 0 0 72px; width: 72px; height: 72px; border-radius: var(--radius-md);
  background: var(--ui-surface-muted); overflow: hidden;
}
.about-line__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.about-line__body { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.about-line__name { font-family: var(--font-display); font-size: var(--fs-md); letter-spacing: var(--ls-wide); text-transform: uppercase; color: var(--color-ink); }
.about-line__count { font-family: var(--font-ui); font-size: var(--fs-sm); color: var(--text-tertiary); }
@media (max-width: 1024px) { .about-lines { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px)  { .about-lines { grid-template-columns: 1fr; } }

/* ---------------------------------------------------------------
   24) CONTATO — localização com mapa
   --------------------------------------------------------------- */
.location-grid { display: grid; grid-template-columns: minmax(260px, 380px) minmax(0, 1fr); gap: var(--sp-8); margin-top: var(--sp-5); align-items: start; }
.location-grid__text { margin: 0; line-height: 1.8; }
.location-map { border: 1px solid var(--ui-border-muted); border-radius: var(--radius-lg); overflow: hidden; background: var(--ui-surface-muted); }
.location-map iframe { display: block; width: 100%; height: 340px; border: 0; }
@media (max-width: 860px) { .location-grid { grid-template-columns: 1fr; } }

/* ---------------------------------------------------------------
   25) CHECKOUT — pagamento e resumo no sistema visual do tema
   --------------------------------------------------------------- */
#order_review_heading {
  font-family: var(--font-display); font-size: var(--fs-sm) !important; font-weight: var(--fw-medium);
  letter-spacing: var(--ls-widest); text-transform: uppercase; color: var(--text-tertiary);
  margin: 0 0 var(--sp-4);
}
.woocommerce-checkout #payment { background: var(--ui-surface) !important; border: 1px solid var(--ui-border-muted); border-radius: var(--radius-lg); }
.woocommerce-checkout #payment ul.payment_methods { border-bottom: 1px solid var(--ui-border-muted) !important; padding: var(--sp-5) !important; }
.woocommerce-checkout #payment div.payment_box {
  background: var(--ui-surface-muted) !important; color: var(--text-secondary) !important;
  border-radius: var(--radius-md); font-size: var(--fs-base);
}
.woocommerce-checkout #payment div.payment_box::before { display: none !important; }
.woocommerce-checkout #payment div.form-row.place-order { padding: var(--sp-5) !important; }

/* ---------------------------------------------------------------
   26) PDP — meta do produto (SKU/categorias) discreta, sem tags
   --------------------------------------------------------------- */
.single-product .product_meta {
  display: flex; flex-direction: column; gap: 4px;
  margin-top: var(--sp-6); padding-top: var(--sp-4); border-top: 1px solid var(--ui-border-muted);
  font-family: var(--font-ui); font-size: var(--fs-sm); color: var(--text-tertiary);
}
.single-product .product_meta .tagged_as { display: none; }
.single-product .product_meta a { color: var(--text-secondary); }
.single-product .product_meta a:hover { color: var(--color-ink); }

/* ---------------------------------------------------------------
   27) TIPOGRAFIA — presença e acabamento
   --------------------------------------------------------------- */
.h1, .h2, .hero__title, .e4-shop h1.page-title,
.single-product div.product .product_title { text-wrap: balance !important; }
.lede, .hero__support, .term-description p, .entry-content p,
.review-card p, .trust__txt p { text-wrap: pretty !important; }
/* números tabulares em todo preço (colunas alinham, nada "dança") */
.price, .price-old, .price-note, .installment, .pdp-pay__text,
.woocommerce-Price-amount, .mc-item__price,
.woocommerce table.shop_table td { font-variant-numeric: tabular-nums !important; }
/* hero com escala fluida — mais presença em telas largas */
.hero__title { font-size: clamp(44px, 4.6vw, 68px) !important; line-height: 1.02 !important; }
@media (max-width: 768px) { .hero__title { font-size: clamp(34px, 9vw, 44px) !important; } }
/* âncoras deslizam suave (respeitando reduced-motion) */
html { scroll-behavior: smooth !important; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto !important; } }
/* "Ver tudo" ganha seta que desliza no hover */
.section-head .link-more::after { content: "\2192" !important; display: inline-block !important; margin-left: 6px !important; transition: transform var(--t-base) !important; }
.section-head .link-more:hover::after { transform: translateX(4px) !important; }

/* ---------------------------------------------------------------
   28) PDP — botão de compra SEMPRE monocromático (mata o roxo
   nativo do WC em todos os estados, inclusive disabled/variação
   não selecionada) + respiro correto até as abas
   --------------------------------------------------------------- */
.woocommerce div.product form.cart .button,
.woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt {
  background-color: var(--color-ink) !important; color: var(--color-paper) !important;
  border: 1px solid var(--color-ink) !important; border-radius: var(--radius-pill) !important;
  font-family: var(--font-display) !important; text-transform: uppercase !important;
  letter-spacing: var(--ls-wide) !important; font-weight: var(--fw-medium) !important;
}
.woocommerce div.product form.cart .button:hover,
.woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover {
  background-color: var(--color-primary-hover) !important; border-color: var(--color-primary-hover) !important;
}
/* estado desabilitado (escolha a variação): cinza neutro, nunca roxo.
   Os seletores ancorados em div.product form.cart vencem a regra base acima
   (mesma contagem de classes + elementos). */
.woocommerce a.button.disabled, .woocommerce button.button.disabled, .woocommerce input.button.disabled,
.woocommerce a.button:disabled, .woocommerce button.button:disabled, .woocommerce input.button:disabled,
.woocommerce a.button.alt.disabled, .woocommerce button.button.alt.disabled, .woocommerce input.button.alt.disabled,
.woocommerce a.button.alt.disabled:hover, .woocommerce button.button.alt.disabled:hover, .woocommerce input.button.alt.disabled:hover,
.woocommerce div.product form.cart .button.disabled,
.woocommerce div.product form.cart .button:disabled,
.woocommerce div.product form.cart .button.disabled:hover,
.woocommerce div.product form.cart .button.wc-variation-selection-needed,
.woocommerce div.product form.cart .button.wc-variation-is-unavailable,
.woocommerce .single_add_to_cart_button.disabled,
.woocommerce .single_add_to_cart_button.wc-variation-selection-needed {
  background-color: var(--neutral-200) !important; color: var(--neutral-700) !important;
  border-color: var(--neutral-200) !important; cursor: not-allowed !important; opacity: 1 !important;
}
/* seletor de variação confortável */
.woocommerce div.product form.cart .variations select { width: 100% !important; max-width: 340px !important; min-height: 48px !important; }
/* menos vazio entre o produto e as abas */
.single-product .woocommerce-tabs { margin-top: var(--sp-8) !important; padding-top: var(--sp-8) !important; }
/* PDP em 1 coluna no mobile — a regra base de 2 colunas (woocommerce.css)
   tem !important e vencia o próprio breakpoint dela (que não tinha);
   sem isso a galeria espremia a 159px e a tabela de variações estourava
   a viewport (overflow horizontal em 390px) */
@media (max-width: 900px) {
  .woocommerce div.product,
  .single-product div.product { grid-template-columns: minmax(0, 1fr) !important; gap: var(--sp-8) !important; }
  .woocommerce div.product form.cart .variations select { max-width: 100% !important; }
}

/* reanúncio de confiança sob o botão de compra (hook e4_pdp_trust) */
.single-product .pdp-trust {
  display: flex !important; flex-direction: column !important; gap: var(--sp-2) !important;
  list-style: none !important; margin: var(--sp-5) 0 0 !important;
  padding: var(--sp-4) 0 0 !important; border-top: 1px solid var(--ui-border-muted) !important;
}
.single-product .pdp-trust__item {
  display: flex !important; align-items: center !important; gap: var(--sp-3) !important;
  font-family: var(--font-body) !important; font-size: var(--fs-sm) !important; color: var(--text-secondary) !important;
}
.single-product .pdp-trust__item .icon { width: 18px !important; height: 18px !important; stroke-width: 1.4 !important; color: var(--color-ink) !important; flex-shrink: 0 !important; }

/* ---------------------------------------------------------------
   29) AVALIAÇÕES (home) — editorial: sem caixas, aspas grandes,
   colunas separadas por fio. As 5 estrelas repetidas saem (a média
   já aparece no cabeçalho da seção).
   --------------------------------------------------------------- */
#reviews .review-card {
  background: transparent !important; border: 1px solid transparent !important; border-radius: 0 !important;
  padding: 0 !important; gap: var(--sp-4) !important; box-shadow: none !important;
}
#reviews .review-card .stars { display: none !important; }
#reviews .review-card::before {
  content: "\201C"; display: block; font-family: var(--font-accent); font-style: italic;
  font-size: 72px; line-height: 0.55; color: var(--color-ink);
}
#reviews .review-card p { font-size: var(--fs-lg) !important; line-height: 1.6 !important; }
#reviews.grid-3 { column-gap: 0 !important; row-gap: var(--sp-10) !important; }
#reviews .review-card + .review-card { border-left: 1px solid var(--ui-border) !important; padding-left: var(--sp-8) !important; }
#reviews .review-card:not(:last-child) { padding-right: var(--sp-8) !important; }
@media (max-width: 900px) {
  #reviews.grid-3 { grid-template-columns: 1fr !important; }
  #reviews .review-card + .review-card {
    border-left: none !important; padding-left: 0 !important;
    border-top: 1px solid var(--ui-border) !important; padding-top: var(--sp-8) !important;
  }
  #reviews .review-card:not(:last-child) { padding-right: 0 !important; }
}

/* ---------------------------------------------------------------
   30) NEWSLETTER — se destaca do band cinza das avaliações
   --------------------------------------------------------------- */
.newsletter { background: var(--color-paper) !important; border-top: 1px solid var(--ui-border-muted) !important; padding: var(--sp-16) 0 !important; }
.newsletter__title { font-size: var(--fs-3xl) !important; line-height: var(--lh-3xl) !important; }
.newsletter__form .input { background: var(--ui-surface) !important; }

/* ---------------------------------------------------------------
   31) SOBRE — split editorial (título fixo à esq., texto à dir.)
   e índice das linhas em lista fina (sem thumbnail repetida)
   --------------------------------------------------------------- */
.about-editorial {
  display: grid !important; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr) !important;
  gap: var(--sp-12) !important; align-items: start !important; margin-top: var(--sp-10) !important;
}
.about-editorial .page-hero { border-bottom: none !important; margin: 0 !important; padding: 0 !important; position: sticky !important; top: 120px !important; }
.about-editorial .entry-content { margin-top: var(--sp-2) !important; max-width: 640px !important; }
@media (max-width: 900px) {
  .about-editorial { grid-template-columns: 1fr !important; gap: var(--sp-6) !important; }
  .about-editorial .page-hero { position: static !important; }
}

.about-lines { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 0 var(--sp-12) !important; }
.about-line {
  display: flex !important; align-items: center !important; justify-content: space-between !important;
  gap: var(--sp-4) !important; background: transparent !important;
  border: none !important; border-bottom: 1px solid var(--ui-border) !important; border-radius: 0 !important;
  padding: var(--sp-5) 0 !important;
  transition: padding-left var(--t-base), border-color var(--t-base) !important;
}
.about-line:hover { border-bottom-color: var(--color-ink) !important; box-shadow: none !important; padding-left: var(--sp-2) !important; }
.about-line__body { display: flex !important; flex-direction: column !important; gap: 2px !important; }
.about-line__name { font-size: var(--fs-lg) !important; font-weight: var(--fw-light) !important; }
.about-line__arrow {
  flex-shrink: 0 !important; width: 36px !important; height: 36px !important;
  border: 1px solid var(--ui-border) !important; border-radius: var(--radius-circle) !important;
  display: inline-flex !important; align-items: center !important; justify-content: center !important;
  color: var(--color-ink) !important;
  transition: background var(--t-base), color var(--t-base), border-color var(--t-base), transform var(--t-base) !important;
}
.about-line:hover .about-line__arrow { background: var(--color-ink) !important; color: var(--color-paper) !important; border-color: var(--color-ink) !important; transform: translateX(3px) !important; }
.about-line__arrow .icon { width: 16px !important; height: 16px !important; }
@media (max-width: 1024px) { .about-lines { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } }
@media (max-width: 640px)  { .about-lines { grid-template-columns: 1fr !important; } }

/* ---------------------------------------------------------------
   32) CONTATO — dados em lista fina com fios
   --------------------------------------------------------------- */
.contact-info { gap: 0 !important; }
.contact-info .contact-info__item { padding: var(--sp-4) 0 !important; }
.contact-info .contact-info__item + .contact-info__item { border-top: 1px solid var(--ui-border-muted) !important; }

/* ---------------------------------------------------------------
   33) MOTION — reveal com stagger no scroll + entrada do hero
   (classes aplicadas via JS; sem JS nada muda; respeita
   prefers-reduced-motion)
   --------------------------------------------------------------- */
@media (prefers-reduced-motion: no-preference) {
  .e4-reveal {
    opacity: 0 !important; transform: translateY(16px) !important;
    transition: opacity 0.65s cubic-bezier(0.16, 1, 0.3, 1), transform 0.65s cubic-bezier(0.16, 1, 0.3, 1) !important;
    transition-delay: var(--e4-d, 0ms) !important;
  }
  .e4-reveal.is-in { opacity: 1 !important; transform: none !important; }
  /* hero: conteúdo entra orquestrado no load */
  .hero__content > * { animation: e4Rise 0.8s cubic-bezier(0.16, 1, 0.3, 1) both !important; }
  .hero__content > *:nth-child(1) { animation-delay: 0.08s !important; }
  .hero__content > *:nth-child(2) { animation-delay: 0.18s !important; }
  .hero__content > *:nth-child(3) { animation-delay: 0.28s !important; }
  .hero__content > *:nth-child(4) { animation-delay: 0.38s !important; }
  .hero__content > *:nth-child(5) { animation-delay: 0.48s !important; }
}
@keyframes e4Rise { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }

/* ---------------------------------------------------------------
   34) CARROSSEL DE CATEGORIAS (home) — sem scrollbar nativa,
   navegação por setas (mesmo padrão do slider de relacionados);
   no mobile as setas somem (≤900px, regra do §19) e fica o toque
   --------------------------------------------------------------- */
.cat-rail {
  scrollbar-width: none !important; -ms-overflow-style: none !important;
  padding-bottom: 0 !important; scroll-behavior: smooth !important;
}
.cat-rail::-webkit-scrollbar { display: none !important; width: 0 !important; height: 0 !important; }
.e4-slider-wrap--cats { position: relative !important; }
.e4-slider-wrap--cats .e4-slider-nav { top: 38% !important; }

/* ---------------------------------------------------------------
   35) CHECKOUT — layout aprovado: cupom em card com etiqueta,
   card central com passos numerados (1 Cobrança / 2 Informações
   adicionais) e resumo do pedido em card único à direita
   --------------------------------------------------------------- */

/* o heading e o corpo do resumo formam UM card: sem row-gap, linha 1 com
   altura natural (auto) e o excedente do card de dados absorvido pela
   linha 2 (1fr) — senão o heading estica e o card abre um vão no meio */
@media (min-width: 992px) {
  .woocommerce-checkout form.checkout.woocommerce-checkout {
    row-gap: 0 !important; column-gap: var(--sp-12) !important;
    grid-template-rows: auto 1fr !important;
  }
  .woocommerce-checkout form.checkout #order_review_heading { align-self: end !important; }
  .woocommerce-checkout form.checkout #order_review { align-self: start !important; }
}
/* avisos do WC usam glifo da fonte de ícones própria (não carregada pelo
   tema) — vira "�"; esconde o pseudo-elemento em todos os avisos */
.woocommerce-message::before, .woocommerce-info::before, .woocommerce-error::before,
.woocommerce-message::after, .woocommerce-info::after, .woocommerce-error::after { display: none !important; }
.woocommerce-message .button { float: right !important; margin-left: var(--sp-4) !important; }

/* -- cupom: card com ícone de etiqueta em círculo preto e chevron -- */
@media (min-width: 992px) {
  .woocommerce-checkout .woocommerce-form-coupon-toggle,
  .woocommerce-checkout form.checkout_coupon.woocommerce-form-coupon { width: calc(100% - 428px) !important; }
}
.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info {
  position: relative !important; display: block !important;
  background: #fff !important; border: 1px solid var(--ui-border) !important;
  border-radius: var(--radius-lg) !important;
  padding: var(--sp-4) 56px var(--sp-4) 76px !important;
  margin: 0 0 var(--sp-6) !important;
  color: var(--color-ink) !important; font-family: var(--font-body) !important;
  font-size: var(--fs-base) !important; font-weight: var(--fw-semibold) !important;
}
.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info::before {
  content: "" !important; display: block !important; position: absolute !important; left: 20px !important; top: 50% !important;
  transform: translateY(-50%) !important; width: 38px !important; height: 38px !important;
  border-radius: var(--radius-circle) !important; background-color: var(--color-ink) !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.6 13.4L11 3.8H4v7l9.6 9.6a2 2 0 0 0 2.8 0l4.2-4.2a2 2 0 0 0 0-2.8z'/%3E%3Ccircle cx='7.5' cy='7.5' r='1'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important; background-position: center !important; background-size: 18px 18px !important;
}
.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info::after {
  content: "" !important; display: block !important; position: absolute !important; right: 22px !important; top: 50% !important;
  transform: translateY(-50%) !important; width: 16px !important; height: 16px !important;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23878787' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") center / contain no-repeat !important;
}
.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info a.showcoupon {
  display: block !important; margin-top: 2px !important;
  font-weight: var(--fw-regular) !important; color: var(--color-ink) !important;
  text-decoration: underline !important; text-underline-offset: 3px !important;
}
.woocommerce-checkout form.checkout_coupon.woocommerce-form-coupon {
  background: #fff !important; border: 1px solid var(--ui-border) !important;
  border-radius: var(--radius-lg) !important; padding: var(--sp-5) !important; margin: 0 0 var(--sp-6) !important;
}

/* -- coluna central: card branco com os dois passos -- */
.woocommerce-checkout form.checkout #customer_details {
  display: block !important; float: none !important; width: auto !important;
  background: #fff !important; border: 1px solid var(--ui-border-muted) !important;
  border-radius: var(--radius-xl) !important; padding: var(--sp-8) !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04) !important;
}
.woocommerce-checkout #customer_details .col-1,
.woocommerce-checkout #customer_details .col-2 { float: none !important; width: 100% !important; }
.woocommerce-checkout #customer_details .col-2 { margin-top: var(--sp-8) !important; }

/* passos numerados */
.woocommerce-checkout .woocommerce-billing-fields > h3,
.woocommerce-checkout .woocommerce-additional-fields > h3 {
  display: flex !important; align-items: center !important; gap: var(--sp-3) !important;
  margin: 0 0 var(--sp-6) !important;
  font-family: var(--font-display) !important; font-size: var(--fs-md) !important;
  font-weight: var(--fw-semibold) !important; letter-spacing: var(--ls-wide) !important;
  text-transform: uppercase !important; color: var(--color-ink) !important;
}
.woocommerce-checkout .woocommerce-billing-fields > h3::before,
.woocommerce-checkout .woocommerce-additional-fields > h3::before {
  content: "1"; flex-shrink: 0 !important; width: 28px !important; height: 28px !important;
  border-radius: var(--radius-circle) !important; background: var(--color-ink) !important; color: #fff !important;
  display: inline-flex !important; align-items: center !important; justify-content: center !important;
  font-family: var(--font-ui) !important; font-size: 13px !important; font-weight: 600 !important;
  letter-spacing: 0 !important;
}
.woocommerce-checkout .woocommerce-additional-fields > h3::before { content: "2"; }
.woocommerce-checkout .woocommerce-billing-fields > h3::after {
  content: "Seus dados estão seguros" !important; margin-left: auto !important;
  font-family: var(--font-body) !important; font-size: var(--fs-sm) !important;
  font-weight: var(--fw-regular) !important; letter-spacing: 0 !important; text-transform: none !important;
  color: var(--text-tertiary) !important;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23878787' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='11' width='14' height='9' rx='2'/%3E%3Cpath d='M8 11V8a4 4 0 0 1 8 0v3'/%3E%3C/svg%3E") left center / 15px 15px no-repeat !important;
  padding-left: 22px !important;
}
@media (max-width: 640px) { .woocommerce-checkout .woocommerce-billing-fields > h3::after { display: none !important; } }

/* grade dos campos (pares lado a lado como no layout) */
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper,
.woocommerce-checkout .woocommerce-additional-fields__field-wrapper {
  display: grid !important; grid-template-columns: 1fr 1fr !important;
  column-gap: var(--sp-4) !important; row-gap: var(--sp-5) !important;
}
.woocommerce-checkout .form-row {
  float: none !important; width: 100% !important; margin: 0 !important; padding: 0 !important;
  grid-column: 1 / -1;
}
.woocommerce-checkout .form-row-first { grid-column: 1 !important; }
.woocommerce-checkout .form-row-last { grid-column: 2 !important; }
@media (max-width: 640px) {
  .woocommerce-checkout .woocommerce-billing-fields__field-wrapper { grid-template-columns: 1fr !important; }
  .woocommerce-checkout .form-row-first, .woocommerce-checkout .form-row-last { grid-column: 1 / -1 !important; }
}
.woocommerce-checkout .form-row label {
  font-family: var(--font-body) !important; font-size: var(--fs-sm) !important;
  font-weight: var(--fw-semibold) !important; color: var(--color-ink) !important; margin-bottom: 6px !important;
}
/* ícone de pessoa nos campos Nome/Sobrenome */
.woocommerce-checkout input#billing_first_name,
.woocommerce-checkout input#billing_last_name {
  padding-left: 42px !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239e9e9e' stroke-width='1.6' stroke-linecap='round'%3E%3Ccircle cx='12' cy='8' r='3.5'/%3E%3Cpath d='M4.5 20c1.6-3.4 4.5-5 7.5-5s5.9 1.6 7.5 5'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important; background-position: 14px center !important; background-size: 16px 16px !important;
}

/* -- resumo à direita: cabeçalho + corpo formam UM card -- */
.woocommerce-checkout #order_review_heading {
  background: #fff !important; border: 1px solid var(--ui-border-muted) !important; border-bottom: none !important;
  border-radius: var(--radius-xl) var(--radius-xl) 0 0 !important;
  margin: 0 !important; padding: var(--sp-6) var(--sp-6) var(--sp-2) !important;
  display: flex !important; align-items: center !important; gap: 10px !important;
  font-family: var(--font-display) !important; font-size: var(--fs-md) !important;
  font-weight: var(--fw-semibold) !important; letter-spacing: var(--ls-wide) !important;
  text-transform: uppercase !important; color: var(--color-ink) !important;
}
.woocommerce-checkout #order_review_heading::before {
  content: "" !important; width: 18px !important; height: 18px !important; flex-shrink: 0 !important;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='11' width='14' height='9' rx='2'/%3E%3Cpath d='M8 11V8a4 4 0 0 1 8 0v3'/%3E%3C/svg%3E") center / contain no-repeat !important;
}
.woocommerce-checkout #order_review {
  background: #fff !important; border: 1px solid var(--ui-border-muted) !important; border-top: none !important;
  border-radius: 0 0 var(--radius-xl) var(--radius-xl) !important;
  padding: 0 var(--sp-6) var(--sp-6) !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04) !important;
}

/* tabela do resumo: sem moldura, linhas limpas */
.woocommerce-checkout #order_review table.shop_table {
  border: none !important; border-radius: 0 !important; margin: 0 !important;
  border-collapse: collapse !important; background: transparent !important;
}
.woocommerce-checkout #order_review table.shop_table th,
.woocommerce-checkout #order_review table.shop_table td {
  padding: var(--sp-3) 0 !important; border: none !important; background: transparent !important;
  vertical-align: middle !important;
}
.woocommerce-checkout #order_review table.shop_table thead th {
  font-family: var(--font-ui) !important; font-size: 11px !important; font-weight: var(--fw-medium) !important;
  letter-spacing: var(--ls-wider) !important; text-transform: uppercase !important;
  color: var(--text-tertiary) !important; border-bottom: 1px solid var(--ui-border-muted) !important;
  padding-bottom: var(--sp-2) !important;
}
.woocommerce-checkout #order_review td.product-name {
  display: flex !important; align-items: center !important; gap: var(--sp-3) !important;
  font-size: var(--fs-sm) !important; line-height: 1.45 !important; color: var(--color-ink) !important;
}
.woocommerce-checkout #order_review .e4-review-thumb {
  flex: 0 0 56px !important; width: 56px !important; height: 56px !important; display: block !important;
  border: 1px solid var(--ui-border-muted) !important; border-radius: var(--radius-md) !important;
  background: #fff !important; overflow: hidden !important;
}
.woocommerce-checkout #order_review .e4-review-thumb img {
  width: 100% !important; height: 100% !important; object-fit: contain !important; margin: 0 !important;
  border: none !important; border-radius: 0 !important;
}
.woocommerce-checkout #order_review .product-quantity {
  display: block !important; margin-top: 2px !important;
  font-weight: var(--fw-regular) !important; color: var(--text-tertiary) !important; font-size: var(--fs-sm) !important;
}
.woocommerce-checkout #order_review td.product-total {
  text-align: right !important; font-family: var(--font-ui) !important;
  font-weight: var(--fw-semibold) !important; font-size: var(--fs-sm) !important;
}
.woocommerce-checkout #order_review .variation { margin: 2px 0 0 !important; font-size: var(--fs-xs) !important; color: var(--text-tertiary) !important; }

/* totais */
.woocommerce-checkout #order_review tfoot th {
  font-family: var(--font-body) !important; font-size: var(--fs-sm) !important;
  font-weight: var(--fw-regular) !important; color: var(--text-secondary) !important; text-transform: none !important;
}
.woocommerce-checkout #order_review tfoot td { text-align: right !important; font-family: var(--font-ui) !important; font-size: var(--fs-sm) !important; }
.woocommerce-checkout #order_review tr.cart-subtotal th,
.woocommerce-checkout #order_review tr.cart-subtotal td { border-top: 1px solid var(--ui-border-muted) !important; padding-top: var(--sp-4) !important; }
.woocommerce-checkout #order_review tr.woocommerce-shipping-totals td,
.woocommerce-checkout #order_review tr.shipping td { color: var(--fn-success) !important; font-weight: var(--fw-semibold) !important; }
.woocommerce-checkout #order_review tr.order-total th,
.woocommerce-checkout #order_review tr.order-total td {
  border-top: 1px solid var(--ui-border) !important; padding-top: var(--sp-4) !important;
  font-size: var(--fs-lg) !important; font-weight: var(--fw-bold) !important; color: var(--color-ink) !important;
  text-transform: uppercase !important; letter-spacing: var(--ls-wide) !important;
}
.woocommerce-checkout #order_review tr.order-total .woocommerce-Price-amount { font-family: var(--font-ui) !important; }

/* caixas de confiança (pagamento seguro / entrega) */
.e4-check-box {
  display: flex !important; align-items: flex-start !important; gap: var(--sp-3) !important;
  background: var(--ui-surface) !important; border: 1px solid var(--ui-border-muted) !important;
  border-radius: var(--radius-lg) !important; padding: var(--sp-4) !important; margin: var(--sp-4) 0 0 !important;
}
.e4-check-box > .icon { width: 20px !important; height: 20px !important; flex-shrink: 0 !important; margin-top: 1px !important; stroke-width: 1.5 !important; color: var(--color-ink) !important; }
.e4-check-box__txt strong { display: block !important; font-family: var(--font-body) !important; font-size: var(--fs-sm) !important; font-weight: var(--fw-semibold) !important; color: var(--color-ink) !important; }
.e4-check-box__txt p { margin: 2px 0 0 !important; font-size: 12px !important; line-height: 1.5 !important; color: var(--text-secondary) !important; }
.e4-check-box__flags { display: flex !important; flex-wrap: wrap !important; gap: 5px !important; margin-top: var(--sp-3) !important; }
.e4-check-box__flags img {
  height: 16px !important; width: auto !important; display: block !important;
  background: #fff !important; border: 1px solid var(--ui-border) !important;
  border-radius: var(--radius-xs) !important; padding: 2px 5px !important; box-sizing: content-box !important;
}

/* pagamento dentro do card (transparente) + botão preto com cadeado */
.woocommerce-checkout #order_review #payment { background: transparent !important; border: none !important; border-radius: 0 !important; }
.woocommerce-checkout #order_review #payment ul.payment_methods {
  background: transparent !important; border: none !important; padding: var(--sp-4) 0 0 !important; margin: 0 !important;
}
.woocommerce-checkout #order_review #payment .woocommerce-info,
.woocommerce-checkout #order_review #payment .woocommerce-notice {
  background: var(--ui-surface) !important; border: 1px dashed var(--ui-border) !important;
  border-radius: var(--radius-md) !important; color: var(--text-secondary) !important;
  font-size: var(--fs-sm) !important; padding: var(--sp-3) var(--sp-4) !important; margin: var(--sp-4) 0 0 !important;
}
.woocommerce-checkout #order_review #payment div.form-row.place-order { padding: var(--sp-5) 0 0 !important; margin: 0 !important; }
.woocommerce-checkout #place_order {
  width: 100% !important; display: inline-flex !important; align-items: center !important; justify-content: center !important;
  gap: 10px !important; background: var(--color-ink) !important; color: #fff !important;
  border: 1px solid var(--color-ink) !important; border-radius: var(--radius-pill) !important;
  padding: 16px 24px !important; font-family: var(--font-display) !important; font-size: var(--fs-base) !important;
  font-weight: var(--fw-medium) !important; letter-spacing: var(--ls-wide) !important; text-transform: uppercase !important;
}
.woocommerce-checkout #place_order:hover { background: var(--color-primary-hover) !important; }
.woocommerce-checkout #place_order::before {
  content: "" !important; width: 15px !important; height: 15px !important;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='11' width='14' height='9' rx='2'/%3E%3Cpath d='M8 11V8a4 4 0 0 1 8 0v3'/%3E%3C/svg%3E") center / contain no-repeat !important;
}

/* selo final */
.e4-check-certified {
  display: flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important;
  margin: var(--sp-5) 0 0 !important; font-size: var(--fs-sm) !important; color: var(--text-secondary) !important;
}
.e4-check-certified .icon { width: 16px !important; height: 16px !important; color: var(--color-ink) !important; }

/* ---------------------------------------------------------------
   36) CARRINHO — layout aprovado: título com fio caramelo +
   subtítulo, tabela em card (X circular, meta da variação inline,
   stepper −/+), cupom em pill acoplado, faixa de confiança
   --------------------------------------------------------------- */
.woocommerce-cart .page-hero { border-bottom: none !important; margin-bottom: 0 !important; padding-bottom: var(--sp-2) !important; }
.woocommerce-cart .page-hero .h1::after {
  content: "" !important; display: block !important; width: 64px !important; height: 3px !important;
  background: #BE9975 !important; margin-top: var(--sp-4) !important; border-radius: 2px !important;
}
.e4-cart-sub { grid-column: 1 / -1 !important; margin: 0 0 var(--sp-2) !important; color: var(--text-secondary) !important; font-size: var(--fs-md) !important; }

/* tabela em card (o form é o card; a tabela fica sem moldura própria) */
.woocommerce-cart form.woocommerce-cart-form {
  background: #fff !important; border: 1px solid var(--ui-border-muted) !important;
  border-radius: var(--radius-xl) !important; padding: var(--sp-2) var(--sp-6) var(--sp-5) !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04) !important;
}
.woocommerce-cart form.woocommerce-cart-form table.shop_table {
  border: none !important; border-radius: 0 !important; margin: 0 !important;
  border-collapse: collapse !important; background: transparent !important;
}
.woocommerce-cart form.woocommerce-cart-form table.shop_table th,
.woocommerce-cart form.woocommerce-cart-form table.shop_table td {
  border: none !important; background: transparent !important; padding: var(--sp-4) var(--sp-2) !important;
  vertical-align: middle !important;
}
.woocommerce-cart form.woocommerce-cart-form table.shop_table thead th {
  font-family: var(--font-ui) !important; font-size: 11px !important; font-weight: var(--fw-medium) !important;
  letter-spacing: var(--ls-wider) !important; text-transform: uppercase !important;
  color: var(--text-tertiary) !important; border-bottom: 1px solid var(--ui-border-muted) !important;
  text-align: left !important;
}
.woocommerce-cart form.woocommerce-cart-form table.shop_table thead th.product-price,
.woocommerce-cart form.woocommerce-cart-form table.shop_table thead th.product-quantity { text-align: center !important; }
.woocommerce-cart form.woocommerce-cart-form table.shop_table thead th.product-subtotal { text-align: right !important; }
.woocommerce-cart form.woocommerce-cart-form table.shop_table tbody tr.cart_item + tr.cart_item td { border-top: 1px solid var(--ui-border-muted) !important; }

/* remover (X) circular */
.woocommerce-cart td.product-remove a.remove {
  width: 34px !important; height: 34px !important; line-height: 32px !important;
  border: 1px solid var(--ui-border) !important; border-radius: var(--radius-circle) !important;
  background: #fff !important; color: var(--color-ink) !important; font-size: 17px !important; font-weight: 400 !important;
}
.woocommerce-cart td.product-remove a.remove:hover { background: var(--color-ink) !important; color: #fff !important; border-color: var(--color-ink) !important; }

/* produto: foto maior + nome + atributos inline em cinza */
.woocommerce-cart td.product-thumbnail img { width: 76px !important; height: 76px !important; }
.woocommerce-cart td.product-name { font-size: var(--fs-md) !important; }
.woocommerce-cart td.product-name a { font-weight: var(--fw-medium) !important; color: var(--color-ink) !important; text-decoration: none !important; }
.woocommerce-cart td.product-name a:hover { color: var(--text-secondary) !important; }
.woocommerce-cart td.product-name dl.variation {
  display: flex !important; flex-wrap: wrap !important; align-items: center !important;
  gap: 2px 10px !important; margin: 4px 0 0 !important;
  font-size: var(--fs-sm) !important; color: var(--text-tertiary) !important;
}
.woocommerce-cart td.product-name dl.variation dt { font-weight: var(--fw-regular) !important; margin: 0 !important; padding: 0 !important; }
.woocommerce-cart td.product-name dl.variation dd { margin: 0 !important; padding: 0 !important; }
.woocommerce-cart td.product-name dl.variation dd p { margin: 0 !important; display: inline !important; }
.woocommerce-cart td.product-name dl.variation dd + dt::before { content: "|"; margin-right: 10px; color: var(--ui-border-strong); }

/* preço e subtotal */
.woocommerce-cart td.product-price { text-align: center !important; font-family: var(--font-ui) !important; font-size: var(--fs-md) !important; }
.woocommerce-cart td.product-subtotal { text-align: right !important; font-family: var(--font-ui) !important; font-weight: var(--fw-semibold) !important; font-size: var(--fs-md) !important; }

/* stepper − / + */
.woocommerce-cart td.product-quantity { text-align: center !important; }
.woocommerce-cart td.product-quantity .quantity {
  display: inline-flex !important; align-items: center !important;
  border: 1px solid var(--ui-border) !important; border-radius: var(--radius-md) !important;
  overflow: hidden !important; background: #fff !important;
}
.e4-qty-btn {
  width: 38px !important; height: 44px !important; display: inline-flex !important;
  align-items: center !important; justify-content: center !important;
  background: #fff !important; border: none !important; color: var(--color-ink) !important;
  font-size: 17px !important; cursor: pointer !important; transition: background var(--t-fast) !important;
}
.e4-qty-btn:hover { background: var(--ui-surface-muted) !important; }
.woocommerce-cart td.product-quantity .quantity input.qty {
  border: none !important; box-shadow: none !important; border-radius: 0 !important;
  width: 44px !important; min-height: 44px !important; padding: 0 !important; text-align: center !important;
  font-family: var(--font-ui) !important; font-size: var(--fs-md) !important; background: #fff !important;
  -moz-appearance: textfield;
}
.woocommerce-cart .quantity input.qty::-webkit-outer-spin-button,
.woocommerce-cart .quantity input.qty::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

/* rodapé do card: cupom acoplado à esquerda, atualizar à direita */
.woocommerce-cart td.actions { padding-top: var(--sp-5) !important; border-top: 1px solid var(--ui-border-muted) !important; }
.woocommerce-cart td.actions .coupon { display: inline-flex !important; align-items: stretch !important; float: none !important; }
.woocommerce-cart td.actions .coupon label { display: none !important; }
.woocommerce-cart td.actions .coupon input#coupon_code {
  width: 220px !important; min-height: 48px !important;
  border: 1px solid var(--ui-border) !important; border-right: none !important;
  border-radius: var(--radius-md) 0 0 var(--radius-md) !important;
  padding: 0 14px 0 40px !important; font-size: var(--fs-base) !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23878787' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.6 13.4L11 3.8H4v7l9.6 9.6a2 2 0 0 0 2.8 0l4.2-4.2a2 2 0 0 0 0-2.8z'/%3E%3Ccircle cx='7.5' cy='7.5' r='1'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important; background-position: 14px center !important; background-size: 15px 15px !important;
}
.woocommerce-cart td.actions .coupon button[name="apply_coupon"] {
  border-radius: 0 var(--radius-md) var(--radius-md) 0 !important;
  background: var(--color-ink) !important; color: #fff !important; border: 1px solid var(--color-ink) !important;
  padding: 0 22px !important; min-height: 48px !important;
  font-family: var(--font-display) !important; font-size: var(--fs-sm) !important;
  font-weight: var(--fw-medium) !important; letter-spacing: var(--ls-wide) !important; text-transform: uppercase !important;
}
.woocommerce-cart td.actions .coupon button[name="apply_coupon"]:hover { background: var(--color-primary-hover) !important; }
.woocommerce-cart td.actions > button[name="update_cart"] {
  float: right !important; min-height: 48px !important; padding: 0 22px !important;
  display: inline-flex !important; align-items: center !important; gap: 10px !important;
  background: #fff !important; color: var(--color-ink) !important;
  border: 1px solid var(--ui-border) !important; border-radius: var(--radius-md) !important;
  font-family: var(--font-display) !important; font-size: var(--fs-sm) !important;
  font-weight: var(--fw-medium) !important; letter-spacing: var(--ls-wide) !important; text-transform: uppercase !important;
}
.woocommerce-cart td.actions > button[name="update_cart"]:hover { border-color: var(--color-ink) !important; }
.woocommerce-cart td.actions > button[name="update_cart"]::after {
  content: "" !important; width: 15px !important; height: 15px !important;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 12a9 9 0 1 1-2.6-6.3'/%3E%3Cpath d='M21 3v6h-6'/%3E%3C/svg%3E") center / contain no-repeat !important;
}
.woocommerce-cart td.actions > button[name="update_cart"]:disabled { opacity: 0.45 !important; cursor: default !important; }

/* faixa de confiança sob o carrinho */
.e4-cart-trust {
  grid-column: 1 / -1 !important;
  display: grid !important; grid-template-columns: repeat(4, 1fr) !important; gap: var(--sp-4) !important;
  background: var(--ui-surface) !important; border: 1px solid var(--ui-border-muted) !important;
  border-radius: var(--radius-xl) !important; padding: var(--sp-5) var(--sp-6) !important; margin-top: var(--sp-8) !important;
}
.e4-cart-trust__item { display: flex !important; align-items: center !important; gap: var(--sp-3) !important; }
.e4-cart-trust__item .icon { width: 24px !important; height: 24px !important; flex-shrink: 0 !important; stroke-width: 1.4 !important; color: var(--color-ink) !important; }
.e4-cart-trust__item strong { display: block !important; font-family: var(--font-body) !important; font-size: var(--fs-sm) !important; font-weight: var(--fw-semibold) !important; color: var(--color-ink) !important; }
.e4-cart-trust__item p { margin: 1px 0 0 !important; font-size: 12px !important; color: var(--text-secondary) !important; }
@media (max-width: 900px) { .e4-cart-trust { grid-template-columns: 1fr 1fr !important; } }

/* totais do carrinho (coluna direita) no mesmo visual do resumo */
.woocommerce-cart .cart_totals {
  background: #fff !important; border: 1px solid var(--ui-border-muted) !important;
  border-radius: var(--radius-xl) !important; padding: var(--sp-6) !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04) !important;
}
.woocommerce-cart .cart_totals h2 {
  font-family: var(--font-display) !important; font-size: var(--fs-md) !important;
  font-weight: var(--fw-semibold) !important; letter-spacing: var(--ls-wide) !important;
  text-transform: uppercase !important; margin: 0 0 var(--sp-4) !important;
}
.woocommerce-cart .cart_totals table.shop_table { border: none !important; margin: 0 !important; }
.woocommerce-cart .cart_totals table.shop_table th,
.woocommerce-cart .cart_totals table.shop_table td { border: none !important; background: transparent !important; padding: var(--sp-3) 0 !important; }
.woocommerce-cart .cart_totals table.shop_table th { font-family: var(--font-body) !important; font-size: var(--fs-sm) !important; font-weight: var(--fw-regular) !important; color: var(--text-secondary) !important; }
.woocommerce-cart .cart_totals table.shop_table td { text-align: right !important; font-family: var(--font-ui) !important; }
.woocommerce-cart .cart_totals tr.order-total th,
.woocommerce-cart .cart_totals tr.order-total td {
  border-top: 1px solid var(--ui-border) !important; padding-top: var(--sp-4) !important;
  font-size: var(--fs-lg) !important; font-weight: var(--fw-bold) !important; color: var(--color-ink) !important;
}
.woocommerce-cart .wc-proceed-to-checkout { padding: var(--sp-4) 0 0 !important; }
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button {
  width: 100% !important; display: inline-flex !important; align-items: center !important; justify-content: center !important;
  gap: 10px !important; background: var(--color-ink) !important; color: #fff !important;
  border-radius: var(--radius-pill) !important; padding: 16px 24px !important;
  font-family: var(--font-display) !important; font-size: var(--fs-base) !important;
  font-weight: var(--fw-medium) !important; letter-spacing: var(--ls-wide) !important; text-transform: uppercase !important;
}
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button::before {
  content: "" !important; width: 15px !important; height: 15px !important;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='11' width='14' height='9' rx='2'/%3E%3Cpath d='M8 11V8a4 4 0 0 1 8 0v3'/%3E%3C/svg%3E") center / contain no-repeat !important;
}

/* mobile: tabela empilhada do WC */
@media (max-width: 768px) {
  .woocommerce-cart form.woocommerce-cart-form { padding: var(--sp-4) !important; }
  .woocommerce-cart td.actions .coupon { display: flex !important; width: 100% !important; margin-bottom: var(--sp-3) !important; }
  .woocommerce-cart td.actions .coupon input#coupon_code { width: 100% !important; flex: 1 !important; }
  .woocommerce-cart td.actions > button[name="update_cart"] { float: none !important; width: 100% !important; justify-content: center !important; }
  .e4-cart-trust { grid-template-columns: 1fr !important; }
}

/* ---------------------------------------------------------------
   37) SIDECART (drawer "Sacola") — layout aprovado
   --------------------------------------------------------------- */
.drawer__title { font-size: var(--fs-xl) !important; font-weight: var(--fw-light) !important; letter-spacing: var(--ls-wider) !important; }
/* clearfix do WC no li vira item fantasma de grid (mesmo bug do §20) */
.mc-item::before, .mc-item::after,
ul.woocommerce-mini-cart li::before, ul.woocommerce-mini-cart li::after { content: none !important; display: none !important; }
.mc-item { grid-template-columns: 72px minmax(0, 1fr) auto !important; gap: var(--sp-4) !important; padding: var(--sp-5) 0 !important; align-items: center !important; }
.mc-item__media {
  width: 72px !important; height: 72px !important; border: 1px solid var(--ui-border-muted) !important;
  border-radius: var(--radius-md) !important; background: #fff !important; overflow: hidden !important;
}
.mc-item__media img { width: 100% !important; height: 100% !important; object-fit: contain !important; }
.mc-item__name a { font-weight: var(--fw-medium) !important; font-size: var(--fs-base) !important; line-height: 1.35 !important; color: var(--color-ink) !important; }
.mc-item__meta { margin-top: 3px !important; font-family: var(--font-ui) !important; font-size: var(--fs-sm) !important; color: var(--text-tertiary) !important; }
.mc-item__meta dl.variation { display: none !important; } /* a cor já está no nome da variação */
.mc-item__remove {
  display: inline-block !important; margin-top: 6px !important; font-size: 12px !important;
  color: var(--text-secondary) !important; text-decoration: underline !important; text-underline-offset: 2px !important;
}
.mc-item__remove:hover { color: var(--color-ink) !important; }
.mc-item__price { align-self: end !important; padding-bottom: 4px !important; font-family: var(--font-ui) !important; font-weight: var(--fw-semibold) !important; }

.mc-foot.drawer__foot { margin: var(--sp-4) 0 0 !important; padding: var(--sp-5) 0 0 !important; border-top: 1px solid var(--ui-border-muted) !important; }
.mc-totals { background: var(--ui-surface) !important; border-radius: var(--radius-lg) !important; padding: var(--sp-4) var(--sp-5) !important; margin-bottom: var(--sp-4) !important; }
.mc-totals__row { display: flex !important; align-items: baseline !important; justify-content: space-between !important; padding: 3px 0 !important; font-size: var(--fs-sm) !important; color: var(--text-secondary) !important; }
.mc-totals__row .woocommerce-mini-cart__total { font-family: var(--font-ui) !important; }
.mc-totals__row--total { font-size: var(--fs-md) !important; color: var(--color-ink) !important; font-weight: var(--fw-semibold) !important; }
.mc-totals__row--total span:last-child { font-family: var(--font-ui) !important; font-size: var(--fs-xl) !important; font-weight: 700 !important; }

.mc-buttons .btn { width: 100% !important; }
.mc-buttons .btn--secondary { margin-top: var(--sp-3) !important; }
.mc-btn-lock::before {
  content: "" !important; width: 15px !important; height: 15px !important;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='11' width='14' height='9' rx='2'/%3E%3Cpath d='M8 11V8a4 4 0 0 1 8 0v3'/%3E%3C/svg%3E") center / contain no-repeat !important;
}
.mc-certified { display: flex !important; align-items: flex-start !important; gap: var(--sp-3) !important; margin-top: var(--sp-5) !important; }
.mc-certified .icon { width: 18px !important; height: 18px !important; flex-shrink: 0 !important; color: var(--color-ink) !important; margin-top: 1px !important; }
.mc-certified span { font-size: 12px !important; color: var(--text-secondary) !important; line-height: 1.5 !important; }
.mc-certified strong { display: block !important; font-size: var(--fs-sm) !important; font-weight: var(--fw-semibold) !important; color: var(--color-ink) !important; }

/* ============================================================
   SEÇÃO — Mega menu "Produtos" (redesign editorial)
   ============================================================ */
.nav-bar { position: relative; }

.cat-bar__link { display: inline-flex; align-items: center; gap: var(--sp-2); color: inherit; text-decoration: none; }
.cat-bar__caret { width: 14px; height: 14px; stroke-width: 1.6; flex-shrink: 0; transition: transform var(--t-base); }
.nav-bar.is-mega-open .cat-bar__caret { transform: rotate(180deg); }

.mega {
  position: absolute; top: 100%; left: 0; right: 0; width: 100%;
  background: var(--color-paper); color: var(--text-primary);
  border-top: 1px solid var(--ui-border-muted);
  box-shadow: var(--shadow-lg);
  opacity: 0; visibility: hidden; transform: translateY(-8px);
  transition: opacity var(--t-base), transform var(--t-base), visibility 0s var(--t-base);
  z-index: var(--z-dropdown);
}
.nav-bar.is-mega-open .mega {
  opacity: 1; visibility: visible; transform: none;
  transition: opacity var(--t-base), transform var(--t-base);
}

/* Preenche mais a largura da tela que o container padrão (1320px). */
.mega .mega__inner { max-width: min(1680px, 95vw); padding-top: var(--sp-12); padding-bottom: var(--sp-12); }
.mega__cols { display: grid; grid-template-columns: minmax(360px, 440px) 1fr; gap: clamp(var(--sp-10), 5vw, var(--sp-24)); align-items: start; }

/* ---- Rail de filtros ---- */
.mega__filters { display: grid; grid-template-columns: 1fr 1.1fr; gap: var(--sp-8); }
.mega__group-title {
  display: block; font-family: var(--font-ui);
  font-size: var(--fs-xs); font-weight: var(--fw-semibold);
  letter-spacing: var(--ls-widest); text-transform: uppercase; color: var(--text-tertiary);
  padding-bottom: var(--sp-3); margin-bottom: var(--sp-2);
  border-bottom: 1px solid var(--ui-border-muted);
}
.mega__list { list-style: none; margin: 0; padding: 0; }
.mega__item {
  position: relative; display: flex; align-items: center; gap: var(--sp-3);
  min-height: 46px; padding: var(--sp-1) var(--sp-3);
  border-radius: var(--radius-md); color: var(--text-secondary); text-decoration: none;
  transition: color var(--t-fast), background-color var(--t-fast), transform var(--t-fast);
}
.mega__item::before {
  content: ""; position: absolute; left: 2px; top: 50%;
  width: 2px; height: 56%; background: var(--color-ink); border-radius: var(--radius-pill);
  transform: translateY(-50%) scaleY(0); transform-origin: center;
  transition: transform var(--t-fast);
}
.mega__item:hover { transform: translateX(3px); }
.mega__item:hover, .mega__item.is-active { color: var(--color-ink); background-color: var(--ui-surface-muted); }
.mega__item.is-active::before { transform: translateY(-50%) scaleY(1); }

.mega__lbl { font-family: var(--font-body); font-size: var(--fs-base); line-height: var(--lh-base); }
.mega__item--linha .mega__lbl {
  font-family: var(--font-display); font-size: var(--fs-md); font-weight: var(--fw-regular); letter-spacing: var(--ls-wide);
}

/* Chip de ícone (categorias) — preenche de tinta no hover/ativo. */
.mega__ico {
  display: inline-flex; align-items: center; justify-content: center;
  width: 34px; height: 34px; flex-shrink: 0;
  border-radius: var(--radius-sm); background: var(--ui-surface);
  border: 1px solid var(--ui-border-muted); color: var(--text-secondary);
  transition: background-color var(--t-fast), color var(--t-fast), border-color var(--t-fast);
}
.mega__ico-svg { width: 19px; height: 19px; stroke-width: 1.5; }
.mega__item--cat:hover .mega__ico, .mega__item--cat.is-active .mega__ico {
  background: var(--color-ink); color: var(--color-paper); border-color: var(--color-ink);
}

/* ---- Preview ---- */
.mega__preview { min-width: 0; }
.mega__panel { display: none; }
.mega__panel.is-active { display: block; animation: e4MegaFade var(--t-base) both; }
.mega__panel-head { margin-bottom: var(--sp-6); }
.mega__eyebrow {
  display: block; font-family: var(--font-ui);
  font-size: var(--fs-xs); font-weight: var(--fw-semibold);
  letter-spacing: var(--ls-widest); text-transform: uppercase; color: var(--text-tertiary);
  margin-bottom: var(--sp-2);
}
.mega__panel-title {
  display: block; font-family: var(--font-accent); font-style: italic; font-weight: var(--fw-regular);
  font-size: var(--fs-3xl); line-height: var(--lh-3xl); letter-spacing: var(--ls-tight); color: var(--color-ink);
}
.mega__cards { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--sp-6); }
.mega__all {
  display: inline-flex; align-items: center; gap: var(--sp-2); margin-top: var(--sp-8);
  font-family: var(--font-ui); font-size: var(--fs-sm); font-weight: var(--fw-semibold);
  letter-spacing: var(--ls-wide); text-transform: uppercase; color: var(--color-ink); text-decoration: none;
}
.mega__all > span { position: relative; }
.mega__all > span::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: -3px; height: 1px;
  background: currentColor; transform: scaleX(0); transform-origin: left; transition: transform var(--t-base);
}
.mega__all:hover > span::after { transform: scaleX(1); }
.mega__all-icon { width: 16px; height: 16px; transition: transform var(--t-base); }
.mega__all:hover .mega__all-icon { transform: translateX(4px); }
.mega__empty { color: var(--text-secondary); padding: var(--sp-6) 0; }

/* Entrada do painel + troca suave de preview */
@keyframes e4MegaFade { from { opacity: 0; } to { opacity: 1; } }
@keyframes e4MegaRise { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
.nav-bar.is-mega-open .mega__filters { animation: e4MegaRise var(--t-slow) both; }
.nav-bar.is-mega-open .mega__preview { animation: e4MegaRise var(--t-slow) 70ms both; }

@media (prefers-reduced-motion: reduce) {
  .mega, .nav-bar.is-mega-open .mega, .mega__filters, .mega__preview,
  .mega__panel.is-active, .mega__item, .mega__ico, .mega__all-icon,
  .mega__all > span::after, .mega__item::before, .cat-bar__caret {
    animation: none !important; transition: none !important;
  }
}

/* O painel some abaixo do breakpoint do desktop (mobile usa o drawer). */
@media (max-width: 1024px) { .mega { display: none; } }

/* Mega menu — versão mobile (accordion no drawer) */
.m-nav__summary {
  cursor: pointer; list-style: none;
  display: flex; align-items: center; justify-content: space-between;
  padding: 16px 0; border-bottom: 1px solid var(--ui-border-muted);
  font-family: var(--font-body); font-size: var(--fs-md); font-weight: var(--fw-medium);
}
.m-nav__summary::-webkit-details-marker { display: none; }
.m-nav__summary::after { content: "+"; font-size: 1.1em; line-height: 1; color: var(--text-secondary); }
.m-nav__group[open] .m-nav__summary::after { content: "\2212"; } /* − */
.m-nav__label {
  display: block; font-size: 11px; text-transform: uppercase; letter-spacing: 0.12em;
  color: var(--text-secondary); margin: var(--sp-3) 0 var(--sp-1) var(--sp-3);
}
.m-nav .m-nav__sub { padding-left: var(--sp-5); font-size: var(--fs-sm); }

/* ===== Seleção de cor por peça (kits/jogos) ===== */
.e4-piece-colors {
  margin: var(--sp-5) 0 !important; padding: var(--sp-4) var(--sp-5) !important;
  border: 1px solid var(--ui-border) !important; border-radius: var(--radius-md) !important;
  background: var(--ui-surface-muted) !important;
}
.e4-piece-colors__title {
  font-family: var(--font-ui) !important; font-size: var(--fs-sm) !important;
  font-weight: var(--fw-semibold) !important; color: var(--color-ink) !important;
  margin: 0 0 var(--sp-3) !important;
}
.e4-piece-colors__row {
  display: flex !important; align-items: center !important; gap: var(--sp-3) !important;
  margin: 0 0 var(--sp-2) !important;
}
.e4-piece-colors__row:last-child { margin-bottom: 0 !important; }
.e4-piece-colors__row label {
  flex: 0 0 42% !important; font-size: var(--fs-sm) !important;
  color: var(--text-secondary) !important; margin: 0 !important;
}
.e4-piece-colors__row select { flex: 1 1 auto !important; min-width: 0 !important; margin: 0 !important; }
@media (max-width: 480px) {
  .e4-piece-colors__row { flex-direction: column !important; align-items: stretch !important; gap: var(--sp-1) !important; }
  .e4-piece-colors__row label { flex-basis: auto !important; }
}
