/* =====================================================================
   Porta Aberta · pedido.css (T5 · Pixel)
   Estilos de /abrir/, /obrigado/, /bastidores/, termos, privacidade e 404.
   Só tokens de assets/tokens.css (T2); nenhum valor de cor solto.
   ===================================================================== */
.pagina{padding:var(--r6) 0 var(--r7)}
.pagina h1{font-size:var(--t-h2);max-width:22ch;overflow-wrap:anywhere}
.pagina h2,#obrigado-negocio{overflow-wrap:anywhere}   /* nome sem espaço (um @ do Instagram) nunca empurra a página para o lado */
.pagina .lead{margin-top:var(--r3);font-size:var(--t-lead);color:var(--apagado);max-width:58ch}
.pagina h2{font-size:var(--t-h3);margin-bottom:var(--r3)}
.barra-simples .cx{flex-wrap:nowrap}
.barra-simples .voltar{min-height:var(--alvo);padding:8px 12px;font-size:14px;white-space:nowrap}
@media (max-width:400px){.barra-simples .marca span{font-size:19px}}
.grade-pedido{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--r5);margin-top:var(--r6)}
.grade-pedido > *,.horarios > *{min-width:0}
.bloco{padding:var(--r5);background:var(--papel);border:var(--borda) solid var(--linha);border-radius:var(--raio)}
.bloco + .bloco{margin-top:0}
.bloco-tracejado{padding:var(--r5);border:var(--borda) dashed var(--linha);border-radius:var(--raio)}
.num-carregando{display:inline-block;min-width:2.4em;min-height:.9em;border-radius:6px;background:repeating-linear-gradient(-45deg,var(--lasca) 0 6px,transparent 6px 12px);vertical-align:middle}
.resumo-negocio{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;margin-top:var(--r4);padding:var(--r3) var(--r4);background:var(--ceu);border:var(--borda) solid var(--linha);border-radius:var(--raio-p)}
.resumo-negocio strong{font-family:var(--f-display);font-weight:400;font-size:22px;overflow-wrap:anywhere}
.resumo-negocio span{font-size:var(--t-nota);color:var(--apagado)}
.resumo-negocio a{display:inline-flex;align-items:center;min-height:var(--alvo);font-weight:700;margin-left:auto}

/* planos trocáveis em um toque */
.planos{display:grid;gap:10px;margin:0;padding:0;border:0}
.planos legend{font-weight:800;font-size:var(--t-menor);margin-bottom:8px;padding:0}
.plano-opcao{position:relative;display:flex;align-items:center;gap:12px;min-height:56px;padding:10px 16px;border:var(--borda) solid var(--linha);border-radius:var(--raio-campo);background:var(--papel);font-weight:700;cursor:pointer}
.plano-opcao input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.plano-opcao::before{content:"";flex:none;width:22px;height:22px;border:var(--borda) solid var(--linha);border-radius:50%;background:var(--papel)}
.plano-opcao:has(input:checked){background:var(--sol);color:var(--sol-tinta);box-shadow:var(--sombra-p)}
.plano-opcao:has(input:checked)::before{background:radial-gradient(circle,var(--sol-tinta) 0 5px,var(--papel) 6px)}
.plano-opcao:has(input:focus-visible){outline:3px solid var(--sol);outline-offset:3px;box-shadow:0 0 0 6px var(--linha)}
.plano-opcao small{display:block;font:500 var(--t-micro)/1.3 var(--f-dado);text-transform:uppercase;letter-spacing:.06em}

/* total visível antes de pagar */
.total{margin-top:var(--r5);padding:var(--r4) var(--r5);background:var(--vidro);color:var(--giz);border:var(--borda) solid var(--linha);border-radius:var(--raio);box-shadow:var(--sombra)}
.total .olho{color:var(--giz-apagado)}
.total p{font-size:var(--t-lead);font-weight:600}
.total p + p{margin-top:var(--r2)}
.total .menor{font-size:var(--t-nota);font-weight:400;color:var(--giz-apagado)}
.total strong{font-family:var(--f-display);font-weight:400;font-size:1.25em;color:var(--sol)}

/* campos */
.campos{display:grid;gap:var(--r4)}
.campo textarea{width:100%;min-height:96px;padding:14px 18px;border:var(--borda) solid var(--linha);border-radius:var(--raio-campo);background:var(--papel);color:var(--tinta);font-size:18px;box-shadow:var(--sombra-p);resize:vertical}
.campo select{appearance:none;-webkit-appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--tinta) 50%),linear-gradient(135deg,var(--tinta) 50%,transparent 50%);background-position:calc(100% - 22px) 50%,calc(100% - 16px) 50%;background-size:6px 6px;background-repeat:no-repeat;padding-right:40px}
.campo select:focus,.campo textarea:focus{outline:none;box-shadow:0 0 0 3px var(--sol),var(--sombra)}
.campo[data-estado="erro"] select,.campo[data-estado="erro"] textarea{border-color:var(--alerta);box-shadow:3px 3px 0 var(--alerta)}
.erro-solto{font-size:var(--t-nota);font-weight:700;color:var(--alerta)}
.resumo-erros{padding:12px 16px;border:var(--borda) solid var(--alerta);border-radius:var(--raio-p);color:var(--alerta);font-weight:700}

