/* ============================================
   Dra. Ana Paula Conrado, páginas internas
   Carrega depois do styles.css. Usa as mesmas peças da home
   (kicker, título, cartão de borda fina, conversa); aqui só o que
   é próprio das páginas que rolam normal, sem cena presa.
============================================ */

.pagina { position: relative; }

.bloco__dentro {
  max-width: 1180px;
  margin: 0 auto;
  padding: 0 clamp(20px, 4vw, 64px);
}

/* ================= TOPO: retrato + apresentação ================= */
.pagina-topo {
  position: relative;
  overflow: hidden;
  padding: calc(var(--nav-h) + 48px) 0 clamp(64px, 8vw, 104px);
  background:
    radial-gradient(ellipse 60% 70% at 78% 40%, rgba(165, 125, 47, 0.22), transparent 70%),
    linear-gradient(180deg, #121726 0%, var(--azul-petroleo) 100%);
}

/* a mesma grade de mira do hero, bem de leve */
.pagina-topo::before {
  content: '';
  position: absolute;
  inset: 0;
  opacity: 0.12;
  background-image:
    linear-gradient(rgba(244, 238, 227,0.4) 1px, transparent 1px),
    linear-gradient(90deg, rgba(244, 238, 227,0.4) 1px, transparent 1px);
  background-size: 64px 64px;
  mask-image: radial-gradient(ellipse 60% 70% at 70% 45%, black 0%, transparent 75%);
  -webkit-mask-image: radial-gradient(ellipse 60% 70% at 70% 45%, black 0%, transparent 75%);
  pointer-events: none;
}

.pagina-topo .bloco__dentro {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(220px, 400px);
  gap: clamp(32px, 6vw, 96px);
  align-items: center;
}

.pagina-topo__titulo {
  font-family: var(--font-display);
  font-weight: 400;
  font-size: clamp(38px, 5.2vw, 66px);
  line-height: 1.08;
  letter-spacing: -0.01em;
}
.pagina-topo__titulo em { font-style: italic; color: var(--bege); }

.pagina-topo__cargo {
  margin-top: 14px;
  font-family: var(--font-support);
  font-size: 14px;
  letter-spacing: 0.04em;
  color: rgba(255,255,255,0.75);
}

/* os cartões do HUD da home, em linha */
.fatos {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 32px;
}
.fatos .hud__card { flex: 1 1 160px; }

/* retrato: moldura de borda fina com cantos de mira */
.retrato {
  position: relative;
  margin: 0;
  border: 1px solid rgba(244, 238, 227, 0.28);
  border-top: 2px solid var(--bege);
  background: rgba(25, 31, 50, 0.5);
  padding: 10px;
}
.retrato img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 2 / 3;
  object-fit: cover;
  filter: saturate(0.95) contrast(1.03);
}
.retrato::before,
.retrato::after {
  content: '';
  position: absolute;
  width: 14px;
  height: 14px;
  border-color: var(--bege);
  border-style: solid;
}
.retrato::before { left: -6px; bottom: -6px; border-width: 0 0 1px 1px; }
.retrato::after  { right: -6px; bottom: -6px; border-width: 0 1px 1px 0; }

