/* ====== URAH v58 produtos (crm, erp, licita): papelada passada a limpo ======
   Carregado por último nas três páginas de produto. Tema claro. Prefixo pp-. */
.pp{background:#fff}
.pp .container{padding-left:24px;padding-right:24px}
.pp section{scroll-margin-top:84px}

/* topo: título, texto e dois botões */
.pp-hero{padding:40px 0 28px;background:var(--papel2);border-bottom:1px solid var(--regua)}
.pp-hero h1{margin:0 0 12px!important;max-width:820px;font-size:clamp(1.6rem,2.8vw,2.2rem)!important;line-height:1.15!important}
.pp-lead{margin:0 0 22px;max-width:680px;color:var(--sec);font-size:1.05rem;line-height:1.55}
.pp-acts{display:flex;flex-wrap:wrap;gap:12px}
.pp-btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 20px;border:1px solid var(--azul);border-radius:4px;font-family:var(--font);font-weight:600;font-size:1rem;line-height:1.2;text-align:center;text-decoration:none}
.pp-btn--solid{background:var(--azul);color:#fff}
.pp-btn--solid:hover,.pp-btn--solid:focus-visible{background:var(--azul-esc);border-color:var(--azul-esc);color:#fff}
.pp-btn--line{background:#fff;color:var(--azul)}
.pp-btn--line:hover,.pp-btn--line:focus-visible{background:var(--celula)}
.pp-small{margin:12px 0 0;font-size:.88rem;color:var(--sec)}
.pp-small a{color:var(--azul);font-weight:600;text-decoration:underline;text-underline-offset:3px;min-height:44px;display:inline-flex;align-items:center}

/* menu interno: uma linha, que rola para o lado só dentro da faixa */
.pp-menu{background:#fff;border-bottom:1px solid var(--regua)}
.pp-menu-in{overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:thin}
.pp-menu ul{display:flex;gap:4px;list-style:none;margin:0;padding:0;white-space:nowrap;min-width:max-content}
.pp-menu a{display:inline-flex;align-items:center;min-height:48px;padding:0 12px;color:var(--azul);font-weight:600;font-size:.95rem;text-decoration:none;border-bottom:2px solid transparent}
.pp-menu a:hover,.pp-menu a:focus-visible{border-bottom-color:var(--azul)}

/* seções: uma por assunto, separadas por régua fina */
.pp-sec{padding:40px 0;border-bottom:1px solid var(--regua)}
.pp-sec h2{margin:0 0 6px;font-size:clamp(1.4rem,2.2vw,1.75rem);line-height:1.2}
.pp-sub{margin:0 0 18px;max-width:680px;color:var(--sec)}
.pp-more{margin:16px 0 0}
.pp-more a{display:inline-flex;align-items:center;min-height:44px;color:var(--azul);font-weight:600;text-decoration:underline;text-underline-offset:3px}

/* tabelas: linhas de planilha */
.pp-tbl{width:100%;border-collapse:collapse;border:1px solid var(--regua);font-size:.96rem}
.pp-tbl th{background:var(--celula);text-align:left;font-weight:600;font-size:.85rem;color:var(--tinta);padding:10px 14px;border-bottom:1px solid var(--regua);vertical-align:top}
.pp-tbl td{padding:12px 14px;border-bottom:1px solid var(--regua);vertical-align:top;line-height:1.5}
.pp-tbl tbody tr:last-child td{border-bottom:0}
.pp-tbl td:first-child{font-weight:600;width:38%}
.pp-tbl ul{margin:0;padding:0 0 0 18px}
.pp-tbl li{margin:0 0 6px}
.pp-tbl li:last-child{margin-bottom:0}
.pp-tbl--duas td:first-child{font-weight:400;width:50%}
.pp-when{color:var(--prazo);font-weight:600}

/* para quem é / não é: duas colunas de texto, sem cartão */
.pp-prod{margin:0 0 18px;max-width:720px;color:var(--tinta)}
.pp-prod b{font-weight:600}
.pp-two{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--regua)}
.pp-two>div{padding:18px 24px 6px 0}
.pp-two>div+div{border-left:1px solid var(--regua);padding-left:24px}
.pp-two h3{margin:0 0 8px;font-size:1.15rem;line-height:1.25}
.pp-two ul{margin:0;padding-left:18px}
.pp-two li{margin:0 0 8px;line-height:1.5}

/* como funciona: linhas com o nome do passo e o que acontece */
.pp-steps{list-style:none;margin:0;padding:0;border-top:1px solid var(--regua)}
.pp-steps li{display:grid;grid-template-columns:minmax(0,180px) minmax(0,1fr);gap:16px;padding:14px 0;border-bottom:1px solid var(--regua);line-height:1.5}
.pp-steps b{font-weight:600;color:var(--tinta)}

/* dúvidas: pergunta em título e resposta em texto */
.pp-faq{border-top:1px solid var(--regua)}
.pp-faq div{padding:14px 0;border-bottom:1px solid var(--regua)}
.pp-faq h3{margin:0 0 6px;font-size:1.05rem;line-height:1.3}
.pp-faq p{margin:0;line-height:1.55}

/* fecho */
.pp-close{padding:40px 0 48px;background:var(--papel2);border-top:1px solid var(--regua)}
.pp-close h2{margin:0 0 6px;font-size:clamp(1.4rem,2.2vw,1.75rem);line-height:1.2}
.pp-close p{margin:0 0 18px;color:var(--sec)}
.pp-close p a{color:var(--azul);font-weight:600;text-decoration:underline;text-underline-offset:3px}

/* celular: sem rolagem lateral da página, tudo em uma coluna */
@media(max-width:760px){
  .pp-two{grid-template-columns:1fr}
  .pp-two>div+div{border-left:0;padding-left:0;border-top:1px solid var(--regua)}
  .pp-steps li{grid-template-columns:minmax(0,1fr);gap:4px}
}
@media(max-width:640px){
  .pp .container{padding-left:16px;padding-right:16px}
  .pp-hero{padding:26px 0 22px}
  .pp-acts{flex-direction:column}
  .pp-btn{width:100%}
  .pp-sec{padding:28px 0}
  .pp-tbl thead{display:none}
  .pp-tbl,.pp-tbl tbody,.pp-tbl tr,.pp-tbl td{display:block;width:100%}
  .pp-tbl tr{border-bottom:1px solid var(--regua);padding:8px 0}
  .pp-tbl tbody tr:last-child{border-bottom:0}
  .pp-tbl td{border:0;padding:4px 14px}
  .pp-tbl td:first-child{width:100%}
  .pp-tbl td[data-label]::before{content:attr(data-label);display:block;font-size:.78rem;font-weight:600;color:var(--sec);margin-bottom:2px}
  .pp-tbl--duas td:first-child{width:100%}
  .pp-close{padding:28px 0 32px}
}
