@font-face { font-family: "Brygada 1918"; src: url("fonts/brygada-1918-italic-latin.woff2") format("woff2"); font-style: italic; font-weight: 400 700; font-display: swap; }
@font-face { font-family: "Brygada 1918"; src: url("fonts/brygada-1918-latin.woff2") format("woff2"); font-style: normal; font-weight: 400 700; font-display: swap; }
@font-face { font-family: "Archivo"; src: url("fonts/archivo-latin.woff2") format("woff2"); font-style: normal; font-weight: 400 700; font-display: swap; }

:root {
  --verde-escuro: #050505; /* fundo: preto (antes #05160d, verde) */
  --preto: #0b0d0c;
  --laje: #151816;
  --tinta: #f1efe8;
  --tinta-2: #dddbd3;
  --tinta-3: #c6c4bc;
  --fio: rgba(241, 239, 232, .14);
  --fio-2: rgba(241, 239, 232, .26);
  --verde: #8fdfb0;
  --verde-fundo: #2fa064;
  --verde-forte: #1a7344;
  --tomate: #e8826d;
  --f-display: "Brygada 1918", Georgia, "Times New Roman", serif;
  --f-texto: "Archivo", system-ui, -apple-system, "Segoe UI", sans-serif;
  --wrap: 880px;
  --r: 14px;
  --ease: cubic-bezier(.16, 1, .3, 1);
  --seta-btn: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 15 15'%3E%3Cpath d='M8.146 3.146a.5.5 0 0 1 .708 0l4 4a.5.5 0 0 1 0 .708l-4 4a.5.5 0 0 1-.708-.708L11.293 8H2.5a.5.5 0 0 1 0-1h8.793L8.146 3.854a.5.5 0 0 1 0-.708Z'/%3E%3C/svg%3E");
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { -webkit-text-size-adjust: 100%; color-scheme: dark; background: var(--verde-escuro); }
body {
  min-height: 100vh;
  font-family: var(--f-texto); font-size: 17px; line-height: 1.55; color: var(--tinta-2);
  background:
    /* preto com luz verde: canto superior esquerdo e inferior direito */
    radial-gradient(ellipse 80% 65% at 8% 0%, rgba(26, 115, 68, .55) 0%, rgba(26, 115, 68, .16) 48%, transparent 75%),
    radial-gradient(ellipse 70% 60% at 100% 100%, rgba(18, 90, 52, .46) 0%, transparent 72%),
    linear-gradient(180deg, #060807 0%, #050505 100%),
    var(--verde-escuro);
  background-attachment: fixed;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
  padding-bottom: env(safe-area-inset-bottom);
}
img { display: block; max-width: 100%; }
button { font: inherit; cursor: pointer; border: 0; background: none; color: inherit; }
input { font: inherit; }
a { color: var(--verde); }
::selection { background: var(--verde-forte); color: var(--tinta); }
:focus-visible { outline: 2px solid var(--verde); outline-offset: 3px; border-radius: 5px; }
[hidden] { display: none !important; }

h1, h2, h3 { font-family: var(--f-display); font-style: italic; font-weight: 500; line-height: 1.08; letter-spacing: -.012em; color: var(--tinta); text-wrap: balance; }
h1 { font-size: clamp(30px, 5vw, 46px); }
h2 { font-size: clamp(24px, 3.4vw, 32px); margin-bottom: 16px; }
h3 { font-size: 21px; }
b, strong { color: var(--tinta); font-weight: 600; }
.num { font-family: var(--f-display); font-style: normal; font-variant-numeric: tabular-nums lining-nums; }
.wrap { --gutter: 16px; width: 100%; max-width: var(--wrap); margin-inline: auto; padding-inline: var(--gutter); }
@media (min-width: 700px) { .wrap { --gutter: 32px; } }

/* Topo: cor sólida (regra da casa para a barra de status do celular) */
.topo { position: sticky; top: 0; z-index: 10; background: var(--verde-escuro); border-bottom: 1px solid var(--fio); padding-top: env(safe-area-inset-top); }
.topo__in { display: flex; align-items: center; gap: 18px; height: 80px; }
.topo__logo { height: 44px; width: auto; }
@media (max-width: 480px) { .topo__in { height: 68px; } .topo__logo { height: 34px; } }
.topo__nome { font-family: var(--f-display); font-style: italic; color: var(--tinta-3); font-size: 20px; padding-left: 18px; border-left: 1px solid var(--fio-2); }
.topo .btn { margin-left: auto; }
@media (max-width: 480px) { .topo__nome { display: none; } }

/* Capa */
.capa { position: relative; isolation: isolate; min-height: 100vh; min-height: 100svh; display: flex; align-items: center; overflow: hidden; background: #050706; }
.capa__foto img {
  position: absolute; z-index: -2; right: 0; bottom: 0; width: min(100%, 1400px); height: auto; max-width: none;
  /* Funde as bordas da foto no fundo preto (sem a "caixa" visível) */
  -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 38%), linear-gradient(90deg, transparent 0%, #000 34%);
  -webkit-mask-composite: source-in;
  mask-image: linear-gradient(180deg, transparent 0%, #000 38%), linear-gradient(90deg, transparent 0%, #000 34%);
  mask-composite: intersect;
}
.capa::before { content: ""; position: absolute; z-index: -1; inset: 0; background: linear-gradient(90deg, #050706 0%, rgba(5, 7, 6, .92) 32%, rgba(5, 7, 6, .25) 62%, rgba(5, 7, 6, 0) 100%), linear-gradient(180deg, #050706 0%, rgba(5, 7, 6, 0) 30%); }
.capa__in { padding-block: 56px; --wrap: 1200px; }
.capa h1 { font-size: clamp(38px, 5.8vw, 80px); line-height: 1.04; }
.capa h1 s { white-space: nowrap; text-decoration-thickness: .06em; text-decoration-color: var(--tinta-2); color: var(--tinta-2); }
.capa h1 em { color: #5aa877; }
.capa h1 .capa__promessa { color: var(--verde); }
.capa__texto { margin-top: 26px; max-width: 46ch; font-size: clamp(17px, 1.6vw, 20px); color: var(--tinta-2); }
.capa .btn { margin-top: 30px; }
.capa__selos { display: flex; flex-wrap: wrap; gap: 10px 26px; margin-top: 28px; list-style: none; font-size: 15px; color: var(--tinta-2); }
.capa__selos li { display: flex; align-items: center; gap: 8px; }
.capa__selos .ic { color: var(--verde); width: 18px; height: 18px; }
.ic { width: 1em; height: 1em; flex: none; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
@media (max-width: 760px) and (orientation: portrait) {
  .capa { align-items: flex-start; }
  .capa__marca { margin-bottom: 36px; }
  .capa__marca img { height: 52px; }
  .capa__foto img { width: 100%; height: 62%; object-fit: cover; object-position: center bottom; -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 35%); mask-image: linear-gradient(180deg, transparent 0%, #000 35%); }
  .capa::before { background: linear-gradient(180deg, #050706 0%, rgba(5, 7, 6, .94) 48%, rgba(5, 7, 6, .35) 72%, rgba(5, 7, 6, .55) 100%); }
  .capa__in { padding-block: 40px 260px; }
}
body.na-capa main { display: none; }
body.na-capa, body.na-capa .topo { background: #050505; }
body.na-capa .topo { border-bottom-color: transparent; }
body:not(.na-capa) .capa { display: none; }
body.na-capa #novo { display: none; }
body.na-capa .topo { display: none; }
.capa__marca { display: flex; align-items: center; gap: clamp(16px, 2vw, 28px); margin-bottom: clamp(40px, 7vh, 80px); }
.capa__marca img { height: clamp(64px, 8vw, 120px); width: auto; }
.capa__marca span { font-family: var(--f-display); font-style: italic; font-size: clamp(20px, 2.2vw, 32px); color: var(--tinta-3); padding-left: clamp(16px, 2vw, 28px); border-left: 1px solid var(--fio-2); line-height: 1.2; }
.capa__site { position: absolute; top: 28px; right: max(var(--gutter, 16px), calc((100% - 1200px) / 2 + var(--gutter, 16px))); font-size: 14px; color: var(--tinta-3); text-decoration: none; }
.capa__site:hover { color: var(--verde); }
@media (max-width: 480px) {
  .capa__site { display: none; }
  .capa__marca img { height: 44px !important; }
  .capa__marca span { font-size: 17px; }
}

/* Botões */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  font-weight: 600; font-size: 15.5px; padding: 12px 24px; min-height: 48px;
  border-radius: 5px; border: 1.5px solid var(--verde-fundo); color: var(--tinta); white-space: nowrap;
  transition: filter .25s var(--ease), transform .25s var(--ease), background .25s;
}
.btn--sm { padding: 8px 18px; min-height: 40px; font-size: 14px; }
.btn--solid { background: linear-gradient(90deg, #06200f, var(--verde-forte)); }
.btn--solid::after { content: ""; width: 20px; height: 20px; margin-right: -6px; background: currentColor; -webkit-mask: var(--seta-btn) center / contain no-repeat; mask: var(--seta-btn) center / contain no-repeat; }
.btn--solid:hover { filter: brightness(1.14); transform: translateY(-1px); }
.btn--ghost:hover { background: linear-gradient(90deg, #06200f, var(--verde-forte)); }
.btn--brilho { position: relative; overflow: hidden; isolation: isolate; }
.btn--brilho::before {
  content: ""; position: absolute; z-index: -1; inset: -2px auto -2px -60%; width: 45%;
  background: linear-gradient(100deg, transparent, rgba(143, 223, 176, .45), transparent);
  transform: skewX(-18deg); animation: brilho 4.2s var(--ease) 1.2s infinite;
}
.btn--brilho::after { animation: empurra 4.2s var(--ease) 1.2s infinite; }
@keyframes brilho { 0% { left: -60%; } 28%, 100% { left: 130%; } }
@keyframes empurra { 0%, 14%, 34%, 100% { transform: translateX(0); } 22% { transform: translateX(5px); } }
@media (prefers-reduced-motion: reduce) { .btn--brilho::before, .btn--brilho::after { animation: none; } .btn--brilho::before { display: none; } }
.btn.alerta { border-color: var(--tomate); color: var(--tomate); }

/* Progresso */
.passos-nav { margin: 32px 0 44px; }
.progresso { display: flex; align-items: flex-start; list-style: none; counter-reset: p; }
.progresso li {
  --m: 30px;
  position: relative; flex: 1; display: flex; flex-direction: column; align-items: center; gap: 10px;
  text-align: center; font-size: 13px; line-height: 1.25; color: var(--tinta-3); counter-increment: p;
}
.progresso li.atual { --m: 52px; }
/* linha que liga um passo ao anterior, sempre na altura do centro dos círculos menores */
.progresso li + li::before {
  content: ""; position: absolute; top: 25px; right: 50%; left: -50%; height: 2px; z-index: 0;
  border-radius: 2px; background: var(--fio-2); transition: background .4s var(--ease);
}
.progresso li.feito::before, .progresso li.atual::before { background: var(--verde-fundo); }
.passo__marca {
  position: relative; z-index: 1; display: grid; place-items: center; flex: none;
  width: var(--m); height: var(--m); margin-top: calc((52px - var(--m)) / 2); border-radius: 50%;
  border: 1.5px solid var(--fio-2); background: var(--verde-escuro); color: var(--tinta-3);
  font-family: var(--f-display); font-size: 14px; font-variant-numeric: lining-nums;
  transition: width .4s var(--ease), height .4s var(--ease), margin .4s var(--ease), background .35s var(--ease), border-color .35s var(--ease), color .35s var(--ease);
}
.passo__marca::before { content: counter(p); }
.progresso li.feito { color: var(--tinta-2); cursor: pointer; }
.progresso li.feito .passo__marca { background: var(--verde-forte); border-color: var(--verde-fundo); }
.progresso li.feito .passo__marca::before {
  content: ""; width: 13px; height: 13px; background: var(--tinta);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5L20 7'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5L20 7'/%3E%3C/svg%3E") center / contain no-repeat;
}
.progresso li.feito:hover { color: var(--verde); }
.progresso li.feito:hover .passo__marca { border-color: var(--verde); }
.progresso li.atual { color: var(--tinta); font-weight: 600; font-size: 15.5px; }
.progresso li.atual .passo__marca {
  border: 2px solid var(--verde); color: var(--tinta); font-size: 23px;
  background: linear-gradient(140deg, #0d3a22, var(--verde-forte));
  box-shadow: 0 8px 22px rgba(0, 0, 0, .5), inset 0 1px 0 rgba(143, 223, 176, .35);
}
@media (max-width: 760px) {
  .passos-nav { margin: 24px 0 32px; }
  .progresso li { --m: 24px; }
  .progresso li.atual { --m: 42px; flex: 2.4; font-size: 14px; }
  .progresso li + li::before { top: 20px; }
  .passo__marca { margin-top: calc((42px - var(--m)) / 2); font-size: 12px; }
  .progresso li.atual .passo__marca { font-size: 19px; }
  .progresso li:not(.atual) .passo__nome { display: none; }
  .progresso li.atual .passo__nome { white-space: nowrap; }
}

/* Etapas */
.etapa { animation: entra .45s var(--ease); }
@keyframes entra { from { opacity: 0; transform: translateY(10px); } }
@media (prefers-reduced-motion: reduce) { .etapa { animation: none; } }
.eyebrow { font-size: 13px; letter-spacing: .08em; text-transform: uppercase; color: var(--verde); font-weight: 600; margin-bottom: 10px; }
.etapa__topo { margin-bottom: 28px; }
.etapa__sub { margin-top: 10px; color: var(--tinta-3); font-size: 17px; }
.painel { background: rgba(10, 12, 11, .78); border: 1px solid var(--fio); border-radius: 5px; padding: clamp(20px, 3.2vw, 32px); }
.painel + .painel { margin-top: 16px; }
.painel__titulo { font-size: 22px; color: var(--tinta); margin-bottom: 20px; }
.painel__ajuda { margin: -12px 0 20px; color: var(--tinta-3); font-size: 15px; }
.painel > .campos + .pergunta, .painel > .pergunta + .campos, .painel > .erro + .pergunta { margin-top: 24px; }
.lead { margin-top: 12px; color: var(--tinta-3); }

.campos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px 20px; align-items: end; }
@media (max-width: 640px) { .campos { grid-template-columns: 1fr; } }
.campo--largo { grid-column: 1 / -1; }

/* Lista de escolha com busca (estado, cidade) */
.combo { position: relative; }
.campo.combo input { padding-right: 44px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%238fdfb0' stroke-width='2'%3E%3Cpath d='M4 6l4 4 4-4'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 16px center; background-size: 16px; }
.combo__lista {
  position: absolute; z-index: 20; left: 0; right: 0; top: calc(100% + 6px);
  max-height: 300px; overflow-y: auto; list-style: none; padding: 6px;
  background: #0e0f0e; border: 1.5px solid var(--verde-fundo); border-radius: 5px;
  box-shadow: 0 18px 40px rgba(0, 0, 0, .55);
  scrollbar-color: #2c5a40 transparent;
}
.combo__lista li { padding: 10px 14px; border-radius: 3px; color: var(--tinta-2); cursor: pointer; font-size: 16px; }
.combo__lista li:hover, .combo__lista li[aria-selected="true"] { background: rgba(47, 160, 100, .25); color: var(--tinta); }
.combo__lista .combo__vazio { color: var(--tinta-3); cursor: default; font-size: 14.5px; }
.combo__lista .combo__vazio:hover { background: none; }
.campo > span, .campo__topo > span { display: block; font-size: 14.5px; font-weight: 500; color: var(--tinta-2); margin-bottom: 8px; }
.campo b { color: var(--verde); }
.campo span.base { display: inline; margin: 0; }
.campo__topo { display: flex; align-items: flex-end; justify-content: space-between; gap: 10px; flex-wrap: wrap; margin-bottom: 7px; }
.campo__topo > span { margin-bottom: 0 !important; }
.opcoes--mini { flex-wrap: nowrap; }
.opcoes--mini { gap: 0; }
.opcoes--mini button { min-height: 32px; padding: 4px 14px; font-size: 13px; flex: none !important; }
.opcoes--mini button + button { margin-left: -1.5px; }
.opcoes--mini button:first-child { border-radius: 5px 0 0 5px; }
.opcoes--mini button:last-child { border-radius: 0 5px 5px 0; }
.campo input {
  width: 100%; min-height: 52px; padding: 12px 16px; font-size: 18px; color: var(--tinta);
  background: #080908; border: 1.5px solid var(--fio-2); border-radius: 5px; outline: none;
  transition: border-color .2s, box-shadow .2s;
}
.campo input::placeholder { color: rgba(241, 239, 232, .35); }
.campo input:focus { border-color: var(--verde); box-shadow: 0 0 0 4px rgba(143, 223, 176, .15); }
.campo input[aria-invalid="true"] { border-color: var(--tomate); }
.erro, .aviso { margin-top: 16px; font-size: 15px; padding: 10px 14px; border-radius: 5px; }
.erro { color: var(--tomate); background: rgba(232, 130, 109, .1); }
.aviso { color: var(--tinta-2); background: rgba(241, 239, 232, .06); }
.aviso--alerta { color: var(--tomate); background: rgba(232, 130, 109, .1); }

.pergunta { border: 0; min-width: 0; }
.pergunta + .pergunta { margin-top: 22px; padding-top: 22px; border-top: 1px solid var(--fio); }
.painel > .pergunta + .campos { margin-top: 18px; }
.pergunta legend { float: left; width: 100%; font-size: 16.5px; color: var(--tinta); font-weight: 500; margin-bottom: 12px; padding: 0; }
.pergunta legend + * { clear: both; }
.opcoes { display: flex; flex-wrap: wrap; gap: 10px; }
.opcoes button {
  min-height: 48px; padding: 11px 22px; border-radius: 5px; font-size: 15.5px; font-weight: 500;
  border: 1.5px solid var(--fio-2); color: var(--tinta-2); background: #080908;
  transition: border-color .2s, background .2s, color .2s;
}
.opcoes button:hover { border-color: var(--verde-fundo); }
.opcoes button[aria-checked="true"] { border-color: var(--verde); background: rgba(47, 160, 100, .25); color: var(--tinta); font-weight: 600; }
@media (max-width: 480px) { .opcoes button { flex: 1 1 100%; } }

.navegacao {
  position: sticky; bottom: 0; z-index: 5; display: flex; justify-content: space-between; gap: 12px;
  margin: 0 calc(-1 * var(--gutter, 16px)); padding: 16px var(--gutter, 16px) calc(16px + env(safe-area-inset-bottom));
  background: var(--verde-escuro); border-top: 1px solid var(--fio);
  /* faixa de ponta a ponta da tela, cor sólida */
  box-shadow: 0 0 0 100vmax var(--verde-escuro); clip-path: inset(0 -100vmax);
}
main.wrap { padding-bottom: 0; min-height: calc(100vh - 81px); min-height: calc(100svh - 81px); display: flex; flex-direction: column; }
#form { flex: 1; display: flex; flex-direction: column; }
#form > .etapa:not([hidden]) { margin-bottom: 32px; }
.navegacao { margin-top: auto !important; }
.navegacao .btn--solid { margin-left: auto; }

/* Resultado: "a virada" — perda, barra de recuperação, diagnóstico e fechamento */
body.em-resultado main.wrap { --wrap: 1120px; }
.rotulo { font-family: var(--f-texto); font-style: normal; font-size: 15px; font-weight: 600; letter-spacing: .07em; text-transform: uppercase; color: var(--tinta-2); line-height: 1.3; }

.res-topo { display: flex; align-items: center; gap: clamp(18px, 3vw, 36px); padding-bottom: 28px; margin-bottom: clamp(36px, 6vh, 56px); border-bottom: 1px solid var(--fio); }
.res-topo__logo { display: none; width: auto; height: clamp(40px, 4.4vw, 58px); flex: none; }
.res-topo__texto { min-width: 0; }
.res-topo h1 { font-size: clamp(32px, 4.6vw, 58px); }
.res-topo__meta { margin-top: 8px; color: var(--tinta-3); font-size: 15.5px; }
@media (max-width: 640px) {
  .res-topo { flex-direction: column; align-items: flex-start; }
  .res-topo__texto { padding-left: 0; border-left: 0; }
}

.virada { position: relative; }
.virada__numero { margin-top: 10px; font-size: clamp(64px, 11vw, 148px); line-height: .95; letter-spacing: -.03em; color: var(--tomate); }
.virada__unidade { display: flex; align-items: center; flex-wrap: wrap; gap: 14px; margin-top: 12px; font-size: 18px; color: var(--tinta-2); }
.virada__detalhe { margin-top: 16px; color: var(--tinta-2); font-size: 17px; }
.virada__apoio { margin-top: 8px; color: var(--tinta-3); font-size: 15.5px; }
.selo { font-size: 12px; padding: 4px 12px; border-radius: 5px; border: 1px solid rgba(232, 130, 109, .6); color: var(--tomate); letter-spacing: .02em; font-weight: 600; }

/* barra: 100% = perda total; verde cheio = conservador; verde claro = faixa provável */
.barra { margin: clamp(36px, 6vh, 52px) 0 clamp(28px, 4vh, 40px); }
.barra__trilho {
  position: relative; height: 22px; border-radius: 5px; overflow: hidden;
  background: repeating-linear-gradient(135deg, rgba(232, 130, 109, .32) 0 8px, rgba(232, 130, 109, .2) 8px 16px);
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, .4);
}
.barra__conservador, .barra__provavel { position: absolute; top: 0; bottom: 0; left: 0; transition: width 1.4s var(--ease) .15s, left 1.4s var(--ease) .15s; }
.barra__conservador { width: 0; border-radius: 0; background: linear-gradient(90deg, #1a7344, var(--verde-fundo)); z-index: 2; }
.barra__provavel { width: 0; background: linear-gradient(90deg, rgba(143, 223, 176, .9), rgba(143, 223, 176, .55)); z-index: 1; }
.barra.cheia .barra__conservador { width: var(--p); }
.barra.cheia .barra__provavel { width: var(--ate); }
.barra__escala { position: relative; height: 22px; margin-top: 10px; font-size: 13px; color: var(--tinta-3); }
.barra__escala span { position: absolute; left: var(--x); transform: translateX(-50%); white-space: nowrap; }
.barra__escala span:first-child { transform: none; }
.barra__escala span:last-child { transform: translateX(-100%); }

.rotulo--ganho { color: var(--verde); }
.cenarios { display: grid; grid-template-columns: 1fr 1.25fr; gap: clamp(20px, 4vw, 56px); margin-top: 18px; }
@media (max-width: 760px) { .cenarios { grid-template-columns: 1fr; } }
.cenario__nome { display: flex; align-items: center; gap: 10px; font-size: 15px; color: var(--tinta-2); }
.ponto { width: 12px; height: 12px; border-radius: 50%; flex: none; }
.ponto--cheio { background: var(--verde-fundo); }
.ponto--claro { background: rgba(143, 223, 176, .8); }
.cenario__numero { margin-top: 10px; font-size: clamp(40px, 5.6vw, 72px); line-height: 1; letter-spacing: -.02em; color: var(--verde); }
.cenario__numero small { font-family: var(--f-texto); font-size: 16px; letter-spacing: 0; color: var(--tinta-3); }
.cenario__mes { margin-top: 10px; color: var(--tinta-2); font-size: 16px; }
.virada__como { margin-top: 28px; padding-top: 20px; border-top: 1px solid var(--fio); color: var(--tinta-2); font-size: 16.5px; }

.diagnostico { margin-top: clamp(56px, 9vh, 88px); }
.diagnostico h2, .fechamento h2 { font-size: clamp(28px, 3.4vw, 40px); margin-bottom: 22px; }
.diagnostico__cab, .diagnostico__lista li { display: grid; grid-template-columns: 1.1fr 1fr; gap: clamp(20px, 4vw, 56px); }
.diagnostico__cab { padding-bottom: 12px; border-bottom: 1px solid var(--fio-2); font-size: 13px; font-weight: 600; letter-spacing: .07em; text-transform: uppercase; }
.diagnostico__cab span:first-child { color: var(--tomate); }
.diagnostico__cab span:last-child { color: var(--verde); }
.diagnostico__lista { list-style: none; }
.diagnostico__lista li { padding: 22px 0; border-bottom: 1px solid var(--fio); }
.diag__hoje h3 { font-size: 22px; }
.diag__hoje p { margin-top: 6px; color: var(--tinta-3); font-size: 15.5px; }
.diag__veta { align-self: center; color: var(--tinta); font-size: 16.5px; padding-left: 28px; position: relative; }
.diag__veta::before {
  content: ""; position: absolute; left: 0; top: .2em; width: 18px; height: 18px; background: var(--verde);
  -webkit-mask: var(--seta-btn) center / contain no-repeat; mask: var(--seta-btn) center / contain no-repeat;
}
@media (max-width: 760px) {
  .diagnostico__cab { display: none; }
  .diagnostico__lista li { grid-template-columns: 1fr; gap: 12px; }
}

.fechamento { margin-top: clamp(56px, 9vh, 88px); }
.linha-tempo { list-style: none; display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; counter-reset: lt; }
.linha-tempo li { position: relative; counter-increment: lt; padding-top: 58px; font-size: 17px; color: var(--tinta); }
.linha-tempo li::after { content: ""; position: absolute; top: 21px; left: 44px; right: -16px; height: 2px; background: linear-gradient(90deg, var(--verde-fundo), rgba(47, 160, 100, .25)); }
.linha-tempo li:last-child::after { display: none; }
.linha-tempo__marco { position: absolute; top: 0; left: 0; width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; border: 2px solid var(--verde-fundo); background: var(--verde-escuro); font-family: var(--f-display); font-size: 19px; color: var(--verde); }
.linha-tempo__marco::before { content: counter(lt); }
.linha-tempo li:first-child .linha-tempo__marco { background: linear-gradient(140deg, #0d3a22, var(--verde-forte)); border-color: var(--verde); color: var(--tinta); }
@media (max-width: 640px) {
  .linha-tempo { grid-template-columns: 1fr; gap: 22px; }
  .linha-tempo li { padding: 10px 0 0 62px; min-height: 44px; }
  .linha-tempo li::after { display: none; }
}
.consultor { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 16px 24px; margin-top: 40px; padding: 22px 26px; border-radius: 5px; border: 1px solid var(--fio-2); background: rgba(10, 12, 11, .78); }
.consultor p { display: flex; flex-direction: column; gap: 4px; font-size: 20px; }
.consultor__rotulo { font-size: 13px; font-weight: 600; letter-spacing: .07em; text-transform: uppercase; color: var(--tinta-3); }
.consultor__whats { text-decoration: none; }
.legal { margin-top: 36px; font-size: 12.5px; color: var(--tinta-3); }

/* ---------- PDF (impressão): versão clara ---------- */
@page { size: A4; margin: 12mm 14mm; }
@media print {
  :root { --tinta: #0b0d0c; --tinta-2: #2b302d; --tinta-3: #555b57; --fio: #d9ddd9; --fio-2: #c3c9c4; --verde: #1a7344; --tomate: #c4472e; }
  html, body { background: #fff !important; color-scheme: light; }
  body { font-size: 11.5pt; color: var(--tinta-2); }
  * { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .topo, .capa, .passos-nav, .navegacao, .etapa:not(.etapa--resultado) { display: none !important; }
  .etapa--resultado { animation: none; }
  body.em-resultado .etapa--resultado { display: block !important; }
  body:not(.em-resultado) main { display: none !important; }
  body:not(.em-resultado)::after { content: "Conclua o diagnóstico para gerar o PDF."; display: block; padding: 40px; font-size: 14pt; }
  .wrap { max-width: none; padding: 0; }
  .res-topo { gap: 18px; background: #05160d; padding: 14px 20px; border: 0; border-radius: 5px; margin-bottom: 18px; }
  .res-topo__logo { display: block; height: 42px; }
  .res-topo__texto { border-left: 1px solid rgba(241, 239, 232, .3); padding-left: 18px; }
  .res-topo h1 { color: #f1efe8; font-size: 22pt; }
  .res-topo__meta { color: #c6c4bc; font-size: 9.5pt; }
  .rotulo { font-size: 9.5pt; }
  .virada { padding: 16px 20px; border: 1.5px solid #e8826d; border-radius: 5px; background: #fdf6f3 !important; break-inside: avoid; }
  .virada__numero { font-size: 46pt; }
  .virada__unidade { font-size: 11pt; margin-top: 6px; }
  .virada__detalhe, .virada__apoio { font-size: 10pt; margin-top: 8px; }
  .barra { margin: 16px 0 12px; }
  .barra__trilho { height: 14px; background: repeating-linear-gradient(135deg, #f3c5b9 0 6px, #f8dcd4 6px 12px); box-shadow: none; }
  .barra__conservador { width: var(--p) !important; transition: none; }
  .barra__provavel { width: var(--ate) !important; transition: none; background: #9fd9b5; }
  .barra__escala { font-size: 8.5pt; height: 16px; margin-top: 4px; }
  .cenarios { grid-template-columns: 1fr 1.25fr; gap: 20px; margin-top: 8px; }
  .cenario__nome { font-size: 9.5pt; }
  .cenario__numero { font-size: 26pt; margin-top: 4px; }
  .cenario__numero small { font-size: 9pt; }
  .cenario__mes { font-size: 9.5pt; margin-top: 4px; }
  .virada__como { font-size: 9.5pt; margin-top: 12px; padding-top: 10px; }
  .diagnostico, .fechamento { margin-top: 20px; }
  .diagnostico h2, .fechamento h2 { font-size: 15pt; margin-bottom: 8px; }
  .diagnostico__cab { display: grid !important; font-size: 8pt; padding-bottom: 6px; }
  .diagnostico__cab, .diagnostico__lista li { grid-template-columns: 1.1fr 1fr !important; gap: 22px !important; }
  .linha-tempo { grid-template-columns: repeat(3, 1fr) !important; }
  .linha-tempo li { padding-left: 0 !important; min-height: 0; }
  .linha-tempo li::after { display: block !important; }
  .linha-tempo li:last-child::after { display: none !important; }
  .cenarios { grid-template-columns: 1fr 1.25fr !important; }
  .diagnostico__lista li { padding: 9px 0; break-inside: avoid; }
  .diag__hoje h3 { font-size: 12pt; }
  .diag__hoje p, .diag__veta { font-size: 9.5pt; }
  .linha-tempo li { font-size: 10pt; padding-top: 40px; }
  .linha-tempo__marco { width: 30px; height: 30px; font-size: 12pt; background: #fff; }
  .linha-tempo li:first-child .linha-tempo__marco { background: #1a7344; color: #fff; }
  .linha-tempo li::after { top: 14px; left: 32px; }
  .fechamento { break-inside: avoid; }
  .consultor { margin-top: 14px; padding: 10px 16px; background: #fff; }
  .consultor p { font-size: 12pt; }
  .consultor__whats { border: 0; padding: 0; min-height: 0; color: var(--verde); }
  .consultor__whats::after { display: none; }
  .legal { margin-top: 12px; font-size: 8pt; }
}

/* ---------- Login, menu e telas internas ---------- */
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.topo__menu { margin-left: auto; display: flex; align-items: center; gap: 4px; flex-wrap: wrap; justify-content: flex-end; }
.topo__menu a, .menu__sair { padding: 8px 12px; border-radius: 5px; font-size: 14.5px; color: var(--tinta-2); text-decoration: none; transition: color .2s, background .2s; }
.topo__menu a:hover, .menu__sair:hover { color: var(--tinta); background: rgba(241, 239, 232, .06); }
.topo__menu a[aria-current="page"] { color: var(--verde); }
.menu__conta { display: flex; align-items: center; gap: 2px; margin-left: 10px; padding-left: 10px; border-left: 1px solid var(--fio-2); }
.capa__site.topo__menu { margin-left: 0; }
@media (max-width: 760px) {
  .topo__in { height: auto; min-height: 68px; flex-wrap: wrap; padding-block: 10px; }
  .topo__menu { width: 100%; justify-content: flex-start; margin-left: -12px; }
  .capa__site.topo__menu { display: flex; position: static; width: auto; margin: 0 0 24px -12px; }
}

.salvo { flex: 1; align-self: center; text-align: center; font-size: 14px; color: var(--tinta-3); }
.salvo--ok { color: var(--verde); }
.salvo--erro { color: var(--tomate); }
body.modo-ver .passos-nav { display: none; }

body.tela-login { display: grid; place-items: center; padding: 24px 16px; }
.login { width: 100%; max-width: 440px; }
.login__marca { display: flex; align-items: center; gap: 18px; margin-bottom: 28px; }
.login__marca img { height: 56px; width: auto; }
.login__marca span { font-family: var(--f-display); font-style: italic; font-size: 20px; color: var(--tinta-3); padding-left: 18px; border-left: 1px solid var(--fio-2); line-height: 1.2; }
.login__form h1 { font-size: 34px; margin-bottom: 6px; }
.login__form .painel__ajuda { margin: 0 0 22px; }
.login__form .btn { margin-top: 22px; }
.campos--uma { grid-template-columns: 1fr !important; }
.btn--block { width: 100%; }
.btn:disabled { opacity: .6; cursor: progress; }

.pagina { padding-block: 36px 64px; }
.pagina__topo { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; flex-wrap: wrap; }
.busca { width: min(100%, 380px); }
.painel--estreito { max-width: 520px; }
.painel__ajuda--depois { margin: 16px 0 0; }
.acoes { display: flex; justify-content: flex-end; margin-top: 20px; }
.painel + .painel, form.painel + .painel { margin-top: 16px; }
.tabela-wrap { overflow-x: auto; border: 1px solid var(--fio); border-radius: 5px; background: rgba(10, 12, 11, .78); }
.painel .tabela-wrap { border: 0; background: none; }
.tabela { width: 100%; border-collapse: collapse; font-size: 15px; }
.tabela th { text-align: left; font-size: 12.5px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--tinta-3); padding: 14px 16px; border-bottom: 1px solid var(--fio-2); white-space: nowrap; }
.tabela td { padding: 14px 16px; border-bottom: 1px solid var(--fio); vertical-align: middle; color: var(--tinta-2); }
.tabela tr:last-child td { border-bottom: 0; }
.tabela tbody tr:hover td { background: rgba(241, 239, 232, .03); }
.tabela__principal { color: var(--tinta); font-weight: 600; text-decoration: none; }
a.tabela__principal:hover { color: var(--verde); }
.tabela__acoes { text-align: right; white-space: nowrap; }
.tabela__acoes .btn + .btn { margin-left: 6px; }
.num-col { text-align: right; white-space: nowrap; }
.tabela tr.inativo td { opacity: .55; }
.btn--perigo { border-color: rgba(232, 130, 109, .6); color: var(--tomate); }
.btn--perigo:hover { background: rgba(232, 130, 109, .12) !important; }
.vazio { margin-top: 24px; color: var(--tinta-3); }
@media print { .topo__menu, .salvo { display: none !important; } }
.topo .wrap { --wrap: 1180px; }
.topo__nome, .topo__menu a, .menu__sair { white-space: nowrap; }
@media (min-width: 761px) { .topo__menu { flex-wrap: nowrap; } }
@media (max-width: 1000px) and (min-width: 761px) { .topo__nome { display: none; } }