.retrato__legenda {
  position: absolute;
  left: 22px;
  bottom: 22px;
  padding: 8px 12px;
  background: rgba(25, 31, 50, 0.72);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-left: 2px solid var(--bege);
  font-family: var(--font-support);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

/* ================= BLOCOS ================= */
.bloco { padding: clamp(72px, 10vw, 128px) 0; position: relative; }
.bloco--risco { border-top: 1px solid rgba(244, 238, 227, 0.12); }

.bloco .cena__titulo { font-size: clamp(30px, 3.8vw, 48px); }
.bloco .cena__texto { max-width: 600px; }
.bloco .cena__texto + .cena__texto { margin-top: 16px; }

.duas {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
  gap: clamp(36px, 6vw, 96px);
  align-items: start;
}

/* linha do tempo: marcos verticais com fio dourado */
.marcos {
  list-style: none;
  position: relative;
  padding-left: 28px;
  margin-top: 8px;
}
.marcos::before {
  content: '';
  position: absolute;
  left: 5px;
  top: 6px;
  bottom: 6px;
  width: 1px;
  background: linear-gradient(180deg, var(--bege), rgba(165,125,47,0.3));
}
.marco { position: relative; padding-bottom: 30px; }
.marco:last-child { padding-bottom: 0; }
.marco::before {
  content: '';
  position: absolute;
  left: -27px;
  top: 5px;
  width: 9px;
  height: 9px;
  transform: rotate(45deg);
  background: var(--azul-petroleo);
  border: 1px solid var(--bege);
}
.marco:last-child::before { background: var(--bege); }

.marco__quando {
  font-family: var(--font-support);
  font-weight: 700;
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--bege);
}
.marco__nome {
  display: block;
  margin-top: 4px;
  font-family: var(--font-display);
  font-weight: 400;
  font-size: 24px;
  line-height: 1.2;
}
.marco__texto {
  margin-top: 6px;
  font-family: var(--font-body);
  font-weight: 300;
  font-size: 15px;
  line-height: 1.6;
  color: rgba(255,255,255,0.8);
}

/* ================= FAIXA COM FOTO ================= */
.faixa {
  position: relative;
  overflow: hidden;
  padding: clamp(88px, 12vw, 150px) 0;
}
.faixa__fundo,
.faixa__leitura { position: absolute; inset: 0; }
.faixa__fundo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 60% 50%;
  filter: saturate(0.9);
}
.faixa__leitura {
  background:
    linear-gradient(180deg, var(--azul-petroleo) 0%, rgba(25,31,50,0.3) 22%, rgba(25,31,50,0.3) 78%, var(--azul-petroleo) 100%),
    linear-gradient(90deg, rgba(25,31,50,0.95) 0%, rgba(25,31,50,0.78) 45%, rgba(25,31,50,0.35) 100%);
}
.faixa .bloco__dentro { position: relative; }
.faixa .duas { align-items: center; }
.faixa .retrato { max-width: 360px; justify-self: end; width: 100%; }
.faixa .retrato img { aspect-ratio: 4 / 5; object-position: 50% 15%; }

/* ================= CARTÕES (talhões em 4) ================= */
.talhoes--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: 40px; }

/* ================= CONTATO: fala + conversa ================= */
.contato {
  position: relative;
  overflow: hidden;
  padding: clamp(88px, 11vw, 140px) 0;
}
.contato .faixa__leitura {
  background:
    linear-gradient(180deg, var(--azul-petroleo) 0%, rgba(25,31,50,0.45) 28%, rgba(25,31,50,0.55) 100%),
    linear-gradient(90deg, rgba(25,31,50,0.92) 0%, rgba(25,31,50,0.6) 50%, rgba(25,31,50,0.35) 100%);
}
.contato .faixa__fundo img { object-position: 50% 62%; }
.contato .bloco__dentro {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, 400px);
  gap: clamp(32px, 6vw, 96px);
  align-items: center;
}

/* ================= PÁGINAS DE SERVIÇO (30/09/2026) ================= */

