.elementor-457 .elementor-element.elementor-element-03df78f{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--padding-top:0rem;--padding-bottom:0rem;--padding-left:3rem;--padding-right:3rem;}.elementor-457 .elementor-element.elementor-element-526519c{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--align-items:flex-start;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-457 .elementor-element.elementor-element-412c19f{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.woocommerce .elementor-457 .elementor-element.elementor-element-8ba97ce .flex-viewport:not(:last-child){margin-bottom:10px;}.woocommerce .elementor-457 .elementor-element.elementor-element-8ba97ce .flex-control-thumbs li{padding-right:calc(10px / 2);padding-left:calc(10px / 2);padding-bottom:10px;}.woocommerce .elementor-457 .elementor-element.elementor-element-8ba97ce .flex-control-thumbs{margin-right:calc(-10px / 2);margin-left:calc(-10px / 2);}.elementor-457 .elementor-element.elementor-element-547bb79{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-457 .elementor-element.elementor-element-728d57c .elementor-heading-title{color:#0367B8;}.elementor-widget-woocommerce-product-title .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-457 .elementor-element.elementor-element-5b10db4 > .elementor-widget-container{margin:8px 0px 0px 0px;}.elementor-457 .elementor-element.elementor-element-5b10db4 .elementor-heading-title{color:#16181C;}.elementor-457 .elementor-element.elementor-element-3dfe63f{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.woocommerce .elementor-widget-woocommerce-product-price .price{color:var( --e-global-color-primary );font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-woocommerce-product-add-to-cart .added_to_cart{font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-457 .elementor-element.elementor-element-1844989 .cart button, .elementor-457 .elementor-element.elementor-element-1844989 .cart .button{transition:all 0.2s;}.elementor-457 .elementor-element.elementor-element-1844989 .quantity .qty{transition:all 0.2s;}.elementor-457 .elementor-element.elementor-element-255e1dd{width:100%;max-width:100%;}.elementor-457 .elementor-element.elementor-element-255e1dd > .elementor-widget-container{margin:0px 0px 0px 0px;}.elementor-457 .elementor-element.elementor-element-5109966{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-457 .elementor-element.elementor-element-c1e25dc{--display:flex;}.elementor-widget-woocommerce-product-content{color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-457 .elementor-element.elementor-element-367fe42{--display:flex;}.elementor-457 .elementor-element.elementor-element-17775ed{--display:flex;}.elementor-widget-text-editor{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );color:var( --e-global-color-text );}.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:var( --e-global-color-primary );}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap, .elementor-widget-text-editor.elementor-drop-cap-view-default .elementor-drop-cap{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-457 .elementor-element.elementor-element-50fc6f3{--display:flex;}.elementor-457 .elementor-element.elementor-element-76ed5a3{--n-accordion-title-font-size:1rem;--n-accordion-title-justify-content:space-between;--n-accordion-title-flex-grow:1;--n-accordion-title-icon-order:initial;--n-accordion-item-title-space-between:0px;--n-accordion-item-title-distance-from-content:0px;--n-accordion-icon-size:14px;--n-accordion-icon-normal-color:#0367B8;--n-accordion-icon-hover-color:#0367B8;--n-accordion-icon-active-color:#0367B8;}:where( .elementor-457 .elementor-element.elementor-element-76ed5a3 > .elementor-widget-container > .e-n-accordion > .e-n-accordion-item ) > .e-con{border-style:none;}.elementor-457 .elementor-element.elementor-element-be58ba4{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-457 .elementor-element.elementor-element-be58ba4:not(.elementor-motion-effects-element-type-background), .elementor-457 .elementor-element.elementor-element-be58ba4 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#F4F6F8;}.elementor-457 .elementor-element.elementor-element-8690b01 > .elementor-widget-container{margin:0px 0px 32px 0px;}.elementor-widget-loop-grid .elementor-button{background-color:var( --e-global-color-accent );font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-widget-loop-grid .elementor-pagination{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-loop-grid .e-load-more-message{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-457 .elementor-element.elementor-element-8296d37{--grid-columns:4;--grid-row-gap:18px;--e-loop-nothing-found-message-align:start;--grid-column-gap:18px;}.elementor-457 .elementor-element.elementor-element-8296d37 .elementor-loop-container{grid-auto-rows:1fr;}.elementor-457 .elementor-element.elementor-element-8296d37 .e-loop-item > .elementor-section, .elementor-457 .elementor-element.elementor-element-8296d37 .e-loop-item > .elementor-section > .elementor-container, .elementor-457 .elementor-element.elementor-element-8296d37 .e-loop-item > .e-con, .elementor-457 .elementor-element.elementor-element-8296d37 .e-loop-item .elementor-section-wrap  > .e-con{height:100%;}.elementor-457 .elementor-element.elementor-element-8296d37 .elementor-pagination{text-align:center;}body:not(.rtl) .elementor-457 .elementor-element.elementor-element-8296d37 .elementor-pagination .page-numbers:not(:first-child){margin-left:calc( 10px/2 );}body:not(.rtl) .elementor-457 .elementor-element.elementor-element-8296d37 .elementor-pagination .page-numbers:not(:last-child){margin-right:calc( 10px/2 );}body.rtl .elementor-457 .elementor-element.elementor-element-8296d37 .elementor-pagination .page-numbers:not(:first-child){margin-right:calc( 10px/2 );}body.rtl .elementor-457 .elementor-element.elementor-element-8296d37 .elementor-pagination .page-numbers:not(:last-child){margin-left:calc( 10px/2 );}@media(max-width:1024px){.elementor-457 .elementor-element.elementor-element-8296d37{--grid-columns:2;}}@media(max-width:767px){.elementor-457 .elementor-element.elementor-element-03df78f{--padding-top:0rem;--padding-bottom:0rem;--padding-left:1.25rem;--padding-right:1.25rem;}.elementor-457 .elementor-element.elementor-element-8296d37{--grid-columns:2;--grid-row-gap:12px;--grid-column-gap:12px;}}@media(min-width:768px){.elementor-457 .elementor-element.elementor-element-412c19f{--width:52%;}}/* Start custom CSS for woocommerce-breadcrumb, class: .elementor-element-addef72 */.elementor-457 .elementor-element.elementor-element-addef72 .woocommerce-breadcrumb{
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  align-items: center;
  font-family: 'Inter', -apple-system, 'Segoe UI', Roboto, sans-serif;
  font-size: 12.5px;
  color: #70757C !important;
  margin: 0;
padding: 16px 0;
}
.elementor-457 .elementor-element.elementor-element-addef72 .woocommerce-breadcrumb a{
  color: #70757C !important;
  text-decoration: none;
  transition: color .2s cubic-bezier(.16,1,.3,1);
}
.elementor-457 .elementor-element.elementor-element-addef72 .woocommerce-breadcrumb a:hover{ color: #0367B8 !important; }/* End custom CSS */
/* Start custom CSS for woocommerce-notices, class: .elementor-element-2f31a13 */.elementor-457 .elementor-element.elementor-element-2f31a13 .woocommerce-message,
.elementor-457 .elementor-element.elementor-element-2f31a13 .woocommerce-info,
.elementor-457 .elementor-element.elementor-element-2f31a13 .woocommerce-error{
  border: 1px solid #E3E7EB;
  border-left: 3px solid #0367B8;
  border-radius: 10px;
  background: #F4F6F8;
  padding: 13px 16px;
  margin-bottom: 18px;
  font-family: 'Inter', -apple-system, 'Segoe UI', Roboto, sans-serif;
  font-size: 13.5px;
  color: #16181C;
  list-style: none;
}

/* 🔴 O ícone redondo do WooCommerce, que aparece em cima da primeira palavra.
   O `woocommerce.css` dá `padding: 1em 2em 1em 3.5em` na caixa só pra reservar
   os 3.5em da esquerda a um `::before` absoluto em `left: 1.5em`. Trocando o
   padding por 13px 16px, a reserva some e o ícone continua ancorado no mesmo
   lugar: em cima do texto.

   Ele sai em vez de ganhar espaço porque é desenhado com a fonte de ícones
   `WooCommerce`, que não é a família do site, e a barra colorida da esquerda
   (azul, verde ou vermelha) já diz o tipo da mensagem.

   O `::after` continua vivo: é ele que segura o clearfix do botão. */
.elementor-457 .elementor-element.elementor-element-2f31a13 .woocommerce-message::before,
.elementor-457 .elementor-element.elementor-element-2f31a13 .woocommerce-info::before,
.elementor-457 .elementor-element.elementor-element-2f31a13 .woocommerce-error::before{ display: none !important; }

.elementor-457 .elementor-element.elementor-element-2f31a13 .woocommerce-error{ border-left-color: #C8342A; }
.elementor-457 .elementor-element.elementor-element-2f31a13 .woocommerce-message{ border-left-color: #0B7A4B; }
.elementor-457 .elementor-element.elementor-element-2f31a13 .woocommerce-message .button,
.elementor-457 .elementor-element.elementor-element-2f31a13 .woocommerce-info .button{
  float: right;
  background: none;
  border: 0;
  padding: 0;
  color: #0367B8;
  font-weight: 600;
  text-decoration: underline;
}/* End custom CSS */
/* Start custom CSS for shortcode, class: .elementor-element-98ccca6 */.elementor-457 .elementor-element.elementor-element-98ccca6{
  position: absolute;
  top: 14px;
  left: 14px;
  display: flex;
  flex-direction: column;
  gap: 5px;
  align-items: flex-start;
  z-index: 3;
}
/* produto sem promoção e sem MagSafe: o shortcode volta vazio e o widget
   absoluto sobra por cima da foto sem nada dentro */
.elementor-457 .elementor-element.elementor-element-98ccca6:not(:has(.tag)){ display: none; }
.elementor-457 .elementor-element.elementor-element-98ccca6 .tag{
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 11.5px;
  font-weight: 600;
  letter-spacing: .01em;
}
.elementor-457 .elementor-element.elementor-element-98ccca6 .tag-off{
    background-color: rgb(224, 31, 31);
    color: rgb(255, 255, 255);
    border-style: dashed;

    border-width: 1px;
    border-color: rgb(255, 255, 255);
}
.elementor-457 .elementor-element.elementor-element-98ccca6 .tag-mag{ background: #FDF3E0; color: #8A5A00; }/* End custom CSS */
/* Start custom CSS for woocommerce-product-images, class: .elementor-element-8ba97ce *//* ==========================================================
   TECHCELL · GALERIA DO PRODUTO
   ========================================================== */

/* a moldura vai na JANELA, não na tira de fotos */
.elementor-457 .elementor-element.elementor-element-8ba97ce .woocommerce-product-gallery__wrapper,
.elementor-457 .elementor-element.elementor-element-8ba97ce .flex-viewport{
  margin: 0;
  border: 1px solid #E3E7EB;
  border-radius: 14px;
  background: #F4F6F8;
  overflow: hidden;
}
.elementor-457 .elementor-element.elementor-element-8ba97ce .flex-viewport .woocommerce-product-gallery__wrapper{
  border: 0;
  border-radius: 0;
  background: none;
}
.elementor-457 .elementor-element.elementor-element-8ba97ce .woocommerce-product-gallery__image img{
  aspect-ratio: 1;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* miniaturas */
.elementor-457 .elementor-element.elementor-element-8ba97ce .flex-control-thumbs{
  display: flex;
  gap: 10px;
  margin: 10px 0 0 !important;
  padding: 0;
  list-style: none;
  justify-content: flex-start;
}
/* width/float com !important: o FlexSlider manda `width: 25%; float: left`.
   padding com !important: o campo Espaçamento do widget escreve `0 5px 10px`
   em cada li, que soma com o gap e faz o vão do lado (18px) ficar maior que o
   de cima (10px). Zerado, o gap vira a única medida e os dois batem. */
.elementor-457 .elementor-element.elementor-element-8ba97ce .flex-control-thumbs li{
  width: auto !important;
  flex: 0 0 auto;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
}
.elementor-457 .elementor-element.elementor-element-8ba97ce .flex-control-thumbs img{
  width: 78px;
  height: 78px;
  object-fit: cover;
  padding: 0;
  border-radius: 10px;
  border: 1.5px solid #E3E7EB;
  background: #F4F6F8;
  opacity: 1;
  cursor: pointer;
  transition: border-color .2s cubic-bezier(.16,1,.3,1);
}
.elementor-457 .elementor-element.elementor-element-8ba97ce .flex-control-thumbs img:hover{ border-color: #CFD5DC; }
.elementor-457 .elementor-element.elementor-element-8ba97ce .flex-control-thumbs img.flex-active{ border-color: #0367B8; }

/* ==========================================================
   TECHCELL · SKIN DO LIGHTBOX (PhotoSwipe do WooCommerce)
   Sem `.elementor-457 .elementor-element.elementor-element-8ba97ce` de propósito: a caixa do PhotoSwipe é filha do <body>,
   fora do widget. Com `.elementor-457 .elementor-element.elementor-element-8ba97ce` na frente, nada aplicaria.
   ========================================================== */

/* fundo */
.pswp .pswp__bg{
  background: #0B0E12;
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}

/* a foto vira um card branco */
.pswp .pswp__img{
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 30px 80px rgba(0,0,0,.45);
}
.pswp .pswp__img--placeholder{ border-radius: 16px; }

/* barra de cima: sem fundo, só respiro */
.pswp .pswp__top-bar,
.pswp .pswp__ui--fit .pswp__top-bar{
  background: none;
  height: 72px;
  padding: 16px 20px 0;
  box-sizing: border-box;
}

/* contador vira pílula */
.pswp .pswp__counter{
  position: absolute;
  left: 20px;
  top: 16px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  padding: 0px 14px 4px 14px;
  border-radius: 999px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.10);
  color: rgba(255,255,255,.82);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .02em;
  opacity: 1;
  margin: 0;
}


/* ---------- botões ----------
   `.pswp .pswp__ui` na frente porque o default-skin usa duas classes.
   `!important` na cor porque o photoswipe.min.css força transparent, e na
   imagem porque ele força o sprite: sem isso o botão mostra dois ícones. */
.pswp .pswp__ui .pswp__button{
  position: relative;
  width: 40px;
  height: 40px;
  margin: 0 0 0 8px;
  border-radius: 999px;
  background-color: rgba(255,255,255,.08) !important;
  background-image: none !important;
  border: 1px solid rgba(255,255,255,.10);
  box-shadow: none;
  opacity: 1;
  transition: background-color .18s ease, border-color .18s ease, transform .18s ease;
}
.pswp .pswp__ui .pswp__button:hover{
  background-color: rgba(3,103,184,.95) !important;
  border-color: rgba(3,103,184,.95);
}
.pswp .pswp__ui .pswp__button:active{ transform: scale(.94); }
.pswp .pswp__ui .pswp__button--share{ display: none; }

/* o ícone: máscara SVG no lugar do sprite de fábrica */
.pswp .pswp__ui .pswp__button::before{
  content: "";
  position: absolute;
  inset: 0;
  width: auto;
  height: auto;
  background-color: #fff !important;
  background-image: none;
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-position: center;  mask-position: center;
  -webkit-mask-size: 18px 18px;   mask-size: 18px 18px;
}
.pswp .pswp__ui .pswp__button--close::before{
  -webkit-mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.9' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6L6 18'/%3E%3C/svg%3E");
          mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.9' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6L6 18'/%3E%3C/svg%3E");
}
.pswp .pswp__ui .pswp__button--zoom::before{
  -webkit-mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='6.5'/%3E%3Cpath d='M15.8 15.8l4.7 4.7M8.5 11h5M11 8.5v5'/%3E%3C/svg%3E");
          mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='6.5'/%3E%3Cpath d='M15.8 15.8l4.7 4.7M8.5 11h5M11 8.5v5'/%3E%3C/svg%3E");
}
.pswp .pswp__ui .pswp__button--fs::before{
  -webkit-mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 9V5.5A1.5 1.5 0 015.5 4H9M15 4h3.5A1.5 1.5 0 0120 5.5V9M20 15v3.5a1.5 1.5 0 01-1.5 1.5H15M9 20H5.5A1.5 1.5 0 014 18.5V15'/%3E%3C/svg%3E");
          mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 9V5.5A1.5 1.5 0 015.5 4H9M15 4h3.5A1.5 1.5 0 0120 5.5V9M20 15v3.5a1.5 1.5 0 01-1.5 1.5H15M9 20H5.5A1.5 1.5 0 014 18.5V15'/%3E%3C/svg%3E");
}

/* ---------- setas ----------
   Depois do bloco geral de propósito: mesma especificidade, o que vem depois
   vence. Sem isso elas herdam o position: relative e caem no canto. */
.pswp .pswp__ui .pswp__button--arrow--left,
.pswp .pswp__ui .pswp__button--arrow--right{
  position: absolute;
  width: 48px;
  height: 48px;
  top: 50%;
  margin: -24px 0 0;
  background-color: rgba(255,255,255,.08) !important;
}
.pswp .pswp__ui .pswp__button--arrow--left{ left: 24px; }
.pswp .pswp__ui .pswp__button--arrow--right{ right: 24px; }
.pswp .pswp__ui .pswp__button--arrow--left::before,
.pswp .pswp__ui .pswp__button--arrow--right::before{
  top: 0; right: 0; bottom: 0; left: 0;
  width: auto; height: auto;
  margin: 0;
  background-color: #fff !important;
  background-image: none;
  -webkit-mask-size: 22px 22px; mask-size: 22px 22px;
}
.pswp .pswp__ui .pswp__button--arrow--left::before{
  -webkit-mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14.5 5l-7 7 7 7'/%3E%3C/svg%3E");
          mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14.5 5l-7 7 7 7'/%3E%3C/svg%3E");
}
.pswp .pswp__ui .pswp__button--arrow--right::before{
  -webkit-mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9.5 5l7 7-7 7'/%3E%3C/svg%3E");
          mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9.5 5l7 7-7 7'/%3E%3C/svg%3E");
}

/* girinho de carregamento: de fábrica ele cai por cima do contador */
.pswp .pswp__preloader{
  position: absolute;
  left: 50%;
  top: 16px;
  width: 40px;
  height: 40px;
  margin: 0 0 0 -20px;
  float: none;
}

/* respiro lateral: o PhotoSwipe mede a área útil pelo clientWidth deste
   elemento, então encolher ele é o que dá margem de verdade na foto */
.pswp .pswp__scroll-wrap{
  width: calc(100% - 48px);
  left: 24px;
}

/* ---------- legenda ---------- */
.pswp .pswp__caption,
.pswp .pswp__ui--fit .pswp__caption{
  background: none;
  min-height: 0;
}
.pswp .pswp__caption--empty{ display: none; }
.pswp .pswp__caption__center{
  max-width: 720px;
  padding: 18px 20px 24px;
  text-align: center;
  font-size: 13px;
  font-weight: 500;
  color: rgba(255,255,255,.62);
}

/* ---------- celular ---------- */
@media (max-width: 767px){
  .pswp .pswp__scroll-wrap{ width: calc(100% - 32px); left: 16px; }
  .pswp .pswp__ui .pswp__button--arrow--left{ left: 10px; }
  .pswp .pswp__ui .pswp__button--arrow--right{ right: 10px; }
  .pswp .pswp__ui .pswp__button--arrow--left,
  .pswp .pswp__ui .pswp__button--arrow--right{ width: 42px; height: 42px; margin-top: -21px; }
  .pswp .pswp__top-bar{ padding: 12px 12px 0; }
  .pswp .pswp__counter{ left: 12px; top: 12px; }
  .pswp .pswp__preloader{ top: 12px; }
  .pswp .pswp__img{ border-radius: 12px; }
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-412c19f */.elementor-457 .elementor-element.elementor-element-412c19f{
  flex: 0 0 calc(52% - 22px);
  position: sticky;
  top: 180px;
}
@media (max-width: 900px){
  .elementor-457 .elementor-element.elementor-element-412c19f{
    flex: 1 1 100%;
    position: relative;
    top: auto;
  }
}/* End custom CSS */
/* Start custom CSS for heading, class: .elementor-element-728d57c */.elementor-457 .elementor-element.elementor-element-728d57c{
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: .09em;
  text-transform: uppercase;
  color: #0367B8 !important;
  margin-bottom: 6px;
}
.elementor-457 .elementor-element.elementor-element-728d57c p{ margin: 0; }

/* nos 4 produtos simples a tag dinâmica volta vazia. Sem isto o widget continua
   ocupando lugar e empurra o H1 pra baixo, com respiro que não existe nos outros */
.elementor-457 .elementor-element.elementor-element-728d57c:not(:has(p:not(:empty))){ display: none; }/* End custom CSS */
/* Start custom CSS for woocommerce-product-title, class: .elementor-element-5b10db4 */.elementor-457 .elementor-element.elementor-element-5b10db4{
  font-size: clamp(22px, 2.8vw, 32px);
  font-weight: 700;
  letter-spacing: -.03em;
  line-height: 1.2;
  color: #16181C !important;
  margin: 0;
}/* End custom CSS */
/* Start custom CSS for shortcode, class: .elementor-element-30c67c0 */.elementor-457 .elementor-element.elementor-element-30c67c0 .tc-prodmeta{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 14px;
  margin: 10px 0 20px;
  font-size: 12.5px;
  color: #70757C;
}
.elementor-457 .elementor-element.elementor-element-30c67c0 .tc-sku{
  font-family: 'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, monospace;
  font-variant-numeric: tabular-nums;
  color: #CFD5DC;
}
.elementor-457 .elementor-element.elementor-element-30c67c0 .tag{
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 11.5px;
  font-weight: 600;
}
.elementor-457 .elementor-element.elementor-element-30c67c0 .tag-estoque{ background: #E7F4EE; color: #0B7A4B; }
.elementor-457 .elementor-element.elementor-element-30c67c0 .tag-esgot{ background: #EEF0F2; color: #70757C; }/* End custom CSS */
/* Start custom CSS for woocommerce-product-short-description, class: .elementor-element-d028739 */.elementor-457 .elementor-element.elementor-element-d028739{
  font-size: 15px;
  line-height: 1.5;
  color: #55585E;
  max-width: 52ch;
}
.elementor-457 .elementor-element.elementor-element-d028739 p:last-child{ margin-bottom: 0; }/* End custom CSS */
/* Start custom CSS for woocommerce-product-price, class: .elementor-element-8ef2a9b */.elementor-457 .elementor-element.elementor-element-8ef2a9b .price{
  display: flex;
  align-items: baseline;
  gap: 10px;
  flex-wrap: wrap;
  margin: 0;
  /* o WooCommerce pinta o p.price inteiro de mostarda por padrão. Cortar na raiz */
  color: #16181C;
}

.elementor-457 .elementor-element.elementor-element-8ef2a9b .price .woocommerce-Price-amount{
  font-size: 34px;
  font-weight: 800;
  color: #16181C;
  letter-spacing: -.03em;
}

/* a cor tem que estar no <del>, não só no <span> de dentro: text-decoration é
   pintada com a cor do elemento que declara a decoração, e não com a do filho
   onde o texto mora. Era isso que deixava o traço amarelo com o número cinza.
   O font-size aqui não é repetição do filho: é o que põe o risco no meio do
   número. O <del> herdava 20px do widget e o texto dele é 14px, então o traço
   saía na altura e na espessura de um texto de 20px. O thickness trava a
   espessura em 1px em vez de deixar o navegador escalar de novo. */
.elementor-457 .elementor-element.elementor-element-8ef2a9b .price del{
  font-size: 14px;
  line-height: 1.4;
  text-decoration: line-through;
  text-decoration-color: #9AA0A8;
  text-decoration-thickness: 1px;
  color: #70757C;
  opacity: 1;
  order: -1;
  width: 100%;
}
.elementor-457 .elementor-element.elementor-element-8ef2a9b .price del .woocommerce-Price-amount{
  font-size: 14px;
  font-weight: 400;
  color: #70757C;
}
.elementor-457 .elementor-element.elementor-element-8ef2a9b .price ins{ text-decoration: none; }

@media (max-width: 900px){
  .elementor-457 .elementor-element.elementor-element-8ef2a9b .price .woocommerce-Price-amount{ font-size: 28px; }
}/* End custom CSS */
/* Start custom CSS for shortcode, class: .elementor-element-4ab004c */.elementor-457 .elementor-element.elementor-element-4ab004c .parc{
  font-size: 14px;
  font-weight: 600;
  color: #0B7A4B;
}/* End custom CSS */
/* Start custom CSS for shortcode, class: .elementor-element-c30f815 */.elementor-457 .elementor-element.elementor-element-c30f815:not(:has(.tc-pix)){ display: none; }

.elementor-457 .elementor-element.elementor-element-c30f815 .tc-pix{
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin-top: 6px;
  padding: 7px 12px;
  border-radius: 10px;
  background: #E7F4EE;
  color: #0B7A4B;
  font-size: 12.5px;
  font-weight: 600;
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-3dfe63f */.elementor-457 .elementor-element.elementor-element-3dfe63f{
  padding: 18px 0;
  margin: 20px 0 0;
  border-top: 1px solid #E3E7EB;
  border-bottom: 1px solid #E3E7EB;
  display: flex;
  flex-direction: column;
  gap: 4px;
  align-items: flex-start;
}/* End custom CSS */
/* Start custom CSS for woocommerce-product-add-to-cart, class: .elementor-element-1844989 *//* ==========================================================
   TECHCELL · FORMULÁRIO DE COMPRA
   ========================================================== */

/* --- rótulo de cada atributo (Modelo, Cor) --- */
.elementor-457 .elementor-element.elementor-element-1844989 table.variations,
.elementor-457 .elementor-element.elementor-element-1844989 .variations{
  width: 100%;
  border: 0;
  margin: 0;
}
.elementor-457 .elementor-element.elementor-element-1844989 .variations tr,
.elementor-457 .elementor-element.elementor-element-1844989 .variations td,
.elementor-457 .elementor-element.elementor-element-1844989 .variations th{
  display: block;
  width: 100%;
  border: 0;
  padding: 0;
  background: none;
}
.elementor-457 .elementor-element.elementor-element-1844989 .variations th.label{ display: none; }
.elementor-457 .elementor-element.elementor-element-1844989 .variations .value{ margin-bottom: 0; }

.elementor-457 .elementor-element.elementor-element-1844989 .tc-swatches select{ display: none; }

/* margem só em cima: cada atributo mora num <tr><td> próprio, e margem de célula
   de tabela não colapsa com a da célula seguinte. Com `22px 0` vira 44px */
.elementor-457 .elementor-element.elementor-element-1844989 .tc-swatches{ margin: 22px 0 0; }

/* o "Limpar" nativo do WooCommerce. Clicar de novo na opção escolhida já desmarca */
.elementor-457 .elementor-element.elementor-element-1844989 .reset_variations{ display: none !important; }

/* --- rótulo: "Modelo do aparelho" na esquerda, "iPhone 17 Pro Max" na direita --- */
.elementor-457 .elementor-element.elementor-element-1844989 .tc-rot{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  font-size: 12.5px;
  font-weight: 700;
  color: #16181C;
  letter-spacing: .01em;
  margin-bottom: 10px;
}
.elementor-457 .elementor-element.elementor-element-1844989 .tc-rot-val{
  font-weight: 500;
  color: #70757C;
  text-align: right;
}

/* --- as pílulas --- */
.elementor-457 .elementor-element.elementor-element-1844989 .tc-ops{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.elementor-457 .elementor-element.elementor-element-1844989 .tc-op{
  display: flex;
  align-items: center;
  margin: 0;
  padding: 9px 14px;
  border: 1.5px solid #CFD5DC;
  border-radius: 10px;
  background: #fff;
  box-shadow: none;
  font-size: 13px;
  font-weight: 500;
  color: #55585E;
  line-height: 1.2;
  cursor: pointer;
  user-select: none;
  list-style: none;
  transition: border-color .2s cubic-bezier(.16,1,.3,1),
              background .2s cubic-bezier(.16,1,.3,1),
              color .2s cubic-bezier(.16,1,.3,1);
}
.elementor-457 .elementor-element.elementor-element-1844989 .tc-op:hover{ border-color: #0367B8; color: #0367B8; }
.elementor-457 .elementor-element.elementor-element-1844989 .tc-op:focus-visible{
  outline: none;
  border-color: #0367B8;
  box-shadow: 0 0 0 3px rgba(3,103,184,.13);
}
.elementor-457 .elementor-element.elementor-element-1844989 .tc-op.on{
  border-color: #0367B8;
  background: #E8F1FA;
  color: #024E8C;
  font-weight: 600;
}
.elementor-457 .elementor-element.elementor-element-1844989 .tc-op.fora{
  opacity: .42;
  text-decoration: line-through;
  pointer-events: none;
}

/* --- pílula de cor --- */
.elementor-457 .elementor-element.elementor-element-1844989 .tc-op-cor{
  gap: 8px;
  padding: 7px 13px 7px 8px;
}
.elementor-457 .elementor-element.elementor-element-1844989 .tc-op-cor i{
  width: 20px;
  height: 20px;
  border-radius: 6px;
  flex-shrink: 0;
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.1);
}

/* --- <select> nativo: o que o cliente vê se o JavaScript não rodar --- */
.elementor-457 .elementor-element.elementor-element-1844989 .variations select{
  width: 100%;
  appearance: none;
  cursor: pointer;
  padding: 12px 38px 12px 14px;
  border: 1.5px solid #CFD5DC;
  border-radius: 10px;
  background-color: #fff;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2355585E' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 12px center;
  background-size: 16px;
  font-size: 14.5px;
  color: #16181C;
}
.elementor-457 .elementor-element.elementor-element-1844989 .variations select:focus{
  outline: none;
  border-color: #0367B8;
  box-shadow: 0 0 0 3px rgba(3,103,184,.13);
}
/* --- preço da variação escolhida: já mostrado no bloco de preço acima --- */
.elementor-457 .elementor-element.elementor-element-1844989 .woocommerce-variation-price{ display: none; }

/* --- estoque ---
   Nasce em dois lugares: no produto variável dentro de
   `.woocommerce-variation-availability`, montado pelo JavaScript; no produto simples
   solto fora do <form>, irmão dele. Uma regra em `p.stock` cobre os dois.
   O aviso de esgotado continua aparecendo, na pílula cinza */
.elementor-457 .elementor-element.elementor-element-1844989 p.stock.in-stock{ display: none; }
.elementor-457 .elementor-element.elementor-element-1844989 .woocommerce-variation-availability{ margin: 0; }
.elementor-457 .elementor-element.elementor-element-1844989 .woocommerce-variation-availability:has(p.stock.in-stock){ display: none; }
.elementor-457 .elementor-element.elementor-element-1844989 p.stock{
  display: inline-flex;
  align-items: center;
  margin: 0 0 14px;
  padding: 4px 10px;
  border-radius: 999px;
  background: #EEF0F2;
  color: #70757C;
  font-size: 11.5px;
  font-weight: 600;
}

/* --- a linha de compra ---
   Também é dois elementos: no variável é o `.woocommerce-variation-add-to-cart`, e
   o `form.cart` é só envelope (gap 0, quem espaça são os swatches); no simples é o
   próprio `form.cart`. `.variations_form` separa os dois casos */
.elementor-457 .elementor-element.elementor-element-1844989 form.cart{
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  gap: 12px;
  margin: 0;
}
.elementor-457 .elementor-element.elementor-element-1844989 form.cart.variations_form{ gap: 0; }
.elementor-457 .elementor-element.elementor-element-1844989 .variations,
.elementor-457 .elementor-element.elementor-element-1844989 .single_variation_wrap,
.elementor-457 .elementor-element.elementor-element-1844989 .woocommerce-variation{ flex: 1 1 100%; }

.elementor-457 .elementor-element.elementor-element-1844989 .woocommerce-variation-add-to-cart{
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  gap: 12px;
  width: 100%;
  margin-top: 24px;
}
/* no produto simples o estoque escondido não empurra nada, a margem é aqui */
.elementor-457 .elementor-element.elementor-element-1844989 .elementor-product-simple form.cart{ margin-top: 24px; }

/* 🔴 O espaçamento que o Elementor injeta entre os botões do formulário:

     form.cart button:where(:not(:first-child)) {
       margin-inline-start: var(--button-spacing, 10px);
     }

   Ela pega TRÊS botões, não um: o `−` e o `+` (o primeiro filho da caixa de
   quantidade é o <label> escondido do WooCommerce, então nenhum dos dois é
   "first-child") e o Adicionar ao carrinho, que somava 10px ao gap de 12px.

   O `:not(:first-child)` daqui é redundante na lógica e essencial no peso: a regra
   do Elementor vale (0,4,3), e `.elementor-457 .elementor-element.elementor-element-1844989 form.cart button` sozinho vale (0,4,2),
   ou seja, perde. O `:not()` empresta a especificidade do que tem dentro e leva a
   nossa pra (0,5,2). Especificidade em vez de !important, porque aqui dá pra vencer
   no limpo. Pelo painel, o mesmo valor está em Estilo > Botão > Espaçamento */
.elementor-457 .elementor-element.elementor-element-1844989 form.cart button:not(:first-child){
  margin-inline-start: 0 !important;
  margin-inline-end: 0 !important;
}

/* --- stepper de quantidade ---
   largura travada no pai, não no campo: o WooCommerce e o Elementor mandam os dois
   `width: 3.631em` no `.qty`, e era isso que engordava a caixa */
.elementor-457 .elementor-element.elementor-element-1844989 .quantity{
  display: flex;
  align-items: stretch;
  flex: 0 0 auto;
  width: 122px;
  height: 48px;
  margin: 0 !important;
  padding: 0;
  border: 1.5px solid #CFD5DC;
  border-radius: 10px;
  background: #fff;
  overflow: hidden;
}
/* o rótulo escondido do WooCommerce. O <input> já tem aria-label próprio */
.elementor-457 .elementor-element.elementor-element-1844989 .quantity > label{ display: none; }

.elementor-457 .elementor-element.elementor-element-1844989 .quantity input.qty{
  flex: 1 1 0;
  width: auto !important;
  min-width: 0;
  height: auto;
  margin: 0;
  padding: 0;
  border: 0;
  text-align: center;
  font-size: 15px;
  font-weight: 700;
  color: #16181C;
  background: none;
  appearance: textfield;
}
.elementor-457 .elementor-element.elementor-element-1844989 .quantity input.qty::-webkit-outer-spin-button,
.elementor-457 .elementor-element.elementor-element-1844989 .quantity input.qty::-webkit-inner-spin-button{
  appearance: none;
  margin: 0;
}

.elementor-457 .elementor-element.elementor-element-1844989 .tc-qtd-bt{
  flex: 0 0 40px;
  width: 40px;
  height: auto;
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  letter-spacing: 0;
  text-indent: 0;
  color: #55585E;
  font-size: 18px;
  cursor: pointer;
  transition: background .18s cubic-bezier(.16,1,.3,1), color .18s cubic-bezier(.16,1,.3,1);
}
.elementor-457 .elementor-element.elementor-element-1844989 .tc-qtd-bt:hover{ background: #F4F6F8; color: #0367B8; }

/* min-width: 0, não 200px. Piso mínimo em flex não encolhe nem quebra linha: ele
   estoura. Com `flex: 1 1 180px` o botão ocupa o resto da linha quando cabe, e
   desce sozinho ocupando tudo quando não cabe */
.elementor-457 .elementor-element.elementor-element-1844989 button.single_add_to_cart_button{
  flex: 1 1 180px;
  min-width: 0;
  height: 48px;
  padding: 0 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  border: 0;
  border-radius: 10px;
  background: #0367B8;
  color: #fff;
  font-size: 14.5px;
  font-weight: 600;
  letter-spacing: -.01em;
  box-shadow: 0 1px 2px rgba(6,43,77,.05);
  cursor: pointer;
  transition: background .2s cubic-bezier(.16,1,.3,1), box-shadow .2s cubic-bezier(.16,1,.3,1);
}

/* o ícone de carrinho, como máscara, porque o widget não tem campo de ícone */
.elementor-457 .elementor-element.elementor-element-1844989{
  --tc-ico-carrinho: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 4h2.2l2.2 11.2a2 2 0 002 1.6h7.9a2 2 0 002-1.6L21 8H6'/%3E%3Ccircle cx='9.5' cy='20' r='1.4'/%3E%3Ccircle cx='17.5' cy='20' r='1.4'/%3E%3C/svg%3E");
}
.elementor-457 .elementor-element.elementor-element-1844989 button.single_add_to_cart_button::before{
  content: "";
  width: 19px;
  height: 19px;
  flex-shrink: 0;
  background: currentColor;
  -webkit-mask: var(--tc-ico-carrinho) center / contain no-repeat;
          mask: var(--tc-ico-carrinho) center / contain no-repeat;
}
.elementor-457 .elementor-element.elementor-element-1844989 button.single_add_to_cart_button:hover{
  background: #024E8C;
  box-shadow: 0 4px 16px rgba(6,43,77,.07);
}
.elementor-457 .elementor-element.elementor-element-1844989 button.single_add_to_cart_button:disabled{
  opacity: .45;
  pointer-events: none;
}

/* --- celular: tudo um ponto menor, e o polegar ainda alcança --- */
@media (max-width: 767px){
  .elementor-457 .elementor-element.elementor-element-1844989 .quantity{ width: 108px; height: 46px; }
  .elementor-457 .elementor-element.elementor-element-1844989 .tc-qtd-bt{ flex: 0 0 35px; width: 35px; }
  .elementor-457 .elementor-element.elementor-element-1844989 .woocommerce-variation-add-to-cart,
  .elementor-457 .elementor-element.elementor-element-1844989 form.cart{ gap: 10px; }
  .elementor-457 .elementor-element.elementor-element-1844989 form.cart.variations_form{ gap: 0; }
  .elementor-457 .elementor-element.elementor-element-1844989 button.single_add_to_cart_button{
    flex: 1 1 150px;
    height: 46px;
    padding: 0 14px;
    font-size: 14px;
  }
  .elementor-457 .elementor-element.elementor-element-1844989 .tc-swatches{ margin-top: 20px; }
}/* End custom CSS */
/* Start custom CSS for shortcode, class: .elementor-element-255e1dd */.elementor-457 .elementor-element.elementor-element-255e1dd .tc-zap{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  width: 100%;
  padding: 13px 22px;
  margin-top: 16px;
  border-radius: 10px;
  background: #0B7A4B;
  color: #fff;
  font-size: 14.5px;
  font-weight: 600;
  text-decoration: none;
  transition: background .2s cubic-bezier(.16,1,.3,1);
}
.elementor-457 .elementor-element.elementor-element-255e1dd .tc-zap:hover{ background: #09623B; color: #fff; }
.elementor-457 .elementor-element.elementor-element-255e1dd .tc-zap svg{
  width: 19px;
  height: 19px;
  fill: currentColor;
  flex-shrink: 0;
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-5109966 */.elementor-457 .elementor-element.elementor-element-5109966{
  border: 1px solid #E3E7EB;
  border-radius: 14px;
  padding: 18px;
  margin-top: 20px;

  /* ícones vetoriais no lugar dos três PNG do plugin, ver o bloco "OS ÍCONES"
     mais abaixo. Mesma técnica do carrinho do botão de comprar: máscara pintada
     com `background`, então a cor vem do CSS e não do arquivo */
  --tc-ico-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 15l-6-6-6 6'/%3E%3C/svg%3E");
  --tc-ico-refresh: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.5 12a8.5 8.5 0 11-2.6-6.1'/%3E%3Cpath d='M19.6 2.6V6.8h-4.2'/%3E%3C/svg%3E");
  --tc-ico-truck: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 6.5h11v9.5h-11z'/%3E%3Cpath d='M13.5 9.8h3.9L21.5 13.4V16h-8'/%3E%3Ccircle cx='6.8' cy='17.6' r='1.8'/%3E%3Ccircle cx='17.2' cy='17.6' r='1.8'/%3E%3C/svg%3E");
}
.elementor-457 .elementor-element.elementor-element-5109966 h4,
.elementor-457 .elementor-element.elementor-element-5109966 .elementor-heading-title{
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13.5px;
  font-weight: 700;
  color: #16181C;
  margin: 0 0 6px;
}
.elementor-457 .elementor-element.elementor-element-5109966 h4 i{ font-size: 17px; color: #0367B8; }
.elementor-457 .elementor-element.elementor-element-5109966 .tc-ajuda{
  font-size: 13px;
  line-height: 1.5;
  color: #70757C;
  margin: 0;
}

/* ==========================================================
   A caixa que o Better Shipping injeta

   Nomes de classe e valores conferidos lendo o CSS e o JS do plugin (v4.16.10) no
   site em 09 e 10/08/2026.

   O `input` genérico fica junto de propósito, como rede de segurança caso o plugin
   renomeie a classe numa atualização: existe um campo de texto só dentro deste
   container, então o alcance é o mesmo. **Com `button` e `a` a conta é outra**, e a
   régua é `#custom-postcode-form`: o resultado da cotação traz mais botões pro
   mesmo container, e o genérico pega todos.
   ========================================================== */

/* 🔴 A régua de 360px é do plugin, e é ela que impedia a calculadora de ocupar o
   card inteiro. Ele embrulha tudo num `.woo-better-parent-container` com
   `max-width: 360px`, e dentro dele o campo tem `max-width: 220px` e o botão
   `width: 100px`, os três fixos. */
.elementor-457 .elementor-element.elementor-element-5109966 .woo-better-parent-container{
  width: 100%;
  max-width: none;
}

/* 🔴 A FONTE. O plugin está configurado com `"fontClass":"woo-better-poppins-family"`
   (dá pra ver no objeto `WooBetterData` impresso na página), e ele **carimba essa
   classe em cada peça que desenha**: campo, botão, link, CEP, "Alterar", cada item
   da lista. A folha dele declara `font-family: Poppins, sans-serif !important`.

   Por isso o `font-family: inherit !important` que já existia no campo não bastava:
   ele resolvia um elemento e o resto continuava com a classe. A regra abaixo pega o
   container do plugin e tudo que estiver dentro dele, de uma vez.

   Não encosta no `<h4>` "Calcular frete e prazo" nem no caminhãozinho Phosphor do
   título: os dois vivem no widget `tc-frete-alvo`, fora do `.woo-better-parent-container`.
   Se um dia esta regra virar `.elementor-457 .elementor-element.elementor-element-5109966 *`, o Phosphor morre junto e o ícone do
   título vira uma letra solta. */
.elementor-457 .elementor-element.elementor-element-5109966 .woo-better-parent-container,
.elementor-457 .elementor-element.elementor-element-5109966 .woo-better-parent-container *,
.elementor-457 .elementor-element.elementor-element-5109966 .woo-better-poppins-family{
  font-family: 'Inter', -apple-system, 'Segoe UI', Roboto, sans-serif !important;
}

/* o `margin-top: 20px` é estilo inline que o JS escreve no `<form>`; 11px é o do
   protótipo (`.frete-form { margin-top: 11px }`) */
.elementor-457 .elementor-element.elementor-element-5109966 #custom-postcode-form{
  margin-top: 11px !important;
  padding: 0 !important;
}

/* 🔴 `margin-bottom: 0` mata o buraco embaixo do "Não sei meu CEP".
   O plugin põe `margin-bottom: 15px` neste container. Como ele é o último filho do
   card, esses 15px somam com os 18px de `padding` da moldura e viram 33px embaixo
   contra 18px dos outros três lados. */
.elementor-457 .elementor-element.elementor-element-5109966 .woo-better-container-current-style{
  width: 100%;
  margin-bottom: 0 !important;
}
.elementor-457 .elementor-element.elementor-element-5109966 .woo-better-input-button-group-current-style{
  display: flex;
  gap: 8px;
  align-items: stretch;
  flex-wrap: wrap;
  width: 100%;
}
.elementor-457 .elementor-element.elementor-element-5109966 .woo-better-input-wrapper-current-style{
  flex: 1 1 160px;
  width: auto !important;
  max-width: none !important;
  height: 48px !important;
}

/* 🔴 O `!important` daqui pra baixo não é preguiça, e são dois motivos.
   O primeiro: o Better Shipping aplica cor, borda, raio e fonte como **estilo
   inline**, montado no JavaScript a partir do painel dele (é o `inputStyles` e o
   `buttonStyles` do objeto `WooBetterData` impresso na página).
   O segundo: largura, altura e tamanho de fonte ele grava com `!important` na
   própria folha (`width: 220px !important` no campo, `width: 100px !important` no
   botão). Só `!important` vence `!important`. */
.elementor-457 .elementor-element.elementor-element-5109966 input[type="text"],
.elementor-457 .elementor-element.elementor-element-5109966 input[type="tel"],
.elementor-457 .elementor-element.elementor-element-5109966 .woo-better-input-current-style{
  width: 100% !important;
  height: 48px !important;
  /* 40px de folga na direita: é lá que mora o caminhãozinho */
  padding: 0 40px 0 14px !important;
  border: 1.5px solid #CFD5DC !important;
  border-radius: 10px !important;
  background: #fff !important;
  font-family: inherit !important;
  font-size: 14.5px !important;
  color: #16181C !important;
}
.elementor-457 .elementor-element.elementor-element-5109966 input::placeholder{ color: #9AA0A8 !important; }
.elementor-457 .elementor-element.elementor-element-5109966 input:focus{
  outline: none;
  border-color: #0367B8 !important;
  box-shadow: 0 0 0 3px rgba(3,103,184,.13) !important;
}

/* 🔴 `#custom-postcode-form button`, nunca `.elementor-457 .elementor-element.elementor-element-5109966 button`.
   Esta é a regra que quebrou a caixa inteira quando a primeira cotação voltou, em
   10/08/2026. Enquanto o plugin só desenhava o formulário, `.elementor-457 .elementor-element.elementor-element-5109966 button` acertava
   um botão só, o CONSULTAR. Com cotação na tela nascem mais três dentro do mesmo
   container (a setinha de recolher, o "Alterar" e o de atualizar), e os três herdavam
   48px de altura, 118px de piso, moldura, raio de 10px e fundo branco: era o círculo
   azul gigante e as caixas brancas do print. */
.elementor-457 .elementor-element.elementor-element-5109966 #custom-postcode-form button,
.elementor-457 .elementor-element.elementor-element-5109966 .woo-better-button-current-style{
  width: auto !important;
  min-width: 118px;
  height: 48px !important;
  padding: 0 18px !important;
  border: 1.5px solid #CFD5DC !important;
  border-radius: 10px !important;
  background: #fff !important;
  background-image: none !important;
  box-shadow: none !important;
  font-family: inherit !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  color: #16181C !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  cursor: pointer;
}
.elementor-457 .elementor-element.elementor-element-5109966 #custom-postcode-form button:hover,
.elementor-457 .elementor-element.elementor-element-5109966 .woo-better-button-current-style:hover{
  border-color: #0367B8 !important;
  color: #0367B8 !important;
}

/* o plugin desliga o botão enquanto o cliente não escolheu a variação, e pinta o
   cinza dele como estilo inline. O `background: #fff !important` de cima vence esse
   inline, então sem esta regra o botão ficaria desligado com cara de ligado */
.elementor-457 .elementor-element.elementor-element-5109966 #custom-postcode-form button:disabled{
  opacity: .5;
  cursor: not-allowed;
  pointer-events: none;
}

/* o link "Não sei meu CEP" é dele. Mesmo motivo do bloco acima pra escopar o `a`
   no formulário (o caminhãozinho dentro do campo está no bloco "OS ÍCONES") */
.elementor-457 .elementor-element.elementor-element-5109966 #custom-postcode-form a,
.elementor-457 .elementor-element.elementor-element-5109966 .woo-better-link-current-style{
  margin-top: 10px !important;
  font-size: 12.5px !important;
  font-weight: 500 !important;
  color: #70757C !important;
  text-decoration: none !important;
}
.elementor-457 .elementor-element.elementor-element-5109966 #custom-postcode-form a:hover,
.elementor-457 .elementor-element.elementor-element-5109966 .woo-better-link-current-style:hover{
  color: #0367B8 !important;
  text-decoration: none !important;
}

/* ==========================================================
   O RESULTADO DA COTAÇÃO

   O desenho segue a linguagem do carrinho: barra cinza `#F4F6F8` pro destino, um
   cartão por método de entrega, rodapé em 11,5px.

   A folha que o plugin injeta pro resultado **não é o arquivo `.css` dele**: é um
   `<style>` que o JS monta e joga no `<head>`, com as cores vindas do painel. Como
   são regras de classe, e não estilo inline, o CSS daqui vence por especificidade
   (`.elementor-457 .elementor-element.elementor-element-5109966 .classe` contra `.classe`). Onde ele usa `!important`, a resposta
   também precisa de `!important`.
   ========================================================== */

.elementor-457 .elementor-element.elementor-element-5109966 .woo-better-info-block{
  margin: 14px 0 0 !important;
  padding: 12px 0 0 !important;
  border-top: 1px dashed #CFD5DC;
  border-radius: 0 !important;
  font-size: 13px !important;
  color: #16181C !important;
}

/* --- a barra do CEP: mesma cara do `.woocommerce-shipping-destination` do carrinho --- */
.elementor-457 .elementor-element.elementor-element-5109966 .woo-better-current-postcode-block{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-width: 0;
  padding: 10px 12px !important;
  border: 0 !important;
  border-radius: 10px !important;
  background: #F4F6F8 !important;
}
.elementor-457 .elementor-element.elementor-element-5109966 .woo-better-toggle-postcode-wrapper{
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}
.elementor-457 .elementor-element.elementor-element-5109966 .woo-better-current-postcode-text{
  font-size: 12.5px !important;
  line-height: 1.4;
  color: #70757C !important;
}
.elementor-457 .elementor-element.elementor-element-5109966 .woo-better-current-postcode-text strong{ color: #16181C !important; font-weight: 600; }

/* 🔴 a setinha de recolher. Sem estas medidas ela herda a cara do botão CONSULTAR
   (48px de altura, 118px de piso, moldura e fundo branco) e o `<img>` de dentro,
   que não tem tamanho próprio, estica junto: era o círculo azul gigante do print.
   O desenho dela está no bloco "OS ÍCONES", logo abaixo */
.elementor-457 .elementor-element.elementor-element-5109966 .woo-better-toggle-button{
  flex-shrink: 0;
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: 26px !important;
  min-width: 0 !important;
  height: 26px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: none !important;
  box-shadow: none !important;
  transition: background .2s ease;
}
.elementor-457 .elementor-element.elementor-element-5109966 .woo-better-toggle-button:hover{ background: #E8F1FA !important; }

/* "Alterar" é link, não botão */
.elementor-457 .elementor-element.elementor-element-5109966 .woo-better-change-postcode-button{
  flex-shrink: 0;
  width: auto !important;
  min-width: 0 !important;
  height: auto !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: none !important;
  box-shadow: none !important;
  font-family: inherit !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  color: #0367B8 !important;
  text-decoration: none !important;
}
.elementor-457 .elementor-element.elementor-element-5109966 .woo-better-change-postcode-button:hover{
  color: #062B4D !important;
  text-decoration: underline !important;
}

/* --- o corpo que abre e fecha ---
   ⚠️ não mexer em `height` nem em `overflow`: o plugin anima a abertura escrevendo
   `height: <scrollHeight>px` inline, e travar isso mata a animação */
.elementor-457 .elementor-element.elementor-element-5109966 .woo-better-content-block{
  padding: 10px 0 0 !important;
  border: 0 !important;
  background: none !important;
}
.elementor-457 .elementor-element.elementor-element-5109966 .woo-better-content-block.expanded{
  padding: 10px 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
}

/* "Produto: Capa Aramid…" e "Quantidade: 1" saem: o cliente está na página desse
   produto e a quantidade está no stepper três dedos acima. Os ícones que sobravam
   nas linhas são os mesmos PNG borrados do bloco "OS ÍCONES", e aqui não vale a
   pena redesenhar: some com eles */
.elementor-457 .elementor-element.elementor-element-5109966 .woo-better-product-name,
.elementor-457 .elementor-element.elementor-element-5109966 .woo-better-product-quantity{ display: none !important; }
.elementor-457 .elementor-element.elementor-element-5109966 .woo-better-icon{ display: none !important; }

.elementor-457 .elementor-element.elementor-element-5109966 .woo-better-shipping-methods{ margin-top: 0; }
.elementor-457 .elementor-element.elementor-element-5109966 .woo-better-shipping-methods > p{
  margin: 0 0 8px !important;
  font-size: 12px;
  font-weight: 600;
  color: #70757C;
}

/* --- um cartão por método, igual ao `ul#shipping_method li` do carrinho ---
   O `[data-tc-ok="1"]` é o que o bloco 5 do widget HTML carimba depois de separar
   preço e nome em dois `<span>`. Sem ele o `<li>` continua sendo
   `<strong>R$ 14,43</strong> - Correios Sedex (…)` num nó só, e aí `space-between`
   jogaria o preço na esquerda e o resto na direita. Por isso o flex só entra
   depois do carimbo */
.elementor-457 .elementor-element.elementor-element-5109966 .woo-better-shipping-list{
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.elementor-457 .elementor-element.elementor-element-5109966 .woo-better-shipping-list li{
  display: block;
  margin: 0 !important;
  padding: 11px 13px;
  border: 1.5px solid #E3E7EB;
  border-radius: 10px;
  background: #fff;
  font-size: 13.5px !important;
  line-height: 1.45;
  color: #16181C;
}
.elementor-457 .elementor-element.elementor-element-5109966 .woo-better-shipping-list li[data-tc-ok="1"]{
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}
.elementor-457 .elementor-element.elementor-element-5109966 .tc-frete-nome{ font-weight: 500; }
.elementor-457 .elementor-element.elementor-element-5109966 .tc-frete-val{ font-weight: 700; white-space: nowrap; }

/* "Nenhum método de frete disponível": o plugin cria esse `<p>` com cor, peso e
   padding em **estilo inline**. `!important` de folha de autor vence inline sem
   `!important`, então aqui basta o peso */
.elementor-457 .elementor-element.elementor-element-5109966 .woo-better-error-message{
  margin: 0 !important;
  padding: 11px 13px !important;
  border: 1.5px solid #E3E7EB !important;
  border-radius: 10px !important;
  background: #F4F6F8 !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: #70757C !important;
}

/* --- rodapé: atualizar, data e aviso --- */
.elementor-457 .elementor-element.elementor-element-5109966 .woo-better-separator{
  margin: 12px 0 !important;
  border: 0;
  border-top: 1px solid #E3E7EB;
  opacity: 1;
}
.elementor-457 .elementor-element.elementor-element-5109966 .woo-better-update-section{
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 0 !important;
  padding: 0 !important;
}
.elementor-457 .elementor-element.elementor-element-5109966 .woo-better-update-icon-container{
  flex-shrink: 0 !important;
  width: 32px !important;
  min-width: 0 !important;
  height: 32px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: none !important;
  box-shadow: none !important;
}
.elementor-457 .elementor-element.elementor-element-5109966 .woo-better-update-icon-container:hover{ background: #E8F1FA !important; }
.elementor-457 .elementor-element.elementor-element-5109966 .woo-better-update-text-container{ flex: 1 1 auto; min-width: 0; }
.elementor-457 .elementor-element.elementor-element-5109966 .woo-better-update-date{
  width: auto !important;
  margin: 0 0 2px !important;
  padding: 0 !important;
  font-size: 11.5px !important;
  font-weight: 600 !important;
  color: #70757C !important;
  opacity: 1;
}
.elementor-457 .elementor-element.elementor-element-5109966 .woo-better-info-text{
  margin: 0 !important;
  padding: 0 !important;
  font-size: 11.5px !important;
  line-height: 1.4 !important;
  color: #9AA0A8 !important;
  opacity: 1;
}

/* ==========================================================
   OS ÍCONES

   🔴 Os três ícones do plugin (setinha, atualizar e caminhãozinho) **não são SVG
   de verdade.** Cada um é um PNG de 100×100 em base64, embrulhado dentro de um
   `<svg>` como `<pattern>` com `<image>`. Ele reduz esse PNG pra 15 ou 18px e
   depois tinge o resultado com uma corrente de `filter`
   (`brightness/invert/sepia/saturate/hue-rotate`) montada como classe `.blue-icon`.

   Raster escalado, com cor aproximada por filtro: é por isso que a setinha saía
   borrada e com a bolinha azul chapada. Não existe CSS que conserte um PNG, e
   `image-rendering` só piora.

   A saída é a mesma técnica do carrinho no botão de comprar: esconder o `<img>` do
   plugin e desenhar o ícone com **máscara** num `::before`. Fica vetorial, na cor
   da marca, acompanha qualquer troca de paleta depois, e sobrevive a toda
   re-renderização, porque o plugin recria o `<img>` a cada clique mas o `::before`
   é nosso.

   O `:has()` lê o `alt` do `<img>` escondido pra saber o estado da setinha: o
   plugin escreve "Exibir detalhes de entrega" quando está fechado e "Esconder…"
   quando está aberto. Sem `:has()` num navegador antigo, o chevron simplesmente
   não gira: fica apontando pra cima sempre, que é falha cosmética, não quebra.
   ========================================================== */

.elementor-457 .elementor-element.elementor-element-5109966 .woo-better-toggle-icon,
.elementor-457 .elementor-element.elementor-element-5109966 .woo-better-update-icon,
.elementor-457 .elementor-element.elementor-element-5109966 .woo-better-icon-current-style{ display: none !important; }

.elementor-457 .elementor-element.elementor-element-5109966 .woo-better-toggle-button::before,
.elementor-457 .elementor-element.elementor-element-5109966 .woo-better-update-icon-container::before,
.elementor-457 .elementor-element.elementor-element-5109966 .woo-better-input-wrapper-current-style::after{
  content: "";
  display: block;
  background: #0367B8;
}

.elementor-457 .elementor-element.elementor-element-5109966 .woo-better-toggle-button::before{
  width: 15px;
  height: 15px;
  -webkit-mask: var(--tc-ico-chevron) center / contain no-repeat;
          mask: var(--tc-ico-chevron) center / contain no-repeat;
  transition: transform .25s cubic-bezier(.16,1,.3,1);
}
.elementor-457 .elementor-element.elementor-element-5109966 .woo-better-toggle-button:has(img[alt^="Exibir"])::before{ transform: rotate(180deg); }

.elementor-457 .elementor-element.elementor-element-5109966 .woo-better-update-icon-container::before{
  width: 17px;
  height: 17px;
  opacity: .8;
  -webkit-mask: var(--tc-ico-refresh) center / contain no-repeat;
          mask: var(--tc-ico-refresh) center / contain no-repeat;
  transition: transform .3s ease;
}
.elementor-457 .elementor-element.elementor-element-5109966 .woo-better-update-icon-container:hover::before{ transform: rotate(180deg); }
/* enquanto ele consulta de novo, o plugin põe `.spinning-container` no botão */
.elementor-457 .elementor-element.elementor-element-5109966 .woo-better-update-icon-container.spinning-container::before{
  animation: tc-gira 1s linear infinite;
}
@keyframes tc-gira{ to{ transform: rotate(360deg); } }

/* o caminhãozinho dentro do campo de CEP. Ele é `<img>` posicionado em absoluto
   pelo plugin; escondendo o `<img>`, o `::after` do wrapper toma o lugar dele, com
   as mesmas coordenadas */
.elementor-457 .elementor-element.elementor-element-5109966 .woo-better-input-wrapper-current-style{ position: relative; }
.elementor-457 .elementor-element.elementor-element-5109966 .woo-better-input-wrapper-current-style::after{
  position: absolute;
  right: 13px;
  top: 50%;
  transform: translateY(-50%);
  width: 18px;
  height: 18px;
  pointer-events: none;
  -webkit-mask: var(--tc-ico-truck) center / contain no-repeat;
          mask: var(--tc-ico-truck) center / contain no-repeat;
}

/* --- celular: campo e botão, um embaixo do outro, os dois na largura toda ---
   🔴 Isto é media query e não `flex-grow`, de propósito. Com `flex-grow` no botão
   ele cresceria também quando estivesse ao lado do campo, e ficaria gordo no
   desktop sem necessidade.

   🔴 E o seletor aqui é `#custom-postcode-form button`, pelo mesmo motivo do bloco
   lá de cima: com `.elementor-457 .elementor-element.elementor-element-5109966 button` o botão de atualizar da cotação ia a 100% de
   largura no celular e empurrava o "Atualizado em…" pra fora do card. */
@media (max-width: 767px){
  .elementor-457 .elementor-element.elementor-element-5109966 .woo-better-input-button-group-current-style{ flex-direction: column; }
  .elementor-457 .elementor-element.elementor-element-5109966 .woo-better-input-wrapper-current-style{
    flex: 0 0 auto;
    width: 100% !important;
  }
  .elementor-457 .elementor-element.elementor-element-5109966 #custom-postcode-form button,
  .elementor-457 .elementor-element.elementor-element-5109966 .woo-better-button-current-style{ width: 100% !important; }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-b2e22f2 */.elementor-457 .elementor-element.elementor-element-b2e22f2 .tc-vantagens{
  margin: 18px 0 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 1px;
  background: #E3E7EB;
  border: 1px solid #E3E7EB;
  border-radius: 14px;
  overflow: hidden;
}
.elementor-457 .elementor-element.elementor-element-b2e22f2 .tc-vantagens li{
  display: flex;
  gap: 11px;
  align-items: center;
  padding: 13px 16px;
  margin: 0;
  background: #fff;
  font-size: 13px;
  line-height: 1.5;
  color: #55585E;
}
.elementor-457 .elementor-element.elementor-element-b2e22f2 .tc-vantagens i{
  font-size: 19px;
  color: #0367B8;
  flex-shrink: 0;
}
.elementor-457 .elementor-element.elementor-element-b2e22f2 .tc-vantagens b{ color: #16181C; font-weight: 600; }/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-547bb79 */.elementor-457 .elementor-element.elementor-element-547bb79{
  flex: 1 1 calc(48% - 22px);
  min-width: 0;
}
@media (max-width: 900px){
  .elementor-457 .elementor-element.elementor-element-547bb79{ flex: 1 1 100%; }
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-526519c */.elementor-457 .elementor-element.elementor-element-526519c{
  gap: 44px;
  padding-bottom: 44px;
}
@media (max-width: 900px){
  .elementor-457 .elementor-element.elementor-element-526519c{
    flex-direction: column;
    gap: 28px;
    padding-bottom: 30px;
  }
}/* End custom CSS */
/* Start custom CSS for nested-accordion, class: .elementor-element-76ed5a3 *//* ---------- moldura ---------- */
.elementor-457 .elementor-element.elementor-element-76ed5a3{
  max-width: 860px;
  margin-bottom: clamp(48px,6vw,88px);
  border-top: 1px solid #E3E7EB;
}
.elementor-457 .elementor-element.elementor-element-76ed5a3 .e-n-accordion-item{
  border-bottom: 1px solid #E3E7EB;
}

/* ---------- título ---------- */
.elementor-457 .elementor-element.elementor-element-76ed5a3 .e-n-accordion-item-title{
  padding: 18px 0;
  font-weight: 600;
  color: #16181C;
  background: none;
  border: 0;
}
.elementor-457 .elementor-element.elementor-element-76ed5a3 .e-n-accordion-item-title-text{
  font-size: 15px;
  line-height: 1.3;
}
.elementor-457 .elementor-element.elementor-element-76ed5a3 .e-n-accordion-item-title-icon{
  color: #0367B8;
  transition: transform .3s cubic-bezier(.16,1,.3,1);
}
.elementor-457 .elementor-element.elementor-element-76ed5a3 .e-n-accordion-item[open] .e-n-accordion-item-title-icon{
  transform: rotate(45deg);
}

/* ---------- corpo ---------- */
.elementor-457 .elementor-element.elementor-element-76ed5a3 .e-n-accordion-item > .e-con{
  padding: 0 0 22px;
  font-size: 14.5px;
  line-height: 1.7;
  color: #55585E;
}
.elementor-457 .elementor-element.elementor-element-76ed5a3 .e-n-accordion-item > .e-con > .e-con-inner{
  padding: 0;
  max-width: none;
}
.elementor-457 .elementor-element.elementor-element-76ed5a3 .e-n-accordion-item > .e-con p,
.elementor-457 .elementor-element.elementor-element-76ed5a3 .e-n-accordion-item > .e-con li,
.elementor-457 .elementor-element.elementor-element-76ed5a3 .e-n-accordion-item > .e-con div{
  font-size: inherit;
  line-height: inherit;
  color: inherit;
}
.elementor-457 .elementor-element.elementor-element-76ed5a3 .e-n-accordion-item > .e-con p{ margin: 0 0 .9em; }
.elementor-457 .elementor-element.elementor-element-76ed5a3 .e-n-accordion-item > .e-con p:last-child{ margin-bottom: 0; }
.elementor-457 .elementor-element.elementor-element-76ed5a3 .e-n-accordion-item > .e-con strong,
.elementor-457 .elementor-element.elementor-element-76ed5a3 .e-n-accordion-item > .e-con b{
  color: #16181C;
  font-weight: 600;
}
.elementor-457 .elementor-element.elementor-element-76ed5a3 .elementor-widget-text-editor > .elementor-widget-container,
.elementor-457 .elementor-element.elementor-element-76ed5a3 .elementor-widget-woocommerce-product-content > .elementor-widget-container{
  max-width: 70ch;
}

/* ---------- tabela de especificações ---------- */
.elementor-457 .elementor-element.elementor-element-76ed5a3 .tc-ficha{
  width: 100%;
  max-width: 560px;
  border-collapse: collapse;
  font-size: 13.5px;
  margin: 0;
}
.elementor-457 .elementor-element.elementor-element-76ed5a3 .tc-ficha td{
  padding: 10px 0;
  border: 0;
  border-bottom: 1px solid #E3E7EB;
  background: none;
  vertical-align: middle;
  line-height: 1.5;
}
.elementor-457 .elementor-element.elementor-element-76ed5a3 .tc-ficha td:first-child{
  color: #70757C;
  width: 44%;
  font-weight: 400;
}
.elementor-457 .elementor-element.elementor-element-76ed5a3 .tc-ficha td:last-child{ color: #16181C; font-weight: 500; }
.elementor-457 .elementor-element.elementor-element-76ed5a3 .tc-ficha .tc-sku{
  font-family: 'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, monospace;
  font-variant-numeric: tabular-nums;
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-03df78f */.elementor-457 .elementor-element.elementor-element-03df78f{
  font-family: 'Inter', -apple-system, 'Segoe UI', Roboto, sans-serif;
}/* End custom CSS */
/* Start custom CSS for heading, class: .elementor-element-8690b01 */.elementor-457 .elementor-element.elementor-element-8690b01 h2{
  font-family: 'Inter', -apple-system, 'Segoe UI', Roboto, sans-serif;
  font-size: clamp(22px, 2.8vw, 32px);
  font-weight: 600;
  line-height: 1.15;
  letter-spacing: -.03em;
  color: #16181C !important;
}/* End custom CSS */
/* Start custom CSS for loop-grid, class: .elementor-element-8296d37 */.elementor-457 .elementor-element.elementor-element-8296d37 .elementor-pagination{
  margin-top: 34px;
  display: flex;
  justify-content: center;
  gap: 6px;
  flex-wrap: wrap;
}
.elementor-457 .elementor-element.elementor-element-8296d37 .elementor-pagination .page-numbers{
  display: grid;
  place-items: center;
  min-width: 38px;
  height: 38px;
  padding: 0 12px;
  border: 1px solid #E3E7EB;
  border-radius: 10px;
  font-family: 'Inter', -apple-system, 'Segoe UI', Roboto, sans-serif;
  font-size: 13.5px;
  font-weight: 600;
  color: #55585E;
  text-decoration: none;
  transition: border-color .2s cubic-bezier(.16,1,.3,1), color .2s cubic-bezier(.16,1,.3,1);
}
.elementor-457 .elementor-element.elementor-element-8296d37 .elementor-pagination .page-numbers:hover{ border-color: #CFD5DC; color: #16181C; }
.elementor-457 .elementor-element.elementor-element-8296d37 .elementor-pagination .page-numbers.current{
  background: #0367B8;
  border-color: #0367B8;
  color: #fff;
}

.elementor-457 .elementor-element.elementor-element-8296d37 .e-loop-nothing-found-message{
  font-family: 'Inter', -apple-system, 'Segoe UI', Roboto, sans-serif;
  font-size: 14.5px;
  line-height: 1.7;
  color: #55585E;
  padding: 0;
  text-align: left;
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-be58ba4 */.elementor-457 .elementor-element.elementor-element-be58ba4{
  background: #F4F6F8;
  padding: clamp(48px,6vw,88px) 0;
}
/* sem relacionado, some a seção inteira em vez de deixar a frase solta */
.elementor-457 .elementor-element.elementor-element-be58ba4:has(.e-loop-nothing-found-message){
  display: none;
}/* End custom CSS */