/* ============================================================
   Belzcont — Diagnóstico Tributário
   Depende de assets/base.css (tokens, header, rodapé).
   ============================================================ */

.dg-hero{position:relative;overflow:hidden;padding:7.5rem 0 2rem}
@media(min-width:640px){.dg-hero{padding:9.5rem 0 2.5rem}}
.dg-hero .blob-a{top:-12rem;left:-8rem;width:30rem;height:30rem;background-image:var(--gradient-primary);opacity:.12;filter:blur(64px)}
.dg-hero .blob-b{top:-5rem;right:-9rem;width:24rem;height:24rem;background:var(--gold);opacity:.15;filter:blur(64px)}
.dg-hero-inner{position:relative;z-index:1;max-width:44rem}
.dg-hero h1{margin-top:1rem;font-size:2rem;font-weight:700;line-height:1.12}
@media(min-width:640px){.dg-hero h1{font-size:2.75rem}}
.dg-hero .lead{margin-top:1.125rem;color:var(--muted-foreground);line-height:1.65}
@media(min-width:640px){.dg-hero .lead{font-size:1.0625rem}}
.dg-selos{margin-top:1.5rem;display:flex;flex-wrap:wrap;gap:.5rem}
.dg-selo{
  display:inline-flex;align-items:center;gap:.45rem;
  border:1px solid var(--border);border-radius:9999px;background:var(--card);
  padding:.45rem .9rem;font-size:.75rem;font-weight:500;color:var(--muted-foreground);
  box-shadow:var(--shadow-soft);
}
.dg-selo svg{width:.9rem;height:.9rem;color:var(--primary);flex-shrink:0}

/* ---------- área do questionário ---------- */
.dg-wrap{max-width:46rem;padding-bottom:4rem}
@media(min-width:640px){.dg-wrap{padding-bottom:5rem}}

.dg-topo{margin-bottom:2rem}
.dg-topo-linha{
  display:flex;justify-content:space-between;gap:1rem;
  font-size:.8125rem;color:var(--muted-foreground);
}
.dg-topo-linha span:first-child{font-weight:600;color:var(--foreground)}
.dg-barra{
  margin-top:.6rem;height:6px;border-radius:9999px;
  background:color-mix(in oklab,var(--primary) 12%,transparent);overflow:hidden;
}
.dg-barra i{
  display:block;height:100%;border-radius:9999px;
  background-image:var(--gradient-primary);
  transition:width .45s var(--ease-out-soft);
}
.dg-barra-forte{height:10px;margin-top:1rem}
.dg-barra-fina{height:5px;margin-top:.4rem}
.dg-secao{margin-top:.6rem;font-size:.8125rem;color:var(--muted-foreground)}

/* ---------- perguntas ---------- */
.q{border:0;margin-bottom:2.25rem}
.q:last-of-type{margin-bottom:0}
.q-label{
  font-family:var(--font-display);font-size:1.125rem;font-weight:700;
  line-height:1.3;letter-spacing:-.01em;
}
@media(min-width:640px){.q-label{font-size:1.25rem}}
.q-opt{font-family:var(--font-body);font-size:.8125rem;font-weight:500;color:var(--muted-foreground)}
.q-ajuda{
  display:flex;align-items:flex-start;gap:.45rem;margin-top:.5rem;
  font-size:.8125rem;line-height:1.5;color:var(--muted-foreground);
}
.q-ajuda svg{width:.95rem;height:.95rem;flex-shrink:0;margin-top:.15rem;opacity:.75}