/* topo com foto escurecida (serviço) */
.pagina-topo--foto {
  min-height: min(86vh, 760px);
  display: flex;
  align-items: flex-end;
  background: var(--azul-petroleo);
}
.pagina-topo--foto::before { display: none; }
.pagina-topo--foto .faixa__fundo img { object-position: 50% 50%; }
.pagina-topo--foto .faixa__leitura {
  background:
    linear-gradient(180deg, rgba(25,31,50,0.55) 0%, rgba(25,31,50,0.25) 35%, rgba(25,31,50,0.7) 75%, var(--azul-petroleo) 100%),
    linear-gradient(90deg, rgba(25,31,50,0.95) 0%, rgba(25,31,50,0.72) 50%, rgba(25,31,50,0.2) 100%);
}
.pagina-topo--foto .bloco__dentro { display: block; width: 100%; }
.pagina-topo--foto .bloco__dentro > div { max-width: 760px; }
.pagina-topo--foto .pagina-topo__titulo { font-size: clamp(34px, 4.6vw, 58px); }
.pagina-topo--foto .cena__texto { max-width: 620px; }
.pagina-topo--foto .hero__actions { margin-top: 32px; }
.pagina-topo--foto .pagina-topo__cargo { margin-top: 28px; }

/* página geral: atalhos das cinco frentes, à direita do topo */
.pagina-topo--lista .bloco__dentro { grid-template-columns: minmax(0, 1fr) minmax(220px, 340px); }
.atalhos {
  display: flex;
  flex-direction: column;
  padding: 18px 22px;
  background: rgba(25, 31, 50, 0.55);
  border: 1px solid rgba(244, 238, 227, 0.24);
  border-top: 2px solid var(--bege);
}
.atalhos__rotulo {
  font-family: var(--font-support);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--bege);
  margin-bottom: 6px;
}
.atalhos a {
  padding: 11px 0;
  border-bottom: 1px solid rgba(244, 238, 227, 0.14);
  font-family: var(--font-display);
  font-size: 19px;
  color: var(--branco);
  text-decoration: none;
  transition: color 0.3s ease, padding 0.3s ease;
}
.atalhos a:last-child { border-bottom: 0; }
.atalhos a:hover { color: var(--bege); padding-left: 6px; }

/* página geral: cada frente */
.area { scroll-margin-top: var(--nav-h); }
.area__indicado {
  margin-top: 18px;
  max-width: 600px;
  padding-left: 14px;
  border-left: 2px solid var(--bronze);
  font-family: var(--font-body);
  font-weight: 300;
  font-size: 15px;
  line-height: 1.6;
  color: rgba(255,255,255,0.82);
}
.area__indicado strong { font-family: var(--font-support); font-weight: 700; color: var(--bege); }
.area__acao { margin-top: 26px; }

.recebe {
  padding: 20px 24px 8px;
  background: rgba(25, 31, 50, 0.5);
  border: 1px solid rgba(244, 238, 227, 0.24);
  border-top: 2px solid var(--bege);
}
.recebe__rotulo {
  font-family: var(--font-support);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--bege);
}
.recebe .clausulas { margin-top: 10px; }
.recebe .clausula:last-child { border-bottom: 0; }

/* linha de contrato sem nome: só a frase */
.clausulas--simples .clausula__texto {
  margin-top: 0;
  font-size: 17px;
  line-height: 1.55;
  color: rgba(255,255,255,0.86);
}

