/* ============================================================
   ElectroMart Plugin — Design System CSS
   Fiel ao template Electromix: #0088cc, Poppins, 1170px
   ============================================================ */

/* ─────────────────────────────────────────────
   RESET E BASE
   ───────────────────────────────────────────── */
   *, *::before, *::after { box-sizing: border-box; }

   .em-container {
       max-width: var(--em-container, 1170px);
       margin: 0 auto;
       padding: 0 30px; /* era 15px — aumentado para 30px conforme referência Electromix (Etapa 2) */
   }
   .em-container.em-container--full {
       max-width: 100% !important;
   }
   .em-container.em-container--no-padding {
       padding-left: 0 !important;
       padding-right: 0 !important;
   }
   
   body { font-family: var(--em-font-primary, 'Poppins', sans-serif); }
   
   /* ─────────────────────────────────────────────
      TOPBAR
      ───────────────────────────────────────────── */
   .em-topbar {
       width: 100%;
       text-align: center;
       padding: 8px 15px;
       font-size: 13px;
       font-weight: 500;
       letter-spacing: 0.3px;
       z-index: 9999;
       position: relative;
       overflow: hidden; /* Correção Etapa 15.4: Impede transbordo lateral */
   }
   .em-topbar-inner {
       max-width: var(--em-container, 1170px);
       margin: 0 auto;
       display: flex;
       align-items: center;
       justify-content: center;
       gap: 8px;
   }
   .em-topbar-text i { margin-right: 6px; }
   
   /* ─────────────────────────────────────────────
      BOTÕES GLOBAIS
      ───────────────────────────────────────────── */
   .em-btn {
       display: inline-flex;
       align-items: center;
       justify-content: center;
       gap: 8px;
       padding: 10px 24px;
       border-radius: var(--em-radius, 6px);
       font-family: var(--em-font-primary);
       font-weight: 600;
       font-size: 14px;
       text-decoration: none;
       cursor: pointer;
       border: 2px solid transparent;
       transition: var(--em-transition);
       white-space: nowrap;
   }
   
   .em-btn-primary {
       background: var(--em-primary, #0088cc);
       color: #fff;
       border-color: var(--em-primary, #0088cc);
   }
   .em-btn-primary:hover {
       background: var(--em-accent, #0070a8);
       border-color: var(--em-accent, #0070a8);
       color: #fff;
   }
   
   .em-btn-outline {
       background: transparent;
       color: var(--em-primary, #0088cc);
       border-color: var(--em-primary, #0088cc);
   }
   .em-btn-outline:hover {
       background: var(--em-primary, #0088cc);
       color: #fff;
   }
   
   .em-btn-dark {
       background: var(--em-dark, #212121);
       color: #fff;
       border-color: var(--em-dark, #212121);
   }
   .em-btn-dark:hover { opacity: 0.85; }
   
   .em-btn-block { width: 100%; display: flex; }
   
   /* ─────────────────────────────────────────────
      SEÇÕES GENÉRICAS
      ───────────────────────────────────────────── */
   .em-section-wrap {
       padding: var(--em-section-padding, 70px) 0;
   }
   .em-section-wrap.em-dark-bg {
       background: var(--em-dark-bg, #1a1a1a);
       color: #fff;
   }
   .em-section-wrap.em-primary-bg {
       background: var(--em-primary-bg, #f4f4f4);
   }
   
   /* ─── heading-default: fiel ao Electromix ─── */
   .em-section-header {
       display: flex;
       align-items: center;
       justify-content: space-between;
       flex-wrap: wrap;
       gap: 10px;
       margin-bottom: 1.5rem;
   }
   
   /* title-container: borda + grid ícone | h2 */
   .em-title-container {
       display: inline-grid;
       grid-template-columns: auto 1fr;
       align-items: center;
       gap: 0;
       border: 1px solid #cccccc;
       border-radius: 4px;
       overflow: hidden;
       flex-shrink: 0;
   }
   .em-dark-bg .em-title-container { border-color: #4e4e4e; }
   
   .em-title-icon {
       display: flex;
       align-items: center;
       justify-content: center;
       width: 44px;
       height: 44px;
       background: var(--em-primary, #0088cc);
       color: #fff;
       font-size: 18px;
       flex-shrink: 0;
   }
   
   .em-section-title {
       font-size: 18px;
       font-weight: 700;
       color: var(--em-dark, #212121);
       margin: 0;
       padding: 0 14px;
       white-space: nowrap;
   }
   .em-dark-bg .em-section-title { color: #fff; }
   
   /* Variante sem container (seções simples sem ícone) */
   .em-section-title-plain {
       font-size: 22px;
       font-weight: 700;
       color: var(--em-dark, #212121);
       margin: 0;
   }
   .em-dark-bg .em-section-title-plain { color: #fff; }
   
   /* Setas de nav customizadas (ficam no heading-default à direita) */
   .em-heading-nav {
       display: flex;
       align-items: center;
       gap: 6px;
       margin-left: auto;
   }
   .em-heading-nav button {
       width: 30px;
       height: 30px;
       border-radius: 50%;
       border: 1px solid #cccccc;
       background: transparent;
       color: var(--em-dark, #212121);
       font-size: 12px;
       cursor: pointer;
       display: flex;
       align-items: center;
       justify-content: center;
       transition: var(--em-transition);
   }
   .em-dark-bg .em-heading-nav button { border-color: #4e4e4e; color: #fff; }
   .em-heading-nav button:hover,
   .em-heading-nav button:not([disabled]):hover {
       background: var(--em-primary, #0088cc);
       border-color: var(--em-primary, #0088cc);
       color: #fff;
   }
   .em-heading-nav button[disabled] { opacity: 0.35; cursor: default; }
   
   .em-view-all {
       font-size: 13px;
       font-weight: 600;
       color: var(--em-primary, #0088cc);
       text-decoration: none;
       transition: var(--em-transition);
   }
   .em-view-all:hover { color: var(--em-accent, #0070a8); }
   
   /* ─────────────────────────────────────────────
      CARDS DE PRODUTO (base para os widgets)
      ───────────────────────────────────────────── */
   .em-product-card {
       background: #fff;
       border-radius: var(--em-radius, 6px);
       overflow: hidden;
       box-shadow: var(--em-shadow);
       transition: var(--em-transition);
       position: relative;
   }
   .em-product-card:hover {
       box-shadow: var(--em-shadow-hover);
       transform: translateY(-3px);
   }
   .em-product-card:hover .em-product-actions { opacity: 1; visibility: visible; }
   
   .em-product-image {
       position: relative;
       overflow: hidden;
       aspect-ratio: 1 / 1;
       background: var(--em-primary-bg, #f4f4f4);
   }
   .em-product-image img {
       width: 100%;
       height: 100%;
       object-fit: contain;
       transition: transform 0.4s ease;
       padding: 10px;
   }
   .em-product-card:hover .em-product-image img { transform: scale(1.05); }
   
   .em-product-actions {
       position: absolute;
       top: 10px;
       right: 10px;
       display: flex;
       flex-direction: column;
       gap: 6px;
       opacity: 0;
       visibility: hidden;
       transition: var(--em-transition);
   }
   .em-product-action-btn {
       width: 36px;
       height: 36px;
       border-radius: 50%;
       background: #fff;
       border: 1px solid #e5e5e5;
       display: flex;
       align-items: center;
       justify-content: center;
       cursor: pointer;
       font-size: 14px;
       color: var(--em-dark, #212121);
       transition: var(--em-transition);
       text-decoration: none;
   }
   .em-product-action-btn:hover {
       background: var(--em-primary, #0088cc);
       border-color: var(--em-primary, #0088cc);
       color: #fff;
   }
   
   .em-product-badges {
       position: absolute;
       top: 10px;
       left: 10px;
       display: flex;
       flex-direction: column;
       gap: 4px;
   }
   .em-badge-sale {
       position: absolute;
       top: 10px;
       left: 10px;
       font-size: 12px;
       height: 20px;
       z-index: 1;
       line-height: 1;
       font-weight: 700;
       display: flex;
       justify-content: center;
       align-items: center;
       padding: 0 10px;
       color: #fff;
       background: transparent;
       border: 10px solid var(--em-secondary, #db5555);
       border-left: 6px solid transparent;
       border-right: 6px solid transparent;
       white-space: nowrap;
       border-radius: 0;
   }
   .em-badge-new {
       background: #28a745;
       color: #fff;
       font-size: 11px;
       font-weight: 700;
       padding: 2px 8px;
       border-radius: 3px;
       text-transform: uppercase;
   }
   
   .em-product-info { padding: 12px; }
   .em-product-category {
       font-size: 11px;
       color: var(--em-primary, #0088cc);
       text-transform: uppercase;
       font-weight: 600;
       letter-spacing: 0.5px;
       margin-bottom: 4px;
       display: block;
       text-decoration: none;
   }
   .em-product-name {
       font-size: 14px;
       font-weight: 600;
       color: var(--em-dark, #212121);
       margin-bottom: 8px;
       line-height: 1.4;
       display: -webkit-box;
       -webkit-line-clamp: 2;
       -webkit-box-orient: vertical;
       overflow: hidden;
   }
   .em-product-name a { color: inherit; text-decoration: none; }
   .em-product-name a:hover { color: var(--em-primary, #0088cc); }
   
   .em-product-price {
       display: flex;
       align-items: center;
       gap: 8px;
       margin-bottom: 12px;
   }
   .em-product-price .price { font-size: 16px; font-weight: 700; color: var(--em-primary, #0088cc); }
   .em-product-price del { font-size: 12px; color: #999; }
   .em-product-price ins { text-decoration: none; }
   
   .em-product-rating { display: flex; align-items: center; gap: 4px; margin-bottom: 10px; }
   .em-stars { color: #f5a623; font-size: 12px; }
   .em-rating-count { font-size: 11px; color: #999; }
   
   .em-add-to-cart-btn {
       width: 100%;
       padding: 9px 16px;
       background: var(--em-dark, #212121);
       color: #fff;
       border: none;
       border-radius: var(--em-radius, 6px);
       font-family: var(--em-font-primary);
       font-size: 13px;
       font-weight: 600;
       cursor: pointer;
       transition: var(--em-transition);
       text-align: center;
       display: block;
       text-decoration: none;
   }
   .em-add-to-cart-btn:hover { background: var(--em-primary, #0088cc); color: #fff; }
   
   /* ─────────────────────────────────────────────
      CARRINHO SIDEBAR OFF-CANVAS
      ───────────────────────────────────────────── */
   .em-cart-overlay {
       position: fixed;
       inset: 0;
       background: rgba(0, 0, 0, 0.5);
       z-index: 99998;
       opacity: 0;
       visibility: hidden;
       transition: var(--em-transition);
   }
   .em-cart-overlay.em-active {
       opacity: 1;
       visibility: visible;
   }
   
   .em-cart-sidebar {
       position: fixed;
       top: 0;
       right: -420px;
       width: 100%;
       max-width: 420px;
       height: 100vh;
       background: #fff;
       z-index: 99999;
       display: flex;
       flex-direction: column;
       box-shadow: -5px 0 30px rgba(0,0,0,0.15);
       transition: right 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94);
   }
   .em-cart-sidebar.em-active { right: 0; }
   
   .em-cart-sidebar-header {
       display: flex;
       align-items: center;
       justify-content: space-between;
       padding: 20px;
       border-bottom: 1px solid #e5e5e5;
       background: var(--em-dark-bg, #1a1a1a);
       color: #fff;
   }
   .em-cart-sidebar-header h3 {
       margin: 0;
       font-size: 16px;
       font-weight: 700;
       display: flex;
       align-items: center;
       gap: 8px;
   }
   .em-cart-sidebar-header h3 i { color: var(--em-primary, #0088cc); }
   .em-cart-count { color: var(--em-primary, #0088cc); }
   
   .em-cart-close {
       background: none;
       border: none;
       color: #fff;
       font-size: 20px;
       cursor: pointer;
       padding: 4px;
       transition: var(--em-transition);
   }
   .em-cart-close:hover { color: var(--em-primary, #0088cc); transform: rotate(90deg); }
   
   .em-cart-sidebar-body {
       flex: 1;
       overflow-y: auto;
       padding: 16px;
       scrollbar-width: thin;
       scrollbar-color: var(--em-primary, #0088cc) #f4f4f4;
   }
   
   .em-cart-item {
       display: flex;
       align-items: center;
       gap: 12px;
       padding: 12px 0;
       border-bottom: 1px solid #f0f0f0;
   }
   .em-cart-item:last-child { border-bottom: none; }
   
   .em-cart-item-img {
       width: 70px;
       height: 70px;
       flex-shrink: 0;
       border-radius: 6px;
       overflow: hidden;
       background: var(--em-primary-bg, #f4f4f4);
   }
   .em-cart-item-img img { width: 100%; height: 100%; object-fit: contain; padding: 4px; }
   
   .em-cart-item-info { flex: 1; }
   .em-cart-item-name { font-size: 13px; font-weight: 600; color: var(--em-dark, #212121); display: block; margin-bottom: 4px; }
   .em-cart-item-qty { font-size: 12px; color: #666; }
   
   .em-cart-item-remove {
       color: #999;
       font-size: 16px;
       cursor: pointer;
       transition: var(--em-transition);
       background: none;
       border: none;
       padding: 4px;
       text-decoration: none;
   }
   .em-cart-item-remove:hover { color: #dc3545; }
   
   .em-cart-empty {
       text-align: center;
       padding: 40px 20px;
       color: #999;
   }
   .em-cart-empty i { display: block; margin-bottom: 16px; color: #ddd; }
   .em-cart-empty p { margin-bottom: 20px; font-size: 15px; }
   
   .em-cart-sidebar-footer {
       padding: 16px 20px;
       border-top: 1px solid #e5e5e5;
       background: #fafafa;
   }
   .em-cart-subtotal {
       display: flex;
       justify-content: space-between;
       align-items: center;
       margin-bottom: 12px;
       font-size: 16px;
   }
   .em-cart-subtotal strong { color: var(--em-primary, #0088cc); font-size: 18px; }
   
   .em-cart-sidebar-footer .em-btn { margin-bottom: 8px; }
   
   /* ─────────────────────────────────────────────
      TRUST BADGES
      ───────────────────────────────────────────── */
   .em-trust-badges {
       display: flex;
       flex-wrap: wrap;
       gap: 8px;
       margin: 12px 0;
       justify-content: center;
   }
   .em-trust-badge {
       display: flex;
       align-items: center;
       gap: 6px;
       font-size: 11px;
       color: #555;
       font-weight: 500;
   }
   .em-trust-badge i { color: var(--em-primary, #0088cc); font-size: 14px; }
   
   /* ─────────────────────────────────────────────
      TABS FILTER (para widgets de produto)
      ───────────────────────────────────────────── */
   .em-tabs-nav {
       display: flex;
       flex-wrap: wrap;
       gap: 6px;
       margin-bottom: 24px;
   }
   .em-tab-btn {
       padding: 7px 18px;
       border-radius: 50px;
       border: 1px solid #ddd;
       background: #fff;
       font-size: 13px;
       font-weight: 500;
       cursor: pointer;
       transition: var(--em-transition);
       color: var(--em-dark, #212121);
   }
   .em-tab-btn:hover,
   .em-tab-btn.em-active {
       background: var(--em-primary, #0088cc);
       border-color: var(--em-primary, #0088cc);
       color: #fff;
   }
   .em-dark-bg .em-tab-btn {
       background: rgba(255,255,255,0.08);
       border-color: rgba(255,255,255,0.15);
       color: #ddd;
   }
   .em-dark-bg .em-tab-btn:hover,
   .em-dark-bg .em-tab-btn.em-active {
       background: var(--em-primary, #0088cc);
       border-color: var(--em-primary, #0088cc);
       color: #fff;
   }
   
   /* ─────────────────────────────────────────────
      LOADING SPINNER
      ───────────────────────────────────────────── */
   .em-loading {
       display: flex;
       align-items: center;
       justify-content: center;
       padding: 40px;
   }
   .em-spinner {
       width: 36px;
       height: 36px;
       border: 3px solid #e5e5e5;
       border-top-color: var(--em-primary, #0088cc);
       border-radius: 50%;
       animation: em-spin 0.7s linear infinite;
   }
   @keyframes em-spin { to { transform: rotate(360deg); } }
   
   /* ─────────────────────────────────────────────
      OWL CAROUSEL — OVERRIDES
      ───────────────────────────────────────────── */
   .em-owl-nav .owl-prev,
   .em-owl-nav .owl-next {
       width: 36px;
       height: 36px;
       border-radius: 50%;
       background: var(--em-primary, #0088cc) !important;
       color: #fff !important;
       display: flex;
       align-items: center;
       justify-content: center;
       font-size: 16px;
       transition: var(--em-transition);
   }
   .em-owl-nav .owl-prev:hover,
   .em-owl-nav .owl-next:hover {
       background: var(--em-accent, #0070a8) !important;
   }
   
   /* ─────────────────────────────────────────────
      RESPONSIVO — MOBILE FIRST
      ───────────────────────────────────────────── */
   @media (max-width: 767px) {
       .em-cart-sidebar { max-width: 100%; right: -100%; }
       .em-cart-sidebar.em-active { right: 0; }
       .em-section-header { flex-direction: column; align-items: flex-start; gap: 8px; }
   }
   
   @media (max-width: 480px) {
       .em-topbar { font-size: 11px; padding: 6px 10px; }
       .em-trust-badges { gap: 6px; }
       .em-trust-badge { font-size: 10px; }
   }
   
   /* ============================================================
      FASE 2 — Widgets: Hero Slider · Ticker Bar · Info Service
      ============================================================ */
   
   /* ─────────────────────────────────────────────
      HERO SLIDER (base visual tokens)
      Obs: regras estruturais (layout, nav, tamanhos) ficam no bloco
      consolidado mais abaixo para evitar conflito com estilos legados.
      ───────────────────────────────────────────── */
   .em-hero-slider-wrap {
       position: relative;
       overflow: hidden;
       /* Padding top/bottom zerado: evita gap entre o carousel e os mini-banners
          adjacentes. Em mobile (≤991px) o media query reaplica 10px/14px. */
       padding: 0;
   }
   /* Remove o padding lateral do .em-container DENTRO do hero slider.
      O .em-container global (padding: 0 30px) é correto para outros widgets,
      mas aqui ele somava 30px extras ao row_padding do Elementor (também 30px
      por padrão), gerando 60px de offset esquerdo no carousel.
      Em mobile (≤991px) o media query reaplica padding-left/right: 12px. */
   .em-hero-slider-wrap .em-container {
       padding-left: 0;
       padding-right: 0;
   }

   .em-slide-badge {
       display: inline-block;
       background: var(--em-primary, #0088cc);
       color: #fff;
       font-size: 11px;
       font-weight: 700;
       letter-spacing: 1.5px;
       text-transform: uppercase;
       padding: 4px 14px;
       border-radius: 50px;
       margin-bottom: 16px;
   }
   .em-slide-title {
       font-size: 38px;
       font-weight: 800;
       line-height: 1.15;
       margin: 0 0 14px;
       font-family: var(--em-font-primary);
   }
   .em-slide-subtitle {
       font-size: 16px;
       line-height: 1.7;
       margin: 0 0 20px;
       max-width: 420px;
   }
   .em-slide-price {
       display: flex;
       align-items: center;
       gap: 12px;
       margin-bottom: 28px;
       font-size: 15px;
   }
   .em-slide-price strong { font-size: 28px; font-weight: 800; }
   .em-slide-btn { font-size: 15px; padding: 13px 32px; }

   @media (max-width: 768px) {
       .em-slide-title { font-size: 24px; }
       .em-slide-subtitle { font-size: 14px; margin-bottom: 15px; }
       .em-slide-price { margin-bottom: 18px; }
       .em-slide-price strong { font-size: 22px; }
       .em-slide-btn { padding: 11px 24px; font-size: 14px; }
   }

   /* ─────────────────────────────────────────────
      TICKER BAR
      ───────────────────────────────────────────── */
   .em-ticker-wrap { width: 100%; }
   .em-ticker-dark    { background: var(--em-dark-bg, #1a1a1a); }
   .em-ticker-primary { background: var(--em-primary, #0088cc); }
   .em-ticker-light   { background: var(--em-primary-bg, #f4f4f4); }
   
   .em-ticker-item { text-align: center; }
   .em-ticker-link {
       display: flex;
       flex-direction: column;
       align-items: center;
       gap: 6px;
       text-decoration: none;
       padding: 4px 8px;
       border-radius: var(--em-radius, 6px);
       transition: var(--em-transition);
   }
   .em-ticker-link:hover { background: rgba(255,255,255,0.05); }
   .em-ticker-primary .em-ticker-link:hover { background: rgba(0,0,0,0.1); }
   .em-ticker-light .em-ticker-link:hover   { background: rgba(0,0,0,0.05); }
   
   .em-ticker-img {
       width: 35px; height: 35px;
       border-radius: 50%;
       overflow: hidden;
       border: 1px solid var(--em-primary, #0088cc);
       background: rgba(255,255,255,0.08);
       display: flex; align-items: center; justify-content: center;
       flex-shrink: 0;
       padding: 4px;
   }
   .em-ticker-light .em-ticker-img { background: #fff; border-color: var(--em-primary, #0088cc); }
   .em-ticker-img img { width: 100%; height: 100%; object-fit: contain; }
   
   .em-ticker-name {
       font-size: 11px;
       font-weight: 500;
       line-height: 1.3;
       color: #ccc;
       display: -webkit-box;
       -webkit-line-clamp: 2;
       -webkit-box-orient: vertical;
       overflow: hidden;
   }
   .em-ticker-primary .em-ticker-name { color: rgba(255,255,255,0.9); }
   .em-ticker-light .em-ticker-name   { color: #555; }
   
   .em-ticker-price { font-size: 12px; font-weight: 700; color: var(--em-primary, #0088cc); }
   .em-ticker-primary .em-ticker-price { color: #fff; }
   .em-ticker-empty { color: #999; text-align: center; padding: 16px; font-size: 13px; }

   /* ── Ticker Marquee (rolagem contínua) ────────────────────────────────
      Modo alternativo ao Owl Carousel.
      O PHP renderiza os itens 2× seguidos na .em-ticker-marquee-track.
      A animação translateX(-50%) percorre exatamente um conjunto de itens,
      retornando ao início de forma invisível — loop seamless sem JS extra.
      ──────────────────────────────────────────────────────────────────── */
   @keyframes em-marquee-scroll {
       0%   { transform: translateX(0); }
       100% { transform: translateX(-50%); }
   }

   .em-ticker-mode-marquee .em-ticker-marquee {
       overflow: hidden;
       width: 100%;
   }

   .em-ticker-mode-marquee .em-ticker-marquee-track {
       display: flex;
       flex-wrap: nowrap;
       width: max-content;
       gap: 0;
       animation: em-marquee-scroll var(--em-marquee-duration, 30s) linear infinite;
       will-change: transform;
   }

   /* Pausa ao hover para acessibilidade e usabilidade */
   .em-ticker-mode-marquee .em-ticker-marquee:hover .em-ticker-marquee-track,
   .em-ticker-mode-marquee .em-ticker-marquee:focus-within .em-ticker-marquee-track {
       animation-play-state: paused;
   }

   /* Espaçamento lateral entre itens no modo marquee */
   .em-ticker-mode-marquee .em-ticker-item {
       flex-shrink: 0;
       padding: 0 12px;
   }

    @media (prefers-reduced-motion: reduce) {
        .em-ticker-mode-marquee .em-ticker-marquee-track {
            animation: none;
            overflow-x: auto;
            scroll-behavior: smooth;
        }
    }

    @media (max-width: 991px) {
        .em-ticker-wrap {
            overflow: hidden;
            width: 100%;
        }
        .em-ticker-mode-marquee .em-ticker-marquee-track {
            animation-duration: 20s;
        }
    }

   /* ─────────────────────────────────────────────
      INFO SERVICE
      ───────────────────────────────────────────── */
   .em-infoservice-wrap { width: 100%; }
   
   .em-infoservice-grid {
       display: grid;
       grid-template-columns: repeat(var(--em-info-cols, 4), 1fr) auto;
       align-items: center;
       gap: 0;
   }
   
   /* Remover colunas auto dos dividers do cálculo base */
   .em-infoservice-grid.em-info-dividers {
       grid-template-columns: repeat(var(--em-info-cols, 4), 1fr);
   }
   
   /* Divider entre itens */
   .em-info-divider {
       width: 1px;
       height: 50px;
       background: rgba(0,0,0,0.1);
       margin: 0 auto;
       display: none; /* Só em grid calculado por coluna */
   }
   
   /* Layout horizontal */
   .em-info-horizontal .em-info-item {
       display: flex;
       align-items: center;
       gap: 14px;
       padding: 16px 20px;
       position: relative;
   }
   .em-info-horizontal.em-info-dividers .em-info-item:not(:last-child)::after {
       content: '';
       position: absolute;
       right: 0;
       top: 50%;
       transform: translateY(-50%);
       width: 1px;
       height: 50px;
       background: rgba(0,0,0,0.1);
   }
   
   /* Layout vertical */
   .em-info-vertical .em-info-item {
       display: flex;
       flex-direction: column;
       align-items: center;
       text-align: center;
       gap: 10px;
       padding: 20px 16px;
   }
   
   .em-info-icon {
       flex-shrink: 0;
       width: 50px; height: 50px;
       border-radius: 50%;
       background: var(--em-primary, #0088cc);
       color: #fff;
       display: flex;
       align-items: center;
       justify-content: center;
       font-size: 22px;
       transition: var(--em-transition);
   }
   .em-info-icon i { font-size: 22px; color: #fff; }
   .em-info-icon svg { width: 22px; height: 22px; fill: #fff; }
   a.em-info-item:hover .em-info-icon { background: var(--em-dark, #212121); }
   
   .em-info-text { display: flex; flex-direction: column; gap: 3px; }
   .em-info-title { font-size: 14px; font-weight: 700; color: #212121; white-space: nowrap; }
   .em-info-desc  { font-size: 12px; color: #666; }
   
   /* Link style */
   a.em-info-item { text-decoration: none; transition: var(--em-transition); }
   a.em-info-item:hover .em-info-title { color: var(--em-primary, #0088cc); }
   
   @media (max-width: 767px) {
       .em-infoservice-grid {
           grid-template-columns: repeat(2, 1fr) !important;
       }
       .em-info-horizontal .em-info-item { padding: 12px 10px; gap: 10px; }
       .em-info-title { font-size: 12px; white-space: normal; }
       .em-info-horizontal .em-info-item::after { display: none; }
   }
   @media (max-width: 480px) {
       .em-infoservice-grid { grid-template-columns: 1fr !important; }
   }
   
   /* ============================================================
      FASE 3 — Widgets: Category Grid · Banner Grid · Banner Full
      ============================================================ */
   
   /* ─────────────────────────────────────────────
      CATEGORY GRID
      ───────────────────────────────────────────── */
   .em-catgrid-wrap { width: 100%; }
   
   .em-cat-grid {
       display: grid;
       grid-template-columns: repeat(var(--em-cat-cols, 6), 1fr);
       gap: 16px;
   }
   
   /* Estilo: Circular */
   .em-cat-style-circle .em-cat-item {
       display: flex;
       flex-direction: column;
       align-items: center;
       gap: 10px;
       text-decoration: none;
       padding: 12px 8px;
       border-radius: 10px;
       transition: var(--em-transition);
   }
   .em-cat-style-circle .em-cat-item:hover { background: var(--em-primary-bg, #f4f4f4); }
   .em-cat-style-circle .em-cat-img-wrap {
       width: 90px; height: 90px;
       border-radius: 50%;
       overflow: hidden;
       background: var(--em-primary-bg, #f4f4f4);
       display: flex; align-items: center; justify-content: center;
       transition: var(--em-transition);
       border: 3px solid transparent;
   }
   .em-cat-style-circle .em-cat-item:hover .em-cat-img-wrap {
       border-color: var(--em-primary, #0088cc);
       transform: translateY(-4px);
   }
   
   /* Estilo: Square */
   .em-cat-style-square .em-cat-item {
       display: flex;
       flex-direction: column;
       align-items: center;
       gap: 10px;
       text-decoration: none;
       border-radius: var(--em-radius, 6px);
       overflow: hidden;
       transition: var(--em-transition);
   }
   .em-cat-style-square .em-cat-img-wrap {
       width: 100%;
       aspect-ratio: 1/1;
       overflow: hidden;
       background: var(--em-primary-bg, #f4f4f4);
   }
   .em-cat-style-square .em-cat-item:hover .em-cat-img-wrap img { transform: scale(1.08); }
   .em-cat-style-square .em-cat-info { padding: 0 8px 12px; text-align: center; }
     @media (max-width: 1024px) {
        .em-cat-grid { grid-template-columns: repeat(var(--em-cat-cols-tab, 4), 1fr); }
    }
    @media (max-width: 767px) {
        .em-cat-filters { display: none !important; } /* Ocultar filtros no mobile para reduzir altura (Etapa 15.6) */
        .em-cat-grid { grid-template-columns: repeat(2, 1fr) !important; gap: 12px; } /* Forçado 2 colunas */
        .em-cat-count { display: none !important; } /* Remover contagem no mobile para limpar visual */
        .em-cat-style-circle .em-cat-img-wrap { width: 56px; height: 56px; }
        .em-cat-name { font-size: 11px; margin-top: 8px; }
    }
   
   /* Estilo: Card */
   .em-cat-style-card .em-cat-item {
       display: flex;
       flex-direction: column;
       align-items: center;
       gap: 10px;
       text-decoration: none;
       border: 1px solid #e5e5e5;
       border-radius: var(--em-radius, 6px);
       padding: 16px 12px;
       transition: var(--em-transition);
       background: #fff;
   }
   .em-cat-style-card .em-cat-item:hover {
       border-color: var(--em-primary, #0088cc);
       box-shadow: 0 4px 16px rgba(0,136,204,0.12);
       transform: translateY(-3px);
   }
   .em-cat-style-card .em-cat-img-wrap {
       width: 70px; height: 70px;
       border-radius: 50%;
       overflow: hidden;
       background: var(--em-primary-bg, #f4f4f4);
       display: flex; align-items: center; justify-content: center;
   }
   
   /* Imagem comum */
   .em-cat-img-wrap img {
       width: 100%; height: 100%;
       object-fit: contain;
       padding: 6px;
       transition: transform 0.3s ease;
   }

   .em-cat-fallback-icon {
       display: none;
       align-items: center;
       justify-content: center;
       font-size: 34px;
       color: var(--em-primary, #0088cc);
   }

   .em-cat-img-wrap--icon img {
       display: none;
   }

   .em-cat-img-wrap--icon .em-cat-fallback-icon {
       display: inline-flex;
   }

   .em-cat-style-card .em-cat-fallback-icon {
       font-size: 28px;
   }

   .em-cat-style-square .em-cat-fallback-icon {
       font-size: 56px; /* proporcional ao card full-width (~172px) */
   }
   
   .em-cat-info { display: flex; flex-direction: column; align-items: center; gap: 2px; text-align: center; }
   .em-cat-name {
       font-size: 13px; font-weight: 600;
       color: var(--em-dark, #212121);
       line-height: 1.3;
       display: -webkit-box;
       -webkit-line-clamp: 2;
       -webkit-box-orient: vertical;
       overflow: hidden;
   }
   /* Badge circular — background configurável via count_color no Elementor.
      color !important: garante branco mesmo se Elementor tiver CSS cacheado
      com o selector antigo (color: {{VALUE}}) que gerava azul-sobre-azul. */
   .em-cat-count {
       width: 22px;
       height: 22px;
       border-radius: 50%;
       background: var(--em-primary, #0088cc);
       color: #fff !important;
       font-size: 10px;
       font-weight: 700;
       display: inline-flex;
       align-items: center;
       justify-content: center;
       line-height: 1;
       flex-shrink: 0;
       transition: background 0.2s ease;
   }
   .em-cat-item:hover .em-cat-count {
       background: var(--em-accent, #0070a8);
   }
   
   /* Hover: nome recebe cor primária (padrão Electromix) */
   .em-cat-item:hover .em-cat-name,
   .em-cat-item:focus-within .em-cat-name {
       color: var(--em-primary, #0088cc) !important;
   }

   /* Filtros de categoria */
   .em-cat-filters { margin-bottom: 24px; }
   .em-cat-item[style*="display: none"] { display: none !important; }
   
   /* Responsivo */
   @media (max-width: 1024px) {
       .em-cat-grid { grid-template-columns: repeat(var(--em-cat-cols-tab, 4), 1fr); }
   }
   @media (max-width: 640px) {
       .em-cat-grid { grid-template-columns: repeat(var(--em-cat-cols-mob, 3), 1fr); gap: 10px; }
       .em-cat-style-circle .em-cat-img-wrap { width: 64px; height: 64px; }
       .em-cat-name { font-size: 11px; }
   }
   
   /* ─────────────────────────────────────────────
      BANNER GRID
      ───────────────────────────────────────────── */
   .em-bannergrid-wrap { width: 100%; }
   
   /* NOVO: Definição base .em-banner-grid (evita flashing/reflow) */
   .em-banner-grid {
       display: grid;
       gap: 16px;
   }
   
   /* Layouts */
   .em-banner-layout-1col  { grid-template-columns: 1fr; }
   .em-banner-layout-2col  { grid-template-columns: 1fr 1fr; }
   .em-banner-layout-3col  { grid-template-columns: 1fr 1fr 1fr; }
   .em-banner-layout-1\+2  { grid-template-columns: 2fr 1fr 1fr; }
   .em-banner-layout-2\+1  { grid-template-columns: 1fr 1fr 2fr; }
   
   .em-banner-item {
       position: relative;
       overflow: hidden;
       display: block;
       text-decoration: none;
   }
   .em-banner-bg {
       position: absolute;
       inset: 0;
       background-size: cover;
       background-position: center;
       transition: transform 0.5s ease;
   }
   .em-banner-zoom:hover .em-banner-bg { transform: scale(1.05); }
   
   .em-banner-overlay {
       position: absolute;
       inset: 0;
       transition: background 0.3s ease;
   }
   .em-banner-item:hover .em-banner-overlay { filter: brightness(1.1); }
   
   .em-banner-content {
       position: absolute;
       inset: 0;
       display: flex;
       padding: 24px;
       z-index: 2;
   }
   .em-banner-text { display: flex; flex-direction: column; gap: 6px; }
   
   .em-banner-badge {
       display: inline-block;
       background: var(--em-primary, #0088cc);
       color: #fff;
       font-size: 10px;
       font-weight: 700;
       letter-spacing: 1px;
       text-transform: uppercase;
       padding: 3px 10px;
       border-radius: 3px;
       width: fit-content;
   }
   .em-banner-title {
       font-size: 22px;
       font-weight: 800;
       line-height: 1.2;
       margin: 0;
       font-family: var(--em-font-primary);
   }
   .em-banner-subtitle { font-size: 13px; line-height: 1.4; margin: 0; }
   .em-banner-btn {
       display: inline-flex;
       align-items: center;
       gap: 6px;
       font-size: 13px;
       font-weight: 700;
       margin-top: 4px;
       transition: gap 0.2s;
       width: fit-content;
       border-bottom: 2px solid currentColor;
       padding-bottom: 2px;
   }
   .em-banner-item:hover .em-banner-btn { gap: 10px; }
   
   @media (max-width: 768px) {
       .em-banner-layout-3col,
       .em-banner-layout-1\+2,
       .em-banner-layout-2\+1 { grid-template-columns: 1fr !important; }
       .em-banner-layout-2col  { grid-template-columns: 1fr 1fr; }
       .em-banner-title { font-size: 18px; }
   }
   @media (max-width: 480px) {
       .em-banner-layout-2col  { grid-template-columns: 1fr; }
   }
   
   /* ─────────────────────────────────────────────
      BANNER FULL WIDTH
      ───────────────────────────────────────────── */
   .em-fullbanner-wrap { width: 100%; }
   .em-fullbanner-inner {
       position: relative;
       overflow: hidden;
       min-height: 280px;
       display: flex;
       align-items: center;
   }
   .em-fullbanner-overlay {
       position: absolute;
       inset: 0;
       background: rgba(0,0,0,0.15);
       z-index: 0;
   }
   .em-fullbanner-container {
       position: relative;
       z-index: 1;
       display: flex;
       align-items: center;
       justify-content: space-between;
       gap: 40px;
       padding: 48px 15px;
       width: 100%;
   }
   .em-fullbanner-content { flex: 1; max-width: 580px; }
   
   .em-fullbanner-badge {
       display: inline-block;
       background: var(--em-primary, #0088cc);
       color: #fff;
       font-size: 11px;
       font-weight: 700;
       letter-spacing: 1.5px;
       text-transform: uppercase;
       padding: 4px 14px;
       border-radius: 50px;
       margin-bottom: 14px;
   }
   .em-fullbanner-title {
       font-size: 34px;
       font-weight: 800;
       line-height: 1.2;
       margin: 0 0 10px;
       font-family: var(--em-font-primary);
   }
   .em-fullbanner-subtitle { font-size: 16px; margin: 0 0 14px; }
   .em-fullbanner-price {
       display: flex;
       align-items: center;
       gap: 12px;
       margin-bottom: 10px;
   }
   .em-fullbanner-price-old { font-size: 14px; }
   .em-fullbanner-price-current { font-size: 28px; font-weight: 800; }
   .em-fullbanner-urgency { font-size: 13px; margin: 0 0 20px; }
   .em-fullbanner-urgency i { margin-right: 6px; }
   
   .em-fullbanner-btn {
       display: inline-flex;
       align-items: center;
       gap: 8px;
       padding: 13px 32px;
       border-radius: var(--em-radius, 6px);
       font-size: 15px;
       font-weight: 700;
       text-decoration: none;
       transition: var(--em-transition);
   }
   .em-fullbanner-btn:hover { opacity: 0.88; transform: translateY(-2px); }
   
   .em-fullbanner-product-img {
       flex-shrink: 0;
       max-width: 40%;
       display: flex;
       align-items: center;
       justify-content: flex-end;
   }
   .em-fullbanner-product-img img {
       max-width: 100%;
       max-height: 320px;
       object-fit: contain;
       filter: drop-shadow(0 16px 32px rgba(0,0,0,0.25));
       animation: em-float 3.5s ease-in-out infinite;
        will-change: transform;
   }

   @keyframes em-float {
       0%, 100% { transform: translate3d(0, 0, 0); }
       50%      { transform: translate3d(0, -8px, 0); }
   }
   
   /* Countdown no banner full */
   .em-fullbanner-countdown {
       display: flex;
       align-items: center;
       gap: 8px;
       margin-bottom: 24px;
       flex-wrap: wrap;
   }
   .em-cd-block {
       display: flex;
       flex-direction: column;
       align-items: center;
       background: rgba(255,255,255,0.12);
       border: 1px solid rgba(255,255,255,0.2);
       border-radius: 6px;
       padding: 8px 14px;
       min-width: 60px;
   }
   .em-cd-block strong { font-size: 28px; font-weight: 800; line-height: 1; }
   .em-cd-block small  { font-size: 10px; text-transform: uppercase; letter-spacing: 1px; opacity: .7; }
   .em-cd-sep { font-size: 24px; font-weight: 700; opacity: .6; }
   .em-countdown-ended { font-size: 14px; opacity: .7; }
   
   @media (max-width: 768px) {
       .em-fullbanner-container { flex-direction: column; padding: 40px 15px; }
       .em-fullbanner-content   { max-width: 100%; text-align: center; }
       .em-fullbanner-product-img { max-width: 60%; }
       .em-fullbanner-title  { font-size: 26px; }
       .em-fullbanner-price  { justify-content: center; }
       .em-fullbanner-badge,
       .em-fullbanner-btn    { display: block; text-align: center; }
       .em-fullbanner-countdown { justify-content: center; }
   }
   
   /* Fix para layouts com + no nome de classe (gerados via data-layout) */
   .em-banner-grid[data-layout="1+2"] { grid-template-columns: 2fr 1fr 1fr; }
   .em-banner-grid[data-layout="2+1"] { grid-template-columns: 1fr 1fr 2fr; }
   
   /* ============================================================
      FASE 4 — Grid Produtos · Lista · Flash · Slider Split · Blog
      ============================================================ */
   
   /* ─── Utilitários dark ─── */
   .em-dark-section  { color: #e0e0e0; }
   .em-text-white    { color: #ffffff !important; }
   .em-text-muted    { color: rgba(255,255,255,.6) !important; }
   .em-card-dark     { background: #2a2a2a !important; border-color: #3a3a3a !important; }
   .em-card-dark .em-product-name a { color: #ffffff; }
   .em-card-dark .em-product-name a:hover { color: var(--em-primary, #0088cc); }
   .em-tabs-dark .em-tab-btn          { background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.15); color: #ccc; }
   .em-tabs-dark .em-tab-btn:hover,
   .em-tabs-dark .em-tab-btn.em-active { background: var(--em-primary,#0088cc); border-color: var(--em-primary,#0088cc); color:#fff; }
   .em-btn-outline-white { background: transparent; color: #fff; border: 2px solid rgba(255,255,255,.4); border-radius: var(--em-radius,6px); padding:10px 24px; font-weight:600; cursor:pointer; transition:var(--em-transition); }
   .em-btn-outline-white:hover { background: #fff; color: var(--em-dark,#212121); }
   
   /* ─── Grid de colunas genérico ─── */
   .em-grid-cols-2 { display: grid; grid-template-columns: repeat(2,1fr); gap: 20px; }
   .em-grid-cols-3 { display: grid; grid-template-columns: repeat(3,1fr); gap: 20px; }
   .em-grid-cols-4 { display: grid; grid-template-columns: repeat(4,1fr); gap: 20px; }
   .em-grid-cols-5 { display: grid; grid-template-columns: repeat(5,1fr); gap: 16px; }
   
   @media (max-width: 1024px) {
       .em-grid-cols-5 { grid-template-columns: repeat(4,1fr); }
       .em-grid-cols-4 { grid-template-columns: repeat(3,1fr); }
   }
   @media (max-width: 768px) {
       .em-grid-cols-2,.em-grid-cols-3,.em-grid-cols-4,.em-grid-cols-5 { grid-template-columns: repeat(2,1fr); }
   }
   @media (max-width: 480px) {
       .em-grid-cols-2,.em-grid-cols-3,.em-grid-cols-4,.em-grid-cols-5 { grid-template-columns: 1fr; }
   }
   
   /* ─── Badges ─── */
   .em-badge-discount {
       background: #ff4444; color: #fff;
       font-size: 11px; font-weight: 700;
       padding: 2px 8px; border-radius: 3px;
       text-transform: uppercase;
   }
   
   /* ─── Barra de estoque ─── */
   .em-stock-bar { margin: 8px 0 12px; }
   .em-stock-bar-label { display: flex; justify-content: space-between; font-size: 11px; color: #888; margin-bottom: 4px; }
   .em-stock-bar-track { height: 5px; background: #e5e5e5; border-radius: 50px; overflow: hidden; }
   .em-stock-bar-fill  { height: 100%; background: var(--em-primary,#0088cc); border-radius: 50px; transition: width 0.6s ease; }
   .em-card-dark .em-stock-bar-track { background: rgba(255,255,255,.15); }
   
   /* ─── Load More ─── */
   .em-load-more-wrap { text-align: center; margin-top: 36px; }
   .em-load-more-btn  { cursor: pointer; font-family: var(--em-font-primary); font-size: 14px; }
   .em-load-more-btn.em-loading i { animation: em-spin .7s linear infinite; }
   
   /* ─── Grid de Produtos (wrapper) ─── */
   .em-prodgrid-wrap  { width: 100%; }
   .em-products-grid  { margin-top: 24px; }
   .em-no-products    { grid-column: 1/-1; text-align: center; padding: 40px; color: #999; font-size: 15px; }
   
   /* ─── Lista de Produtos ─── */
   .em-prodlist-wrap { width: 100%; }
   .em-prodlist-grid {
       display: grid;
       grid-template-columns: repeat(3, 1fr);
       gap: 20px;
       margin-top: 24px;
   }
   .em-prodlist-item {
       display: flex;
       gap: 14px;
       align-items: flex-start;
       background: #fff;
       border-radius: var(--em-radius,6px);
       padding: 14px;
       box-shadow: var(--em-shadow);
       transition: var(--em-transition);
   }
   .em-prodlist-item:hover { box-shadow: var(--em-shadow-hover); transform: translateY(-2px); }
   .em-prodlist-img {
       position: relative;
       width: 100px;
       height: 100px;
       flex-shrink: 0;
       border-radius: 6px;
       overflow: hidden;
       background: var(--em-primary-bg,#f4f4f4);
       display: block;
   }
   .em-prodlist-img img { width:100%; height:100%; object-fit:contain; padding:4px; }
   .em-prodlist-img .em-badge-sale { position:absolute; top:6px; left:6px; }
   .em-prodlist-info { flex:1; }
   .em-prodlist-name { font-size: 13px; font-weight: 600; margin: 0 0 6px; line-height: 1.4; }
   .em-prodlist-name a { color: var(--em-dark,#212121); text-decoration: none; }
   .em-prodlist-name a:hover { color: var(--em-primary,#0088cc); }
   .em-prodlist-price .price { font-size:15px; font-weight:700; color: var(--em-primary,#0088cc); }
   
   @media (max-width: 1024px) { .em-prodlist-grid { grid-template-columns: repeat(2,1fr); } }
   @media (max-width: 600px)  { .em-prodlist-grid { grid-template-columns: 1fr; } }
   
   /* ─── Flash Products ─── */
   .em-flash-wrap { width:100%; }
   .em-flash-header {
       display: flex;
       align-items: center;
       justify-content: space-between;
       flex-wrap: wrap;
       gap: 16px;
       margin-bottom: 24px;
   }
   .em-flash-title-group { display:flex; align-items:center; gap:10px; }
   .em-flash-icon {
       width: 36px; height: 36px;
       background: var(--em-primary,#0088cc);
       color: #fff;
       border-radius: 8px;
       display: flex; align-items: center; justify-content: center;
       font-size: 16px;
   }
   .em-flash-countdown-wrap { display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
   .em-flash-ends-label { font-size:13px; color:#888; display:flex; align-items:center; gap:6px; }
   .em-dark-section .em-flash-ends-label { color: rgba(255,255,255,.6); }
   
   /* Cards dentro do flash carousel */
   .em-flash-card {
       background: #fff;
       border-radius: var(--em-radius,6px);
       overflow: hidden;
       box-shadow: var(--em-shadow);
       transition: var(--em-transition);
   }
   .em-flash-card:hover { box-shadow: var(--em-shadow-hover); transform:translateY(-3px); }
   .em-flash-carousel .owl-prev,
   .em-flash-carousel .owl-next {
       width: 36px; height: 36px;
       border-radius: 50%;
       background: var(--em-primary,#0088cc) !important;
       color: #fff !important;
       top: -52px;
   }
   .em-flash-carousel.owl-carousel .owl-nav { position: absolute; right: 0; top: -60px; display:flex; gap:8px; }
   
   /* ─── Products Slider (split) ─── */
   .em-prodslider-wrap { width:100%; }
   .em-prodslider-layout {
       display: grid;
       grid-template-columns: 1fr 2fr;
       gap: 24px;
       margin-top: 24px;
   }
   .em-ps-featured { position:relative; }
   .em-ps-featured-card {
       background: #fff;
       border-radius: 12px;
       overflow: hidden;
       box-shadow: var(--em-shadow);
       height: 100%;
       display: flex;
       flex-direction: column;
   }
   .em-card-dark.em-ps-featured-card { background: #2a2a2a; }
   .em-ps-featured-img {
       display: block;
       position: relative;
       background: var(--em-primary-bg,#f4f4f4);
       padding: 20px;
       text-align: center;
       aspect-ratio: 1;
       overflow: hidden;
   }
   .em-ps-featured-img img { max-width:100%; max-height:280px; object-fit:contain; transition: transform .4s ease; }
   .em-ps-featured-card:hover .em-ps-featured-img img { transform:scale(1.04); }
   .em-ps-featured-img .em-badge-sale { position:absolute; top:12px; left:12px; }
   .em-ps-featured-info { padding: 20px; flex:1; display:flex; flex-direction:column; }
   .em-ps-featured-name { font-size:18px; font-weight:700; margin:0 0 8px; line-height:1.3; }
   .em-ps-featured-name a { color:var(--em-dark,#212121); text-decoration:none; }
   .em-ps-featured-name a:hover { color:var(--em-primary,#0088cc); }
   .em-ps-featured-desc { font-size:13px; color:#666; line-height:1.6; margin:0 0 12px; }
   .em-dark-section .em-ps-featured-desc { color:rgba(255,255,255,.6); }
   .em-ps-featured-actions { display:flex; gap:10px; flex-wrap:wrap; margin-top:auto; padding-top:16px; }
   .em-ps-featured-actions .em-btn { font-size:13px; padding:10px 20px; }
   
   .em-ps-list-inner { display:flex; flex-direction:column; }
   .em-ps-list-item {
       display: flex;
       align-items: center;
       gap: 12px;
       padding: 12px 0;
       border-bottom: 1px solid #f0f0f0;
       transition: var(--em-transition);
   }
   .em-card-dark.em-ps-list-item { border-bottom-color: rgba(255,255,255,.08); }
   .em-ps-list-item:last-child { border-bottom: none; }
   .em-ps-list-item:hover { background: rgba(0,136,204,.04); border-radius: 8px; padding-left:8px; padding-right:8px; }
   .em-ps-list-img {
       width: 72px; height: 72px; flex-shrink:0;
       border-radius: 6px; overflow:hidden;
       background: var(--em-primary-bg,#f4f4f4);
       display: block;
   }
   .em-ps-list-img img { width:100%; height:100%; object-fit:contain; padding:4px; }
   .em-ps-list-info { flex:1; }
   .em-ps-list-name { font-size:13px; font-weight:600; margin:0 0 4px; display: -webkit-box; -webkit-line-clamp: 1; line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; }
   .em-ps-list-name a { color:var(--em-dark,#212121); text-decoration:none; }
   .em-ps-list-name a:hover { color:var(--em-primary,#0088cc); }
   .em-ps-add-btn {
       width:32px; height:32px; border-radius:50%;
       background: var(--em-primary,#0088cc);
       color: #fff;
       border: none; cursor:pointer;
       display:flex; align-items:center; justify-content:center;
       font-size:14px; text-decoration:none;
       flex-shrink:0;
       transition:var(--em-transition);
   }
   .em-ps-add-btn:hover { background: var(--em-accent,#0070a8); color:#fff; transform:scale(1.1); }
   
   @media (max-width:900px) { .em-prodslider-layout { grid-template-columns: 1fr; } }
   
   /* ─── Blog Posts ─── */
   .em-blog-wrap { width:100%; }
   .em-blog-grid { margin-top:24px; }
   
   .em-blog-card {
       background: #fff;
       border-radius: var(--em-radius,6px);
       overflow: hidden;
       box-shadow: var(--em-shadow);
       border: 1px solid #f0f0f0;
       transition: var(--em-transition);
       display: flex;
       flex-direction: column;
   }
   .em-blog-card:hover { box-shadow:var(--em-shadow-hover); transform:translateY(-3px); }
   
   .em-blog-thumb {
       display: block;
       position: relative;
       overflow: hidden;
       aspect-ratio: 4/3;
       background: #eee;
   }
   .em-blog-img-link { display:block; width:100%; height:100%; }
   .em-blog-thumb img { width:100%; height:100%; object-fit:cover; transition: transform .4s ease; display:block; }
   .em-blog-card:hover .em-blog-thumb img { transform: scale(1.04); }

   .em-blog-body { padding: 14px 16px 18px; flex:1; display:flex; flex-direction:column; }

   /* Categoria (link colorido acima do meta — igual à referência) */
   .em-blog-cat-link {
       display: inline-block;
       color: var(--em-secondary, #db5555);
       font-size: 13px;
       font-weight: 600;
       margin-bottom: 6px;
       text-decoration: none;
   }
   .em-blog-cat-link:hover { text-decoration: underline; }

   .em-blog-meta { display:flex; gap:12px; font-size:12px; color:#888; margin-bottom:10px; flex-wrap:wrap; padding: 0 0 8px; border-bottom: 1px solid #f0f0f0; }
   .em-blog-meta i { margin-right:4px; color:var(--em-primary,#0088cc); }

   .em-blog-title { font-size:15px; font-weight:700; margin:0 0 10px; line-height:1.4; }
   .em-blog-title a { color:var(--em-dark,#212121); text-decoration:none; }
   .em-blog-title a:hover { color:var(--em-primary,#0088cc); }

   .em-blog-excerpt { font-size:13px; color:#666; line-height:1.7; margin:0 0 14px; flex:1; }
   
   .em-blog-readmore {
       display: inline-flex;
       align-items: center;
       gap: 6px;
       font-size: 13px;
       font-weight: 700;
       color: var(--em-primary,#0088cc);
       text-decoration: none;
       transition: var(--em-transition);
       margin-top: auto;
   }
   .em-blog-readmore:hover { gap: 10px; }
   .em-blog-readmore i { font-size: 12px; }
   
   @media (max-width:768px) {
       .em-blog-grid.em-grid-cols-3,
       .em-blog-grid.em-grid-cols-4 { grid-template-columns: repeat(2,1fr); }
   }
   @media (max-width:480px) {
       .em-blog-grid.em-grid-cols-2,
       .em-blog-grid.em-grid-cols-3,
       .em-blog-grid.em-grid-cols-4 { grid-template-columns: 1fr; }
   }
   
   /* back-to-top */
   #em-back-top {
       position: fixed; bottom: 24px; right: 24px;
       width: 44px; height: 44px;
       background: var(--em-primary,#0088cc);
       color: #fff; border: none; border-radius: 50%;
       font-size: 16px; cursor: pointer;
       display: flex; align-items: center; justify-content: center;
       opacity: 0; visibility: hidden;
       transition: var(--em-transition);
       z-index: 9990;
       box-shadow: 0 4px 12px rgba(0,0,0,0.2);
   }
   #em-back-top.em-visible { opacity: 1; visibility: visible; }
   #em-back-top:hover { background: var(--em-accent,#0070a8); transform: translateY(-3px); }
   
   /* ============================================================
      FASE 4 — Widgets: Products Grid · Slider · List · Flash · Brand · Blog
      ============================================================ */
   
   /* ─────────────────────────────────────────────
      GRID DE PRODUTOS (base para todos os widgets)
      ───────────────────────────────────────────── */
   .em-products-grid {
       display: grid;
       gap: 20px;
   }
   .em-grid-cols-2 { grid-template-columns: repeat(2, 1fr); }
   .em-grid-cols-3 { grid-template-columns: repeat(3, 1fr); }
   .em-grid-cols-4 { grid-template-columns: repeat(4, 1fr); }
   .em-grid-cols-5 { grid-template-columns: repeat(5, 1fr); }
   .em-grid-cols-6 { grid-template-columns: repeat(6, 1fr); }
   
   .em-text-white { color: #fff !important; }
   .em-text-white a { color: #fff; }
   
   /* Skeleton (preview Elementor) */
   .em-card-skeleton { opacity: .5; pointer-events: none; }
   
   /* ─────────────────────────────────────────────
      PRODUCTS GRID — Seções [12][18]
      ───────────────────────────────────────────── */
   .em-prodgrid-wrap { width: 100%; }
   
   /* Load more */
   .em-load-more-wrap { text-align: center; margin-top: 32px; }
   .em-btn-load-more {
       display: inline-flex;
       align-items: center;
       gap: 8px;
       padding: 12px 36px;
       background: var(--em-primary, #0088cc);
       color: #fff;
       border: none;
       border-radius: var(--em-radius, 6px);
       font-size: 14px;
       font-weight: 600;
       cursor: pointer;
       transition: var(--em-transition);
       font-family: var(--em-font-primary);
   }
   .em-btn-load-more:hover { background: var(--em-accent, #0070a8); }
   .em-btn-load-more:disabled { opacity: .6; cursor: wait; }
   
   /* Dark bg override para cards */
   .em-prodgrid-wrap.em-dark-bg .em-product-card { background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.08); }
   .em-prodgrid-wrap.em-dark-bg .em-product-name,
   .em-prodgrid-wrap.em-dark-bg .em-product-name a { color: #fff; }
   .em-prodgrid-wrap.em-dark-bg .em-add-to-cart-btn { background: var(--em-primary, #0088cc); }
   .em-prodgrid-wrap.em-dark-bg .em-add-to-cart-btn:hover { background: var(--em-accent, #0070a8); }
   .em-prodgrid-wrap.em-dark-bg .em-product-image { background: rgba(255,255,255,.05); }
   
   /* ─────────────────────────────────────────────
      PRODUCTS SLIDER — Seções [06][17]
      ───────────────────────────────────────────── */
   .em-prodslider-wrap { width: 100%; }
   .em-prodslider-inner {
       display: grid;
       grid-template-columns: 300px 1fr;
       gap: 24px;
       align-items: start;
   }
   .em-prodslider-featured {
       position: relative;
       border-radius: var(--em-radius, 6px);
       overflow: hidden;
       background: var(--em-primary-bg, #f4f4f4);
   }
   .em-prodslider-featured-img {
       aspect-ratio: 1 / 1;
       overflow: hidden;
   }
   .em-prodslider-featured-img img {
       width: 100%;
       height: 100%;
       object-fit: contain;
       padding: 20px;
       transition: transform .4s ease;
   }
   .em-prodslider-featured:hover .em-prodslider-featured-img img { transform: scale(1.05); }
   .em-prodslider-featured-info { padding: 16px; }
   .em-prodslider-featured-name {
       font-size: 15px;
       font-weight: 700;
       margin: 0 0 8px;
       color: var(--em-dark, #212121);
   }
   .em-dark-bg .em-prodslider-featured-name { color: #fff; }
   .em-prodslider-featured-price .price { font-size: 22px; font-weight: 800; color: var(--em-primary, #0088cc); }
   
   .em-prodslider-list { overflow: hidden; }
   .em-prodslider-list .em-product-card {
       display: flex;
       gap: 12px;
       align-items: center;
       padding: 12px;
       border-radius: var(--em-radius, 6px);
       background: var(--em-primary-bg, #f4f4f4);
       margin-bottom: 12px;
       transition: var(--em-transition);
   }
   .em-prodslider-list .em-product-card:last-child { margin-bottom: 0; }
   .em-prodslider-list .em-product-card:hover { box-shadow: var(--em-shadow-hover); }
   .em-prodslider-list .em-product-image {
       width: 70px;
       height: 70px;
       flex-shrink: 0;
       border-radius: 6px;
       overflow: hidden;
       background: #fff;
       aspect-ratio: unset;
   }
   .em-prodslider-list .em-product-image img { width: 100%; height: 100%; object-fit: contain; padding: 4px; }
   .em-prodslider-list .em-product-info { flex: 1; }
   .em-prodslider-list .em-product-name { font-size: 13px; -webkit-line-clamp: 1; line-clamp: 1; }
   .em-prodslider-list .em-product-price .price { font-size: 15px; }
   .em-prodslider-list .em-add-to-cart-btn { padding: 7px 14px; font-size: 12px; width: auto; }
   
   /* Tabs no slider */
   .em-prodslider-tabs { margin-bottom: 16px; }
   
   /* Dark bg no slider */
   .em-dark-bg .em-prodslider-featured { background: rgba(255,255,255,.06); }
   .em-dark-bg .em-prodslider-list .em-product-card { background: rgba(255,255,255,.06); }
   .em-dark-bg .em-prodslider-list .em-product-image { background: rgba(255,255,255,.04); }
   
   @media (max-width: 900px) {
       .em-prodslider-inner { grid-template-columns: 1fr; }
       .em-prodslider-featured { display: none; }
   }
   
   /* ─────────────────────────────────────────────
      PRODUCTS LIST — Seções [08][14]
      ───────────────────────────────────────────── */
   .em-prodlist-wrap { width: 100%; }
   .em-prodlist-grid {
       display: grid;
       grid-template-columns: repeat(4, 1fr);
       gap: 20px;
   }
   .em-prodlist-item {
       display: flex;
       gap: 12px;
       align-items: flex-start;
       padding: 14px;
       background: var(--em-primary-bg, #f4f4f4);
       border-radius: var(--em-radius, 6px);
       transition: var(--em-transition);
       text-decoration: none;
   }
   .em-prodlist-item:hover { box-shadow: var(--em-shadow-hover); background: #fff; }
   .em-prodlist-img {
       width: 80px;
       height: 80px;
       flex-shrink: 0;
       border-radius: 6px;
       overflow: hidden;
       background: #fff;
   }
   .em-prodlist-img img { width: 100%; height: 100%; object-fit: contain; padding: 4px; }
   .em-prodlist-info { flex: 1; }
   .em-prodlist-cat { font-size: 10px; font-weight: 700; color: var(--em-primary, #0088cc); text-transform: uppercase; letter-spacing: .5px; }
   .em-prodlist-name { font-size: 13px; font-weight: 600; color: var(--em-dark, #212121); margin: 4px 0 6px; line-height: 1.4; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
   .em-prodlist-price .price { font-size: 15px; font-weight: 700; color: var(--em-primary, #0088cc); }
   .em-prodlist-price del { font-size: 11px; color: #999; }
   .em-prodlist-add {
       display: inline-flex;
       align-items: center;
       gap: 5px;
       margin-top: 8px;
       padding: 6px 14px;
       background: var(--em-dark, #212121);
       color: #fff;
       border-radius: var(--em-radius, 6px);
       font-size: 11px;
       font-weight: 600;
       text-decoration: none;
       transition: var(--em-transition);
   }
   .em-prodlist-add:hover { background: var(--em-primary, #0088cc); color: #fff; }
   
   @media (max-width: 1024px) { .em-prodlist-grid { grid-template-columns: repeat(3, 1fr); } }
   @media (max-width: 768px)  { .em-prodlist-grid { grid-template-columns: repeat(2, 1fr); } }
   @media (max-width: 480px)  { .em-prodlist-grid { grid-template-columns: 1fr; } }
   
   /* ─────────────────────────────────────────────
      FLASH PRODUCTS — Seção [17]
      ───────────────────────────────────────────── */
   .em-flash-wrap { width: 100%; }
   .em-flash-header {
       display: flex;
       align-items: center;
       justify-content: space-between;
       flex-wrap: wrap;
       gap: 16px;
       margin-bottom: 28px;
   }
   .em-flash-title-block { display: flex; align-items: center; gap: 12px; }
   .em-flash-icon { font-size: 28px; color: var(--em-primary, #0088cc); animation: em-pulse 1.5s ease-in-out infinite; }
   @keyframes em-pulse { 0%,100%{transform:scale(1)} 50%{transform:scale(1.15)} }
   .em-flash-title { font-size: 24px; font-weight: 800; color: var(--em-dark, #212121); margin: 0; }
   .em-dark-bg .em-flash-title { color: #fff; }
   
   /* Countdown no flash */
   .em-flash-countdown {
       display: flex;
       align-items: center;
       gap: 8px;
   }
   .em-flash-cd-block {
       display: flex;
       flex-direction: column;
       align-items: center;
       background: var(--em-primary, #0088cc);
       color: #fff;
       border-radius: 6px;
       padding: 6px 12px;
       min-width: 48px;
   }
   .em-flash-cd-block strong { font-size: 20px; font-weight: 800; line-height: 1; }
   .em-flash-cd-block small  { font-size: 9px; text-transform: uppercase; letter-spacing: 1px; opacity: .85; }
   .em-flash-cd-sep           { font-size: 18px; font-weight: 700; color: var(--em-primary, #0088cc); }
   .em-dark-bg .em-flash-cd-sep { color: #fff; }
   
   /* Card do flash product */
   .em-flash-card {
       background: #fff;
       border-radius: var(--em-radius, 6px);
       overflow: hidden;
       box-shadow: var(--em-shadow);
       transition: var(--em-transition);
       position: relative;
   }
   .em-flash-card:hover { box-shadow: var(--em-shadow-hover); transform: translateY(-3px); }
   .em-flash-discount-badge {
       position: absolute;
       top: 10px;
       left: 10px;
       background: #dc3545;
       color: #fff;
       font-size: 11px;
       font-weight: 800;
       padding: 3px 8px;
       border-radius: 4px;
       z-index: 2;
   }
   .em-flash-img {
       aspect-ratio: 1;
       overflow: hidden;
       background: var(--em-primary-bg, #f4f4f4);
   }
   .em-flash-img img { width: 100%; height: 100%; object-fit: contain; padding: 10px; transition: transform .4s; }
   .em-flash-card:hover .em-flash-img img { transform: scale(1.07); }
   .em-flash-info { padding: 12px; }
   .em-flash-cat { font-size: 10px; font-weight: 700; color: var(--em-primary, #0088cc); text-transform: uppercase; letter-spacing: .5px; }
   .em-flash-name { font-size: 13px; font-weight: 600; color: var(--em-dark, #212121); margin: 4px 0 8px; line-height: 1.4; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
   .em-flash-name a { color: inherit; text-decoration: none; }
   .em-flash-name a:hover { color: var(--em-primary, #0088cc); }
   .em-flash-price { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; }
   .em-flash-price strong { font-size: 16px; font-weight: 800; color: var(--em-primary, #0088cc); }
   .em-flash-price del { font-size: 12px; color: #999; }
   .em-flash-stock { font-size: 11px; color: #666; margin-bottom: 8px; }
   .em-flash-stock-bar {
       height: 4px;
       background: #e5e5e5;
       border-radius: 2px;
       margin-bottom: 2px;
       overflow: hidden;
   }
   .em-flash-stock-bar-fill { height: 100%; background: var(--em-primary, #0088cc); border-radius: 2px; transition: width .6s ease; }
   .em-flash-add { width: 100%; padding: 9px; background: var(--em-dark, #212121); color: #fff; border: none; border-radius: var(--em-radius, 6px); font-size: 12px; font-weight: 600; cursor: pointer; transition: var(--em-transition); font-family: var(--em-font-primary); display: flex; align-items: center; justify-content: center; gap: 6px; text-decoration: none; }
   .em-flash-add:hover { background: var(--em-primary, #0088cc); color: #fff; }
   
   /* Dark override */
   .em-dark-bg .em-flash-card { background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.08); }
   .em-dark-bg .em-flash-name { color: #fff; }
   .em-dark-bg .em-flash-name a { color: #fff; }
   
   /* ─────────────────────────────────────────────
      BRAND PRODUCTS — Seção [11]
      ───────────────────────────────────────────── */
   .em-brand-wrap { width: 100%; }
  .em-brand-tabs {
      position: relative;
      margin-bottom: 24px;
      gap: 0;
      border: 1px solid rgba(255,255,255,0.12);
      border-radius: var(--em-radius, 6px);
      overflow: hidden;
      background: #242529;
  }
  .em-brand-wrap .em-brand-tabs .em-tab-btn {
      position: relative;
      min-height: 70px;
      padding: 10px 16px;
      border: 0;
      border-right: 1px solid rgba(255,255,255,0.12);
      border-radius: 0;
      background: #242529;
      color: #d4d8de;
      font-size: 13px;
      font-weight: 600;
      line-height: 1.2;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      text-align: center;
      transition: var(--em-transition);
  }
  .em-brand-wrap .em-brand-tabs .em-tab-btn:last-child { border-right: 0; }
  .em-brand-wrap .em-brand-tabs .em-tab-btn::after {
      content: "";
      position: absolute;
      left: 50%;
      bottom: -8px;
      width: 15px;
      height: 15px;
      background: transparent;
      transform: translateX(-50%) rotate(45deg);
      transition: var(--em-transition);
      pointer-events: none;
  }
  .em-brand-wrap .em-brand-tabs .em-tab-btn:hover,
  .em-brand-wrap .em-brand-tabs .em-tab-btn.em-active {
      background: var(--em-primary, #0088cc);
      color: #fff;
  }
  .em-brand-wrap .em-brand-tabs .em-tab-btn.em-active::after {
      background: var(--em-primary, #0088cc);
  }
  .em-brand-wrap .em-brand-tabs .em-tab-btn:focus-visible {
      outline: 2px solid color-mix(in srgb, var(--em-primary,#0088cc) 65%, #fff 35%);
      outline-offset: -2px;
  }
   .em-brand-panel { display: block; }
   .em-brand-panel.em-hidden { display: none; }
  .em-brand-wrap .em-products-grid { align-items: stretch; gap: 0; }
  .em-brand-wrap .em-brand-product-card {
      height: 100%;
      display: flex;
      flex-direction: column;
      padding: 2px;
      outline: 1px solid rgba(255,255,255,0.14);
      outline-offset: -2px;
      border: 0;
      border-radius: 0;
      box-shadow: none;
  }
  .em-brand-wrap .em-brand-product-card .em-product-image {
      aspect-ratio: 1 / 1;
      min-height: 220px;
      border-bottom: 1px solid rgba(255,255,255,0.08);
  }
  .em-brand-wrap .em-brand-product-card .em-product-image img {
      width: 100%;
      height: 100%;
      object-fit: contain;
      padding: 14px;
  }
  .em-brand-wrap .em-brand-product-card .em-product-info {
      display: flex;
      flex-direction: column;
      flex: 1 1 auto;
      padding: 10px;
  }
  .em-brand-wrap .em-brand-product-card .em-product-name {
      min-height: 42px;
      margin-bottom: 8px;
  }
  .em-brand-wrap .em-brand-product-card .em-add-to-cart-btn { margin-top: auto; }
  @media (max-width: 768px) {
      .em-brand-wrap .em-brand-tabs .em-tab-btn {
          min-height: 56px;
          padding: 8px 12px;
          font-size: 12px;
      }
      .em-brand-wrap .em-brand-tabs .em-tab-btn::after {
          width: 12px;
          height: 12px;
          bottom: -7px;
      }
      .em-brand-wrap .em-products-grid { grid-template-columns: repeat(2, 1fr) !important; }
  }
  @media (max-width: 480px) {
      .em-brand-wrap .em-brand-tabs .em-tab-btn { padding: 8px 6px; font-size: 11px; }
      .em-brand-wrap .em-products-grid { grid-template-columns: 1fr !important; }
  }
   .em-no-products { text-align: center; padding: 40px; color: #999; font-size: 14px; }
   
   /* ─────────────────────────────────────────────
      BLOG POSTS — Seção [21]
      ───────────────────────────────────────────── */
   .em-blog-wrap { width: 100%; }
   .em-blog-grid {
       display: grid;
       gap: 24px;
   }
   .em-blog-grid-3 { grid-template-columns: repeat(3, 1fr); }
   .em-blog-grid-2 { grid-template-columns: repeat(2, 1fr); }
   .em-blog-grid-4 { grid-template-columns: repeat(4, 1fr); }
   
   .em-blog-card {
       background: #fff;
       border-radius: var(--em-radius, 6px);
       overflow: hidden;
       box-shadow: var(--em-shadow);
       transition: var(--em-transition);
   }
   .em-blog-card:hover { box-shadow: var(--em-shadow-hover); transform: translateY(-3px); }
   .em-blog-thumb {
       aspect-ratio: 16 / 9;
       overflow: hidden;
       background: var(--em-primary-bg, #f4f4f4);
   }
   .em-blog-thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }
   .em-blog-card:hover .em-blog-thumb img { transform: scale(1.06); }
   .em-blog-body { padding: 20px 22px 18px; }
   .em-blog-meta {
       display: flex;
       align-items: center;
       gap: 12px;
       margin-bottom: 8px;
       font-size: 11px;
       color: #999;
   }
   .em-blog-cat { color: var(--em-primary, #0088cc); font-weight: 600; text-decoration: none; }
   .em-blog-cat:hover { text-decoration: underline; }
   .em-blog-title {
       font-size: 15px;
       font-weight: 700;
       color: var(--em-dark, #212121);
       margin: 0 0 10px;
       line-height: 1.4;
       display: -webkit-box;
       -webkit-line-clamp: 2;
       line-clamp: 2;
       -webkit-box-orient: vertical;
       overflow: hidden;
   }
   .em-blog-title a { color: inherit; text-decoration: none; }
   .em-blog-title a:hover { color: var(--em-primary, #0088cc); }
   .em-blog-excerpt { font-size: 13px; color: #666; line-height: 1.6; margin: 0 0 14px; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
   .em-blog-read-more {
       display: inline-flex;
       align-items: center;
       gap: 6px;
       font-size: 13px;
       font-weight: 600;
       color: var(--em-primary, #0088cc);
       text-decoration: none;
       transition: var(--em-transition);
   }
   .em-blog-read-more:hover { gap: 10px; color: var(--em-accent, #0070a8); }
   .em-blog-read-more i { font-size: 11px; }
   
   @media (max-width: 1024px) {
       .em-blog-grid-4 { grid-template-columns: repeat(3, 1fr); }
       .em-grid-cols-4, .em-grid-cols-5, .em-grid-cols-6 { grid-template-columns: repeat(3, 1fr); }
   }
   @media (max-width: 768px) {
       .em-blog-grid-3, .em-blog-grid-4 { grid-template-columns: repeat(2, 1fr); }
       .em-grid-cols-3, .em-grid-cols-4, .em-grid-cols-5, .em-grid-cols-6 { grid-template-columns: repeat(2, 1fr); }
   }
   @media (max-width: 480px) {
       .em-blog-grid-2, .em-blog-grid-3, .em-blog-grid-4 { grid-template-columns: 1fr; }
       .em-grid-cols-2, .em-grid-cols-3, .em-grid-cols-4, .em-grid-cols-5, .em-grid-cols-6 { grid-template-columns: 1fr; }
   }
   
   /* Back to top */
   #em-back-top {
       position: fixed;
       bottom: 24px;
       right: 24px;
       width: 44px;
       height: 44px;
       border-radius: 50%;
       background: var(--em-primary, #0088cc);
       color: #fff;
       border: none;
       cursor: pointer;
       font-size: 16px;
       display: flex;
       align-items: center;
       justify-content: center;
       box-shadow: 0 4px 16px rgba(0,136,204,.4);
       opacity: 0;
       visibility: hidden;
       transform: translateY(12px);
       transition: all .3s ease;
       z-index: 999;
   }
   #em-back-top.em-visible { opacity: 1; visibility: visible; transform: translateY(0); }
   #em-back-top:hover { background: var(--em-accent, #0070a8); transform: translateY(-2px); }
   
   /* ============================================================
      FASE 5 — Templates WC: Checkout · Cart · Produto · Account
      ============================================================ */
   
   /* ─── Progresso (steps) ─── */
   .em-checkout-hero,
   .em-cart-hero {
       background: var(--em-dark-bg, #1a1a1a);
       padding: 40px 0;
   }
   .em-checkout-progress,
   .em-cart-progress {
       display: flex;
       align-items: center;
       justify-content: center;
       gap: 0;
       margin-bottom: 20px;
   }
   .em-cp-step {
       display: flex;
       flex-direction: column;
       align-items: center;
       gap: 6px;
       position: relative;
   }
   .em-cp-icon {
       width: 40px;
       height: 40px;
       border-radius: 50%;
       background: rgba(255,255,255,.1);
       border: 2px solid rgba(255,255,255,.2);
       display: flex;
       align-items: center;
       justify-content: center;
       font-size: 16px;
       color: rgba(255,255,255,.4);
       transition: var(--em-transition);
   }
   .em-cp-label {
       font-size: 11px;
       color: rgba(255,255,255,.4);
       font-weight: 600;
       white-space: nowrap;
   }
   .em-cp-step.em-cp-active .em-cp-icon { background: var(--em-primary, #0088cc); border-color: var(--em-primary, #0088cc); color: #fff; }
   .em-cp-step.em-cp-active .em-cp-label { color: #fff; }
   .em-cp-step.em-cp-done .em-cp-icon { background: #28a745; border-color: #28a745; color: #fff; }
   .em-cp-step.em-cp-done .em-label { color: rgba(255,255,255,.7); }
   .em-cp-line {
       width: 80px;
       height: 2px;
       background: rgba(255,255,255,.1);
       margin: 0 8px;
       margin-bottom: 20px;
   }
   .em-cp-line-done { background: #28a745; }
   
   .em-checkout-title,
   .em-cart-page-title {
       text-align: center;
       color: #fff;
       font-size: 32px;
       font-weight: 800;
       margin: 0;
       display: flex;
       align-items: center;
       justify-content: center;
       gap: 10px;
   }
   .em-checkout-title i { color: var(--em-primary, #0088cc); }
   .em-checkout-subtitle {
       text-align: center;
       color: rgba(255,255,255,.5);
       font-size: 13px;
       margin: 8px 0 0;
   }
   .em-cart-count-badge {
       background: var(--em-primary, #0088cc);
       color: #fff;
       font-size: 13px;
       padding: 3px 12px;
       border-radius: 50px;
       font-weight: 600;
   }
   
   /* ─── CHECKOUT ─── */
   .em-checkout-wrap { padding: 40px 0 80px; }
   .em-checkout-grid {
       display: grid;
       grid-template-columns: 1fr 400px;
       gap: 32px;
       align-items: start;
   }
   .em-checkout-block {
       background: #fff;
       border-radius: 12px;
       box-shadow: var(--em-shadow);
       margin-bottom: 24px;
       overflow: hidden;
   }
   .em-checkout-block-header {
       display: flex;
       align-items: center;
       gap: 10px;
       padding: 16px 20px;
       background: var(--em-dark-bg, #1a1a1a);
       color: #fff;
   }
   .em-checkout-block-header i { color: var(--em-primary, #0088cc); }
   .em-checkout-block-header h2 { margin: 0; font-size: 16px; font-weight: 700; flex: 1; }
   .em-checkout-block-body { padding: 24px 20px; }
   
   /* Editar link no resumo */
   .em-edit-cart {
       font-size: 12px;
       color: var(--em-primary, #0088cc);
       text-decoration: none;
       margin-left: auto;
       display: flex;
       align-items: center;
       gap: 4px;
   }
   .em-edit-cart:hover { text-decoration: underline; }
   
   .em-order-review-wrap { padding: 0 20px 20px; }
   
   /* CPF */
   .em-cpf-field .input-text,
   .em-cpf-input {
       border: 1px solid #ddd;
       border-radius: 6px;
       padding: 10px 14px;
       font-size: 14px;
       width: 100%;
       font-family: var(--em-font-primary);
       transition: border-color .2s;
   }
   .em-cpf-input:focus { outline: none; border-color: var(--em-primary, #0088cc); box-shadow: 0 0 0 3px rgba(0,136,204,.1); }
   
   /* Trust badges no checkout */
   .em-checkout-trust {
       background: #fff;
       border-radius: 12px;
       padding: 16px;
       box-shadow: var(--em-shadow);
       display: flex;
       flex-wrap: wrap;
       gap: 10px;
       margin-bottom: 16px;
   }
   .em-trust-badge-item {
       display: flex;
       align-items: center;
       gap: 8px;
       font-size: 12px;
       color: #555;
       font-weight: 500;
       flex: 1;
       min-width: 120px;
   }
   .em-trust-badge-item i { color: var(--em-primary, #0088cc); font-size: 16px; }
   
   /* Ícones de pagamento */
   .em-checkout-payment-icons,
   .em-cart-payment-icons,
   .em-product-payment-row {
       display: flex;
       align-items: center;
       gap: 10px;
       padding: 12px 0;
       font-size: 12px;
       color: #999;
   }
   .em-checkout-payment-icons i,
   .em-cart-payment-icons i { font-size: 24px; color: #555; }
   .em-product-payment-row { font-size: 13px; color: #666; margin: 8px 0; }
   .em-product-payment-row i { font-size: 22px; color: #444; }
   .em-product-payment-row span { font-weight: 600; }
   
   @media (max-width: 900px) {
       .em-checkout-grid { grid-template-columns: 1fr; }
       .em-checkout-right { order: -1; }
   }
   
   /* ─── CARRINHO ─── */
   .em-cart-page-wrap { padding: 40px 0 80px; background: var(--em-primary-bg, #f4f4f4); }
   .em-cart-layout {
       display: grid;
       grid-template-columns: 1fr 360px;
       gap: 32px;
       align-items: start;
   }
   /* Tabela do carrinho */
   .em-cart-table {
       width: 100%;
       border-collapse: collapse;
       background: #fff;
       border-radius: 12px;
       overflow: hidden;
       box-shadow: var(--em-shadow);
   }
   .em-cart-table thead tr { background: var(--em-dark-bg, #1a1a1a); }
   .em-cart-table thead th { padding: 14px 16px; color: #fff; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .5px; }
   .em-cart-table tbody tr { border-bottom: 1px solid #f0f0f0; }
   .em-cart-table tbody tr:last-child { border-bottom: none; }
   .em-cart-table td { padding: 16px; vertical-align: middle; }
   
   .em-cart-td-img { width: 90px; }
   .em-cart-item-thumb { width: 70px; height: 70px; border-radius: 8px; overflow: hidden; background: var(--em-primary-bg, #f4f4f4); }
   .em-cart-item-thumb img { width: 100%; height: 100%; object-fit: contain; padding: 4px; }
   
   .em-cart-item-name { font-size: 14px; font-weight: 600; color: var(--em-dark, #212121); text-decoration: none; }
   .em-cart-item-name:hover { color: var(--em-primary, #0088cc); }
   .em-cart-sku { display: block; font-size: 11px; color: #999; margin-top: 4px; }
   
   .em-cart-td-price .price,
   .em-cart-td-total .price { color: var(--em-primary, #0088cc); font-weight: 700; font-size: 15px; }
   
   .em-cart-remove-btn {
       display: flex;
       align-items: center;
       justify-content: center;
       width: 28px;
       height: 28px;
       border-radius: 50%;
       background: #fef2f2;
       color: #dc3545;
       text-decoration: none;
       font-size: 13px;
       transition: var(--em-transition);
   }
   .em-cart-remove-btn:hover { background: #dc3545; color: #fff; }
   
   /* Ações do carrinho (cupom + atualizar) */
   .em-cart-actions-row td { background: #fafafa; }
   .em-coupon-wrap { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
   .em-coupon-input { border: 1px solid #ddd; border-radius: 6px; padding: 9px 14px; font-size: 13px; min-width: 180px; }
   .em-coupon-btn, .em-update-cart { padding: 9px 18px; font-size: 13px; }
   .em-update-cart { margin-left: auto; }
   
   .em-continue-shopping { margin-top: 16px; }
   
   /* Colateral (totais) */
   .em-cart-collaterals .cart_totals { background: #fff; border-radius: 12px; padding: 20px; box-shadow: var(--em-shadow); }
   .em-cart-trust-badges { background: #fff; border-radius: 12px; padding: 16px; box-shadow: var(--em-shadow); margin-top: 16px; display: flex; flex-direction: column; gap: 10px; }
   .em-cart-payment-icons { background: #fff; border-radius: 12px; padding: 14px 16px; box-shadow: var(--em-shadow); margin-top: 12px; }
   
   @media (max-width: 900px) {
       .em-cart-layout { grid-template-columns: 1fr; }
       .em-cart-table thead { display: none; }
       .em-cart-table td { display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid #f9f9f9; padding: 12px 15px; }
       .em-cart-table td:last-child { border-bottom: none; }
       .em-cart-table td::before { content: attr(data-title); font-weight: 700; font-size: 12px; color: #666; }
       .em-cart-td-img { width: 100%; justify-content: center !important; }
       .em-cart-item-name { font-size: 13px; }
   }
   @media (max-width: 480px) {
       .em-coupon-wrap { flex-direction: column; align-items: stretch; }
       .em-coupon-input { width: 100%; }
       .em-cart-td-price, .em-cart-td-total { font-size: 13px; }
   }
   
   /* ─── PRODUTO INDIVIDUAL ─── */
   .em-product-breadcrumb-bar { background: var(--em-primary-bg, #f4f4f4); padding: 12px 0; border-bottom: 1px solid #e5e5e5; }
   .em-single-product-wrap { padding: 40px 0 80px; }
   
   .em-product-main-section {
       display: grid;
       grid-template-columns: 1fr 1fr;
       gap: 48px;
       margin-bottom: 60px;
   }
   .em-product-gallery-col .woocommerce-product-gallery { position: relative; }
   
   /* Info do produto */
   .em-product-summary .price { font-size: 32px; font-weight: 800; color: var(--em-primary, #0088cc); }
   .em-product-summary del .amount { font-size: 18px; color: #999; }
   
   /* Estoque info */
   .em-product-stock-info { margin: 12px 0; }
   .em-product-stock-text { font-size: 13px; color: #555; font-weight: 500; margin-bottom: 6px; }
   
   /* Tabs */
   .em-product-tabs-section { margin-bottom: 60px; }
   .em-product-tabs-section .woocommerce-tabs .tabs { display: flex; gap: 0; border-bottom: 2px solid #e5e5e5; list-style: none; padding: 0; margin: 0 0 24px; }
   .em-product-tabs-section .woocommerce-tabs .tabs li { margin: 0; }
   .em-product-tabs-section .woocommerce-tabs .tabs li a { display: block; padding: 12px 24px; font-weight: 600; font-size: 14px; color: #666; border-bottom: 3px solid transparent; margin-bottom: -2px; text-decoration: none; transition: var(--em-transition); }
   .em-product-tabs-section .woocommerce-tabs .tabs li.active a { color: var(--em-primary, #0088cc); border-bottom-color: var(--em-primary, #0088cc); }
   .em-product-tabs-section .woocommerce-tabs .tabs li a:hover { color: var(--em-primary, #0088cc); }
   
   /* Trust badges produto */
   .em-product-trust-badges { display: flex; flex-wrap: wrap; gap: 10px; margin: 16px 0; padding: 14px; background: var(--em-primary-bg, #f4f4f4); border-radius: 10px; }
   
   /* Sticky ATC */
   .em-sticky-atc {
       position: fixed;
       bottom: -100px;
       left: 0;
       right: 0;
       z-index: 9990;
       background: var(--em-dark-bg, #1a1a1a);
       border-top: 2px solid var(--em-primary, #0088cc);
       padding: 12px 0;
       transition: bottom .3s cubic-bezier(.25,.46,.45,.94);
       box-shadow: 0 -4px 20px rgba(0,0,0,.3);
   }
   .em-sticky-atc.em-visible { bottom: 0; }
   .em-sticky-atc-inner { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
   .em-sticky-atc-product { display: flex; align-items: center; gap: 12px; }
   .em-sticky-atc-product img { width: 44px; height: 44px; border-radius: 6px; object-fit: contain; background: rgba(255,255,255,.08); }
   .em-sticky-atc-name { color: #fff; font-size: 14px; font-weight: 600; display: block; }
   .em-sticky-atc-price .price { color: var(--em-primary, #0088cc); font-size: 16px; font-weight: 800; }
   .em-sticky-atc-btn { padding: 11px 28px; white-space: nowrap; }
   
   @media (max-width: 900px) {
       .em-product-main-section { grid-template-columns: 1fr; gap: 30px; }
       .em-sticky-atc-product { display: none; }
       .em-product-summary .price { font-size: 24px; }
       .em-product-tabs-section .woocommerce-tabs .tabs { flex-wrap: wrap; }
       .em-product-tabs-section .woocommerce-tabs .tabs li a { padding: 10px 15px; font-size: 13px; }
   }
   
   /* ─── MY ACCOUNT ─── */
   .em-account-hero { background: var(--em-dark-bg, #1a1a1a); padding: 40px 0; }
   .em-account-title { color: #fff; font-size: 28px; font-weight: 800; margin: 0; display: flex; align-items: center; gap: 10px; }
   .em-account-title i { color: var(--em-primary, #0088cc); }
   
   .em-account-wrap { padding: 40px 0 80px; background: var(--em-primary-bg, #f4f4f4); }
   .em-account-layout { display: grid; grid-template-columns: 260px 1fr; gap: 32px; align-items: start; }
   
   .em-account-sidebar { position: sticky; top: 20px; }
   
   @media (max-width: 768px) {
       .em-account-layout { grid-template-columns: 1fr; }
       .em-account-sidebar { position: static; margin-bottom: 24px; }
   }
   
   .em-account-nav { background: #fff; border-radius: 12px; overflow: hidden; box-shadow: var(--em-shadow); }
   .em-account-nav-item {
       display: flex;
       align-items: center;
       gap: 12px;
       padding: 14px 18px;
       text-decoration: none;
       color: #555;
       font-size: 14px;
       font-weight: 500;
       border-bottom: 1px solid #f0f0f0;
       transition: var(--em-transition);
   }
   .em-account-nav-item:last-child { border-bottom: none; }
   .em-account-nav-item i:first-child { color: var(--em-primary, #0088cc); font-size: 16px; width: 20px; text-align: center; }
   .em-account-nav-item span { flex: 1; }
   .em-account-nav-arrow { font-size: 11px; color: #ddd; }
   .em-account-nav-item:hover, .em-account-nav-item.em-active { background: var(--em-primary, #0088cc); color: #fff; }
   .em-account-nav-item:hover i, .em-account-nav-item.em-active i { color: #fff !important; }
   .em-account-logout { color: #dc3545 !important; }
   .em-account-logout i:first-child { color: #dc3545 !important; }
   .em-account-logout:hover { background: #dc3545 !important; color: #fff !important; }
   
   .em-account-support { background: #fff; border-radius: 12px; padding: 16px; box-shadow: var(--em-shadow); margin-top: 16px; text-align: center; }
   .em-account-support p { font-size: 13px; color: #666; margin: 0 0 6px; }
   .em-account-support a { color: var(--em-primary, #0088cc); font-weight: 700; text-decoration: none; }
   
   .em-account-content { background: #fff; border-radius: 12px; padding: 28px; box-shadow: var(--em-shadow); min-height: 400px; }
   
   @media (max-width: 900px) {
       .em-account-layout { grid-template-columns: 1fr; }
       .em-account-sidebar { position: static; }
   }
   
   /* ─── THANK YOU (confirmação) ─── */
   .em-thankyou-banner {
       text-align: center;
       padding: 40px 20px;
       background: linear-gradient(135deg, var(--em-primary, #0088cc), var(--em-accent, #0070a8));
       color: #fff;
       border-radius: 12px;
       margin-bottom: 32px;
   }
   .em-thankyou-icon { font-size: 56px; margin-bottom: 12px; animation: em-bounce-in .5s ease; }
   @keyframes em-bounce-in { 0%{transform:scale(0)} 70%{transform:scale(1.1)} 100%{transform:scale(1)} }
   .em-thankyou-banner h2 { font-size: 28px; font-weight: 800; margin: 0 0 8px; }
   .em-thankyou-banner p  { font-size: 16px; margin: 0; opacity: .9; }
   
   /* ─── Ajustes globais WooCommerce com design ElectroMart ─── */
   .woocommerce-breadcrumb { font-size: 13px; color: #888; }
   .woocommerce-breadcrumb a { color: var(--em-primary, #0088cc); text-decoration: none; }
   .woocommerce-breadcrumb a:hover { text-decoration: underline; }
   
   /* Botões WC → estilo ElectroMart */
   .woocommerce a.button,
   .woocommerce button.button,
   .woocommerce input.button,
   .woocommerce #respond input#submit {
       background: var(--em-primary, #0088cc);
       color: #fff;
       border-radius: var(--em-radius, 6px);
       font-family: var(--em-font-primary);
       font-weight: 600;
       transition: var(--em-transition);
   }
   .woocommerce a.button:hover,
   .woocommerce button.button:hover,
   .woocommerce input.button:hover,
   .woocommerce #respond input#submit:hover {
       background: var(--em-accent, #0070a8);
       color: #fff;
   }
   .woocommerce a.button.alt,
   .woocommerce button.button.alt { background: var(--em-dark, #212121); }
   .woocommerce a.button.alt:hover,
   .woocommerce button.button.alt:hover { background: var(--em-primary, #0088cc); }
   
   /* Notices WC */
   .woocommerce-message,
   .woocommerce-info { border-top-color: var(--em-primary, #0088cc); }
   .woocommerce-message::before,
   .woocommerce-info::before { color: var(--em-primary, #0088cc); }
   
   /* Campos do checkout WC */
   .woocommerce-checkout .input-text,
   .woocommerce-checkout select,
   .woocommerce-checkout textarea {
       border-radius: var(--em-radius, 6px) !important;
       border-color: #ddd !important;
       font-family: var(--em-font-primary) !important;
   }
   .woocommerce-checkout .input-text:focus,
   .woocommerce-checkout select:focus {
       border-color: var(--em-primary, #0088cc) !important;
       box-shadow: 0 0 0 3px rgba(0,136,204,.1) !important;
   }
   
   /* Place order button */
   #place_order {
       width: 100%;
       padding: 16px !important;
       font-size: 16px !important;
       background: var(--em-primary, #0088cc) !important;
       border-radius: 50px !important;
       letter-spacing: .3px;
   }
   #place_order:hover { background: var(--em-accent, #0070a8) !important; }
   
   /* ============================================================
      FASE 6 — Loop de produto · Quick View · Shop page override
      ============================================================ */
   
   /* ─── Badges adicionais ─── */
   .em-badge-featured {
       background: #7b2ff7;
       color: #fff;
       font-size: 11px;
       font-weight: 700;
       padding: 2px 8px;
       border-radius: 3px;
       text-transform: uppercase;
   }
   .em-badge-outofstock {
       background: #999;
       color: #fff;
       font-size: 11px;
       font-weight: 700;
       padding: 2px 8px;
       border-radius: 3px;
       text-transform: uppercase;
   }
   .em-out-of-stock-label {
       display: flex;
       align-items: center;
       gap: 6px;
       font-size: 13px;
       color: #999;
       padding: 9px 0;
   }
   .em-out-of-stock-label i { color: #dc3545; }
   
   /* ─── Shop page (página /loja nativa do WC) ─── */
   .woocommerce ul.products,
   .woocommerce-page ul.products {
       display: grid !important;
       grid-template-columns: repeat(var(--em-shop-cols, 4), 1fr) !important;
       gap: 20px !important;
       list-style: none !important;
       padding: 0 !important;
       margin: 0 !important;
   }
   .woocommerce ul.products.columns-2 { --em-shop-cols: 2; }
   .woocommerce ul.products.columns-3 { --em-shop-cols: 3; }
   .woocommerce ul.products.columns-4 { --em-shop-cols: 4; }
   .woocommerce ul.products.columns-5 { --em-shop-cols: 5; }
   
   /* Sobrescrever estilos padrão do WC nos cards da loja */
   .woocommerce ul.products li.em-product-card,
   .woocommerce-page ul.products li.em-product-card {
       background: #fff;
       border-radius: var(--em-radius, 6px);
       overflow: hidden;
       box-shadow: var(--em-shadow);
       transition: var(--em-transition);
       padding: 0 !important;
       margin: 0 !important;
       float: none !important;
       width: auto !important;
       text-align: left;
   }
   .woocommerce ul.products li.em-product-card:hover { box-shadow: var(--em-shadow-hover); transform: translateY(-3px); }
   
   /* Imagem no loop */
   .woocommerce ul.products li.em-product-card .em-product-img-link img,
   .woocommerce ul.products li.em-loop-product .em-product-img-link img {
       width: 100%;
       height: 220px;
       object-fit: contain;
       padding: 12px;
       background: var(--em-primary-bg, #f4f4f4);
   }
   
   /* Remover thumbnail padrão WC que pode conflitar */
   .woocommerce ul.products li.em-product-card .woocommerce-loop-product__link img { display: none; }
   
  /* Oculta título apenas nos cards custom do plugin */
  .woocommerce ul.products li.em-product-card .woocommerce-loop-product__title,
  .woocommerce ul.products li.em-loop-product .woocommerce-loop-product__title { display: none; }
   
  /* Oculta preço apenas nos cards custom do plugin */
  .woocommerce ul.products li.em-product-card .price,
  .woocommerce ul.products li.em-loop-product .price { display: none; }
   
   /* Responsivo da loja */
   @media (max-width: 1024px) {
       .woocommerce ul.products { --em-shop-cols: 3 !important; }
   }
   @media (max-width: 768px) {
       .woocommerce ul.products { --em-shop-cols: 2 !important; }
   }
   @media (max-width: 480px) {
       .woocommerce ul.products { --em-shop-cols: 1 !important; }
   }
   
   /* ─── Quick View modal (estrutura base) ─── */
   .em-qv-overlay {
       position: fixed;
       inset: 0;
       background: rgba(0,0,0,.6);
       z-index: 99997;
       display: flex;
       align-items: center;
       justify-content: center;
       opacity: 0;
       visibility: hidden;
       transition: all .3s ease;
   }
   .em-qv-overlay.em-active { opacity: 1; visibility: visible; }
   .em-qv-modal {
       background: #fff;
       border-radius: 12px;
       width: 90%;
       max-width: 860px;
       max-height: 90vh;
       overflow-y: auto;
       padding: 32px;
       position: relative;
       transform: translateY(20px);
       transition: transform .3s ease;
   }
   .em-qv-overlay.em-active .em-qv-modal { transform: translateY(0); }
   .em-qv-close {
       position: absolute;
       top: 14px;
       right: 14px;
       width: 32px;
       height: 32px;
       border-radius: 50%;
       background: #f4f4f4;
       border: none;
       cursor: pointer;
       display: flex;
       align-items: center;
       justify-content: center;
       font-size: 14px;
       color: #555;
       transition: var(--em-transition);
   }
   .em-qv-close:hover { background: var(--em-primary, #0088cc); color: #fff; }
   .em-qv-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; }
   .em-qv-img img { width: 100%; border-radius: 8px; object-fit: contain; background: var(--em-primary-bg, #f4f4f4); padding: 16px; }
   .em-qv-info .em-product-name { font-size: 22px; font-weight: 800; margin-bottom: 12px; }
   .em-qv-loading { text-align: center; padding: 40px; }
   @media (max-width: 680px) {
       .em-qv-grid { grid-template-columns: 1fr; }
       .em-qv-modal { padding: 20px; }
   }
   
   /* ─── Paginação WC ─── */
   .woocommerce nav.woocommerce-pagination ul {
       display: flex;
       gap: 6px;
       list-style: none;
       padding: 0;
       margin: 32px 0 0;
       justify-content: center;
   }
   .woocommerce nav.woocommerce-pagination ul li a,
   .woocommerce nav.woocommerce-pagination ul li span {
       display: flex;
       align-items: center;
       justify-content: center;
       width: 38px;
       height: 38px;
       border-radius: var(--em-radius, 6px);
       border: 1px solid #ddd;
       font-size: 14px;
       font-weight: 600;
       color: var(--em-dark, #212121);
       text-decoration: none;
       transition: var(--em-transition);
   }
   .woocommerce nav.woocommerce-pagination ul li a:hover { background: var(--em-primary, #0088cc); border-color: var(--em-primary, #0088cc); color: #fff; }
   .woocommerce nav.woocommerce-pagination ul li span.current { background: var(--em-primary, #0088cc); border-color: var(--em-primary, #0088cc); color: #fff; }
   
   /* ─── Resultado de busca / filtros ─── */
   .woocommerce-result-count { font-size: 13px; color: #888; }
   .woocommerce-ordering select {
       border: 1px solid #ddd;
       border-radius: var(--em-radius, 6px);
       padding: 8px 14px;
       font-size: 13px;
       font-family: var(--em-font-primary);
   }
   
   /* ─── Notices do WC ─── */
   .woocommerce-error,
   .woocommerce-message,
   .woocommerce-info {
       border-radius: var(--em-radius, 6px);
       font-family: var(--em-font-primary);
   }

/* ============================================================
   STAGE 2 - PRODUCT CARD FIDELITY (Electromix real structure)
   ============================================================ */
.em-product-card .em-product-single {
    display: flex;
    flex-direction: column;
    min-height: 100%;
    background: inherit;
}

.em-product-card .em-product-image {
    position: relative;
    aspect-ratio: 1 / 1;
    background: var(--em-primary-bg, #f4f4f4);
    border-bottom: 1px solid rgba(0, 0, 0, 0.12);
}

.em-dark-section .em-product-card .em-product-image,
.em-card-dark .em-product-image {
    border-bottom-color: rgba(255, 255, 255, 0.12);
}

.em-product-card .em-product-content-outer {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
}

.em-product-card .em-product-info {
    padding: 12px 12px 8px;
    flex: 1;
}

.em-product-card .em-product-action {
    border-top: 1px solid rgba(0, 0, 0, 0.12);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 8px;
    padding: 10px 12px;
}

.em-dark-section .em-product-card .em-product-action,
.em-card-dark .em-product-action {
    border-top-color: rgba(255, 255, 255, 0.12);
}

.em-product-card .em-product-action .home-single-fields {
    display: flex;
    align-items: center;
}

.em-product-card .em-product-action .em-add-to-cart-btn {
    width: auto;
    min-height: 36px;
    padding: 8px 14px;
}

.em-product-card .em-product-action .em-product-action-btn {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    border: 1px solid rgba(0, 0, 0, 0.14);
    background: #fff;
}

.em-dark-section .em-product-card .em-product-action .em-product-action-btn,
.em-card-dark .em-product-action .em-product-action-btn {
    border-color: rgba(255, 255, 255, 0.2);
    background: rgba(255, 255, 255, 0.04);
    color: #fff;
}

/* List card variant: product-single grid 40/60 */
.em-product-card--list .em-product-single {
    display: grid;
    grid-template-columns: 40% 60%;
    min-height: 100%;
}

.em-product-card--list .em-product-image {
    aspect-ratio: auto;
    min-height: 145px;
    border-bottom: 0;
    border-right: 1px solid rgba(0, 0, 0, 0.12);
    display: flex;
    align-items: center;
    justify-content: center;
}

.em-dark-section .em-product-card--list .em-product-image,
.em-card-dark.em-product-card--list .em-product-image {
    border-right-color: rgba(255, 255, 255, 0.12);
}

.em-product-card--list .em-product-image img {
    max-height: 175px;
    object-fit: contain;
}

.em-product-card--list .em-product-info {
    padding: 10px 12px 6px;
}

.em-product-card--list .em-product-name {
    font-size: 14px;
    margin-bottom: 6px;
}

.em-product-card--list .em-product-action {
    justify-content: center;
    padding: 8px 10px;
}

/* Featured product: vertical thumbnail gallery */
.em-ps-featured-media {
    display: flex;
    align-items: stretch;
    gap: 10px;
}

.em-ps-featured-media .em-ps-featured-img {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 320px;
}

.em-ps-featured-thumbs-wrap {
    width: 78px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 8px 0;
}

.em-ps-featured-thumbs {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.em-ps-thumb-btn {
    width: 100%;
    height: 64px;
    border: 1px solid rgba(0, 0, 0, 0.12);
    background: #fff;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 6px;
    cursor: pointer;
}

.em-ps-thumb-btn img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.em-ps-thumb-btn.is-active {
    border-color: var(--em-primary, #0088cc);
}

.em-ps-thumbs-arrow {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    border: 1px solid rgba(0, 0, 0, 0.2);
    background: #fff;
    color: var(--em-dark, #212121);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.em-ps-thumbs-arrow:hover {
    background: var(--em-primary, #0088cc);
    border-color: var(--em-primary, #0088cc);
    color: #fff;
}

/* 3-column mode */
.em-ps-3col-layout {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}

.em-ps-3col-item {
    border: 1px solid rgba(0, 0, 0, 0.12);
    border-radius: var(--em-radius, 6px);
    background: #fff;
    padding: 12px;
    min-height: 430px;
    display: flex;
    flex-direction: column;
}

.em-dark-section .em-ps-3col-item,
.em-card-dark.em-ps-3col-item {
    border-color: rgba(255, 255, 255, 0.12);
}

.em-ps-3col-header {
    margin-bottom: 10px;
}

.em-ps-3col-title {
    display: flex;
    align-items: center;
    gap: 8px;
}

.em-ps-3col-title h3 {
    margin: 0;
    font-size: 16px;
    line-height: 1.3;
}

.em-ps-3col-slider-wrap {
    display: flex;
    flex-direction: column;
    gap: 8px;
    flex: 1;
    min-height: 0;
}

.em-ps-3col-slider {
    overflow: hidden;
}

.em-ps-3col-slide {
    padding-bottom: 10px;
}

.em-ps-3col-arrow {
    width: 30px;
    height: 30px;
    align-self: center;
    border-radius: 50%;
    border: 1px solid rgba(0, 0, 0, 0.2);
    background: #fff;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}

.em-ps-3col-arrow:hover {
    border-color: var(--em-primary, #0088cc);
    background: var(--em-primary, #0088cc);
    color: #fff;
}

/* Keep list cards compact inside section [06] and 3-col mode */
.em-ps-list-item.em-product-card,
.em-ps-3col-slide .em-product-card {
    box-shadow: none;
    border: 1px solid rgba(0, 0, 0, 0.08);
}

.em-dark-section .em-ps-list-item.em-product-card,
.em-dark-section .em-ps-3col-slide .em-product-card {
    border-color: rgba(255, 255, 255, 0.12);
}

@media (max-width: 1024px) {
    .em-ps-3col-layout { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 900px) {
    .em-ps-featured-media { flex-direction: column; }
    .em-ps-featured-thumbs-wrap {
        width: 100%;
        flex-direction: row;
        justify-content: center;
    }
    .em-ps-featured-thumbs { flex-direction: row; }
}

@media (max-width: 768px) {
    .em-product-card--list .em-product-single { grid-template-columns: 1fr; }
    .em-product-card--list .em-product-image {
        border-right: 0;
        border-bottom: 1px solid rgba(0, 0, 0, 0.12);
        min-height: 120px;
    }
    .em-ps-3col-layout { grid-template-columns: 1fr; }
}

/* ============================================================
   STAGE 5 - FINAL POLISH / RESPONSIVE
   ============================================================ */

/* Flash heading-default: countdown in the same heading container */
.em-flash-heading-default {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    flex-wrap: wrap;
    margin-bottom: 24px;
    position: relative;
    padding-right: 102px;
}

.em-flash-heading-default .em-title-container {
    margin: 0;
}

.em-flash-heading-timer {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    min-width: 0;
    flex: 1 1 auto;
    justify-content: flex-end;
}

.em-flash-heading-timer .em-countdown {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
}

/* Flash carousel nav: ancora no canto direito sem invadir countdown */
.em-flash-wrap .em-flash-carousel.owl-carousel .owl-nav {
    position: absolute;
    right: 0;
    top: -66px;
    display: flex;
    gap: 8px;
}
.em-flash-wrap .em-flash-carousel .owl-prev,
.em-flash-wrap .em-flash-carousel .owl-next {
    top: auto;
}

/* Hero layout with side mini banners */
.em-hero-layout-row {
    display: grid;
    grid-template-columns: var(--em-hero-main-width, minmax(0, 1.75fr)) var(--em-hero-side-width, minmax(300px, 1fr));
    gap: 0px;
    align-items: stretch;
    /* ─── Espaçamento (Agora controlado via Widget Elementor) ─── */
    /* padding-top: 20px; */
    /* padding-left: 30px; */
    /* padding-right: 30px; */
}

/* Reservar espaço para o Owl Carousel antes de inicializar (evita CLS/empurrão no primeiro paint)
   O Owl padrão aplica `display:none` em `.owl-carousel` até adicionar `owl-loaded`.
   Aqui forçamos `display:block` e escondemos visualmente (visibility) até ficar pronto. */
.em-hero-layout-main .em-hero-carousel.owl-carousel:not(.owl-loaded) {
    display: block !important;
    visibility: hidden;
}

.em-hero-layout-main .em-hero-carousel.owl-carousel.owl-loaded {
    visibility: visible;
}

.em-hero-layout-row.em-hero-layout-row--solo {
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
}

.em-hero-layout-row > .col-lg-8,
.em-hero-layout-row > .col-lg-4,
.em-hero-layout-row > .col-lg-12 {
    width: auto;
    max-width: none;
    padding: 0;
    min-width: 0;
}

.em-hero-layout-main {
    min-width: 0;
    position: relative;
}

.em-hero-layout-main .em-hero-carousel {
    border-radius: 12px;
    overflow: hidden;
}

.em-hero-layout-main .em-hero-carousel .owl-stage-outer,
.em-hero-layout-main .em-hero-carousel .owl-stage,
.em-hero-layout-main .em-hero-carousel .owl-item {
    overflow: hidden;
}

.em-hero-layout-main .em-hero-slide {
    position: relative;
    display: flex;
    align-items: center;
    overflow: hidden;
}

.em-hero-layout-main .owl-nav {
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    transform: translateY(-50%);
    display: flex;
    justify-content: space-between;
    pointer-events: none;
    padding: 0 10px;
    z-index: 10;
}

.em-hero-layout-main .owl-prev,
.em-hero-layout-main .owl-next {
    pointer-events: all;
    width: 30px !important;
    height: 30px !important;
    border-radius: 50% !important;
    background: rgba(255,255,255,0.15) !important;
    border: 1px solid rgba(255,255,255,0.35) !important;
    color: #fff !important;
    font-size: 12px !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    transition: background .2s !important;
    flex-shrink: 0;
}
.em-hero-layout-main .owl-prev:hover,
.em-hero-layout-main .owl-next:hover {
    background: var(--em-primary, #0088cc) !important;
    border-color: var(--em-primary, #0088cc) !important;
}

.em-hero-layout-main .owl-dots {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 10px;
}

.em-hero-slide-inner {
    display: flex;
    justify-content: space-between;
    width: 100%;
    box-sizing: border-box;
    gap: clamp(18px, 3vw, 40px);
    /* Respiro consistente no desktop, sem encostar conteúdo nas bordas. */
    padding: clamp(36px, 4.6vw, 52px) clamp(40px, 5vw, 56px);
    height: 100%;
    align-items: center;
}

/* Stage 2: normalização do conteúdo interno do hero */
.em-hero-content {
    flex: 1 1 0;
    min-width: 0;
    max-width: none;
    overflow: hidden;
    padding-right: 8px;
}

.em-slide-title {
    line-height: 1.15;
    max-height: calc(1.15em * 2);
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    line-clamp: 2;
}

.em-slide-subtitle {
    line-height: 1.6;
    max-height: calc(1.6em * 3);
    max-width: 100%;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    line-clamp: 3;
}

.em-hero-image {
    flex: 0 0 36%;
    width: 36%;
    min-width: 220px;
    max-width: 360px;
    height: 260px;
    max-height: 260px;
    margin-left: auto;
    min-height: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.em-hero-image img {
    width: 100%;
    height: 100%;
    max-width: none;
    max-height: none;
    object-fit: contain;
    object-position: center;
    filter: none;
    animation: em-float 4.2s ease-in-out infinite;
    will-change: transform;
}

.em-slide-features {
    margin: 0 0 20px;
    padding: 0;
    list-style: none;
    display: grid;
    gap: 8px;
}

.em-slide-features li {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    font-size: 13px;
    line-height: 1.4;
}

.em-slide-features i {
    margin-top: 1px;
    color: var(--em-primary, #0088cc);
}

.em-hero-layout-side {
    min-width: 0;
    min-height: 0;
    display: flex;
}

.em-hero-layout-row.em-hero-layout-row--with-side .em-hero-layout-side {
    align-self: stretch;
    height: 100%;
}

/* Equal-height no cenário legado (mini-cards internos do Hero widget). */
.em-hero-layout-row.em-hero-layout-row--with-side .em-hero-layout-side > .em-hero-mini-banners {
    height: 100%;
    min-height: 0;
    grid-template-rows: repeat(var(--em-mini-card-count, 3), minmax(0, 1fr));
    align-content: stretch;
}

.em-hero-layout-row.em-hero-layout-row--with-side .em-hero-layout-side > .em-hero-mini-banners > .em-hero-mini-banner {
    min-height: 0 !important;
}

.em-hero-mini-banners-wrap {
    width: 100%;
    height: 100%;
    align-self: stretch;
    display: flex;
    flex-direction: column;
    padding-right: 30px;
}

.em-hero-mini-banners {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
    width: 100%;
    max-width: 320px;
}

.em-hero-mini-banners-wrap .em-hero-mini-banners {
    height: 100%;
    grid-template-rows: repeat(var(--em-mini-card-count, 3), minmax(0, 1fr));
    align-content: stretch;
}

.em-hero-mini-banner {
    border-radius: 10px;
    overflow: hidden;
    min-height: 124px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 14px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    text-decoration: none;
    transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    position: relative;
}

.em-hero-mini-banners-wrap .em-hero-mini-banner {
    min-height: 0;
    height: 100%;
}

/* Etapa 6: overlay escuro sutil no hover (funde sobre a cor de fundo do card) */
.em-hero-mini-banner::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(0, 136, 204, 0), rgba(0, 136, 204, 0.08));
    transition: background 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    pointer-events: none;
    border-radius: inherit;
}

/* Etapa 6: hover — lift + escala leve + overlay */
.em-hero-mini-banner:hover {
    transform: translateY(-6px) scale(1.02);
    box-shadow: 0 8px 24px rgba(0, 136, 204, 0.25);
    color: inherit;
}

.em-hero-mini-banner:hover::after {
    background: linear-gradient(135deg, rgba(0, 136, 204, 0.15), rgba(0, 136, 204, 0.25));
}

.em-hero-mini-banner-content {
    min-width: 0;
    flex: 1;
}

.em-hero-mini-banner-content h4 {
    margin: 0 0 6px;
    font-size: 16px;
    line-height: 1.2;
    color: inherit;
}

.em-hero-mini-banner-content p {
    margin: 0;
    font-size: 13px;
    opacity: 0.86;
    color: inherit;
}

.em-hero-mini-banner-media {
    width: 96px;
    height: 96px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden; /* Etapa 6: necessário para clip do zoom */
    border-radius: 8px;
}

.em-hero-mini-banner-media img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    transition: transform 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    will-change: transform;
}

/* Etapa 6: zoom da imagem ao hover no card */
.em-hero-mini-banner:hover .em-hero-mini-banner-media img {
    transform: scale(1.15) rotate(2deg);
}

/* ── Etapa 6: alinhamento de altura e espaçamento ──────── */

/* Força o wrapper Elementor do widget a ocupar 100% da coluna,
   permitindo que os cards se estiquem para igualar a altura do hero slider */
/* ── Hero Mini Banners: chain de altura no Elementor ──────────────────────
   Problema: o Elementor usa flex-wrap:wrap + align-content:flex-start no
   .elementor-widget-wrap, o que impede que height:100% se propague.
   Solução A (navegadores modernos): :has() sobrescreve o align do wrap.
   Solução B (fallback JS):          a classe .em-mini-height-active é
   adicionada pelo JS em electromart.js após sincronizar a altura.
   ────────────────────────────────────────────────────────────────────── */

/* Solução A — CSS :has() (Chrome 105+, Safari 15.4+, Firefox 121+) */
.elementor-widget-wrap:has(.elementor-widget-em_hero_mini_banners) {
    align-content: stretch !important;
    align-items: stretch !important;
}

/* Chain flex: widget → container → wrap → grid */
.elementor-widget-em_hero_mini_banners {
    align-self: stretch;
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
}

.elementor-widget-em_hero_mini_banners > .elementor-widget-container {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-height: 0;
}

.elementor-widget-em_hero_mini_banners .em-hero-mini-banners-wrap {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-height: 0;
    height: auto; /* flex substitui height:100% aqui */
}

.elementor-widget-em_hero_mini_banners .em-hero-mini-banners {
    flex: 1;
    height: auto; /* substitui height:100% legado neste contexto flex */
    min-height: 0;
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: repeat(var(--em-mini-card-count, 3), minmax(0, 1fr));
}

/* Solução B — fallback JS: quando JS define height diretamente no wrap */
.em-hero-mini-banners-wrap.em-mini-height-active {
    height: var(--em-hero-synced-height, auto) !important;
}

.em-hero-mini-banners-wrap.em-mini-height-active .em-hero-mini-banners {
    height: 100%;
    grid-template-rows: repeat(var(--em-mini-card-count, 3), minmax(0, 1fr));
}

.em-hero-mini-banners-wrap.em-mini-height-active .em-hero-mini-banner {
    min-height: 0 !important;
}

/* ⚠️ REMOVIDO: Segunda definição de .em-hero-layout-row (linha 3196) foi consolidada na definição primária (linha ~2823) */
/* Para evitar conflitos de CSS Cascade, manter apenas UMA definição por seletor */

/* Ticker overflow hardening */
.em-ticker-wrap {
    overflow: hidden;
}

.em-ticker-carousel .owl-stage-outer {
    overflow: hidden;
}

.em-ticker-item,
.em-ticker-link {
    min-width: 0;
}

.em-ticker-name {
    word-break: break-word;
}

/* Mobile and tablet responsive audit */
@media (max-width: 991px) {
    .em-hero-layout-row {
        grid-template-columns: 1fr;
    }

    .em-hero-layout-side {
        order: 2;
    }

    .em-hero-mini-banners {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .em-hero-layout-row.em-hero-layout-row--with-side .em-hero-layout-side > .em-hero-mini-banners {
        height: auto;
        grid-auto-rows: auto;
    }

    .em-hero-layout-row.em-hero-layout-row--with-side .em-hero-layout-side > .em-hero-mini-banners > .em-hero-mini-banner {
        min-height: 124px !important;
    }

    .em-hero-mini-banners-wrap {
        height: auto;
    }

    .em-hero-mini-banners-wrap .em-hero-mini-banners {
        height: auto;
        grid-template-rows: none;
    }

    .em-hero-mini-banners-wrap .em-hero-mini-banner {
        min-height: 124px;
        height: auto;
    }
}

@media (max-width: 768px) {
    .em-flash-heading-default {
        align-items: flex-start;
        padding-right: 0;
    }

    .em-flash-heading-timer {
        width: 100%;
        justify-content: flex-start;
    }

    .em-flash-wrap .em-flash-carousel.owl-carousel .owl-nav {
        position: static;
        justify-content: flex-end;
        margin-bottom: 10px;
    }

    .em-hero-slide {
        min-height: 320px;
    }

    .em-hero-slide-inner {
        flex-direction: column;
        text-align: center;
        gap: 16px;
        padding: 34px 42px;
    }

    .em-hero-slider-wrap {
        padding: 10px 0 14px;
    }

    .em-hero-slider-wrap .em-container {
        padding-left: 12px;
        padding-right: 12px;
    }

    .em-hero-image {
        width: min(78%, 280px);
        min-width: 0;
        max-width: none;
        height: 180px;
        max-height: 180px;
        margin-left: 0;
    }

    .em-slide-subtitle {
        -webkit-line-clamp: 2;
        line-clamp: 2;
        line-clamp: 2;
        max-height: calc(1.6em * 2);
    }

    .em-slide-features {
        margin-left: auto;
        margin-right: auto;
        max-width: 360px;
        text-align: left;
    }

    .em-hero-mini-banners {
        grid-template-columns: 1fr;
        margin: 0 auto;
    }

    .em-cart-sidebar {
        width: 100vw;
        max-width: 100vw;
        right: -100vw;
        border-radius: 0;
    }
}

@media (max-width: 575px) {
    .em-grid-cols-2,
    .em-grid-cols-3,
    .em-grid-cols-4,
    .em-grid-cols-5,
    .em-grid-cols-6,
    .em-cat-grid,
    .em-prodlist-grid,
    .em-brand-grid,
    .em-blog-grid-2,
    .em-blog-grid-3,
    .em-blog-grid-4,
    .woocommerce ul.products,
    .woocommerce-page ul.products {
        grid-template-columns: 1fr !important;
    }

    .em-hero-layout-main .owl-nav {
        padding: 0 8px;
    }

    .em-hero-layout-main .owl-prev,
    .em-hero-layout-main .owl-next {
        width: 36px;
        height: 36px;
    }

    .em-ticker-link {
        padding: 4px 4px;
    }
}

/* ============================================================
   ACESSIBILIDADE: prefers-reduced-motion
   Desativa animações críticas para quem possui sensibilidade a movimento.
   ============================================================ */
@media (prefers-reduced-motion: reduce) {
    .em-ticker-marquee-track,
    .em-benefit-track,
    .em-fullbanner-product-img img {
        animation: none !important;
        transition: none !important;
    }
}

.em-compare-actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.em-compare-actions button {
    cursor: pointer;
    border-radius: 6px;
    font-size: 13px;
    line-height: 1;
    padding: 8px 16px;
    transition: var(--em-transition);
}

#em-compare-count { font-weight: 600; }
#em-compare-clear { background: var(--em-primary-bg, #f4f4f4); color: var(--em-dark, #212121); }
#em-compare-now { background: var(--em-primary, #0088cc); color: #fff; }

/* ─────────────────────────────────────────────
   GLOBAL MOBILE OVERRIDES (15.3)
   ───────────────────────────────────────────── */
@media (max-width: 767px) {
    .em-section-wrap { padding: 40px 0 !important; }
    .em-container { padding: 0 15px !important; }
}
@media (max-width: 480px) {
    .em-section-wrap { padding: 30px 0 !important; }
}