/* ================= RESPONSIVIDADE PARA CELULARES E TABLETS ================= */
@media(max-width:900px){
  :root { --nav-h: 64px; }

  nav { padding: 0 4%; }
  .nav-links-desktop { display: none; }
  .btn-orcamento { padding: 9px 16px; font-size: .8rem; }

  .hero {
    padding: calc(var(--nav-h) + 40px) 5% 56px;
    height: auto; min-height: auto;
    align-items: flex-start;
  }
  .hero-right { display: none; }
  .hero-left { max-width: 100%; }
  .hero h1 { font-size: clamp(2rem, 6vw, 2.8rem); }
  .hero p { font-size: .95rem; }
  .hero-btns { flex-direction: column; width: 100%; gap: 12px; }
  .btn-hero-primary, .btn-hero-outline {
    width: 100%; text-align: center; padding: 15px 24px;
  }

  .stats-section { padding: 56px 5%; }
  .stats-bar { grid-template-columns: 1fr 1fr; gap: 14px; }

  section { padding: 64px 5%; }
  .sec-sub { max-width: 100%; }

  .qs-grid { grid-template-columns: 1fr; gap: 36px; margin-top: 36px; }
  .qs-media { aspect-ratio: 16/9; }

  .sv-grid { grid-template-columns: 1fr 1fr; gap: 16px; }
  .sv-card { padding: 26px 20px; }

  #cta-cards { padding: 64px 5%; }
  .cards-row { grid-template-columns: 1fr 1fr; gap: 16px; }
  .cta-card { aspect-ratio: 4/3; }

  .cl-grid { grid-template-columns: repeat(3, 1fr); gap: 14px; }
  .cl-card { padding: 20px 12px; min-height: 140px; display: flex;flex-direction: column;align-items: center;justify-content: center;text-align: center;}
  .client-img {width: 100%; height: 70px;max-width: 110px;object-fit: contain;margin: 0 auto; }

  .ob-grid { grid-template-columns: 1fr 1fr; gap: 16px; }

  .or-grid { grid-template-columns: 1fr; gap: 40px; }
  .form-row { grid-template-columns: 1fr; }
  .form-card { padding: 30px 24px; }

  .footer-grid { grid-template-columns: 1fr 1fr; gap: 32px; }
  .footer-bottom { flex-direction: column; text-align: center; gap: 12px; }

  .whatsapp-float { bottom: 20px; right: 16px; }
  .instagram-float { bottom: 76px; right: 16px; left: auto; }
  .wa-btn { width: 52px; height: 52px; }
  .wa-btn svg { width: 26px; height: 26px; }
  .ig-btn { width: 52px; height: 52px; }
  .ig-btn svg { width: 26px; height: 26px; }
}

@media(max-width:580px){
  :root { --nav-h: 60px; }

  nav { padding: 0 4%; }
  .logo-mark { width: 44px; height: 44px; }
  .logo-mark img { width: 44px; height: 44px; }
  .logo-text { font-size: .9rem; }
  .btn-orcamento { padding: 8px 13px; font-size: .78rem; }

  .hero {
    padding: calc(var(--nav-h) + 32px) 5% 48px;
  }
  .hero h1 { font-size: clamp(1.75rem, 7vw, 2.2rem); line-height: 1.15; }
  .hero p { font-size: .9rem; margin-bottom: 28px; }
  .hero-badge { font-size: .7rem; padding: 6px 12px; }

  .stats-section { padding: 48px 5%; }
  .stats-section-title { font-size: 1.3rem; }
  .stats-bar { grid-template-columns: 1fr 1fr; gap: 12px; }
  .stat-item { padding: 22px 16px; gap: 12px; }
  .stat-val { font-size: 1.6rem; }
  .stat-icon-wrap { width: 42px; height: 42px; border-radius: 12px; }
  .stat-icon-wrap svg { width: 20px; height: 20px; }

  section { padding: 52px 4%; }
  .sec-title { font-size: clamp(1.4rem, 5vw, 1.75rem); }
  .sec-sub { font-size: .9rem; }

  .qs-grid { gap: 28px; margin-top: 28px; }
  .qs-text p { font-size: .9rem; }

  .sv-grid { grid-template-columns: 1fr; gap: 14px; }
  .sv-card { padding: 24px 20px; }

  #cta-cards { padding: 52px 4%; }
  .cards-row { grid-template-columns: 1fr; gap: 14px; }
  .cta-card { aspect-ratio: 16/9; }
  .cta-overlay h3 { font-size: 1.1rem; }

  .cl-grid { grid-template-columns: repeat(2, 1fr); gap: 12px; }
  .cl-card { padding: 20px 12px; min-height: 140px; gap: 8px; }
  .client-img { height: 70px; }
  .cl-card span { font-size: .72rem;line-height: 1.2; }

  .ob-grid { grid-template-columns: 1fr; gap: 16px; }

  .or-grid { gap: 32px; }
  .or-perks { gap: 16px; }
  .or-ci { font-size: .82rem; }
  .form-card { padding: 24px 18px; border-radius: 16px; }
  .form-card h3 { font-size: 1.05rem; margin-bottom: 20px; }
  .fg input, .fg select, .fg textarea { padding: 11px 12px; font-size: .85rem; }
  .form-submit { padding: 14px; font-size: .9rem; }

  .footer-grid { grid-template-columns: 1fr; gap: 28px; }
  .footer-bottom { flex-direction: column; text-align: center; gap: 12px; }
  footer { padding: 48px 5% 24px; }

  .whatsapp-float { bottom: 16px; right: 12px; }
  .instagram-float { bottom: 66px; right: 12px; left: auto; }
  .wa-btn { width: 50px; height: 50px; }
  .wa-btn svg { width: 24px; height: 24px; }
  .ig-btn { width: 50px; height: 50px; }
  .ig-btn svg { width: 24px; height: 24px; }
  .wa-bubble { display: none; }

  .scroll-indicator { display: none; }

  .drawer { width: 85%; max-width: 300px; padding: 24px 20px; }
  .drawer-nav li a { font-size: 1rem; padding: 12px 0; }
}
