/* ═════════ Celular e tablet (até 1099px): o palco de 1440 vira fluxo normal ═════════ */
@media (max-width: 1099px) {
  :root { --pad: 40px; }
  .sec { padding: 96px 0; }
  .stage { width: auto; height: auto; zoom: 1; padding: 0 var(--pad); max-width: 860px; }
  .cv { position: static; width: auto; height: auto; }
  .peca { position: absolute; }

  /* nav */
  .hdr-bar { height: 72px; padding: 0 var(--pad); gap: 12px; }
  .hdr.mini .hdr-bar, .hdr.aberto .hdr-bar { max-width: calc(100% - 20px); height: 60px; margin-top: 10px; padding: 0 8px 0 16px; border-radius: 12px; background: rgba(246, 243, 239, .9); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); box-shadow: 0 0 0 1px rgba(46, 44, 42, .08), 0 18px 40px -26px rgba(46, 44, 42, .45); color: var(--fg); }
  .hdr.aberto.escuro .hdr-bar { background: rgba(246, 243, 239, .95); color: var(--fg); }
  .hdr .marca-bc .mono-bc { font-size: 30px; }
  .marca-bc .nm { font-size: 13px; }
  .hdr-links, .hdr-dir .ig { display: none; }
  .hdr-dir { margin-left: auto; }
  .hdr-menu { display: inline-flex; align-items: center; gap: 10px; height: 44px; padding: 0 14px; border-radius: 6px; font-size: 15px; font-weight: 500; box-shadow: inset 0 0 0 1px rgba(46, 44, 42, .16); }
  .hdr.mini.escuro:not(.aberto) .hdr-menu { box-shadow: inset 0 0 0 1px rgba(244, 242, 239, .3); }
  .hdr-menu i { position: relative; width: 16px; height: 10px; }
  .hdr-menu i::before, .hdr-menu i::after { content: ''; position: absolute; left: 0; right: 0; height: 1.5px; background: currentColor; transition: transform .3s var(--ease), top .3s var(--ease); }
  .hdr-menu i::before { top: 1px; } .hdr-menu i::after { top: 8px; }
  .hdr.aberto .hdr-menu i::before { top: 4.5px; transform: rotate(45deg); }
  .hdr.aberto .hdr-menu i::after { top: 4.5px; transform: rotate(-45deg); }
  .menu-painel { pointer-events: auto; position: absolute; top: 78px; left: 10px; right: 10px; display: flex; flex-direction: column; padding: 10px 20px 20px; border-radius: 12px; background: #FBF9F6; box-shadow: 0 0 0 1px rgba(46, 44, 42, .08), 0 30px 60px -30px rgba(46, 44, 42, .5); opacity: 0; transform: translateY(-8px) scale(.98); transform-origin: top center; visibility: hidden; transition: opacity .25s var(--ease), transform .35s var(--ease), visibility 0s .35s; }
  .hdr.aberto .menu-painel { opacity: 1; transform: none; visibility: visible; transition: opacity .25s var(--ease), transform .35s var(--ease); }
  .menu-painel a:not(.btn) { padding: 13px 0; font-family: var(--f-titulo); font-size: 24px; letter-spacing: -.02em; border-bottom: 1px solid var(--line); }
  .menu-painel .btn { margin-top: 18px; height: 50px; justify-content: center; font-size: 16px; }

  /* 01 hero */
  .sec.hero { padding: 112px 0 64px; }
  .hero .topo { position: static; text-align: center; }
  .hero .eyebrow { font-size: 14px; max-width: 30ch; margin: 0 auto; }
  .hero h1 { font-size: 54px; margin-top: 14px; text-wrap: balance; }
  .hero .acoes { justify-content: center; flex-wrap: wrap; margin-top: 28px; }
  .hero .acoes .btn { height: 48px; }
  .hero .colagem { position: relative; width: 100%; max-width: 520px; aspect-ratio: 39 / 42; margin: 36px auto 0; }
  .hero .tabela, .hero .tabela2, .hero .ficha { display: none; }
  .hero .dra { left: 17%; top: 0; width: 64%; }
  .hero .kraft { left: 0; top: 50%; width: 42%; }
  .hero .bilhete { left: auto; right: -2%; top: 61%; width: 56%; z-index: 5; }
  .hero .bilhete .assin { font-size: clamp(30px, 8.6vw, 46px); left: 8%; top: 12%; }
  .hero .bilhete .quem { font-size: clamp(10.5px, 2.9vw, 14px); left: 10%; top: 50%; }
  .hero .selo { left: auto; right: 0; top: 3%; width: 21%; height: auto; aspect-ratio: 1; }
  .hero .metrica { position: relative; left: auto; top: auto; width: 100%; max-width: 380px; margin: -28px auto 0; z-index: 7; }

  /* 02 statement */
  .stmt .frase { position: static; width: auto; font-size: 40px; line-height: 1.1; text-wrap: pretty; }
  .stmt .colagem { display: grid; grid-template-columns: 1fr; gap: 24px; margin-top: 40px; }
  .stmt .tabela, .stmt .lilas, .stmt .bolinha, .stmt .marca { display: none; }
  .stmt .retrato { position: relative; left: auto; top: auto; width: 100%; height: 420px; max-width: 520px; margin: 0 auto; }
  .stmt .retrato .fundo { left: -10%; top: 26%; width: 120%; max-width: none; }
  .stmt .retrato .pessoa { left: 50%; top: 18px; width: 300px; translate: -50% 0; }
  .painel { position: relative; left: auto; top: auto; width: 100%; height: auto; grid-template-columns: 1fr; border-radius: 10px; overflow: hidden; }
  .painel .trilho { display: none; }
  .painel .cab { flex-wrap: wrap; height: auto; padding: 14px 18px; row-gap: 2px; }
  .painel .corpo { grid-template-columns: 1fr 1.3fr; }
  .painel .dados { padding: 18px; }
  .painel .tl { padding: 18px; }
  .tl .t { white-space: normal; line-height: 1.4; padding-top: 4px; }

  /* 03 procedimentos */
  .proc .cv { display: grid; grid-template-columns: 1fr 1.15fr; column-gap: 40px; align-items: start; }
  .proc .esq { position: static; width: auto; grid-column: 1 / -1; }
  .proc .esq h2 { font-size: 40px; max-width: 16ch; }
  .proc .quadro { position: sticky; top: 96px; left: auto; width: 100%; height: auto; margin-top: 44px; }
  .proc .quadro .papel { left: -16px; top: -24px; width: 62%; }
  .proc .fotos { position: relative; left: auto; top: auto; width: 100%; height: auto; aspect-ratio: 4 / 3.3; transform: rotate(1deg); }
  .proc .legenda { display: none; }
  .proc .acao { position: static; grid-column: 1 / -1; margin-top: 36px; }
  .proc .lista { position: static; margin-top: 44px; grid-column: 2; grid-row: 2 / span 1; }
  .proc .item { grid-template-columns: 34px 1fr; padding: 18px 0; }
  .proc .item .seta { display: none; }
  .proc .item .nome { font-size: 26px; color: var(--fg); }
  .proc .item.on .nome { transform: none; }
  .proc .item .script { color: #6E6660; }
  .proc .desc-m { display: block; font-size: 15px; line-height: 1.5; color: #57524D; margin-top: 8px; }

  /* 04 números */
  .nums .mancha { left: auto; right: -110px; top: 40px; width: 190px; }
  .nums .tit { position: static; width: auto; max-width: 11ch; font-size: 40px; }
  .nums .nota { position: static; display: inline-block; margin-top: 14px; }
  .nums .lista { position: static; margin-top: 36px; }
  .nums .lin { grid-template-columns: 44% 1fr; height: auto; padding: 26px 0; gap: 16px; }
  .nums .val { font-size: 56px; }
  .nums .rot { font-size: 15.5px; }

  /* 05 primeira vez */
  .consulta .tit { position: static; width: auto; font-size: 42px; max-width: 14ch; }
  .consulta .passos { position: static; margin-top: 40px; }
  .consulta .passo { flex: 1; width: auto; min-height: 44px; }
  .consulta .bloco { position: relative; left: auto; top: auto; width: auto; height: 300px; margin-top: 30px; }
  .consulta .bl { inset: 0 0 auto 0; }
  .consulta .bl h3 { font-size: 32px; }
  .consulta .bl p { font-size: 16.5px; }
  .consulta .bloco .btn { top: auto; bottom: 0; height: 48px; }
  .consulta .glow, .consulta .linha-base { display: none; }
  .consulta .dra-mini { position: relative; display: inline-block; vertical-align: middle; left: auto; top: auto; width: 76px; height: 76px; margin-top: 52px; box-shadow: none; }
  .consulta .quem-recebe { position: relative; display: inline-block; vertical-align: middle; left: auto; top: auto; margin: 52px 0 0 12px; font-size: 19px; }
  .consulta .card { position: relative; left: auto; top: auto; width: 100%; max-width: 520px; margin-top: 22px; }

  /* 06 manifesto */
  .sec.mani { padding-top: 96px; }
  .mani .tab, .mani .termo { display: none; }
  .mani .colagem { display: flex; justify-content: center; }
  .mani .circ { position: relative; left: auto; top: auto; width: 140px; height: 140px; }
  .mani h2 { position: static; font-size: 46px; margin-top: 26px; text-wrap: balance; }
  .mani .cols { position: static; grid-template-columns: 1fr 1fr; gap: 40px; margin-top: 40px; }
  .mani .cols p { font-size: 17px; }
  .mani .cols .frase { font-size: 25px; margin-top: 0; }

  /* 07 depoimentos */
  .dep .rotulo { position: static; display: inline-block; font-size: 28px; }
  .dep .quotes { position: relative; left: auto; top: auto; width: 100%; height: 330px; margin-top: 34px; }
  .dep .q p { font-size: 34px; line-height: 1.15; }
  .dep .q .quem { margin-top: 22px; flex-wrap: wrap; row-gap: 4px; }
  .dep .rodape { position: static; flex-wrap: wrap; gap: 16px 22px; margin-top: 12px; }
  .dep .rodape .btn { height: 46px; }
  .dep .colagem { display: none; }
  .dep .gcard { position: relative; left: auto; top: auto; width: 100%; max-width: 340px; margin: 48px auto 0; transform: rotate(1.5deg); }
  .sec.dep:not(.vis) .gcard.rv { transform: translateY(16px) rotate(1.5deg); }

  /* 08 dúvidas */
  .faq .cv { display: flex; flex-direction: column; }
  .faq .mancha { left: auto; right: -120px; top: 30px; width: 200px; }
  .faq .esq { position: static; width: auto; max-width: 560px; }
  .faq .esq .btn { align-self: flex-start; }
  .faq .esq h2 { font-size: 42px; }
  .faq .esq .btn { margin-top: 26px; height: 48px; }
  .faq .lista { position: static; margin-top: 40px; order: 2; }
  .faq .aviso { position: static; width: auto; order: 3; margin-top: 24px; }
  .faq .lin .r { font-size: 40px; }

  /* 09 contato */
  .sec.contato { padding: 12px 0 0; }
  .contato .stage { padding: 0 12px; max-width: none; }
  .contato .card { position: relative; left: auto; right: auto; top: auto; height: auto; display: flex; flex-direction: column; }
  .contato .card .foto { position: relative; width: 100%; height: 440px; order: -1; background-position: 50% 20%; }
  .contato .card .foto::after { background: linear-gradient(0deg, var(--cafe-2) 0%, rgba(74, 71, 68, 0) 38%); }
  .contato .txt { position: static; width: auto; padding: 8px 28px 36px; }
  .contato h2 { font-size: 42px; margin-top: 20px; }
  .contato .chip { flex-wrap: wrap; row-gap: 8px; }
  .contato .chip span { white-space: nowrap; }
  .contato .sub { font-size: 16.5px; }
  .contato .acoes { flex-wrap: wrap; margin-top: 28px; }
  .contato .acoes .btn { height: 48px; }
  .contato .info { position: static; grid-template-columns: 1fr 1fr 1fr; gap: 32px 28px; padding: 48px 16px 8px; }
  .contato .info > div:first-child { grid-column: 1 / -1; }
  .contato .base { position: static; flex-direction: column; gap: 6px; margin: 32px 16px 0; padding: 20px 0 28px; }
}

/* tablet em pé: um pouco mais compacto */
@media (max-width: 899px) and (min-width: 768px) {
  .proc .cv { grid-template-columns: 1fr 1.2fr; column-gap: 32px; }
}

/* ═════════ Celular (até 767px) ═════════ */
@media (max-width: 767px) {
  :root { --pad: 20px; }
  .sec { padding: 80px 0; }
  .hdr-bar { height: 64px; }
  .hdr-dir { display: none; }
  .hdr-menu { margin-left: auto; }
  .hdr .marca-bc .mono-bc { font-size: 28px; }

  /* WhatsApp flutuante depois do hero */
  .wa-float { position: fixed; z-index: 40; right: 16px; bottom: calc(16px + env(safe-area-inset-bottom)); display: inline-flex; align-items: center; gap: 8px; height: 52px; padding: 0 20px 0 16px; border-radius: 99px; background: var(--cafe); color: var(--creme); font-size: 15px; font-weight: 500; box-shadow: 0 0 0 1px rgba(244, 242, 239, .12), 0 16px 34px -14px rgba(46, 44, 42, .7); opacity: 0; transform: translateY(14px) scale(.96); pointer-events: none; transition: opacity .3s var(--ease), transform .4s var(--ease); }
  .wa-float svg { width: 20px; height: 20px; }
  .wa-float.on { opacity: 1; transform: none; pointer-events: auto; }
  .wa-float:active { transform: scale(.97); }

  .sec.hero { padding: 96px 0 48px; }
  .hero .eyebrow { font-size: 13.5px; max-width: 28ch; }
  .hero h1 { font-size: clamp(31px, 9vw, 40px); line-height: 1.08; text-wrap: initial; }
  .hero .acoes { flex-direction: column; align-items: stretch; gap: 10px; max-width: 340px; margin-left: auto; margin-right: auto; }
  .hero .acoes .btn { justify-content: center; }
  .hero .colagem { margin-top: 32px; }
  .hero .metrica { padding: 18px 18px 14px; margin-top: -18px; }
  .metrica .val { font-size: 42px; }
  .metrica .grafico { width: 110px; }

  .stmt .frase { font-size: 29px; line-height: 1.14; text-align: center; }
  .stmt .retrato { height: 360px; }
  .stmt .retrato .pessoa { width: 250px; }
  .painel .corpo { grid-template-columns: 1fr; }
  .painel .dados { border-right: 0; border-bottom: 1px solid var(--line); }

  .proc .cv { display: block; }
  .proc .esq h2 { font-size: 34px; }
  .proc .quadro { position: relative; top: auto; margin-top: 40px; }
  .proc .fotos { aspect-ratio: 4 / 3; }
  .proc .lista { margin-top: 32px; }
  .proc .item .nome { font-size: 24px; }
  .proc .acao .btn { height: 48px; }

  .nums .mancha { right: -96px; width: 150px; top: 24px; }
  .nums .tit { font-size: 34px; }
  .nums .lin { grid-template-columns: 1fr; gap: 6px; padding: 22px 0; }
  .nums .val { font-size: 52px; }

  .consulta .tit { font-size: 34px; }
  .consulta .passos { gap: 6px; }
  .consulta .passo { font-size: 12.5px; }
  .consulta .bloco { height: 330px; }
  .consulta .bl h3 { font-size: 28px; }
  .consulta .card { padding: 18px 16px 20px; }
  .consulta .card .nm { font-size: 19px; }

  .sec.mani { padding-top: 80px; }
  .mani h2 { font-size: 36px; }
  .mani .cols { grid-template-columns: 1fr; gap: 24px; margin-top: 30px; }
  .mani .cols .frase { font-size: 23px; }
  .mani .ass { flex-wrap: wrap; gap: 6px 16px; }
  .mani .ass .assin { font-size: 44px; }

  .dep .rotulo { font-size: 25px; }
  .dep .quotes { height: 390px; margin-top: 26px; }
  .dep .q p { font-size: 27px; line-height: 1.18; }
  .dep .rodape .google { flex-basis: 100%; order: -1; }

  .faq .esq h2 { font-size: 34px; }
  .faq .mancha, .nums .mancha { display: none; }
  .faq .esq h2, .nums .tit { max-width: none; }
  .faq .lin .r { font-size: 34px; }
  .faq .lin p { font-size: 15.5px; }

  .contato .stage { padding: 0 10px; }
  .contato .card .foto { height: 380px; }
  .contato .txt { padding: 4px 20px 30px; }
  .contato h2 { font-size: 34px; }
  .contato .acoes { flex-direction: column; align-items: stretch; }
  .contato .acoes .btn { justify-content: center; }
  .contato .info { grid-template-columns: 1fr 1fr; padding: 40px 10px 0; gap: 28px 20px; }
  .contato .info > div:nth-child(2), .contato .info > div:nth-child(3) { grid-column: 1 / -1; }
  .contato .base { margin: 28px 10px 0; padding-bottom: 96px; }
}

/* toque: área mínima de 44px */
@media (pointer: coarse) {
  .contato .info a.vl { display: inline-block; padding: 10px 0; margin: -10px 0; }
}