/* ponto de atenção sobre a foto */
.destaques { margin-top: 26px; max-width: 720px; display: grid; gap: 16px; }
.destaques--dois { max-width: none; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.destaque {
  padding: 24px 28px;
  background: rgba(25, 31, 50, 0.62);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border: 1px solid rgba(244, 238, 227, 0.24);
  border-left: 2px solid var(--bege);
}
.destaque__titulo {
  font-family: var(--font-display);
  font-weight: 400;
  font-size: clamp(24px, 2.6vw, 32px);
  line-height: 1.15;
}
.destaque__texto {
  margin-top: 12px;
  font-family: var(--font-body);
  font-weight: 300;
  font-size: 17px;
  line-height: 1.65;
  color: rgba(255,255,255,0.86);
}

/* dúvidas: abre e fecha, fio dourado entre elas */
.duvidas {
  margin-top: 36px;
  max-width: 860px;
  border-top: 1px solid rgba(244, 238, 227, 0.18);
}
.duvida { border-bottom: 1px solid rgba(244, 238, 227, 0.18); }
.duvida summary {
  position: relative;
  list-style: none;
  cursor: pointer;
  padding: 20px 44px 20px 0;
  font-family: var(--font-display);
  font-size: 21px;
  line-height: 1.3;
  transition: color 0.3s ease;
}
.duvida summary::-webkit-details-marker { display: none; }
.duvida summary::after {
  content: '+';
  position: absolute;
  right: 6px;
  top: 50%;
  transform: translateY(-50%);
  font-family: var(--font-support);
  font-size: 22px;
  color: var(--bege);
  transition: transform 0.3s ease;
}
.duvida[open] summary::after { transform: translateY(-50%) rotate(45deg); }
.duvida summary:hover { color: var(--bege); }
.duvida summary:focus-visible { outline: 1px solid var(--bege); outline-offset: 4px; }
.duvida p {
  max-width: 720px;
  padding-bottom: 14px;
  font-family: var(--font-body);
  font-weight: 300;
  font-size: 16px;
  line-height: 1.65;
  color: rgba(255,255,255,0.82);
}
.duvida p:last-child { padding-bottom: 22px; }
.duvidas__mais { margin-top: 30px; }
.duvidas__nota {
  margin-top: 18px;
  max-width: 720px;
  font-family: var(--font-body);
  font-size: 13px;
  line-height: 1.6;
  color: rgba(255,255,255,0.6);
}

/* outras frentes: cartão inteiro vira link */
.bloco--curto { padding: clamp(56px, 7vw, 88px) 0; }
.talhao--link { transition: border-color 0.3s ease, transform 0.3s ease; }
.talhao--link:hover { transform: translateY(-3px); border-color: rgba(244, 238, 227, 0.6); }
.talhao--link a { color: var(--branco); text-decoration: none; }
.talhao--link a::before { content: ''; position: absolute; inset: 0; }
.talhao--link:hover a { color: var(--bege); }

/* ================= TEXTO LEGAL (privacidade) ================= */
.pagina-topo--texto { padding-bottom: clamp(48px, 6vw, 72px); }
.pagina-topo--texto .bloco__dentro { grid-template-columns: 1fr; }

.texto-legal { max-width: 760px; }
.texto-legal h2 {
  margin: 44px 0 14px;
  padding-top: 22px;
  border-top: 1px solid rgba(244, 238, 227, 0.18);
  font-family: var(--font-display);
  font-weight: 400;
  font-size: clamp(24px, 2.6vw, 30px);
  line-height: 1.2;
}
.texto-legal h2:first-of-type { margin-top: 36px; }
.texto-legal p,
.texto-legal li {
  font-family: var(--font-body);
  font-weight: 300;
  font-size: 17px;
  line-height: 1.7;
  color: rgba(255,255,255,0.84);
}
.texto-legal p + p { margin-top: 14px; }
.texto-legal ul { list-style: none; margin: 14px 0; }
.texto-legal li { position: relative; padding: 6px 0 6px 22px; }
.texto-legal li::before {
  content: '';
  position: absolute;
  left: 2px;
  top: 17px;
  width: 7px;
  height: 7px;
  transform: rotate(45deg);
  border: 1px solid var(--bege);
}
.texto-legal strong { font-weight: 500; color: var(--branco); }
.texto-legal a { color: var(--bege); }

/* ================= BLOG (30/09/2026) ================= */
.filtros { display: flex; flex-wrap: wrap; gap: 10px; }
.filtro {
  padding: 10px 16px;
  background: transparent;
  border: 1px solid rgba(244, 238, 227, 0.28);
  color: rgba(255,255,255,0.82);
  font-family: var(--font-support);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  cursor: pointer;
  transition: border-color 0.3s ease, color 0.3s ease, background 0.3s ease;
}
.filtro:hover { border-color: var(--bege); color: var(--bege); }
.filtro[aria-pressed="true"] { background: var(--bege); border-color: var(--bege); color: var(--azul-petroleo); }
.filtro:focus-visible { outline: 1px solid var(--bege); outline-offset: 3px; }

.artigos {
  list-style: none;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 22px;
  margin-top: 36px;
}
.artigos--tres { margin-top: 32px; }
.artigos__vazio { margin-top: 30px; color: rgba(255,255,255,0.7); font-family: var(--font-body); }

.cartao-artigo {
  position: relative;
  background: rgba(25, 31, 50, 0.5);
  border: 1px solid rgba(244, 238, 227, 0.2);
  border-top: 2px solid var(--bege);
  transition: transform 0.3s ease, border-color 0.3s ease;
}
.cartao-artigo:hover { transform: translateY(-3px); border-color: rgba(244, 238, 227, 0.55); }
.cartao-artigo[hidden] { display: none; }
.cartao-artigo__link { display: flex; flex-direction: column; height: 100%; color: var(--branco); text-decoration: none; }
.cartao-artigo__foto { display: block; aspect-ratio: 16 / 10; overflow: hidden; background: #121726; }
.cartao-artigo__foto img { width: 100%; height: 100%; object-fit: cover; filter: saturate(0.92); transition: transform 0.6s ease; }
.cartao-artigo:hover .cartao-artigo__foto img { transform: scale(1.04); }
.cartao-artigo__cat {
  margin: 18px 20px 0;
  font-family: var(--font-support);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--bege);
}
.cartao-artigo__titulo {
  margin: 8px 20px 0;
  font-family: var(--font-display);
  font-weight: 400;
  font-size: 21px;
  line-height: 1.25;
}
.cartao-artigo:hover .cartao-artigo__titulo { color: var(--bege); }
.cartao-artigo__resumo {
  margin: 10px 20px 0;
  font-family: var(--font-body);
  font-weight: 300;
  font-size: 14.5px;
  line-height: 1.55;
  color: rgba(255,255,255,0.75);
}
.cartao-artigo__data {
  margin: auto 20px 18px;
  padding-top: 14px;
  font-family: var(--font-support);
  font-size: 11px;
  letter-spacing: 0.06em;
  color: rgba(255,255,255,0.55);
}

/* artigo */
.artigo-topo .pagina-topo__titulo { font-size: clamp(30px, 4vw, 50px); max-width: 900px; }
.artigo-topo .cena__texto { max-width: 720px; }
.artigo .bloco__dentro { max-width: 900px; }
.artigo__capa {
  margin: 0 0 12px;
  padding: 10px;
  border: 1px solid rgba(244, 238, 227, 0.28);
  border-top: 2px solid var(--bege);
  background: rgba(25, 31, 50, 0.5);
}
.artigo__capa img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; }
.artigo__corpo { max-width: 720px; }
.artigo__nota {
  margin: 32px 0;
  padding: 22px 26px;
  background: rgba(25, 31, 50, 0.62);
  border: 1px solid rgba(244, 238, 227, 0.24);
  border-left: 2px solid var(--bege);
}
.artigo__nota strong { color: var(--bege); }
.artigo__acao { margin-top: 40px; }
.artigo__assinatura { margin-top: 36px; }

