/* ============================================================================
   Blocos de prova da BlueBed: faixa de resultado, card de caso, "Quem responde"
   e "Como contratar". Um arquivo só, usado pelas cinco páginas que têm esses blocos.

   Enquanto não existe prova real, os blocos ficam FORA DO AR: só aparecem com
   ?rascunho no endereço (vale para a visita inteira; ?publico desliga).
   Todo texto que falta preencher está em <span class="falta">[...]</span>.
   Para publicar um bloco: troque os [...] pelo conteúdo real e tire a classe
   "prova" do <section>.
   ========================================================================= */
.prova{ display:none }
html.rascunho .prova{ display:block }

.pv{
  --pv-navy:#0b1420; --pv-deep:#0b1d35; --pv-blue:#107de9; --pv-azure:#0b5dbd; --pv-sky:#8ec3ff;
  --pv-mist:#e4ecf7; --pv-line:#dce5f1; --pv-muted:#54637a;
  font-family:'Inter',Arial,Helvetica,sans-serif; color:var(--pv-navy);
  padding:4.5rem 1.25rem; position:relative
}
.pv *{ box-sizing:border-box }
.pv-dentro{ max-width:80rem; margin-inline:auto }
@media (min-width:640px){ .pv{ padding-inline:2rem } }

/* aviso de rascunho: fica colado no bloco, para ninguém confundir com conteúdo real */
.pv-aviso{ display:inline-flex; align-items:center; gap:.5rem; margin-bottom:1.25rem; padding:.3rem .75rem; border-radius:9999px;
  border:1px dashed var(--pv-blue); color:var(--pv-azure); background:rgba(16,125,233,.06);
  font-size:.6875rem; font-weight:600; letter-spacing:.06em; text-transform:uppercase }
.pv-escuro .pv-aviso{ color:var(--pv-sky); border-color:var(--pv-sky); background:rgba(142,195,255,.08) }
.falta{ border-bottom:1px dashed currentColor; color:var(--pv-azure); background:rgba(16,125,233,.06); padding:0 .15em; border-radius:.2em }
.pv-escuro .falta{ color:var(--pv-sky); background:rgba(142,195,255,.08) }

