/*!
 * servicoponto.responsive.css — FIX v4 (carregado após main.css)
 * Foco: forçar menu mobile + quebras das grids em mobile, eliminar qualquer overflow.
 * Regras com maior especificidade e !important para sobrepor main.css.
 */

/* ===== Segurança global contra overflow ===== */

/* ===== GUTTERS (todas as seções desta página) ===== */
@media (max-width:1024px){
  #ponto-intro, #ponto-numeros, #ponto-consultoria, #ponto-recursos, #ponto-avancados, #ponto-equipamentos, #ponto-experimente,
  .ponto-section, .recursos-v2, .avancados-v2{
    padding-left:32px; padding-right:32px;
  }
}
@media (max-width:768px){
  #ponto-intro, #ponto-numeros, #ponto-consultoria, #ponto-recursos, #ponto-avancados, #ponto-equipamentos, #ponto-experimente,
  .ponto-section, .recursos-v2, .avancados-v2{ padding-left:20px; padding-right:20px; }
}
@media (max-width:500px){
  #ponto-intro, #ponto-numeros, #ponto-consultoria, #ponto-recursos, #ponto-avancados, #ponto-equipamentos, #ponto-experimente,
  .ponto-section, .recursos-v2, .avancados-v2{ padding-left:16px; padding-right:16px; }
}
@media (max-width:360px){
  #ponto-intro, #ponto-numeros, #ponto-consultoria, #ponto-recursos, #ponto-avancados, #ponto-equipamentos, #ponto-experimente,
  .ponto-section, .recursos-v2, .avancados-v2{ padding-left:12px; padding-right:12px; }
}

/* ===== GRIDs QUEBRANDO CORRETAMENTE ===== */

/* Intro cards 3→2→1 */
.ponto-grid{ display:grid; gap:24px; }
.ponto-grid-3{ grid-template-columns: repeat(3, minmax(0,1fr)); }
@media (max-width:1200px){ .ponto-grid-3{ grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (max-width:768px){ .ponto-grid-3{ grid-template-columns: 1fr !important; } }

/* Consultoria 2 colunas → 1 em ≤1024 */
.ponto-retrofit-layout{ display:grid; grid-template-columns: 1.05fr .95fr; gap:24px; align-items:start; }
.ponto-retrofit-layout>*{ min-width:0; }
@media (max-width:1024px){
  .ponto-retrofit-layout{ grid-template-columns: 1fr !important; }
}

/* Recursos do sistema (rail) 2→1 e título em cima */
.recursos-rail{ display:grid; grid-template-columns: .95fr 1.05fr; gap:24px; align-items:start; }
.recursos-rail>*{ min-width:0; }
@media (max-width:1024px){
  .recursos-rail{ grid-template-columns: 1fr !important; }
  .recursos-aside{ position: static !important; order: -1; margin-bottom: 14px; }
}
/* Rows dos recursos sem overflow */
.recurso-row{ display:grid; grid-template-columns: minmax(36px,44px) 1fr; gap:12px; align-items:flex-start; padding:16px; border-radius:12px; min-width:0; }
.recurso-icon{ width:44px; height:44px; flex:0 0 auto; display:flex; align-items:center; justify-content:center; }
.recurso-body{ min-width:0; }
@media (max-width:500px){ .recurso-row{ grid-template-columns:32px 1fr; padding:14px; gap:10px; } .recurso-icon{ width:32px; height:32px; } }



@media (min-width:1920px){ 
  .ponto-section{padding: 80px 300px 60px 300px;}
  .ponto-consultoria{padding: 60px 300px;}  
  .ponto-recursos-avancados{padding: 60px 300px;}  
  .ponto-recursos-sistema{padding: 60px 300px;}  
}

/* Banda de benefícios 4→2→1 */
.ponto-band{ display:grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap:16px; align-items:center; padding:14px; border-radius:12px; }
@media (max-width:1024px){ .ponto-band{ grid-template-columns: 1fr 1fr !important; } }
@media (max-width:600px){ .ponto-band{ grid-template-columns: 1fr !important; } .ponto-cta{ width:100%; } }


/* Métricas — forçar quebra responsiva (3→2→1) */
.ponto-metrics{
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 16px !important;
}
.ponto-metrics > *{ min-width: 0; } /* evita overflow dos cards */

/* 2 colunas em tablets */
@media (max-width: 1024px){
  .ponto-metrics{ grid-template-columns: 1fr 1fr !important; }
}

/* 1 coluna no mobile */
@media (max-width: 640px){
  .ponto-metrics{ grid-template-columns: 1fr !important; }
}

/* CTA da última sessão: nunca ultrapassar a caixa */
.ponto-band .ponto-cta,
.ponto-band a.btn,
.ponto-band a[class*="cta"],
.ponto-band button{
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important; /* inclui o padding na largura */
  margin-left: 0 !important;
  margin-right: 0 !important;
  text-align: center;
}

/* garante que o arredondado do container não “corte” feio */
.ponto-band{ overflow: hidden; }

/* layout em colunas da seção */
.ponto-recursos-avancados .recursos-rail{
  display: grid;
  grid-template-columns: minmax(280px,420px) 1fr;
  gap: 32px;
  align-items: start;
}

/* deixa o aside “grudado” enquanto rola */
.ponto-recursos-avancados .recursos-aside{
  position: sticky;
  top: 110px;         /* ajuste conforme a altura do seu header */
  align-self: start;  /* garante que o sticky funcione dentro do grid */
}

/* mobile: desativa o sticky e empilha */
@media (max-width:1024px){
  .ponto-recursos-avancados .recursos-rail{ grid-template-columns: 1fr; }
  .ponto-recursos-avancados .recursos-aside{ position: static; }
}

