/* Responsive rules sit outside the exported visual layer. */
html { scroll-behavior: smooth; }
body { overflow-x: hidden; }

@media (max-width: 1439px) {
  #topo { width: 100% !important; height: auto !important; }
  #topo nav,
  #topo section,
  #topo footer {
    padding-left: clamp(32px, 6.67vw, 96px) !important;
    padding-right: clamp(32px, 6.67vw, 96px) !important;
  }
  #contato {
    margin-left: clamp(32px, 6.67vw, 96px) !important;
    margin-right: clamp(32px, 6.67vw, 96px) !important;
  }
}

@media (max-width: 900px) {
  #topo { width: 100% !important; height: auto !important; min-height: 100vh; overflow: hidden; }
  #topo nav {
    gap: 18px !important;
    padding: 20px !important;
    flex-wrap: wrap;
  }
  #topo nav > div {
    gap: 14px !important;
    flex-wrap: wrap;
    justify-content: flex-end;
  }
  #topo nav a { font-size: 13px !important; }
  #topo nav img { height: 36px !important; max-width: 170px; }
  #topo section,
  #topo footer { padding-left: 20px !important; padding-right: 20px !important; }
  #topo section { gap: 42px !important; }
  #topo section:first-of-type {
    align-items: stretch !important;
    flex-direction: column !important;
    padding-top: 72px !important;
    padding-bottom: 80px !important;
  }
  #topo section:first-of-type > div { width: auto !important; }
  #topo section:first-of-type h1,
  #topo section h2 { font-size: clamp(30px, 8vw, 42px) !important; }
  #topo section:first-of-type > div:nth-child(2) { width: 100% !important; }
  #bastidores > div:first-child {
    align-items: stretch !important;
    flex-direction: column !important;
    gap: 36px !important;
  }
  #bastidores > div:first-child > div { width: auto !important; }
  #bastidores > div:nth-child(2),
  #planos > div:nth-child(2),
  #servicos > div:nth-child(2),
  #como > div:nth-child(2) {
    grid-template-columns: 1fr !important;
  }
  #bastidores img { max-width: 100%; }
  #planos { text-align: left !important; }
  #planos > div:first-child { align-items: flex-start !important; text-align: left !important; }
  #faq {
    flex-direction: column !important;
    gap: 32px !important;
  }
  #faq > div:first-child { width: auto !important; }
  #contato {
    margin: 0 16px !important;
    padding: 64px 22px !important;
  }
  #contato h2 { font-size: clamp(30px, 8vw, 42px) !important; }
  #topo footer {
    flex-direction: column !important;
    gap: 30px !important;
    padding-top: 56px !important;
  }
  #topo footer > div:last-child { align-items: flex-start !important; }
}

@media (max-width: 520px) {
  #topo nav > div { width: 100%; justify-content: flex-start; }
  #topo nav a { font-size: 12px !important; }
  #topo section:first-of-type { padding-top: 54px !important; }
  #topo section:first-of-type h1 { font-size: 35px !important; }
  #bastidores > div:nth-child(2) { grid-template-columns: 1fr !important; }
  #contato { margin: 0 !important; border-radius: 0 !important; }
}