/* Delivery no celular (até 820 px): leve, sem iframes e com seções curtas. Carregado por último, por cima do resto. */
@media(max-width:1024px){
  /* leveza: nada de brilho animado, varredura nos botões ou iframes pesados */
  .bg-glow{display:none}
  .hero .led,.led .glow{animation:none!important}
  .btn::after,.kick::after,.homebtn::after{display:none!important;animation:none!important}
  .nav{backdrop-filter:none;-webkit-backdrop-filter:none;background:#161826f5}
  .homebtn{display:none!important}
  .wrap{padding:0 18px}

  /* topo: título, benefício e botão logo na primeira tela */
  .hero{padding:26px 0 10px}
  .hero .wrap{display:flex!important;flex-direction:column;gap:16px}
  .hero h1{font-size:clamp(34px,10.4vw,44px);margin:16px 0 12px}
  .hero .l{font-size:16.5px;line-height:1.55}
  .hero .stage{display:none!important}
  .hero .chk{grid-template-columns:1fr!important;gap:8px}
  .hero .chk li{flex-direction:row!important;align-items:center!important;justify-content:flex-start!important;text-align:left!important;gap:12px!important;padding:11px 14px!important;font-size:15px!important;border-radius:14px}
  .hero .chk li::before{width:26px!important;height:26px!important;font-size:13px!important}
  .hero .led{display:none!important}
  .hero .row{gap:10px}.hero .row .btn{flex:1 1 100%;min-height:52px}

  /* "como contratar": as 3 opções lado a lado, todas visíveis de uma vez */
  #escolha{padding:8px 0}
  #escolha .ap-t{margin-bottom:10px}#escolha .ap-t b{font-size:15.5px;line-height:1.3}
  #escolha .ap-g{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:8px!important;overflow:visible!important;scroll-snap-type:none!important}
  #escolha .ap-p{display:none!important}
  #escolha .ap-c{flex:none!important;display:flex!important;flex-direction:column;align-items:center;justify-content:flex-start;text-align:center;gap:4px;padding:12px 6px 10px!important;min-width:0;border-radius:16px}
  #escolha .ap-c i{font-size:28px!important}#escolha .ap-c b{font-size:13px!important;line-height:1.2!important;width:100%!important;max-width:100%!important;min-width:0!important;margin:0!important;padding:0!important;white-space:normal!important;overflow-wrap:break-word;text-align:center!important}
  #escolha .ap-c span{display:none!important}
  #escolha .ap-c em{position:static!important;margin-top:2px;padding:2px 7px!important;font-size:9.5px!important;letter-spacing:.04em}
  #escolha .ap-n{font-size:13px;margin-top:10px}

  /* seções */
  .sec{padding:44px 0}
  .sec h2{font-size:clamp(27px,8.2vw,36px);line-height:1.08}
  .sec .s{font-size:16px;margin-bottom:22px}
  .trust .wrap{gap:6px 16px}.trust span{font-size:13px}

  /* galeria de estilos: cartões, sem as 6 demos rodando ao mesmo tempo */
  .pv{display:none!important}
  .gal{grid-template-columns:1fr!important;gap:12px}
  .gal .card{border-top:4px solid var(--c)}

  /* "monte o prato": só o essencial */
  .mt-info2{display:none}
  .mt-grid{gap:0}

  /* seções longas começam fechadas */
  .mx-box{position:relative}
  .mx-box.limite:not(.open){max-height:620px;overflow:hidden}
  .mx-box.limite:not(.open)::after{content:"";position:absolute;left:0;right:0;bottom:0;height:130px;background:linear-gradient(transparent,var(--bg));pointer-events:none}
  .mx-mais[hidden]{display:none}
  .mx-mais{display:block;width:100%;min-height:50px;margin-top:6px;border:1.5px solid #9184d9;border-radius:14px;background:#9184d91a;color:#d2cefd;font:700 15.5px Inter}
  .mx-mais:focus-visible{outline:3px solid #d2cefd;outline-offset:2px}

  /* janela de ver a demo */
  .mh{padding:8px 12px;gap:8px}.mh b{font-size:16px;flex:1 1 auto}.mh .btn{padding:8px 12px;font-size:13px}.mh .x{width:34px;height:34px}.mb{padding:4px}.mb iframe{border-radius:10px}

  /* botões flutuantes: fica só o do WhatsApp (o chat do site sai daqui para não cobrir o conteúdo) */
  #lhc-btn,#lhc{display:none!important}
}

/* CELULAR (até 560 px): mais informação por tela. Cartões em 2 colunas ou em carrossel (deslizar para o lado); perguntas abrem ao tocar */
@media(max-width:560px){
  /* 2 colunas, textos menores */
  .gain,.feat,.need,.flow,.steps{grid-template-columns:1fr 1fr!important;gap:10px!important}
  .gain .gc,.feat .ft,.need>div,.flow .fl{padding:13px 12px!important;border-radius:16px!important;min-width:0}
  .gain .gc,.feat .ft,.need>div,.flow .fl{text-align:left!important;align-items:flex-start!important}
  .gc .k{display:inline-block;padding:4px 9px!important}
  .gc i,.ft i{font-size:24px!important}
  .gc h3,.ft h4{font-size:15px!important;line-height:1.2!important;margin:6px 0 4px!important}
  .gc p,.ft p{font-size:13px!important;line-height:1.4!important;margin:0 0 8px!important}
  .gc .k{font-size:10.5px!important;letter-spacing:.06em!important}
  .need>div b{font-size:14.5px!important;line-height:1.25}.need>div span{font-size:12.5px!important;line-height:1.35}
  .flow .fl{border-radius:16px!important;border:1px solid var(--ln)!important}.flow .fl b{font-size:14px!important}.flow .fl span{font-size:12.5px!important}
  .steps .stp{padding:10px!important;gap:8px!important;min-width:0}.steps .stp b{width:26px!important;height:26px!important;font-size:13px!important}.steps .stp span{font-size:13px!important}.steps .stp small{display:none}

  /* carrossel: o próximo cartão aparece pela metade, avisando que dá para deslizar */
  .three,.gal,.who,.pm{display:flex!important;gap:12px!important;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding:0 18px;margin:0 -18px!important;padding:0 18px 12px!important;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .three::-webkit-scrollbar,.gal::-webkit-scrollbar,.who::-webkit-scrollbar,.pm::-webkit-scrollbar{display:none}
  .three>*,.gal>*,.who>*,.pm>*{flex:0 0 80%!important;scroll-snap-align:start;min-width:0}
  .who>*{flex-basis:62%!important}
  .three .ap{padding:20px 18px!important}.three .ap h3{font-size:22px!important}.three .ap ul{font-size:14.5px!important;gap:7px!important}

  /* perguntas frequentes: lista curta, abre ao tocar */
  .faq{gap:8px!important}
  .faq .q{padding:14px 16px!important;cursor:pointer;border-radius:16px!important}
  .faq .q h3{font-size:16.5px!important;line-height:1.25!important;margin:4px 0 0!important;padding-right:26px;position:relative}
  .faq .q h3::after{content:"+";position:absolute;right:0;top:-2px;font:400 24px/1 Inter,sans-serif;color:#9184d9}
  .faq .q.aberto h3::after{content:"−"}
  .faq .q>p,.faq .q>ul{display:none}
  .faq .q.aberto>p,.faq .q.aberto>ul{display:block}
  .faq .q,.three .ap,.pm .pc{text-align:left!important}
  .faq .q>p,.faq .q>ul{font-size:15px!important;line-height:1.5!important}
  .faq .q ul{padding-left:18px!important;text-align:left!important}
  .faq .q:focus-visible{outline:3px solid #d2cefd;outline-offset:2px}
}