.q-input{
  display:block;width:100%;margin-top:1rem;height:3.25rem;
  border:1px solid var(--input);border-radius:1rem;background:var(--card);
  padding:0 1rem;font-size:1rem;
  transition:border-color .2s,box-shadow .2s;
}
select.q-input{cursor:pointer;appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235f7a70' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 1rem center;background-size:1.1rem;padding-right:2.75rem}
.q-input::placeholder{color:var(--muted-foreground)}
.q-input:focus{outline:none;border-color:var(--ring);box-shadow:0 0 0 3px color-mix(in oklab,var(--ring) 18%,transparent)}

.q-opcoes{margin-top:1rem;display:flex;flex-direction:column;gap:.625rem}
.opt{
  position:relative;display:flex;align-items:center;gap:.875rem;cursor:pointer;
  border:1px solid var(--border);border-radius:1.125rem;background:var(--card);
  padding:.95rem 1.125rem;font-size:.9375rem;
  transition:border-color .2s,background-color .2s,box-shadow .2s;
}
.opt:hover{border-color:color-mix(in oklab,var(--primary-glow) 45%,transparent);background:color-mix(in oklab,var(--accent) 45%,transparent)}
.opt input{position:absolute;opacity:0;width:1px;height:1px}
.opt-marca{
  flex-shrink:0;width:1.15rem;height:1.15rem;border-radius:9999px;
  border:2px solid color-mix(in oklab,var(--muted-foreground) 45%,transparent);
  transition:border-color .2s,background-color .2s,box-shadow .2s;
}
.opt input[type="checkbox"] ~ .opt-marca{border-radius:.4rem}
.opt:has(input:checked){
  border-color:var(--primary);
  background:color-mix(in oklab,var(--accent) 70%,transparent);
  box-shadow:var(--shadow-soft);
}
.opt:has(input:checked) .opt-marca{
  border-color:var(--primary);background:var(--primary);
  box-shadow:inset 0 0 0 3px var(--card);
}
.opt input[type="checkbox"]:checked ~ .opt-marca{
  box-shadow:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");
  background-size:.8rem;background-position:center;background-repeat:no-repeat;
}
.opt input:focus-visible ~ .opt-marca{outline:2px solid var(--ring);outline-offset:2px}
.opt-txt{line-height:1.35}

/* fallback p/ navegadores sem :has() */
@supports not selector(:has(*)){
  .opt input:checked ~ .opt-txt{font-weight:700;color:var(--primary)}
  .opt input:checked ~ .opt-marca{border-color:var(--primary);background:var(--primary)}
}

.q-falta > .q-label{color:var(--primary)}
.q-falta .q-opcoes,.q-falta .q-input{
  animation:dg-shake .4s var(--ease-out-soft);
}
@keyframes dg-shake{
  0%,100%{transform:translateX(0)}
  25%{transform:translateX(-5px)}
  75%{transform:translateX(5px)}
}

/* ---------- navegação ---------- */
.dg-nav{
  margin-top:2.5rem;padding-top:1.75rem;border-top:1px solid var(--border);
  display:flex;align-items:center;justify-content:space-between;gap:1rem;
}
.dg-voltar{
  display:inline-flex;align-items:center;gap:.5rem;border:0;background:none;cursor:pointer;
  font-size:.9375rem;font-weight:500;color:var(--muted-foreground);
  padding:.5rem 0;transition:color .2s;
}
.dg-voltar:hover:not(:disabled){color:var(--primary)}
.dg-voltar:disabled{opacity:.35;cursor:not-allowed}
.dg-voltar svg{width:1rem;height:1rem}
.dg-erro{
  margin-top:1rem;border-radius:1rem;
  background:color-mix(in oklab,var(--destructive,#c0392b) 10%,transparent);
  border:1px solid color-mix(in oklab,var(--destructive,#c0392b) 30%,transparent);
  padding:.75rem 1rem;font-size:.875rem;font-weight:500;
}

/* ---------- tela de contato ---------- */
.dg-contato{padding:1.75rem}
@media(min-width:640px){.dg-contato{padding:2.5rem}}
.dg-chip-pronto{
  display:inline-flex;align-items:center;gap:.45rem;
  border-radius:9999px;background:var(--accent);color:var(--accent-foreground);
  padding:.4rem .85rem;font-size:.75rem;font-weight:600;
}
.dg-chip-pronto svg{width:.95rem;height:.95rem;flex-shrink:0}
.dg-contato h2{margin-top:1rem;font-size:1.5rem;font-weight:700;line-height:1.25}
@media(min-width:640px){.dg-contato h2{font-size:1.875rem}}
.dg-contato-lead{margin-top:.875rem;font-size:.9375rem;line-height:1.65;color:var(--muted-foreground)}
.dg-campos{margin-top:1.75rem;display:grid;gap:1rem}
@media(min-width:640px){.dg-campos{grid-template-columns:1fr 1fr}}
.dg-campo-full{grid-column:1/-1}
.dg-campo label{font-size:.875rem;font-weight:500}
.dg-campo input{
  display:block;width:100%;margin-top:.4rem;height:3rem;
  border:1px solid var(--input);border-radius:1rem;background:var(--background);
  padding:0 .9rem;font-size:1rem;transition:border-color .2s,box-shadow .2s;
}
.dg-campo input:focus{outline:none;border-color:var(--ring);box-shadow:0 0 0 3px color-mix(in oklab,var(--ring) 18%,transparent)}

.dg-consent{
  position:relative;display:flex;align-items:flex-start;gap:.75rem;cursor:pointer;
  margin-top:1.5rem;border:1px solid var(--border);border-radius:1.25rem;
  background:var(--background);padding:1rem 1.125rem;font-size:.875rem;line-height:1.55;
}
.dg-consent input{position:absolute;opacity:0;width:1px;height:1px}
.dg-consent .opt-marca{border-radius:.4rem;margin-top:.1rem}
.dg-consent:has(input:checked) .opt-marca{
  border-color:var(--primary);background:var(--primary);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");
  background-size:.8rem;background-position:center;background-repeat:no-repeat;
}
.dg-consent a{color:var(--primary);font-weight:600;text-decoration:underline;text-underline-offset:3px}
.dg-lock{
  display:flex;align-items:flex-start;gap:.5rem;margin-top:.875rem;
  font-size:.75rem;line-height:1.5;color:var(--muted-foreground);
}
.dg-lock svg{width:.9rem;height:.9rem;flex-shrink:0;margin-top:.1rem;opacity:.7}

/* ---------- resultado ---------- */
.dg-resultado{padding-top:7.5rem}
@media(min-width:640px){.dg-resultado{padding-top:9.5rem}}
.dg-resultado h1{margin-top:1rem;font-size:1.875rem;font-weight:700;line-height:1.15}
@media(min-width:640px){.dg-resultado h1{font-size:2.5rem}}
.dg-res-lead{margin-top:1rem;color:var(--muted-foreground);line-height:1.65}

.dg-kicker{
  font-size:.6875rem;font-weight:700;letter-spacing:.16em;
  text-transform:uppercase;color:var(--muted-foreground);
}
.dg-kicker-solto{margin-top:2.5rem}

.dg-indice{margin-top:2rem;padding:1.75rem}
@media(min-width:640px){.dg-indice{padding:2.25rem}}
.dg-indice-num{display:flex;align-items:baseline;gap:.5rem;margin-top:.875rem;flex-wrap:wrap}
.dg-indice-num strong{font-family:var(--font-display);font-size:3rem;font-weight:700;line-height:1;color:var(--primary)}
.dg-indice-num span{font-size:.9375rem;color:var(--muted-foreground)}
.dg-indice-num .chip{margin-left:.35rem;align-self:center}
.dg-indice-txt{margin-top:1rem;font-size:.9375rem;line-height:1.6;color:var(--muted-foreground)}
.dg-dims{margin-top:1.75rem;display:flex;flex-direction:column;gap:1rem}
.dg-dim-linha{display:flex;justify-content:space-between;gap:1rem;font-size:.8125rem}
.dg-dim-val{color:var(--muted-foreground);white-space:nowrap}
.dg-indice-nota{
  margin-top:1.75rem;padding-top:1.25rem;border-top:1px solid var(--border);
  font-size:.75rem;line-height:1.6;color:var(--muted-foreground);
}

.dg-tiles{margin-top:1.25rem;display:grid;gap:1rem;grid-template-columns:repeat(3,1fr)}
.dg-tile{padding:1.25rem;text-align:center}
@media(min-width:640px){.dg-tile{padding:1.5rem;text-align:left}}
.dg-tile strong{display:block;font-family:var(--font-display);font-size:2rem;font-weight:700;line-height:1;color:var(--primary)}
.dg-tile span{display:block;margin-top:.4rem;font-size:.75rem;line-height:1.35;color:var(--muted-foreground)}

.dg-areas{margin-top:.75rem;display:flex;flex-wrap:wrap;gap:.5rem}

/* cartões de achado */
.dg-achado{margin-top:1.25rem;padding:1.5rem}
@media(min-width:640px){.dg-achado{padding:1.875rem}}
.dg-achado:hover{transform:none;box-shadow:var(--shadow-soft)}
.dg-achado-topo{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;margin-bottom:1rem}
.dg-achado-id{margin-left:auto;font-size:.6875rem;font-weight:600;color:var(--muted-foreground);opacity:.6}
.chip-atencao{background:color-mix(in oklab,var(--gold) 28%,transparent);color:oklch(38% .08 82)}
.chip-oportunidade{background:var(--accent);color:var(--accent-foreground)}
.chip-comparacao{background:color-mix(in oklab,var(--primary-glow) 18%,transparent);color:var(--accent-foreground)}
.chip-fonte{background:var(--muted,#eef4f0);color:var(--muted-foreground);font-weight:500}
.dg-achado h3{font-size:1.125rem;font-weight:700;line-height:1.3}
@media(min-width:640px){.dg-achado h3{font-size:1.25rem}}
.dg-cenario{margin-top:.4rem;font-size:.8125rem;color:var(--muted-foreground)}
.dg-achado > p{margin-top:.875rem;font-size:.9375rem;line-height:1.7}
.dg-nota{
  font-size:.875rem !important;
  border-left:3px solid var(--gold);padding-left:.875rem;color:var(--muted-foreground);
}
.dg-impacto{
  margin-top:1.125rem !important;border-radius:1rem;
  background:color-mix(in oklab,var(--accent) 55%,transparent);
  padding:.875rem 1.125rem;font-size:.875rem !important;line-height:1.6;
}
.dg-porque{margin-top:1.125rem}
.dg-porque summary{
  cursor:pointer;list-style:none;display:flex;align-items:center;gap:.5rem;
  border:1px solid var(--border);border-radius:1rem;padding:.7rem 1rem;
  font-size:.875rem;font-weight:600;transition:background-color .2s;
}
.dg-porque summary::-webkit-details-marker{display:none}
.dg-porque summary::before{
  content:"";width:.55rem;height:.55rem;border-right:2px solid var(--primary);
  border-bottom:2px solid var(--primary);transform:rotate(-45deg);transition:transform .2s;flex-shrink:0;
}
.dg-porque[open] summary::before{transform:rotate(45deg)}
.dg-porque summary:hover{background:var(--accent)}
.dg-porque p{margin-top:.75rem;padding:0 1rem;font-size:.875rem;line-height:1.65;color:var(--muted-foreground)}
.dg-fonte{
  margin-top:1.25rem !important;padding-top:1rem;border-top:1px solid var(--border);
  font-size:.75rem !important;line-height:1.7;color:var(--muted-foreground);
}
.dg-fonte a{color:var(--primary);text-decoration:underline;text-underline-offset:2px}
.dg-area{opacity:.8}

.dg-cta{margin-top:2.5rem}
.dg-cta .btn{background:var(--surface-foreground);color:var(--primary);border:0}
.dg-cta .btn:hover{background:#fff}
.dg-refazer{
  display:block;margin-top:1rem;border:0;background:none;cursor:pointer;
  font-size:.8125rem;color:var(--surface-foreground);opacity:.7;
  text-decoration:underline;text-underline-offset:3px;padding:.25rem 0;
}
.dg-refazer:hover{opacity:1}

.dg-disclaimer{
  margin-top:2rem;border:1px solid var(--border);border-radius:var(--radius);
  background:var(--card);padding:1.25rem 1.5rem;
  font-size:.75rem;line-height:1.7;color:var(--muted-foreground);
}

@media(prefers-reduced-motion:reduce){
  .dg-barra i{transition:none}
  .q-falta .q-opcoes,.q-falta .q-input{animation:none}
}

/* ---------- envio do resumo pelo WhatsApp (topo do resultado) ---------- */
.dg-enviar{
  margin-top:1.75rem;padding:1.25rem 1.5rem;
  display:flex;flex-direction:column;gap:1rem;
  border-color:color-mix(in oklab,var(--primary-glow) 40%,transparent);
  background:color-mix(in oklab,var(--accent) 45%,var(--card));
}
.dg-enviar:hover{transform:none}
@media(min-width:640px){.dg-enviar{flex-direction:row;align-items:center;justify-content:space-between}}
.dg-enviar-txt strong{display:block;font-family:var(--font-display);font-size:1rem;font-weight:700}
.dg-enviar-txt span{display:block;margin-top:.3rem;font-size:.8125rem;line-height:1.5;color:var(--muted-foreground)}
.dg-enviar .btn{flex-shrink:0;width:100%}
@media(min-width:640px){.dg-enviar .btn{width:auto}}