@media (max-width: 1000px) {
  .talhoes--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: none; }
  .artigos { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 800px) {
  .duas,
  .contato .bloco__dentro { grid-template-columns: 1fr; }

  .faixa .retrato { justify-self: start; max-width: 300px; }

  .pagina-topo--lista .bloco__dentro { grid-template-columns: 1fr; }
  .destaques--dois { grid-template-columns: 1fr; }
}

@media (max-width: 700px) {
  .pagina-topo { padding-top: calc(var(--nav-h) + 16px); }
  .pagina-topo__titulo { font-size: 38px; }
  .pagina-topo .bloco__dentro { grid-template-columns: 1fr; gap: 28px; }
  .pagina-topo .retrato { max-width: 210px; order: -1; }
  .fatos { gap: 8px; margin-top: 24px; }
  .bloco .cena__titulo { font-size: 29px; }
  .marco__nome { font-size: 20px; }
  .talhoes--4 { grid-template-columns: 1fr; margin-top: 24px; }
  .faixa .retrato { display: none; }
  .faixa__leitura {
    background:
      linear-gradient(180deg, var(--azul-petroleo) 0%, rgba(25,31,50,0.75) 20%, rgba(25,31,50,0.85) 80%, var(--azul-petroleo) 100%);
  }

  .pagina-topo--foto { min-height: 0; padding-top: calc(var(--nav-h) + 120px); }
  .pagina-topo--foto .pagina-topo__titulo { font-size: 32px; }
  .pagina-topo--foto .faixa__leitura {
    background: linear-gradient(180deg, rgba(25,31,50,0.45) 0%, rgba(25,31,50,0.7) 35%, rgba(25,31,50,0.92) 70%, var(--azul-petroleo) 100%);
  }
  .pagina-topo--foto .hero__actions { flex-direction: column; align-items: stretch; gap: 12px; }
  .atalhos a { font-size: 17px; padding: 9px 0; }
  .clausulas--simples .clausula__texto { font-size: 15px; }
  .destaque { padding: 18px 20px; }
  .destaque__texto { font-size: 15px; }
  .duvida summary { font-size: 18px; padding: 16px 38px 16px 0; }
  .duvida p { font-size: 15px; }
  .recebe { padding: 16px 18px 4px; }
  .texto-legal p, .texto-legal li { font-size: 15px; }
  .artigos { grid-template-columns: 1fr; gap: 16px; margin-top: 24px; }
  .filtros { gap: 8px; }
  .filtro { padding: 9px 12px; font-size: 11px; }
  .cartao-artigo__titulo { font-size: 19px; }
  .artigo-topo .pagina-topo__titulo { font-size: 28px; }
  .artigo__capa { padding: 6px; }
  .artigo__nota { padding: 16px 18px; }
}

