@media (max-width: 768px) {
/* ==========================================================================
   ACESMAQ — MOBILE RESPONSIVE OVERHAUL v7.0 (ZERO OVERFLOW GUARANTEE)
   Fixes:
   1. .products-main-grid & .side-catalog-card: 100% width vertical column
   2. .prefooter-cta & .prefooter-inner & .prefooter-right: 100% width vertical column
   3. .differentials-bar: 100% width vertical column cards
   4. .footer-stats-inner & .fstat-item: 100% width vertical column cards
   5. .indicators-container & .indicator-item: 100% width vertical column cards
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. HAMBURGER & MOBILE OVERLAY & WA FAB
   -------------------------------------------------------------------------- */
.hamburger-btn {
  display: none;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 5px;
  width: 44px;
  height: 44px;
  background: transparent;
  border: none;
  cursor: pointer;
  padding: 8px;
  border-radius: 8px;
  transition: background 0.2s;
  z-index: 1100;
  order: 3;
}
.hamburger-btn:hover { background: rgba(255,255,255,0.08); }

.ham-bar {
  display: block;
  width: 22px;
  height: 2px;
  background: #FFFFFF;
  border-radius: 2px;
  transition: transform 0.3s ease, opacity 0.3s ease, width 0.3s ease;
}

.hamburger-btn.active .ham-bar:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.hamburger-btn.active .ham-bar:nth-child(2) { opacity: 0; width: 0; }
.hamburger-btn.active .ham-bar:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

.mobile-overlay {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.75);
  z-index: 999;
  opacity: 0;
  transition: opacity 0.3s ease;
}
.mobile-overlay.active {
  display: block;
  opacity: 1;
}

