/* =============================================================
   ENCODE — Mobile das landing pages (≤720px)
   Reorganiza e diagrama hero, formulário, seções e rodapé
   para os dois sistemas: g2.css (Grupo 2/4) e lp.css (Grupo 1/3).
   Carregar SEMPRE por último.
   ============================================================= */
@media (max-width:720px){
  html,body{overflow-x:hidden;max-width:100%;}
  *{overflow-wrap:break-word;}

  /* ---- respiro lateral consistente ---- */
  .wrap{padding-left:20px !important;padding-right:20px !important;}

  /* =========================================================
     SISTEMA g2 (Grupo 2 e 4)
     ========================================================= */
  /* topo: logo centralizado */
  .top-in{justify-content:center !important;}
  .top .logo{height:17px;}

  /* hero empilha: texto em cima, formulário embaixo */
  .hero{min-height:auto !important;padding:96px 0 48px !important;}
  .hero-grid{grid-template-columns:1fr !important;gap:28px !important;}
  .hero .scrim{background:linear-gradient(180deg,rgba(6,6,6,.82),rgba(6,6,6,.72)) !important;}
  .hero h1{font-size:27px !important;line-height:1.14 !important;margin-top:14px !important;}
  .hero .lead{font-size:14.5px !important;margin-top:14px !important;max-width:none !important;}
  .hero .checklist{margin-top:18px !important;gap:8px !important;}
  .hero .checklist li{font-size:13.5px !important;}
  .hero-trust{margin-top:22px !important;}

  /* form card: largura total, respiro confortável */
  .formcard{width:100% !important;max-width:100% !important;box-sizing:border-box;padding:22px 18px !important;border-radius:18px !important;}
  .formcard .fc-head{margin-bottom:18px !important;padding-bottom:16px !important;}
  .formcard .fc-head h2{font-size:20px !important;}
  .formcard .fc-head p{font-size:13px !important;}
  .form{gap:14px !important;}
  .form .row{grid-template-columns:1fr !important;gap:14px !important;}
  .field label{font-size:12.5px !important;margin-bottom:2px;}
  .field input,.field select,.field textarea{width:100% !important;max-width:100% !important;box-sizing:border-box !important;padding:13px 14px !important;font-size:16px !important;border-radius:11px !important;}
  .form .btn,.formcard .btn{width:100% !important;padding:15px 20px !important;font-size:15px !important;box-sizing:border-box;justify-content:center;}

  /* seções: ritmo vertical e títulos */
  .section{padding:56px 0 !important;}
  .sec-head{margin-bottom:30px !important;max-width:none !important;}
  .h2{font-size:25px !important;line-height:1.16 !important;}
  .lead{font-size:15px !important;}
  .eyebrow{font-size:11px !important;}

  /* grids de cards → 1 coluna, alинhados */
  .grid3,.split,.prova,.quotes,.steps-grid{grid-template-columns:1fr !important;gap:14px !important;}
  .steps .rail{display:none !important;}
  .card{padding:22px 20px !important;}
  .card h3{font-size:16px !important;}

  /* imagem split ocupa largura toda */
  .media{aspect-ratio:16/10 !important;}
  .split{gap:26px !important;}

  /* tabela antes/depois: mantém 3 colunas compactas */
  .table .trow,.cmp-row{grid-template-columns:1fr 34px 1fr !important;}
  .table .trow>*,.cmp-row .cc{font-size:13px !important;}

  /* CTA band empilha */
  .ctaband{grid-template-columns:1fr !important;text-align:left;gap:18px !important;padding:28px 22px !important;}
  .ctaband .btn{width:100%;justify-content:center;}

  /* rodapé */
  .foot .row{flex-direction:column !important;align-items:flex-start !important;gap:16px;}

  /* =========================================================
     SISTEMA lp (Grupo 1 e 3)
     ========================================================= */
  .lp-hero{padding-top:92px !important;padding-bottom:48px !important;}
  .lp-hero-grid{grid-template-columns:1fr !important;gap:30px !important;align-items:start !important;}
  .lp-hero h1{font-size:27px !important;line-height:1.16 !important;max-width:none !important;}
  .lp-hero-sub{font-size:14.5px !important;margin-top:16px !important;max-width:none !important;}
  .lp-hero .checklist{margin-top:18px !important;}
  .lp-hero-actions{margin-top:26px !important;gap:12px !important;}
  .lp-hero-actions .btn{width:100%;justify-content:center;}

  /* form do hero / modal */
  .lp-hero-form,.lp-form{width:100% !important;max-width:100% !important;box-sizing:border-box;padding:22px 18px !important;}
  .lp-form .fg{grid-template-columns:1fr !important;gap:14px !important;}
  .lp-form .field input,.lp-form .field select,.lp-form .field textarea{width:100% !important;max-width:100% !important;box-sizing:border-box !important;font-size:16px !important;padding:13px 14px !important;}
  .lp-form .form-submit,.lp-form .btn{width:100% !important;justify-content:center;}

  /* seções lp */
  .sec{padding:56px 0 !important;}
  .lp-head{max-width:none !important;}
  .lp-head .h2,.sec .h2{font-size:25px !important;line-height:1.16 !important;}
  .sec-label{font-size:11px !important;margin-bottom:14px !important;}

  /* cards de problema → 1 coluna */
  .prob-top{grid-template-columns:1fr !important;gap:18px !important;margin-bottom:30px !important;}
  .prob-grid{grid-template-columns:1fr !important;gap:12px !important;}
  .prob-card{padding:20px 18px !important;min-height:0 !important;}
  .prob-card h3{font-size:15px !important;}
  .prob-title{white-space:normal !important;}
  .prob-title br{display:none;}

  /* fluxo / custo */
  .flow{grid-template-columns:1fr !important;gap:10px !important;}
  .flow-step{border-right:none !important;border-bottom:1px solid rgba(255,255,255,.12) !important;padding:16px 4px !important;}
  .flow-step .arrow{display:none !important;}
  .stats{grid-template-columns:1fr 1fr !important;gap:14px !important;}

  /* setores */
  .setores,.setores-7{grid-template-columns:repeat(3,1fr) !important;gap:8px !important;}
  .setor{padding:12px 6px !important;font-size:10.5px !important;}

  /* solução split */
  .sol-grid{grid-template-columns:1fr !important;gap:28px !important;}

  /* método / timeline */
  .tl-line,.tl-fill{display:none !important;}
  .tl-grid{grid-template-columns:1fr 1fr !important;row-gap:26px !important;column-gap:14px;}
  .tl-step{border-top:2px solid var(--cinza-200) !important;padding-top:16px !important;}
  .tl-step h3{font-size:15px !important;}
  .tl-step p{font-size:13px !important;}

  /* comparativo */
  .cmp-table{margin-top:30px !important;}
  .cmp-row{grid-template-columns:1fr 40px 1fr !important;}
  .cmp-row .cc{padding:13px 12px !important;font-size:12.5px !important;}
  .cmp-row.head .cc{font-size:10px !important;}

  /* cases */
  .cases-grid,.cases-single{grid-template-columns:1fr !important;}
  .cases-head{flex-direction:column !important;align-items:flex-start !important;gap:14px;}
  .case-img{aspect-ratio:16/10 !important;}

  /* diagnóstico / CTA final */
  .lp-form-sec .wrap{max-width:none !important;}
  .form-grid{grid-template-columns:1fr !important;gap:30px !important;}

  /* rodapé lp */
  .lp-foot-top{grid-template-columns:1fr !important;gap:26px !important;}
  .lp-foot-bot{flex-direction:column !important;align-items:flex-start !important;gap:8px;}

  /* separador de marca: onda mais discreta no mobile */
  .notch-sep svg,.notch svg{height:34px !important;}
}

/* telas bem estreitas */
@media (max-width:400px){
  .hero h1,.lp-hero h1{font-size:24px !important;}
  .setores,.setores-7{grid-template-columns:repeat(2,1fr) !important;}
  .stats{grid-template-columns:1fr !important;}
  .tl-grid{grid-template-columns:1fr !important;}
}