/* rótulo de seção e títulos */
.pv-rotulo{ font-size:.75rem; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--pv-muted) }
.pv-titulo{ margin:.5rem 0 0; font-size:2.25rem; line-height:1.08; font-weight:700; letter-spacing:-.03em }
.pv-titulo span{ color:var(--pv-muted) }
.pv-lead{ max-width:40rem; margin:1rem 0 0; font-size:1.0625rem; line-height:1.55; color:var(--pv-muted) }
.pv-escuro{ background:var(--pv-navy); color:#fff }
.pv-escuro .pv-rotulo, .pv-escuro .pv-titulo span, .pv-escuro .pv-lead{ color:rgba(255,255,255,.62) }

/* ---------------------------------------------------- faixa de resultado */
.pv-faixa{ display:grid; gap:1px; margin-top:2rem; border-radius:1.25rem; overflow:hidden; background:rgba(255,255,255,.12) }
@media (min-width:768px){ .pv-faixa{ grid-template-columns:repeat(3, 1fr) } }
.pv-num{ background:var(--pv-navy); padding:1.75rem 1.5rem; display:flex; flex-direction:column; gap:.5rem }
.pv-num .v{ font-size:3rem; font-weight:700; letter-spacing:-.04em; line-height:1; font-variant-numeric:tabular-nums }
.pv-num .m{ font-size:1rem; font-weight:500; color:rgba(255,255,255,.85) }
.pv-num .onde{ font-size:.875rem; color:rgba(255,255,255,.62) }
.pv-num .fonte{ margin-top:auto; padding-top:.75rem; border-top:1px solid rgba(255,255,255,.1); font-size:.6875rem; letter-spacing:.06em; text-transform:uppercase; color:rgba(255,255,255,.62) }

/* ----------------------------------------------------------- card de caso */
.pv-caso{ display:grid; margin-top:2rem; border-radius:1.25rem; overflow:hidden; border:1px solid var(--pv-line); background:#fff; color:var(--pv-navy) }
@media (min-width:768px){ .pv-caso{ grid-template-columns:1fr 1fr } }
.pv-caso .lado{ padding:2rem 1.75rem; display:flex; flex-direction:column; gap:.6rem }
.pv-caso .antes{ background:var(--pv-navy); color:#fff }
.pv-caso .k{ font-size:.75rem; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--pv-muted) }
.pv-caso .antes .k{ color:rgba(255,255,255,.62) }
.pv-caso .big{ font-size:2.75rem; font-weight:700; letter-spacing:-.04em; line-height:1; font-variant-numeric:tabular-nums }
.pv-caso .big small{ margin-left:.4rem; font-size:1rem; font-weight:500; letter-spacing:0; color:var(--pv-muted) }
.pv-caso .antes .big small{ color:rgba(255,255,255,.62) }
.pv-caso .t{ font-size:1rem; line-height:1.5; color:var(--pv-muted) }
.pv-caso .antes .t{ color:rgba(255,255,255,.72) }
.pv-caso .quem{ grid-column:1 / -1; padding:1.75rem; border-top:1px solid var(--pv-line); background:var(--pv-mist) }
.pv-caso blockquote{ margin:0; font-size:1.25rem; line-height:1.45; font-weight:500; letter-spacing:-.01em }
.pv-caso .assina{ margin-top:.75rem; font-size:.875rem; color:var(--pv-muted) }
.pv-escuro .pv-caso{ border-color:rgba(255,255,255,.14) }
.pv-escuro .pv-caso .antes{ background:var(--pv-deep) }

/* ---------------------------------------------------------- quem responde */
.pv-quem{ display:grid; gap:2rem; margin-top:2rem; align-items:center }
@media (min-width:768px){ .pv-quem{ grid-template-columns:18rem 1fr; gap:3rem } }
.pv-foto{ aspect-ratio:4 / 5; border-radius:1.25rem; border:1px dashed var(--pv-blue); background:var(--pv-mist);
  display:grid; place-items:center; padding:1.5rem; text-align:center; font-size:.875rem; color:var(--pv-azure) }
.pv-quem h3{ margin:0; font-size:1.75rem; font-weight:700; letter-spacing:-.02em }
.pv-quem .cargo{ margin-top:.25rem; color:var(--pv-muted) }
.pv-quem p{ max-width:36rem; line-height:1.6 }
.pv-quem a{ color:var(--pv-azure); font-weight:600 }
.pv-etapas{ display:grid; gap:1rem; margin-top:1.5rem; padding:0; list-style:none }
@media (min-width:640px){ .pv-etapas{ grid-template-columns:repeat(3, 1fr) } }
.pv-etapas li{ padding:1rem 1.1rem; border:1px solid var(--pv-line); border-radius:1rem; background:#fff }
.pv-etapas b{ display:block; font-size:.75rem; letter-spacing:.08em; text-transform:uppercase; color:var(--pv-azure) }
.pv-etapas span{ display:block; margin-top:.35rem; font-size:.9375rem; line-height:1.45 }

/* --------------------------------------------------------- como contratar */
.pv-planos{ display:grid; gap:1rem; margin-top:2rem }
@media (min-width:900px){ .pv-planos{ grid-template-columns:repeat(3, 1fr) } }
.pv-plano{ display:flex; flex-direction:column; gap:.75rem; padding:1.75rem 1.5rem; border:1px solid var(--pv-line); border-radius:1.25rem; background:#fff }
.pv-plano.destaque{ background:var(--pv-navy); color:#fff; border-color:var(--pv-navy) }
.pv-plano h3{ margin:0; font-size:1.375rem; font-weight:700; letter-spacing:-.02em }
.pv-plano .desc{ margin:0; line-height:1.55; color:var(--pv-muted) }
.pv-plano.destaque .desc{ color:rgba(255,255,255,.72) }
.pv-plano dl{ display:grid; grid-template-columns:auto 1fr; gap:.4rem 1rem; margin:auto 0 0; padding-top:1rem; border-top:1px solid var(--pv-line); font-size:.9375rem }
.pv-plano.destaque dl{ border-color:rgba(255,255,255,.14) }
.pv-plano dt{ color:var(--pv-muted) }
.pv-plano.destaque dt{ color:rgba(255,255,255,.62) }
.pv-plano dd{ margin:0; font-weight:600; text-align:right }

/* placeholder legível sobre fundo claro dentro de bloco escuro, e vice-versa */
.pv-escuro .pv-caso .lado:not(.antes) .falta, .pv-escuro .pv-caso .quem .falta{ color:var(--pv-azure); background:rgba(16,125,233,.06) }
.pv-caso .antes .falta, .pv-plano.destaque .falta{ color:var(--pv-sky); background:rgba(142,195,255,.08) }

/* Space Mono nos rótulos e fontes dos blocos de prova */
.pv-aviso, .pv-rotulo, .pv-num .fonte, .pv-caso .k, .pv-etapas b{ font-family:'Space Mono',ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; letter-spacing:.06em; text-transform:uppercase }
