/* Click Solucoes - ajustes responsivos mobile */
html, body { max-width: 100%; overflow-x: hidden; }
*, *::before, *::after { box-sizing: border-box; }
img, video, iframe { max-width: 100%; height: auto; }
svg { max-width: 100%; }
input, textarea, select, button { max-width: 100%; }

@media (max-width: 767px) {
  body { font-size: 16px; }

  /* Cabecalho: evita corte lateral e mantem menu utilizavel */
  header[style*="position:sticky"] {
    position: relative !important;
    padding: 10px 14px !important;
    gap: 10px !important;
    flex-direction: column !important;
    align-items: center !important;
  }
  header[style*="position:sticky"] > a,
  header[style*="position:sticky"] > img {
    align-self: center !important;
  }
  header[style*="position:sticky"] > div {
    width: 100% !important;
    min-width: 0 !important;
    justify-content: center !important;
    gap: 10px !important;
  }
  header[style*="position:sticky"] nav {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    flex-wrap: nowrap !important;
    white-space: nowrap;
    gap: 14px !important;
    padding: 8px 10px !important;
    border-radius: 14px !important;
    scrollbar-width: none;
  }
  header[style*="position:sticky"] nav::-webkit-scrollbar { display: none; }
  header[style*="position:sticky"] nav a { flex: 0 0 auto; }
  header[style*="position:sticky"] > div > div {
    justify-content: center !important;
    flex-wrap: wrap !important;
  }

  /* Home */
  #inicio {
    grid-template-columns: 1fr !important;
    gap: 20px !important;
    padding: 28px 16px 0 !important;
    text-align: center !important;
  }
  #inicio > div { min-width: 0 !important; }
  #inicio h1 {
    font-size: clamp(32px, 10vw, 44px) !important;
    line-height: 1.08 !important;
    overflow-wrap: anywhere;
  }
  #inicio p { margin-left: auto !important; margin-right: auto !important; }
  #inicio > div > div { justify-content: center !important; }
  #inicio > img {
    width: 100% !important;
    max-width: 420px !important;
    margin: 0 auto !important;
  }
  #solucoes-topo {
    margin-top: 0 !important;
    padding: 24px 16px !important;
  }
  #solucoes-topo > div { grid-template-columns: 1fr !important; }
  #sobre { padding-left: 16px !important; padding-right: 16px !important; }
  #sobre > div { grid-template-columns: 1fr !important; gap: 22px !important; }
  #sobre > div > img { max-width: 280px !important; margin: 0 auto !important; }
  #depoimentos, #blog-preview, #solucoes, #faq, #contato {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
  #contato form > div[style*="grid-template-columns"] { grid-template-columns: 1fr !important; }

  /* Paginas internas e blog */
  section[style*="max-width"] {
    max-width: 100% !important;
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
  main {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
  main h1 {
    font-size: clamp(30px, 9vw, 42px) !important;
    line-height: 1.12 !important;
    overflow-wrap: anywhere;
  }
  main h2, main h3, main p, main li, main a { overflow-wrap: anywhere; }

  /* Cards: uma coluna em telas estreitas */
  div[style*="grid-template-columns:repeat(auto-fit,minmax(280px,1fr))"],
  div[style*="grid-template-columns:repeat(auto-fit,minmax(300px,1fr))"],
  div[style*="grid-template-columns:repeat(auto-fit,minmax(260px,1fr))"] {
    grid-template-columns: 1fr !important;
  }

  /* Posts relacionados dentro dos artigos */
  section[aria-label="Posts mais recentes"] {
    grid-template-columns: 1fr !important;
  }
  section[aria-label="Posts mais recentes"] img {
    height: auto !important;
    aspect-ratio: 16 / 9;
  }

  /* Formularios */
  form { min-width: 0 !important; }
  form [style*="grid-template-columns:1fr 1fr"] { grid-template-columns: 1fr !important; }
  input, textarea, select { width: 100% !important; min-width: 0 !important; font-size: 16px !important; }

  /* Comentarios */
  #comentarios, .comments-section { max-width: 100% !important; }
  .comments-container, .comment-form-card, #form-comentario {
    max-width: 100% !important;
    min-width: 0 !important;
  }
  .comment-form-card { padding: 20px !important; }

  /* Rodape */
  footer {
    padding: 20px 16px !important;
    gap: 10px !important;
    text-align: center !important;
  }
  footer > * { max-width: 100% !important; }

  /* WhatsApp flutuante um pouco menor no celular */
  a[aria-label="Falar no WhatsApp"][style*="position:fixed"] {
    right: 14px !important;
    bottom: 14px !important;
    width: 54px !important;
    height: 54px !important;
  }
}

@media (max-width: 380px) {
  header[style*="position:sticky"] { padding-left: 10px !important; padding-right: 10px !important; }
  header[style*="position:sticky"] nav { font-size: 14px !important; gap: 12px !important; }
  #inicio { padding-left: 12px !important; padding-right: 12px !important; }
  section[style*="max-width"], main { padding-left: 12px !important; padding-right: 12px !important; }
  .comment-form-card { padding: 16px !important; }
}