/* ============================================================
   DIAGNÓSTICO ONLINE (diagnostico.js, só na página de Diagnóstico Financeiro, 02/10/2026)
   ============================================================ */
.contato--diag .bloco__dentro { grid-template-columns: minmax(0, 1fr) minmax(340px, 470px); align-items: start; }

/* mesma caixa da conversa das outras páginas */
.diag {
  position: relative;
  padding: 20px 22px 18px;
  background: rgba(25, 31, 50, 0.74);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border: 1px solid rgba(244, 238, 227, 0.28);
  border-top: 2px solid var(--bege);
  scroll-margin-top: calc(var(--nav-h) + 16px);
}

.diag__navega { display: inline-flex; align-items: baseline; gap: 14px; }
.diag__voltar {
  padding: 0;
  background: none;
  border: 0;
  font: inherit;
  letter-spacing: inherit;
  text-transform: inherit;
  color: rgba(255,255,255,0.7);
  text-decoration: underline;
  text-underline-offset: 3px;
  cursor: pointer;
}
.diag__voltar:hover { color: var(--bege); }
.diag__voltar[hidden] { display: none; }

.diag .pergunta__texto small {
  display: block;
  margin-top: 6px;
  font-family: var(--font-support);
  font-size: 12px;
  letter-spacing: 0.04em;
  color: rgba(255,255,255,0.6);
}
.pergunta__opcoes--lista { flex-direction: column; }
.pergunta__opcoes--lista button { flex: none; text-align: left; padding: 12px 14px; }
.diag .pergunta__opcoes button[aria-pressed="true"] {
  border-color: var(--bege);
  background: var(--bege);
  color: var(--azul-petroleo);
}
.diag__continuar { width: 100%; margin-top: 14px; cursor: pointer; }
.diag__continuar:disabled { opacity: 0.45; cursor: not-allowed; }