/* horário de funcionamento */
.horarios{display:grid;grid-template-columns:minmax(0,1fr);gap:8px}
.dia{display:grid;grid-template-columns:minmax(0,1fr);gap:8px;min-width:0;padding:10px 12px;border:var(--borda) solid var(--linha);border-radius:var(--raio-p);background:var(--fundo)}
.dia.fechado{background:transparent;border-style:dashed}
.dia-cab{display:flex;align-items:center;justify-content:space-between;gap:8px}
.dia-nome{font-weight:800}
.dia-aberto{display:inline-flex;align-items:center;gap:8px;min-height:var(--alvo);padding:0 4px;font-weight:700;cursor:pointer}
/* .campo input dava a sombra deslocada de 3 px também às caixas "Aberto" e ao aceite (o "colchete" do PG-13) */
.dia-aberto input,.aceite input{width:24px;height:24px;min-height:0;margin:0;padding:0;border-radius:4px;box-shadow:none;accent-color:var(--sol-tinta);flex:none}
.dia-aberto input:focus-visible,.aceite input:focus-visible{outline:3px solid var(--sol);outline-offset:2px;box-shadow:0 0 0 5px var(--linha)}
.dia-horas{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.dia-hora{display:grid;grid-template-columns:minmax(0,1fr);gap:4px;min-width:0;font-size:var(--t-nota);font-weight:700}
/* horários em lista HH:MM de 24 h (PG-13); a seta é a mesma dos outros selects */
.campo .dia-hora select{min-height:var(--alvo);width:100%;min-width:0;max-width:100%;box-sizing:border-box;padding:0 30px 0 12px;border-radius:10px;font-size:16px;font-variant-numeric:tabular-nums;background-position:calc(100% - 18px) 50%,calc(100% - 12px) 50%;box-shadow:none}
/* abaixo de 360 px, Abre e Fecha empilham para a lista de horários caber inteira */
@media (max-width:359px){.dia-horas{grid-template-columns:minmax(0,1fr)}}

/* aceite e pagamento */
.aceite{display:flex;align-items:flex-start;gap:12px;padding:12px 14px;min-height:var(--alvo);border:var(--borda) solid var(--linha);border-radius:var(--raio-p);background:var(--papel);font-weight:600;cursor:pointer}
.aceite input{margin-top:2px}
.pagar{display:grid;gap:10px}
.pagar .btn{width:100%}
.notas{display:grid;gap:6px;font-size:var(--t-nota);color:var(--apagado)}
p.notas{display:block} /* parágrafo com números dentro (ex.: anual-nota) não vira grade */
.link-forte{display:inline-flex;align-items:center;min-height:var(--alvo);font-weight:700}
.link-texto{background:none;border:0;padding:0 4px;min-height:var(--alvo);font-weight:800;text-decoration:underline;text-underline-offset:.18em;cursor:pointer;color:var(--tinta);text-align:left}
.lista-numerada{margin:0;padding-left:22px;display:grid;gap:8px}
.lista-simples{margin:0;padding-left:20px;display:grid;gap:6px}

/* /obrigado/ */
.relogio{display:grid;gap:6px;padding:var(--r4) var(--r5);background:var(--vidro);color:var(--giz);border:var(--borda) solid var(--linha);border-radius:var(--raio)}
.relogio .digitos{font:400 var(--t-preco)/1 var(--f-display);color:var(--sol);letter-spacing:.04em}
.relogio .estado{font:500 var(--t-micro)/1.3 var(--f-dado);text-transform:uppercase;letter-spacing:.08em;color:var(--giz-apagado)}
.relogio p{font-size:var(--t-nota);color:var(--giz-apagado)}
.pedido-texto{margin:0;padding:var(--r4);background:var(--lasca);border:var(--borda) solid var(--linha);border-radius:var(--raio-p);font:500 13px/1.55 var(--f-dado);white-space:pre-wrap;overflow-wrap:anywhere;max-height:320px;overflow:auto}
.janela-sede{min-height:0}
.sede-palco{position:relative}
.janela-sede iframe{display:block;width:100%;aspect-ratio:16/10;border:0;background:var(--vidro)}
.janela-sede .sede-carregando{position:absolute;inset:0;min-height:0;background:var(--vidro);color:var(--giz)}
.janela-sede .selo-demo,.janela-sede .ver-ao-vivo{z-index:2}
.letreiro-poster{display:grid;place-items:center;aspect-ratio:16/10;padding:var(--r5) var(--r4);background:var(--vidro)}
.letreiro-poster svg{width:min(100%,520px)}

/* termos, privacidade */
.aviso-juridico{display:inline-block;margin-bottom:var(--r4);font:500 var(--t-micro)/1.3 var(--f-dado);letter-spacing:.06em;color:var(--alerta);border:2px dashed currentColor;border-radius:8px;padding:8px 12px;overflow-wrap:anywhere}
.doc{max-width:var(--medida)}
.doc h2{font-size:var(--t-h3);margin:var(--r6) 0 var(--r3)}
.doc h3{font-size:20px;margin:var(--r5) 0 var(--r2)}
.doc p,.doc li{font-size:var(--t-corpo)}
.doc p + p{margin-top:var(--r3)}
.doc ul,.doc ol{padding-left:22px;display:grid;gap:6px;margin:var(--r3) 0}
.doc a{font-weight:700}

/* bastidores */
.aviso-dev{padding:var(--r4) var(--r5);background:var(--vidro);color:var(--giz);border:var(--borda) solid var(--linha);border-radius:var(--raio);font-weight:700;font-size:var(--t-lead);max-width:62ch}
.preco-unico{display:flex;align-items:baseline;flex-wrap:wrap;gap:8px}
.preco-unico strong{font:400 var(--t-preco)/1 var(--f-display)}
.duas-colunas{display:grid;gap:var(--r5)}

.rodape-simples{border-top:var(--borda) solid var(--linha);background:var(--ceu);padding:var(--r5) 0 calc(var(--r5) + env(safe-area-inset-bottom, 0px))}
.rodape-simples .cx{display:flex;flex-wrap:wrap;gap:4px 18px;align-items:center;font-size:var(--t-menor)}
.rodape-simples a{display:inline-flex;align-items:center;min-height:var(--alvo);font-weight:700}
.rodape-simples .link-texto{padding:0;font-weight:700;font-size:inherit}
.rodape-simples .ident{flex-basis:100%;display:flex;flex-wrap:wrap;gap:2px 14px}
.rodape-simples .ident b{font-weight:700}

@media (min-width:720px){
  .planos{grid-template-columns:1fr 1fr}
  .linha-2{display:grid;grid-template-columns:1fr 1fr;gap:var(--r4)}
  .pagar{grid-template-columns:1fr 1fr}
  .horarios{grid-template-columns:repeat(2,minmax(0,1fr))}
  .duas-colunas{grid-template-columns:1fr 1fr}
}
@media (min-width:1000px){
  .grade-pedido{grid-template-columns:minmax(0,1.25fr) minmax(0,.9fr);align-items:start}
  .lateral{position:sticky;top:88px;display:grid;gap:var(--r5)}
}
/* /abrir/ para o visitante frio: resumo do preço no topo, garantia e desistência antes dos botões,
   botão de pagar fixo no rodapé do celular com o total de hoje. */
.link-duvidas{display:inline-flex;align-items:center;min-height:var(--alvo);padding:0 8px;font-weight:700;font-size:var(--t-menor);text-decoration:underline;white-space:nowrap}
.progresso{margin-top:var(--r3);font-size:var(--t-nota);color:var(--apagado);max-width:58ch}
.progresso .feito{font-weight:800;color:var(--ok)}
.resumo-preco{display:grid;gap:6px;margin-top:var(--r4);padding:var(--r3) var(--r4);background:var(--papel);border:var(--borda) solid var(--linha);border-radius:var(--raio-p);box-shadow:var(--sombra-p);max-width:62ch}
.resumo-preco p{font-size:var(--t-corpo)}
.resumo-preco strong{font-weight:800}
.resumo-preco .menor{font-size:var(--t-nota);color:var(--apagado)}
.grade-abrir{grid-template-areas:"form" "confianca" "pagar" "quem"}
.area-form{grid-area:form}.area-confianca{grid-area:confianca}.area-pagar{grid-area:pagar}.area-quem{grid-area:quem}
.pagar-total{margin-bottom:var(--r3);font-weight:700}
.pagar-total strong{font:400 var(--t-h3)/1 var(--f-display)}
.barra-pagar{position:fixed;left:0;right:0;bottom:0;z-index:var(--z-flutuante);display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px var(--gut-d) calc(10px + env(safe-area-inset-bottom, 0px)) var(--gut);background:var(--papel);border-top:var(--borda) solid var(--linha)}
.barra-pagar-total{display:grid;gap:2px;min-width:0}
.barra-pagar-total > span{font:500 var(--t-micro)/1.2 var(--f-dado);text-transform:uppercase;letter-spacing:.06em;color:var(--apagado)}
.barra-pagar-total strong{font:400 24px/1 var(--f-display);white-space:nowrap}
.barra-pagar .btn{flex:0 1 auto;min-height:52px;padding:10px 22px;font-size:17px}
.barra-pagar.recolhida{transform:translateY(calc(100% + 8px));visibility:hidden}
@media (prefers-reduced-motion:no-preference){.barra-pagar{transition:transform var(--duracao-media) var(--curva-saida),visibility 0s}.barra-pagar.recolhida{transition:transform var(--duracao-curta) var(--curva-entrada),visibility 0s var(--duracao-curta)}}
body.com-barra-pagar{padding-bottom:calc(84px + env(safe-area-inset-bottom, 0px))}
/* com o banner de medição aberto, ele ocupa o rodapé; o botão de pagar continua na seção Pagamento */
body.com-consentimento .barra-pagar{display:none}
body.com-consentimento.com-barra-pagar{padding-bottom:var(--altura-consentimento,0px)}
@media (min-width:1000px){
  .grade-abrir{grid-template-areas:"form confianca" "pagar confianca" "quem quem"}
  .barra-pagar{display:none}
  body.com-barra-pagar{padding-bottom:0}
}
.mt-3{margin-top:var(--r3)} .mt-4{margin-top:var(--r4)} .mt-5{margin-top:var(--r5)} .mb-4{margin-bottom:var(--r4)}
.lateral{display:grid;gap:var(--r5);align-content:start}
.relogio .olho{color:var(--giz-apagado);margin-bottom:0}
.campo .dia-hora select:focus{outline:none;box-shadow:0 0 0 3px var(--sol),var(--sombra-p)}

/* campo isca do registro (hp): fora da tela e da leitura; pessoa nunca preenche */
.isca{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* /abrir/: aviso do link de teste e linha dos dados ao lado do botão Pagar */
.modo-teste{margin-top:var(--r4);padding:var(--r3) var(--r4);border:var(--borda) dashed var(--alerta);border-radius:var(--raio-p);color:var(--tinta);font-size:var(--t-nota);max-width:62ch}
.modo-teste strong{color:var(--alerta)}
.pagar-aviso a{font-weight:800}

/* /obrigado/: um estado por vez (vitrine.js, data-estado no main) */
.pagina-obrigado h1:focus{outline:none}
.obrigado-acoes{display:flex;flex-wrap:wrap;align-items:center;gap:var(--r3) var(--r4);margin-top:var(--r5)}
.obrigado-acoes .btn{max-width:100%;text-align:center}
.obrigado-servidor{margin-top:var(--r4);padding:var(--r3) var(--r4);max-width:62ch;background:var(--papel);border:var(--borda) solid var(--linha);border-radius:var(--raio-p);box-shadow:var(--sombra-p);font-weight:700;font-size:var(--t-corpo)}
.obrigado-servidor[data-linha="pago"],.obrigado-servidor[data-linha="teste_ok"]{border-color:var(--ok)}
.obrigado-servidor[data-linha="pago"]::before,.obrigado-servidor[data-linha="teste_ok"]::before{content:"";display:inline-block;width:.7em;height:.7em;margin-right:.5em;border-radius:50%;background:var(--ok);vertical-align:.05em}
.recibo{margin-top:var(--r5);padding:var(--r4) var(--r5);max-width:46ch;background:var(--papel);border:var(--borda) dashed var(--linha);border-radius:var(--raio)}
.recibo .olho{display:block;margin-bottom:var(--r2);font-size:var(--t-micro)}
.recibo-linhas{margin:0;display:grid;gap:10px;overflow-wrap:anywhere}
.recibo-linhas > div{display:grid;gap:2px}
.recibo-linhas > div + div{padding-top:10px;border-top:2px dotted color-mix(in srgb, var(--linha) 30%, transparent)}
.recibo-linhas dt{font:500 var(--t-micro)/1.3 var(--f-dado);text-transform:uppercase;letter-spacing:.06em;color:var(--apagado)}
.recibo-linhas dd{margin:0;font-size:var(--t-corpo);font-weight:800;font-variant-numeric:tabular-nums}
.obrigado-rascunho-texto{margin-top:var(--r4);max-width:62ch;font-size:var(--t-corpo)}
.sem-dados summary{display:flex;align-items:center;min-height:var(--alvo);font-family:var(--f-display);font-size:var(--t-h3);line-height:1.15;cursor:pointer;list-style:none}
.sem-dados summary::-webkit-details-marker{display:none}
.sem-dados summary::after{content:"+";margin-left:auto;padding-left:var(--r3);font-family:var(--f-texto)}
.sem-dados[open] summary::after{content:"−"}
.sem-dados summary:focus-visible{outline:3px solid var(--sol);outline-offset:4px;border-radius:6px}
.relogio .digitos{font-variant-numeric:tabular-nums}