.mobile-wa-fab {
  display: none;
  position: fixed;
  bottom: 24px;
  right: 20px;
  width: 58px;
  height: 58px;
  background: linear-gradient(135deg, #25D366 0%, #128C7E 100%);
  border-radius: 50%;
  box-shadow: 0 6px 24px rgba(37, 211, 102, 0.5);
  align-items: center;
  justify-content: center;
  z-index: 998;
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

/* --------------------------------------------------------------------------
   2. TABLET BREAKPOINT (≤1024px)
   -------------------------------------------------------------------------- */
@media (max-width: 1024px) {
  .whatsapp-header-btn span { display: none; }
  .whatsapp-header-btn { padding: 8px; min-width: auto; }
  .header-container { gap: 12px; }
  .nav-menu { gap: 16px; }
  .nav-link { font-size: 11px; }
  .marketplace-grid { gap: 16px; }
  .marketplace-card { min-width: 280px; }
}

/* --------------------------------------------------------------------------
   3. MOBILE BREAKPOINT (≤768px)
   -------------------------------------------------------------------------- */
@media (max-width: 768px) {

  /* ── GLOBAL OVERFLOW PREVENTION ── */
  html, body {
    overflow-x: hidden !important;
    width: 100% !important;
    max-width: 100vw !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  *, *::before, *::after {
    box-sizing: border-box !important;
  }

  /* ── HEADER ── */
  .header-container {
    padding: 0 16px !important;
    height: 76px !important;
  }

  .logo-img {
    height: 48px !important;
    max-width: 180px !important;
    object-fit: contain !important;
    filter: drop-shadow(0 2px 8px rgba(0, 112, 255, 0.3)) !important;
  }

  .hamburger-btn { display: flex !important; }
  .whatsapp-header-btn { display: none !important; }
  .search-btn { display: none !important; }

  /* ── PREMIUM MOBILE NAV DRAWER ── */
  .nav-menu {
    position: fixed !important;
    top: 0 !important;
    left: -320px !important;
    width: 320px !important;
    max-width: 88vw !important;
    height: 100vh !important;
    height: 100dvh !important;
    background: linear-gradient(180deg, rgba(6, 12, 24, 0.99) 0%, rgba(3, 7, 16, 0.99) 100%) !important;
    backdrop-filter: blur(25px) saturate(180%) !important;
    -webkit-backdrop-filter: blur(25px) saturate(180%) !important;
    border-right: 1px solid rgba(0, 112, 255, 0.3) !important;
    box-shadow: 12px 0 50px rgba(0, 0, 0, 0.85), 2px 0 20px rgba(0, 112, 255, 0.25) !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    padding: 95px 20px 40px !important;
    gap: 6px !important;
    z-index: 1000 !important;
    transition: left 0.35s cubic-bezier(0.16, 1, 0.3, 1) !important;
    overflow-y: auto !important;
  }
  .nav-menu.open { left: 0 !important; }

  .nav-link {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 15px !important;
    font-weight: 800 !important;
    letter-spacing: 0.8px !important;
    padding: 15px 16px !important;
    width: 100% !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important;
    border-radius: 12px !important;
    color: #E2E8F0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    transition: all 0.25s ease !important;
    text-transform: uppercase !important;
  }
  .nav-link.active,
  .nav-link:hover {
    color: #FFFFFF !important;
    background: linear-gradient(90deg, rgba(0, 112, 255, 0.25) 0%, rgba(0, 112, 255, 0.05) 100%) !important;
    border-color: rgba(0, 112, 255, 0.4) !important;
    padding-left: 20px !important;
    box-shadow: inset 4px 0 0 #0070FF !important;
  }
  .nav-link.active::after { display: none !important; }

  .dropdown { width: 100% !important; }
  .dropdown-toggle { width: 100% !important; justify-content: space-between !important; }
  .dropdown-menu {
    position: static !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    padding: 0 0 0 16px !important;
    display: flex !important;
    opacity: 1 !important;
    visibility: visible !important;
    flex-direction: column !important;
    gap: 2px !important;
  }

  /* ── HERO SECTION (REPLICATED 100% FROM REFERENCE PRINTS) ── */
  .hero-section {
    background: #04070F url('assets/hero-bg-mobile.png') no-repeat center top / cover !important;
    min-height: auto !important;
    position: relative !important;
  }

  .hero-body { padding-top: 60px !important; }
  .hero-container {
    padding: 24px 16px 20px !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  .hero-top-tag {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    margin-bottom: 12px !important;
  }

  .hero-tag-line {
    width: 24px !important;
    height: 2px !important;
    background: #0070FF !important;
    border-radius: 2px !important;
  }

  .hero-tag-text {
    font-size: 11px !important;
    font-weight: 800 !important;
    color: #0070FF !important;
    letter-spacing: 1.5px !important;
    text-transform: uppercase !important;
  }

  .hero-title {
    font-family: 'Montserrat', sans-serif !important;
    font-size: clamp(24px, 7.8vw, 32px) !important;
    font-weight: 900 !important;
    line-height: 1.15 !important;
    color: #FFFFFF !important;
    letter-spacing: 0.5px !important;
    margin-bottom: 14px !important;
    text-transform: uppercase !important;
  }

  .blue-highlight-italic {
    color: #0070FF !important;
    font-style: italic !important;
  }

  .hero-subtitle {
    font-family: 'Inter', sans-serif !important;
    font-size: 13.5px !important;
    color: #94A3B8 !important;
    line-height: 1.55 !important;
    margin-bottom: 20px !important;
    max-width: 100% !important;
  }

  /* 3 FEATURE ITEMS (QUALIDADE, TECNOLOGIA, CONFIANÇA) */
  .hero-features-list {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    margin-bottom: 22px !important;
    width: 100% !important;
  }

  .hero-feat-item {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    background: rgba(255, 255, 255, 0.02) !important;
    border: 1px solid rgba(255, 255, 255, 0.06) !important;
    border-radius: 10px !important;
    padding: 10px 12px !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  .hero-feat-icon {
    width: 36px !important;
    height: 36px !important;
    border-radius: 50% !important;
    background: rgba(0, 112, 255, 0.12) !important;
    border: 1px solid rgba(0, 112, 255, 0.3) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
  }

  .hero-feat-text {
    display: flex !important;
    flex-direction: column !important;
    gap: 2px !important;
  }

  .hero-feat-text strong {
    font-size: 12px !important;
    font-weight: 900 !important;
    color: #FFFFFF !important;
    letter-spacing: 0.5px !important;
  }

  .hero-feat-text span {
    font-size: 11px !important;
    color: #94A3B8 !important;
    line-height: 1.3 !important;
  }

  /* 3 PRIMARY CTA BUTTONS — CRISP COMPACT TILES ON MOBILE */
  .cta-buttons-row {
    display: flex !important;
    flex-direction: row !important;
    align-items: stretch !important;
    justify-content: space-between !important;
    gap: 8px !important;
    width: 100% !important;
    margin-top: 20px !important;
    margin-bottom: 26px !important;
  }

  .cta-btn {
    flex: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 4px !important;
    width: 32% !important;
    height: 74px !important;
    border-radius: 12px !important;
    padding: 8px 4px !important;
    box-sizing: border-box !important;
    text-decoration: none !important;
    border: none !important;
    text-align: center !important;
    overflow: hidden !important;
  }

  .cta-ml {
    background: linear-gradient(135deg, #FFE600 0%, #FFD000 100%) !important;
    color: #002F6C !important;
    box-shadow: 0 4px 16px rgba(255, 230, 0, 0.35) !important;
  }

  .cta-shopee {
    background: linear-gradient(135deg, #EE4D2D 0%, #FF6535 100%) !important;
    color: #FFFFFF !important;
    box-shadow: 0 4px 16px rgba(238, 77, 45, 0.35) !important;
  }

  .cta-whatsapp {
    background: linear-gradient(135deg, #128C7E 0%, #25D366 100%) !important;
    color: #FFFFFF !important;
    box-shadow: 0 4px 16px rgba(37, 211, 102, 0.35) !important;
  }

  .cta-icon {
    width: 22px !important;
    height: 22px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 auto !important;
    flex-shrink: 0 !important;
  }

  .cta-brand-img {
    width: 20px !important;
    height: 20px !important;
    object-fit: contain !important;
  }

  .cta-icon svg {
    width: 20px !important;
    height: 20px !important;
  }

  .cta-text {
    font-size: 8px !important;
    font-weight: 700 !important;
    line-height: 1.1 !important;
    text-transform: uppercase !important;
    text-align: center !important;
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    letter-spacing: 0.2px !important;
  }

  .cta-text strong {
    font-size: 9.5px !important;
    font-weight: 900 !important;
    display: block !important;
    margin-top: 1px !important;
  }

  .cta-arrow {
    display: none !important;
  }

  /* VIDEO CTA CARD */
  .hero-video-card {
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
    background: rgba(8, 16, 31, 0.85) !important;
    border: 1px solid rgba(0, 112, 255, 0.3) !important;
    border-radius: 14px !important;
    padding: 14px 16px !important;
    width: 100% !important;
    box-sizing: border-box !important;
    margin-bottom: 24px !important;
    cursor: pointer !important;
  }

  .video-play-btn {
    width: 38px !important;
    height: 38px !important;
    border-radius: 50% !important;
    background: #0070FF !important;
    color: #FFFFFF !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: 0 4px 14px rgba(0, 112, 255, 0.5) !important;
    flex-shrink: 0 !important;
    border: none !important;
  }

  .video-card-text {
    display: flex !important;
    flex-direction: column !important;
    text-align: left !important;
  }

  .vct-title {
    font-size: 13px !important;
    font-weight: 900 !important;
    color: #FFFFFF !important;
    letter-spacing: 0.5px !important;
  }

  .vct-sub {
    font-size: 11px !important;
    color: #94A3B8 !important;
    margin-top: 2px !important;
  }

  .video-card-arrow {
    font-size: 20px !important;
    font-weight: 900 !important;
    color: #0070FF !important;
    margin-left: auto !important;
  }

  /* HERO BOTTOM METRICS CARDS */
  .hero-bottom-metrics {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    width: 100% !important;
    margin-top: 8px !important;
    box-sizing: border-box !important;
  }

  .hmetric-card {
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
    background: rgba(4, 8, 18, 0.85) !important;
    border: 1px solid rgba(0, 112, 255, 0.2) !important;
    border-radius: 14px !important;
    padding: 14px 16px !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  .hm-icon {
    flex-shrink: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  .hm-text {
    display: flex !important;
    flex-direction: column !important;
    text-align: left !important;
  }

  .hm-num {
    font-size: 16px !important;
    font-weight: 900 !important;
    color: #FFFFFF !important;
    letter-spacing: 0.5px !important;
  }

  .hm-label {
    font-size: 11px !important;
    font-weight: 800 !important;
    color: #0070FF !important;
    margin-top: 2px !important;
  }

  .hm-sub {
    font-size: 10px !important;
    color: #64748B !important;
    margin-top: 2px !important;
  }

  .social-sidebar { display: none !important; }
  .mobile-wa-fab { display: flex !important; }

  /* ── 1. TOP HERO INDICATORS BAR ── */
  .indicators-bar {
    width: 100% !important;
    padding: 16px 0 !important;
    box-sizing: border-box !important;
  }

  .indicators-container {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    padding: 0 16px !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  .indicator-item {
    width: 100% !important;
    max-width: 100% !important;
    padding: 12px 14px !important;
    background: rgba(255, 255, 255, 0.03) !important;
    border: 1px solid rgba(0, 112, 255, 0.15) !important;
    border-radius: 10px !important;
    box-sizing: border-box !important;
    gap: 12px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
  }

  .indicator-item:not(:last-child)::after { display: none !important; }
  .indicator-icon svg { width: 24px !important; height: 24px !important; }
  .indicator-text .ind-main { font-size: 13px !important; font-weight: 800 !important; line-height: 1.2 !important; }
  .indicator-text .ind-sub { font-size: 10px !important; opacity: 0.7 !important; }

  /* ── 2. SEÇÃO CATEGORIAS ── */
  .categories-section { padding: 36px 0 !important; }
  .categories-container {
    padding: 0 16px !important;
    width: 100% !important;
  }

  .categories-grid {
    display: flex !important;
    flex-direction: column !important;
    gap: 14px !important;
    width: 100% !important;
  }

  .category-card {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 140px !important;
    padding: 18px 16px !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
    box-sizing: border-box !important;
  }

  .category-card .card-content {
    flex: 1 !important;
    max-width: 60% !important;
    min-width: 0 !important;
  }

  .category-card .card-title {
    font-size: 15px !important;
    line-height: 1.25 !important;
    margin-bottom: 4px !important;
  }
  .category-card .card-title br { display: none !important; }

  .category-card .card-desc {
    font-size: 11px !important;
    margin-bottom: 10px !important;
    line-height: 1.4 !important;
  }

  .category-card .card-btn {
    display: inline-flex !important;
    width: auto !important;
    padding: 6px 12px !important;
    font-size: 10px !important;
  }

  .category-card .card-image-wrapper {
    position: relative !important;
    right: auto !important;
    top: auto !important;
    width: 95px !important;
    min-width: 95px !important;
    height: 95px !important;
    flex-shrink: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: visible !important;
  }

  .category-card .card-image-wrapper::before { display: none !important; }

  .category-card .card-img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    display: block !important;
  }

  /* BANNER CATÁLOGO COMPLETO */
  .full-catalog-banner,
  .catalog-banner-card {
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    padding: 22px 16px !important;
    gap: 14px !important;
    margin-top: 20px !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  .catalog-info {
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    gap: 8px !important;
    width: 100% !important;
  }

  .catalog-title { font-size: 16px !important; }
  .catalog-desc { font-size: 13px !important; }

  .catalog-btn,
  .full-catalog-banner .catalog-btn {
    position: static !important;
    width: 100% !important;
    justify-content: center !important;
    height: 48px !important;
    font-size: 12px !important;
    margin-top: 6px !important;
  }

  /* ── 3. SEÇÃO PRODUTOS EM DESTAQUE & SIDE CATALOG CARD FIX ── */
  .featured-products-section { padding: 36px 0 !important; }
  .featured-products-container {
    padding: 0 16px !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  .products-header-row {
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    gap: 14px !important;
  }

  .products-tabs,
  .tab-buttons {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    gap: 8px !important;
    width: 100% !important;
  }

  .tab-btn {
    padding: 8px 14px !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    white-space: nowrap !important;
    flex: none !important;
  }

  .products-main-grid {
    display: flex !important;
    flex-direction: column !important;
    gap: 20px !important;
    width: 100% !important;
  }

  .carousel-wrapper {
    overflow: visible !important;
    padding: 0 !important;
    width: 100% !important;
  }

  .products-cards-row {
    display: flex !important;
    flex-direction: column !important;
    gap: 16px !important;
    width: 100% !important;
    transform: none !important;
  }

  .product-card {
    width: 100% !important;
    max-width: 100% !important;
    flex: none !important;
    box-sizing: border-box !important;
  }

  .product-card-img-box,
  .product-img-box {
    height: 180px !important;
  }

  .prev-arrow, .next-arrow,
  .carousel-arrow { display: none !important; }

  /* SIDE CATALOG CARD FIX ("PRECISOU DE ALGO ESPECÍFICO?") */
  .side-catalog-card,
  .side-card {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 22px 16px !important;
    text-align: center !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
  }

  .side-catalog-btn,
  .side-catalog-card .btn,
  .side-card .btn {
    width: 100% !important;
    justify-content: center !important;
  }

  .side-catalog-img-box {
    width: 100% !important;
    max-width: 200px !important;
    margin: 12px auto 0 !important;
  }

  .view-all-products-row {
    width: 100% !important;
    margin-top: 20px !important;
  }
  .view-all-products-row a {
    width: 100% !important;
    justify-content: center !important;
  }

  /* ── 4. BOTTOM DIFFERENTIALS BAR ("COMPRE COM SEGURANÇA" FIX) ── */
  .differentials-bar {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    padding: 14px !important;
    width: 100% !important;
    background: rgba(0, 0, 0, 0.3) !important;
    border: 1px solid rgba(0, 112, 255, 0.18) !important;
    border-radius: 16px !important;
    box-sizing: border-box !important;
  }

  .diff-item {
    width: 100% !important;
    max-width: 100% !important;
    padding: 12px 14px !important;
    background: rgba(255, 255, 255, 0.03) !important;
    border: 1px solid rgba(255, 255, 255, 0.06) !important;
    border-radius: 10px !important;
    gap: 12px !important;
    display: flex !important;
    align-items: center !important;
    box-sizing: border-box !important;
  }

  .diff-item:not(:last-child)::after { display: none !important; }
  .diff-title { font-size: 13px !important; font-weight: 800 !important; margin-bottom: 2px !important; }
  .diff-desc { font-size: 11px !important; line-height: 1.35 !important; }

  /* ── 5. SEÇÃO MONTE SEU KIT ── */
  .monte-kit-section { padding: 36px 0 !important; }
  .build-kit-container {
    padding: 0 16px !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  .kit-builder-layout {
    display: flex !important;
    flex-direction: column !important;
    gap: 20px !important;
    align-items: stretch !important;
    width: 100% !important;
  }

  .kit-products-panel { width: 100% !important; }
  .kit-summary-panel { width: 100% !important; position: relative !important; }

  .kit-radio-group {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 10px !important;
    width: 100% !important;
  }

  .kit-radio-card {
    width: 100% !important;
    max-width: 100% !important;
    padding: 12px 10px !important;
    box-sizing: border-box !important;
    min-width: 0 !important;
  }

  .kit-item,
  .kit-product-item {
    display: grid !important;
    grid-template-columns: 1fr auto !important;
    align-items: center !important;
    padding: 14px 12px !important;
    gap: 10px !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  .kit-item-main,
  .kit-item-info {
    display: flex !important;
    flex-direction: column !important;
    gap: 4px !important;
    min-width: 0 !important;
  }

  .kit-item-title { font-size: 14px !important; line-height: 1.3 !important; }
  .kit-item-price { font-size: 14px !important; font-weight: 800 !important; color: #0070FF !important; }

  .kit-qty-ctrl,
  .kit-item-controls,
  .qty-controls-wrapper {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    flex-shrink: 0 !important;
  }

  .qty-btn, .q-btn,
  .qty-minus, .qty-plus {
    width: 36px !important;
    height: 36px !important;
    font-size: 16px !important;
    border-radius: 8px !important;
  }

  .qty-val, .q-val {
    font-size: 15px !important;
    min-width: 26px !important;
    text-align: center !important;
  }

  .kit-summary-sticky {
    position: relative !important;
    top: auto !important;
    border-radius: 12px !important;
    padding: 18px 16px !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  /* ── 6. SEÇÃO EMPRESA / VÍDEO ── */
  .about-section { padding: 36px 0 !important; }
  .about-container {
    padding: 0 16px !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  .about-main-grid {
    display: flex !important;
    flex-direction: column !important;
    gap: 20px !important;
    width: 100% !important;
  }

  .about-left-col, .about-right-col { width: 100% !important; }
  .about-main-title { font-size: clamp(22px, 7vw, 30px) !important; line-height: 1.2 !important; }
  .about-intro-text { font-size: 13px !important; line-height: 1.6 !important; }
  .about-intro-text br { display: none !important; }

  .about-cards-grid {
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
    width: 100% !important;
  }

  .about-diff-card, .diff-card {
    width: 100% !important;
    padding: 16px 14px !important;
    box-sizing: border-box !important;
  }

  #facility-video-container,
  .facility-banner {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 0 16px 0 !important;
    border-radius: 12px !important;
    aspect-ratio: 16 / 9 !important;
    height: auto !important;
    box-sizing: border-box !important;
  }

  .about-features-row {
    display: flex !important;
    flex-direction: column !important;
    gap: 14px !important;
    width: 100% !important;
  }

  .about-feat-card {
    width: 100% !important;
    box-sizing: border-box !important;
  }

  .about-feat-card .feat-img-box {
    height: 160px !important;
    width: 100% !important;
    border-radius: 12px !important;
    overflow: hidden !important;
  }

  .about-feat-card .feat-img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
  }

  .about-stats-bar {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    padding: 16px 0 !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  .stat-item {
    width: 100% !important;
    max-width: 100% !important;
    padding: 12px 14px !important;
    background: rgba(255, 255, 255, 0.03) !important;
    border: 1px solid rgba(0, 112, 255, 0.15) !important;
    border-radius: 12px !important;
    box-sizing: border-box !important;
    gap: 12px !important;
    display: flex !important;
    align-items: center !important;
  }

  /* ── 7. SEÇÃO ONDE COMPRAR & TRUST BAR FIX (COMPRE COM SEGURANÇA) ── */
  .onde-comprar-section {
    padding: 36px 0 !important;
    width: 100% !important;
    max-width: 100vw !important;
    overflow-x: hidden !important;
    box-sizing: border-box !important;
  }

  .onde-comprar-container {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 16px !important;
    margin: 0 !important;
    box-sizing: border-box !important;
  }

  .marketplace-grid {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    padding: 0 !important;
    gap: 16px !important;
    width: 100% !important;
    margin: 0 !important;
    box-sizing: border-box !important;
  }

  .marketplace-card {
    width: 100% !important;
    max-width: 100% !important;
    padding: 20px 16px !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    box-sizing: border-box !important;
    margin: 0 !important;
  }

  .mkt-phone-area { display: none !important; }
  .mkt-content-area { width: 100% !important; }
  .mkt-cta-headline { font-size: 15px !important; }
  .mkt-cta-brand { font-size: 20px !important; margin-bottom: 6px !important; }
  .mkt-cta-desc { font-size: 13px !important; margin-bottom: 14px !important; }

  .mkt-buy-btn {
    width: 100% !important;
    justify-content: center !important;
    height: 46px !important;
    font-size: 13px !important;
  }

  /* TRUST BAR FIX (COMPRE COM SEGURANÇA 100% ALINHADO E CENTRALIZADO) */
  .trust-bar {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    gap: 16px !important;
    padding: 20px 16px !important;
    width: 100% !important;
    max-width: 100% !important;
    background: rgba(8, 16, 31, 0.95) !important;
    border: 1px solid rgba(0, 112, 255, 0.25) !important;
    border-radius: 16px !important;
    box-sizing: border-box !important;
    margin: 20px 0 0 0 !important;
  }

  .trust-main-item {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    gap: 10px !important;
    width: 100% !important;
  }

  .trust-icon-big {
    margin: 0 auto !important;
  }

  .trust-main-text {
    text-align: center !important;
    width: 100% !important;
  }

  .trust-main-title {
    font-size: 18px !important;
    text-align: center !important;
    margin-bottom: 6px !important;
  }

  .trust-main-desc {
    font-size: 13px !important;
    text-align: center !important;
    color: #94A3B8 !important;
    max-width: 100% !important;
    line-height: 1.45 !important;
  }

  .trust-divider { display: none !important; }

  .trust-badges-row {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 10px !important;
    width: 100% !important;
    box-sizing: border-box !important;
    margin-top: 8px !important;
  }

  .trust-badge-item {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    gap: 6px !important;
    padding: 12px 8px !important;
    background: rgba(255, 255, 255, 0.03) !important;
    border: 1px solid rgba(255, 255, 255, 0.07) !important;
    border-radius: 10px !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  .trust-badge-icon svg {
    width: 22px !important;
    height: 22px !important;
  }

  .tb-title {
    font-size: 11px !important;
    text-align: center !important;
    line-height: 1.2 !important;
    display: block !important;
  }

  .tb-sub {
    font-size: 9px !important;
    text-align: center !important;
    opacity: 0.75 !important;
    display: block !important;
  }

  /* ── 8. SEÇÃO BLOG & FAQ ── */
  .blog-faq-section,
  .blog-section {
    padding: 36px 0 !important;
    overflow: hidden !important;
    width: 100% !important;
    max-width: 100vw !important;
  }
  
  .blog-container,
  .blog-faq-container {
    display: flex !important;
    flex-direction: column !important;
    gap: 32px !important;
    padding: 0 16px !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  .blog-col,
  .faq-col {
    width: 100% !important;
    max-width: 100% !important;
    flex: none !important;
    box-sizing: border-box !important;
    margin: 0 !important;
  }

  .blog-title-row {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 12px !important;
    margin-bottom: 12px !important;
  }

  .blog-all-btn {
    width: 100% !important;
    justify-content: center !important;
  }

  .blog-grid,
  .blog-cards-grid {
    display: flex !important;
    flex-direction: column !important;
    gap: 20px !important;
    width: 100% !important;
  }

  .blog-card {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    flex: none !important;
    box-sizing: border-box !important;
    padding: 0 !important;
    overflow: hidden !important;
  }

  .blog-card-img-box,
  .blog-img-box {
    width: 100% !important;
    height: 180px !important;
    border-radius: 12px 12px 0 0 !important;
    overflow: hidden !important;
  }

  .blog-card-img,
  .blog-img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
  }

  .blog-card-body,
  .blog-content {
    padding: 16px !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  .blog-card-title,
  .blog-title {
    font-size: 17px !important;
    line-height: 1.35 !important;
    word-break: normal !important;
    overflow-wrap: break-word !important;
    white-space: normal !important;
    margin-bottom: 8px !important;
  }

  .blog-card-desc,
  .blog-card-excerpt,
  .blog-desc {
    font-size: 13px !important;
    line-height: 1.5 !important;
    word-break: normal !important;
    overflow-wrap: break-word !important;
    white-space: normal !important;
    color: #94A3B8 !important;
    margin-bottom: 12px !important;
  }

  /* BLOG CTA BANNER FIX ("PRECISANDO DE AJUDA NO SEU PROJETO?") */
  .blog-cta-banner {
    padding: 0 16px !important;
    width: 100% !important;
    margin: 28px 0 0 0 !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
  }

  .blog-cta-inner {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    gap: 16px !important;
    padding: 24px 16px !important;
    width: 100% !important;
    border-radius: 16px !important;
    background: linear-gradient(135deg, rgba(8, 14, 28, 0.95) 0%, rgba(4, 8, 18, 0.98) 100%) !important;
    border: 1px solid rgba(0, 112, 255, 0.25) !important;
    box-sizing: border-box !important;
  }

  .blog-cta-left {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    gap: 10px !important;
    width: 100% !important;
  }

  .blog-cta-icon-box {
    margin: 0 auto !important;
  }

  .blog-cta-title {
    font-size: 19px !important;
    font-weight: 900 !important;
    text-align: center !important;
    line-height: 1.3 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 4px !important;
  }
  .blog-cta-title br { display: none !important; }

  .blog-cta-desc {
    font-size: 13px !important;
    text-align: center !important;
    color: #94A3B8 !important;
    line-height: 1.45 !important;
  }
  .blog-cta-desc br { display: none !important; }

  .blog-cta-icons {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    width: 100% !important;
    box-sizing: border-box !important;
    margin: 6px 0 !important;
  }

  .blog-cta-feature {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 14px !important;
    padding: 12px 14px !important;
    background: rgba(255, 255, 255, 0.03) !important;
    border: 1px solid rgba(0, 112, 255, 0.15) !important;
    border-radius: 12px !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  .bcf-icon {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
  }

  .blog-cta-feature span {
    font-size: 12px !important;
    text-align: left !important;
    line-height: 1.3 !important;
    font-weight: 700 !important;
    color: #FFFFFF !important;
  }
  .blog-cta-feature span br { display: none !important; }

  .blog-cta-right {
    width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 14px !important;
    margin-top: 4px !important;
  }

  .blog-cta-product-img {
    width: 120px !important;
    height: 90px !important;
    object-fit: contain !important;
    border-radius: 8px !important;
    display: block !important;
    margin: 0 auto !important;
  }

  .blog-cta-wa-btn {
    width: 100% !important;
    justify-content: center !important;
    height: 50px !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    text-align: center !important;
    padding: 0 16px !important;
    border-radius: 12px !important;
  }

  /* HELP CARD FIX ("PRECISANDO DE AJUDA NO SEU PROJETO?") */
  .help-cta-box,
  .help-card,
  .project-help-card {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    padding: 22px 16px !important;
    gap: 12px !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    margin: 0 !important;
  }

  .faq-accordion {
    width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
  }

  .faq-container {
    padding: 0 !important;
    width: 100% !important;
  }

  .faq-question {
    font-size: 14px !important;
    padding: 14px !important;
    line-height: 1.4 !important;
  }

  .faq-answer {
    font-size: 13px !important;
    padding: 0 14px 14px !important;
    line-height: 1.6 !important;
  }

  /* ── 9. PREFOOTER CTA ("PRONTO PARA LEVAR SEU PROJETO...") ── */
  .prefooter-section,
  .prefooter-cta { padding: 36px 0 !important; width: 100% !important; }
  
  .prefooter-inner {
    padding: 0 16px !important;
    width: 100% !important;
    flex-direction: column !important;
    gap: 20px !important;
    box-sizing: border-box !important;
  }

  .prefooter-left,
  .prefooter-right {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  .prefooter-title {
    font-size: clamp(20px, 6.5vw, 26px) !important;
    line-height: 1.2 !important;
    text-align: center !important;
  }

  .prefooter-sub {
    font-size: 13px !important;
    text-align: center !important;
  }
  .prefooter-sub br { display: none !important; }

  .prefooter-badges {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    width: 100% !important;
  }

  .pf-badge {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 10px 12px !important;
    background: rgba(255, 255, 255, 0.03) !important;
    border: 1px solid rgba(255, 255, 255, 0.07) !important;
    border-radius: 8px !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  .prefooter-btns {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    width: 100% !important;
  }

  .pf-btn-primary,
  .pf-btn-secondary {
    width: 100% !important;
    justify-content: center !important;
    height: 48px !important;
    font-size: 12px !important;
  }

  .prefooter-img {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: 200px !important;
    object-fit: cover !important;
    border-radius: 12px !important;
  }

  /* FOOTER STATS BAR (100% VERTICAL COLUMN STACK) */
  .footer-stats-bar {
    width: 100% !important;
    padding: 20px 16px !important;
    background: #04070F !important;
    border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
    box-sizing: border-box !important;
  }

  .footer-stats-inner {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    width: 100% !important;
    padding: 0 !important;
    box-sizing: border-box !important;
  }

  .fstat-item {
    width: 100% !important;
    max-width: 100% !important;
    padding: 12px 14px !important;
    background: rgba(255, 255, 255, 0.03) !important;
    border: 1px solid rgba(0, 112, 255, 0.15) !important;
    border-radius: 12px !important;
    box-sizing: border-box !important;
    gap: 12px !important;
    display: flex !important;
    align-items: center !important;
  }

  .fstat-divider { display: none !important; }
  .fstat-icon svg { width: 24px !important; height: 24px !important; }
  .fstat-num, .fstat-title { font-size: 13px !important; font-weight: 800 !important; line-height: 1.2 !important; }
  .fstat-label { font-size: 10px !important; opacity: 0.7 !important; }

  /* ── 10. SEÇÃO FOOTER MAIN ── */
  .footer-main {
    display: flex !important;
    flex-direction: column !important;
    gap: 24px !important;
    padding: 36px 16px 20px !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  .footer-brand-col,
  .footer-newsletter-col,
  .footer-nav-col {
    width: 100% !important;
  }

  .footer-bottom {
    flex-direction: column !important;
    gap: 12px !important;
    text-align: center !important;
    padding: 16px 16px 24px !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  .footer-payment-icons {
    flex-wrap: wrap !important;
    justify-content: center !important;
    gap: 8px !important;
  }

  .scroll-indicator { display: none !important; }

} /* end @media 768px */

/* --------------------------------------------------------------------------
   SMALL MOBILE (≤480px)
   -------------------------------------------------------------------------- */
@media (max-width: 480px) {
  /* Logo & Header rules for <= 480px */
  .header-container {
    height: 74px !important;
  }
  .logo-img {
    height: 48px !important;
    max-width: 180px !important;
    object-fit: contain !important;
    filter: drop-shadow(0 2px 8px rgba(0, 112, 255, 0.3)) !important;
  }


  .hero-title { font-size: clamp(21px, 7vw, 28px) !important; }

  .indicator-item,
  .fstat-item,
  .diff-item {
    width: 100% !important;
    padding: 12px 10px !important;
  }

  .cta-btn { font-size: 12px !important; height: 48px !important; }

  .category-card {
    flex-direction: row !important;
    align-items: center !important;
  }

  .category-card .card-image-wrapper {
    width: 90px !important;
    height: 90px !important;
    min-width: 90px !important;
  }

  .kit-radio-group { grid-template-columns: 1fr !important; }
  .blog-card-title { font-size: 16px !important; }
  .blog-card-desc { font-size: 13px !important; }
  

} /* end @media 480px */

  
@media (max-width: 768px) {
/* HERO MOBILE SPACING & AIRINESS IMPROVEMENTS */
  .hero-body {
    padding-top: 80px !important;
    padding-bottom: 40px !important;
  }

  .hero-container {
    padding: 24px 16px 32px !important;
  }

  .hero-title {
    font-size: clamp(23px, 7.5vw, 30px) !important;
    line-height: 1.25 !important;
    margin-bottom: 18px !important;
  }

  .hero-subtitle {
    font-size: 14px !important;
    line-height: 1.6 !important;
    margin-bottom: 24px !important;
  }

  .hero-video-card {
    margin-top: 12px !important;
    margin-bottom: 32px !important;
    padding: 16px 18px !important;
  }

  .hero-bottom-metrics {
    margin-top: 24px !important;
    gap: 14px !important;
  }

  .hmetric-card {
    padding: 16px 18px !important;
  }

}

}