/* um passo por vez: pergunta, contato ou resultado (sem JavaScript, as perguntas aparecem e o WhatsApp resolve) */
.diag__contato { display: none; gap: 14px; }
.js .diag .pergunta,
.js .diag__resultado { display: none; }
.js .diag[data-passo="1"] .pergunta[data-pergunta="1"],
.js .diag[data-passo="2"] .pergunta[data-pergunta="2"],
.js .diag[data-passo="3"] .pergunta[data-pergunta="3"],
.js .diag[data-passo="4"] .pergunta[data-pergunta="4"],
.js .diag[data-passo="5"] .pergunta[data-pergunta="5"],
.js .diag[data-passo="6"] .pergunta[data-pergunta="6"],
.js .diag[data-passo="7"] .pergunta[data-pergunta="7"],
.js .diag[data-passo="8"] .pergunta[data-pergunta="8"],
.js .diag[data-passo="resultado"] .diag__resultado {
  display: block;
  animation: pergunta-in 0.5s ease;
}
.js .diag[data-passo="contato"] .diag__contato { display: grid; animation: pergunta-in 0.5s ease; }
.js .diag[data-passo="contato"] .conversa__contador,
.js .diag[data-passo="resultado"] .conversa__topo,
.js .diag[data-passo="resultado"] .conversa__direto { display: none; }
.diag__contato .pergunta__texto { margin-bottom: 2px; }
.diag__ver { width: 100%; cursor: pointer; }

/* anexos opcionais (até 3 arquivos de 5 MB) */
.chamar__anexo { display: grid; gap: 8px; }
.chamar__anexo-titulo {
  font-family: var(--font-support);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.75);
}
.chamar__anexo-titulo small { font-weight: 400; letter-spacing: 0.04em; text-transform: none; color: rgba(255,255,255,0.5); }
.chamar__anexo-botao { position: relative; width: fit-content; cursor: pointer; }
.chamar__anexo-botao input { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; font-size: 0; }
.chamar__anexo-ajuda { font-size: 12px; line-height: 1.5; color: rgba(255,255,255,0.65); }
.chamar__anexo-lista { list-style: none; display: grid; gap: 6px; }
.chamar__anexo-lista:empty { display: none; }
.chamar__anexo-lista li {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  background: rgba(0, 0, 0, 0.22);
  border-left: 3px solid var(--bege);
  font-size: 13px;
  overflow-wrap: anywhere;
}
.chamar__anexo-tirar {
  flex-shrink: 0;
  padding: 4px;
  background: none;
  border: 0;
  color: var(--bege);
  font-size: 12px;
  text-decoration: underline;
  text-underline-offset: 3px;
  cursor: pointer;
}

/* resultado */
.diag__resultado:focus { outline: none; }
.diag__marca {
  font-family: var(--font-support);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  color: var(--bege);
}
.diag__titulo {
  margin-top: 8px;
  font-family: var(--font-display);
  font-weight: 400;
  font-size: 28px;
  line-height: 1.15;
  color: var(--branco);
}
.diag__titulo em { font-style: italic; color: var(--bege); }
.diag__data { margin-top: 4px; font-size: 12px; color: rgba(255,255,255,0.6); }

.diag__areas { list-style: none; display: grid; gap: 10px; margin-top: 18px; }
.diag__area {
  padding: 14px 16px;
  background: rgba(0, 0, 0, 0.24);
  border-left: 3px solid rgba(255,255,255,0.35);
}
.diag__area[data-nivel="alto"] { border-left-color: #E8907A; }
.diag__area[data-nivel="medio"] { border-left-color: var(--bege); }
.diag__area[data-nivel="ok"] { border-left-color: #9CC79A; }
.diag__area-topo { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.diag__area-nome { font-family: var(--font-display); font-weight: 400; font-size: 20px; color: var(--branco); }
.diag__nivel {
  flex-shrink: 0;
  font-family: var(--font-support);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.03em;
}
.diag__area[data-nivel="alto"] .diag__nivel { color: #F2A896; }
.diag__area[data-nivel="medio"] .diag__nivel { color: var(--bege); }
.diag__area[data-nivel="ok"] .diag__nivel { color: #B5DBB3; }
.diag__frase {
  margin-top: 6px;
  font-family: var(--font-body);
  font-weight: 300;
  font-size: 14px;
  line-height: 1.55;
  color: rgba(255,255,255,0.88);
}
.diag__link {
  display: inline-block;
  margin-top: 8px;
  font-family: var(--font-support);
  font-size: 12px;
  color: var(--bege);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.diag__envio { margin-top: 14px; font-size: 13px; line-height: 1.5; color: var(--bege); }
.diag__envio.is-erro { color: #ffb4a8; }
.diag__acoes { display: grid; gap: 10px; margin-top: 14px; }
.diag__acoes .btn { width: 100%; cursor: pointer; }

.diag__respostas { margin-top: 18px; padding-top: 14px; border-top: 1px solid rgba(255,255,255,0.14); }
.diag__respostas-titulo { font-family: var(--font-display); font-size: 17px; color: var(--branco); }
.diag__respostas ul {
  list-style: none;
  display: grid;
  gap: 4px;
  margin-top: 8px;
  font-family: var(--font-body);
  font-size: 13px;
  line-height: 1.45;
  color: rgba(255,255,255,0.86);
}
.diag__respostas li span { color: rgba(255,255,255,0.55); }
.diag__aviso { margin-top: 14px; font-size: 11.5px; line-height: 1.5; color: rgba(255,255,255,0.6); }

@media (max-width: 800px) {
  .contato--diag .bloco__dentro { grid-template-columns: 1fr; }
}
@media (max-width: 700px) {
  .diag { padding: 16px 16px 14px; }
  .diag__titulo { font-size: 24px; }
}

/* "Salvar em PDF": imprime só o resultado, em papel branco */
@media print {
  .imprime-diag body { background: #fff; }
  .imprime-diag body > *:not(main),
  .imprime-diag main > *:not(#contato),
  .imprime-diag #contato > :not(.bloco__dentro),
  .imprime-diag #contato .fala,
  .imprime-diag .diag > :not(.diag__resultado),
  .imprime-diag .diag__acoes,
  .imprime-diag .diag__envio,
  .imprime-diag .diag__refazer { display: none !important; }
  .imprime-diag #contato,
  .imprime-diag #contato .bloco__dentro { display: block; padding: 0; margin: 0; }
  .imprime-diag .diag {
    padding: 0;
    background: none;
    border: 0;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    opacity: 1 !important;
    transform: none !important;
  }
  .imprime-diag .diag__resultado { display: block !important; animation: none; color: #191F32; }
  .imprime-diag .diag__marca { color: #A57D2F; }
  .imprime-diag .diag__titulo,
  .imprime-diag .diag__area-nome,
  .imprime-diag .diag__respostas-titulo { color: #191F32; }
  .imprime-diag .diag__titulo em { color: #A57D2F; }
  .imprime-diag .diag__data,
  .imprime-diag .diag__aviso,
  .imprime-diag .diag__respostas li span { color: #555; }
  .imprime-diag .diag__frase,
  .imprime-diag .diag__respostas ul { color: #222; }
  .imprime-diag .diag__area { background: #f6f3ec; break-inside: avoid; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .imprime-diag .diag__area[data-nivel="alto"] .diag__nivel { color: #B4462E; }
  .imprime-diag .diag__area[data-nivel="medio"] .diag__nivel { color: #8A6420; }
  .imprime-diag .diag__area[data-nivel="ok"] .diag__nivel { color: #3E7A3B; }
  .imprime-diag .diag__link { color: #191F32; }
  .imprime-diag .diag__respostas { border-top-color: #ddd; }
}