/* nvestor advisory · site institucional · design system da marca-mãe nvestor
   Base clara (branco + grafite), laranja de destaque, degradê laranja → vermelho em capa, faixas, divisores e CTAs.
   Cores extraídas do vetor oficial (07_Logo_Cor.pdf): os RGB impressos no manual de 2018 estão errados. */

@font-face { font-family: "Kanit"; font-weight: 500; font-style: normal; font-display: swap; src: url("fonts/kanit-500.woff2") format("woff2"); }
@font-face { font-family: "Kanit"; font-weight: 600; font-style: normal; font-display: swap; src: url("fonts/kanit-600.woff2") format("woff2"); }
@font-face { font-family: "DM Sans"; font-weight: 400; font-style: normal; font-display: swap; src: url("fonts/dm-sans-400.woff2") format("woff2"); }
@font-face { font-family: "DM Sans"; font-weight: 500; font-style: normal; font-display: swap; src: url("fonts/dm-sans-500.woff2") format("woff2"); }
@font-face { font-family: "DM Sans"; font-weight: 700; font-style: normal; font-display: swap; src: url("fonts/dm-sans-700.woff2") format("woff2"); }

:root {
  /* marca */
  --laranja: #D87738;            /* início do degradê (vetor oficial) */
  --vermelho: #C2232D;           /* fim do degradê (vetor oficial) */
  --degrade: linear-gradient(155deg, var(--laranja) 0%, var(--vermelho) 100%);   /* -65° do manual, laranja à esquerda */
  --degrade-faixa: linear-gradient(170deg, var(--laranja) 0%, var(--vermelho) 100%); /* -80° do manual (banners) */
  --degrade-linha: linear-gradient(90deg, var(--laranja), var(--vermelho));

  /* neutros */
  --tinta: #231F20;              /* preto do manual (R35 G31 B32) */
  --tinta-2: #5B5557;            /* texto secundário · 7,3:1 sobre branco */
  --linha: #E8E3DF;
  --fundo: #FFFFFF;
  --fundo-2: #FBF7F4;            /* branco quente para alternar seções */
  --branco: #FFFFFF;

  /* papéis */
  --destaque-texto: var(--vermelho);   /* texto pequeno de destaque: 5,9:1 sobre branco. O laranja (3,2:1) só em texto grande e grafismo */
  --foco: #231F20;

  /* tipografia */
  --fonte-titulo: "Kanit", "DM Sans", system-ui, sans-serif;   /* família do wordmark (Kanit Medium) */
  --fonte-texto: "DM Sans", system-ui, -apple-system, "Segoe UI", sans-serif; /* corpo do institucional v4 */
  --t-capa: clamp(2.6rem, 7.4vw, 5.5rem);
  --t-h2: clamp(1.9rem, 4.2vw, 3rem);
  --t-h3: 1.375rem;
  --t-lead: clamp(1.5rem, 2.4vw, 1.875rem);   /* >= 24px: texto grande para AA sobre o degradê */
  --t-corpo: 1.0625rem;
  --t-pequeno: 0.9375rem;
  --t-rotulo: 0.8125rem;

  /* espaço e forma */
  --e-1: 0.25rem; --e-2: 0.5rem; --e-3: 0.75rem; --e-4: 1rem; --e-5: 1.5rem; --e-6: 2rem; --e-7: 3rem; --e-8: 4.5rem; --e-9: 7rem;
  --secao: clamp(4rem, 9vw, 7.5rem);
  --margem: clamp(1rem, 5vw, 3rem);
  --largura: 72rem;
  --raio: 14px;
  --raio-p: 8px;
  --pilula: 999px;
  --sombra: 0 1px 2px rgba(35, 31, 32, .05), 0 12px 32px -16px rgba(35, 31, 32, .18);
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 5.5rem; -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--fundo); color: var(--tinta); font: 400 var(--t-corpo)/1.6 var(--fonte-texto); -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
img, svg { display: block; max-width: 100%; }
h1, h2, h3, p, ul, ol, dl, dd, figure { margin: 0; }
ul, ol { padding: 0; list-style: none; }
a { color: inherit; }
:focus-visible { outline: 3px solid var(--foco); outline-offset: 3px; border-radius: 4px; }
.sobre-degrade :focus-visible { outline-color: var(--branco); }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } * { transition: none !important; } }

.so-leitor { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.pular { position: absolute; left: var(--e-4); top: -4rem; z-index: 100; background: var(--tinta); color: var(--branco); padding: var(--e-3) var(--e-4); border-radius: var(--raio-p); }
.pular:focus { top: var(--e-4); }

.caixa { width: 100%; max-width: calc(var(--largura) + 2 * var(--margem)); margin-inline: auto; padding-inline: var(--margem); }

/* ---------- Cabeçalho ---------- */
.topo { position: sticky; top: 0; z-index: 50; background: rgba(255, 255, 255, .94); backdrop-filter: saturate(1.4) blur(10px); border-bottom: 1px solid var(--linha); }
.topo .caixa { display: flex; align-items: center; justify-content: space-between; gap: var(--e-5); min-height: 4.5rem; }
/* área de proteção do manual = altura do "o" (~metade da altura da assinatura) livre em volta */
.marca { display: inline-flex; padding-block: 0.75rem; flex: none; }
.marca img { height: 2rem; width: auto; }
.nav { display: none; }
.nav ul { display: flex; gap: var(--e-6); }
.nav a { font-size: var(--t-pequeno); font-weight: 500; text-decoration: none; color: var(--tinta); padding-block: var(--e-3); border-bottom: 2px solid transparent; }
.nav a:hover { border-bottom-color: var(--laranja); }
@media (min-width: 62rem) { .nav { display: block; } }
@media (max-width: 26rem) { .marca img { height: 1.5rem; } }

/* ---------- Botões ---------- */
.botao { display: inline-flex; align-items: center; justify-content: center; gap: var(--e-2); min-height: 3rem; padding: 0.6rem 1.5rem; border: 2px solid transparent; border-radius: var(--pilula); font: 700 1.1875rem/1.2 var(--fonte-texto); /* 19px negrito = texto grande (AA 3:1 sobre o degradê) */ text-decoration: none; cursor: pointer; transition: transform .15s ease, box-shadow .15s ease, background-color .15s ease; }
.botao--degrade { background: var(--degrade); color: var(--branco); box-shadow: 0 8px 20px -10px rgba(194, 35, 45, .7); }
.botao--degrade:hover { transform: translateY(-1px); box-shadow: 0 12px 24px -10px rgba(194, 35, 45, .8); }
.botao--branco { background: var(--branco); color: var(--tinta); }
.botao--branco:hover { transform: translateY(-1px); box-shadow: 0 12px 24px -12px rgba(35, 31, 32, .6); }
.botao--contorno { border-color: var(--branco); color: var(--branco); background: transparent; }
.botao--contorno:hover { background: rgba(255, 255, 255, .14); }
.botao--compacto { min-height: 2.75rem; padding-inline: 1.15rem; }

/* ---------- Capa ---------- */
.capa { position: relative; overflow: hidden; background: var(--degrade); color: var(--branco); }
.capa .caixa { position: relative; padding-block: clamp(4rem, 11vw, 8.5rem) clamp(4rem, 10vw, 7.5rem); }
/* foto sob o degradê: tons de cinza multiplicados sobre o degradê (só escurece: o contraste do texto branco nunca cai) */
.capa__foto { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 62% 50%; filter: grayscale(1) contrast(1.15) brightness(1.1); mix-blend-mode: multiply; opacity: .34; pointer-events: none; }
@media (min-width: 62rem) {
  .capa__foto { left: auto; right: 0; width: 60%; opacity: .78; object-position: 50% 50%; -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 38%); mask-image: linear-gradient(90deg, transparent 0, #000 38%); }
}
.capa__rotulo { font: 500 1.5rem/1.2 var(--fonte-titulo); letter-spacing: .01em; margin-bottom: var(--e-5); }
.capa__id { font: 500 1.5rem/1.3 var(--fonte-titulo); margin-top: var(--e-7); max-width: 34ch; opacity: .95; }
.capa h1 { font: 500 clamp(2.4rem, 6vw, 4.5rem)/1.04 var(--fonte-titulo); letter-spacing: -0.015em; max-width: 15ch; text-wrap: balance; }
.capa__sub { font: 500 var(--t-lead)/1.3 var(--fonte-titulo); max-width: 26ch; margin-top: var(--e-5); text-wrap: balance; }
.capa__acoes { display: flex; flex-wrap: wrap; gap: var(--e-4); margin-top: var(--e-7); }

/* ---------- Números (logo abaixo da capa) ---------- */
.numeros { border-bottom: 1px solid var(--linha); }
.numeros ul { display: grid; grid-template-columns: 1fr; }
.numeros li { display: flex; align-items: baseline; gap: var(--e-4); padding-block: var(--e-5); border-top: 1px solid var(--linha); }
.numeros li:first-child { border-top: 0; }
.numeros strong { font: 500 clamp(2.5rem, 5vw, 3.5rem)/1 var(--fonte-titulo); min-width: 2.2ch; }
.numeros span { color: var(--tinta-2); font-size: var(--t-pequeno); max-width: 24ch; }
@media (min-width: 48rem) {
  .numeros ul { grid-template-columns: repeat(3, 1fr); }
  .numeros li { border-top: 0; border-left: 1px solid var(--linha); padding: var(--e-6) var(--e-6); }
  .numeros li:first-child { border-left: 0; padding-left: 0; }
}
.tinta-degrade { background: var(--degrade); -webkit-background-clip: text; background-clip: text; color: transparent; }
@media (forced-colors: active) { .tinta-degrade { color: CanvasText; background: none; } }

/* ---------- Seções ---------- */
.secao { padding-block: var(--secao); }
.secao--tom { background: var(--fundo-2); }
.secao__cab { max-width: 46rem; margin-bottom: var(--e-7); }
.rotulo { display: inline-flex; align-items: center; gap: var(--e-3); font: 700 var(--t-rotulo)/1.2 var(--fonte-texto); letter-spacing: .12em; text-transform: uppercase; color: var(--destaque-texto); margin-bottom: var(--e-4); }
.rotulo::before { content: ""; width: .625rem; height: .625rem; border-radius: 50%; background: var(--laranja); flex: none; }
h2 { font: 500 var(--t-h2)/1.1 var(--fonte-titulo); letter-spacing: -0.012em; text-wrap: balance; }
h3 { font: 500 var(--t-h3)/1.25 var(--fonte-titulo); }
.lead { font-size: 1.1875rem; color: var(--tinta-2); margin-top: var(--e-5); max-width: 40rem; }
.divisor { height: 4px; border: 0; margin: 0; background: var(--degrade-linha); }
.divisor--curto { width: 4.5rem; border-radius: var(--pilula); margin-top: var(--e-5); }
.ressalva { margin-top: var(--e-7); font-size: var(--t-pequeno); color: var(--tinta-2); max-width: 54rem; }
.nota { margin-top: var(--e-7); padding-left: var(--e-5); border-left: 4px solid var(--laranja); font-size: 1.1875rem; max-width: 44rem; }

/* ---------- Ícones (set próprio da casa, marca/icones · traço 1,75 · degradê da marca) ---------- */
.defs { position: absolute; width: 0; height: 0; overflow: hidden; }
.ic { width: 1.5rem; height: 1.5rem; flex: none; }
.ic--m { width: 2.25rem; height: 2.25rem; }
.ic--g { width: 3rem; height: 3rem; }
.ic--gg { width: 4rem; height: 4rem; }
.ic--branco { stroke: var(--branco); }
.ic--tinta { stroke: var(--tinta-2); }
@media (forced-colors: active) { .ic { stroke: CanvasText; } }
/* medalhão: ícone grande dentro de um anel em degradê */
.medalhao { display: grid; place-items: center; width: 6.5rem; height: 6.5rem; border-radius: 50%; background: linear-gradient(var(--fundo), var(--fundo)) padding-box, var(--degrade) border-box; border: 3px solid transparent; flex: none; }
.secao--tom .medalhao { background: linear-gradient(var(--fundo-2), var(--fundo-2)) padding-box, var(--degrade) border-box; }
.medalhao.medalhao--cheio { background: var(--degrade); border: 0; }

/* listas com o pingo */
.pingos li { position: relative; padding-left: 1.4rem; }
.pingos li + li { margin-top: var(--e-3); }
.pingos li::before { content: ""; position: absolute; left: 0; top: .58em; width: .5rem; height: .5rem; border-radius: 50%; background: var(--degrade); }

/* ---------- Problema ---------- */
.problema__frase { font: 500 clamp(2rem, 5.4vw, 4rem)/1.05 var(--fonte-titulo); letter-spacing: -0.015em; text-wrap: balance; max-width: 18ch; }
.dores { display: grid; gap: var(--e-6); margin-top: var(--e-8); }
.dores li { display: grid; grid-template-columns: auto 1fr; gap: var(--e-1) var(--e-5); align-items: start; }
.dores .ic { grid-row: span 2; }
.dores p { color: var(--tinta-2); font-size: var(--t-pequeno); grid-column: 2; }
@media (min-width: 40rem) { .dores { grid-template-columns: repeat(2, 1fr); gap: var(--e-7) var(--e-6); } }
@media (min-width: 62rem) {
  .dores { grid-template-columns: repeat(4, 1fr); }
  .dores li { display: block; padding-top: var(--e-5); border-top: 4px solid transparent; border-image: var(--degrade-linha) 1; }
  .dores h3 { margin-block: var(--e-4) var(--e-2); }
}

/* ---------- Quem atendemos ---------- */
.com-foto { display: grid; gap: var(--e-6); margin-bottom: var(--e-7); }
.com-foto .secao__cab { margin-bottom: 0; }
.foto { position: relative; }
.foto img { width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; object-position: 50% 35%; border-radius: var(--raio); }
.foto::after { content: ""; position: absolute; width: 4.5rem; aspect-ratio: 1; border-radius: 50%; background: var(--degrade); left: -1.25rem; top: -1.25rem; }
@media (min-width: 62rem) { .com-foto { grid-template-columns: 1fr 30rem; gap: var(--e-9); align-items: center; } .foto img { aspect-ratio: 16 / 9; } }
@media (max-width: 30rem) { .foto::after { width: 3.25rem; left: -.5rem; top: -1rem; } }
.perfis { display: grid; gap: var(--e-7); }
.perfil { display: grid; grid-template-columns: auto 1fr; gap: var(--e-5); align-items: start; }
.perfil h3 { font-size: 1.625rem; margin-bottom: var(--e-4); }
.perfil .pingos { color: var(--tinta-2); }
@media (min-width: 62rem) { .perfis { grid-template-columns: repeat(3, 1fr); gap: var(--e-8); } .perfil { display: block; } .perfil h3 { margin-top: var(--e-5); } }
@media (max-width: 30rem) { .perfil .medalhao { width: 4.5rem; height: 4.5rem; } .perfil .ic--g { width: 2.25rem; height: 2.25rem; } }

/* ---------- O que fazemos ---------- */
.caminhos { display: flex; flex-wrap: wrap; align-items: center; gap: var(--e-3) var(--e-4); margin-bottom: var(--e-8); padding-bottom: var(--e-7); border-bottom: 1px solid var(--linha); }
.caminhos__titulo { display: flex; align-items: center; gap: var(--e-3); font: 500 1.1875rem/1.3 var(--fonte-titulo); flex-basis: 100%; }
.caminhos li { font: 500 1.125rem/1 var(--fonte-titulo); padding: .8rem 1.25rem; border-radius: var(--pilula); border: 2px solid var(--tinta); }
.caminhos .ou { border: 0; padding: 0; color: var(--tinta-2); font: 400 var(--t-pequeno)/1 var(--fonte-texto); }
.servicos { display: grid; gap: var(--e-7); }
.servico { display: grid; grid-template-columns: auto 1fr; gap: var(--e-2) var(--e-5); align-items: start; }
.servico .medalhao { grid-row: span 2; }
.servico h3 { font-size: 1.5rem; align-self: end; }
.servico p { color: var(--tinta-2); grid-column: 2; }
@media (min-width: 40rem) { .servicos { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 62rem) {
  .servicos { grid-template-columns: repeat(4, 1fr); gap: var(--e-6); }
  .servico { display: block; text-align: center; }
  .servico .medalhao { width: 9rem; height: 9rem; margin: 0 auto var(--e-5); }
  .servico .ic { width: 4.25rem; height: 4.25rem; }
  .servico h3 { margin-bottom: var(--e-3); }
}
@media (max-width: 30rem) { .servico .medalhao { width: 4.5rem; height: 4.5rem; } .servico .ic { width: 2.25rem; height: 2.25rem; } }

/* ---------- Método: linha do tempo ---------- */
.trilha { display: grid; gap: var(--e-6); }
.fase__cab { display: flex; align-items: center; gap: var(--e-4); margin-bottom: var(--e-6); }
.fase__n { display: grid; place-items: center; width: 3.5rem; height: 3.5rem; border-radius: 50%; background: var(--degrade); color: var(--branco); font: 600 1.625rem/1 var(--fonte-titulo); flex: none; }
.fase__cab h3 { font-size: 1.625rem; }
.fase__prazo { display: block; color: var(--tinta-2); font-size: var(--t-pequeno); }
.passos { display: grid; }
.passos li { position: relative; display: grid; grid-template-columns: 3.5rem 1fr; gap: var(--e-4); align-items: center; padding-block: var(--e-3); font-weight: 500; line-height: 1.35; }
.passos li small { display: block; font-weight: 400; font-size: var(--t-rotulo); color: var(--tinta-2); margin-top: var(--e-1); }
.passos li::before { content: ""; position: absolute; left: calc(1.75rem - 2px); top: 0; bottom: 0; width: 4px; background: var(--degrade-linha); background: linear-gradient(180deg, var(--laranja), var(--vermelho)); }
.passos li:first-child::before { top: 50%; } .passos li:last-child::before { bottom: 50%; }
.ponto { position: relative; display: grid; place-items: center; width: 3.5rem; height: 3.5rem; border-radius: 50%; background: var(--fundo); border: 2px solid var(--laranja); }
.secao--tom .ponto { background: var(--fundo-2); }
.portao { display: flex; align-items: center; gap: var(--e-4); font: 500 1.125rem/1.3 var(--fonte-titulo); }
.portao__losango { width: 2.5rem; height: 2.5rem; margin-inline: .5rem; transform: rotate(45deg); background: var(--degrade); border-radius: 6px; flex: none; }
.portao small { display: block; font: 400 var(--t-rotulo)/1.4 var(--fonte-texto); color: var(--tinta-2); }
@media (min-width: 68rem) {
  .trilha { grid-template-columns: 5fr auto 4fr; gap: 0; align-items: start; }
  .fase__cab { margin-bottom: var(--e-7); height: 3.5rem; }
  .passos { grid-auto-flow: column; grid-auto-columns: 1fr; }
  .passos li { display: block; text-align: center; padding: 0 var(--e-2); font-size: var(--t-pequeno); }
  .passos li::before, .passos li:first-child::before, .passos li:last-child::before { left: 0; right: 0; top: calc(1.75rem - 2px); bottom: auto; width: auto; height: 4px; background: var(--degrade-linha); }
  .passos li:first-child::before { left: 50%; }
  .fase--2 .passos li:first-child::before { left: 0; } .fase--2 .passos li:last-child::before { right: 50%; }
  .fase--1 .passos li:last-child::before { right: 0; }
  .passos .ponto { margin: 0 auto var(--e-4); }
  .portao { flex-direction: column; text-align: center; gap: var(--e-4); width: 9rem; margin-top: calc(3.5rem + var(--e-7)); position: relative; }
  .portao::before { content: ""; position: absolute; left: 0; right: 0; top: calc(1.75rem - 2px); height: 4px; background: var(--vermelho); }
  .portao__losango { position: relative; margin: .5rem 0; }
}

/* ---------- Diferenciais: 93 em 14 setores ---------- */
.base { display: grid; gap: var(--e-7); }
.base__num { font: 500 clamp(7rem, 22vw, 13rem)/.8 var(--fonte-titulo); letter-spacing: -0.04em; }
.base__titulo { font: 500 clamp(1.5rem, 2.6vw, 2rem)/1.15 var(--fonte-titulo); margin-top: var(--e-5); max-width: 16ch; }
.barra { display: flex; height: 1.25rem; border-radius: var(--pilula); overflow: hidden; margin-top: var(--e-6); gap: 3px; }
.barra span:first-child { flex: 57; background: var(--degrade-linha); }
.barra span:last-child { flex: 34; background: repeating-linear-gradient(135deg, var(--vermelho) 0 3px, transparent 3px 7px); border: 2px solid var(--vermelho); border-radius: 0 var(--pilula) var(--pilula) 0; }
.barra__leg { display: grid; grid-template-columns: 57fr 34fr; gap: var(--e-4); margin-top: var(--e-3); font-size: var(--t-pequeno); color: var(--tinta-2); }
.barra__leg strong { display: block; font: 500 1.75rem/1 var(--fonte-titulo); color: var(--tinta); margin-bottom: var(--e-1); }
.base__data { margin-top: var(--e-4); font-size: var(--t-rotulo); color: var(--tinta-2); }
.setores { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--e-5) var(--e-4); align-content: start; }
.setores li { display: flex; align-items: center; gap: var(--e-3); font-size: var(--t-pequeno); font-weight: 500; line-height: 1.25; }
@media (min-width: 40rem) { .setores { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 62rem) { .base { grid-template-columns: minmax(0, 24rem) 1fr; gap: var(--e-9); align-items: center; } .setores { gap: var(--e-6) var(--e-5); } }
.trio { display: grid; gap: var(--e-7); margin-top: var(--e-8); padding-top: var(--e-8); border-top: 1px solid var(--linha); }
.trio h3 { margin-block: var(--e-4) var(--e-3); }
.trio p { color: var(--tinta-2); font-size: var(--t-pequeno); }
.trio p + p { margin-top: var(--e-3); }
@media (min-width: 62rem) { .trio { grid-template-columns: repeat(3, 1fr); gap: var(--e-8); } }

/* ---------- Experiência: os dois lados da mesa ---------- */
.mesa { display: grid; gap: var(--e-7); }
.mesa__meio { height: 4px; background: var(--degrade-linha); border-radius: var(--pilula); position: relative; }
.lado__cab { display: flex; align-items: center; gap: var(--e-4); margin-bottom: var(--e-6); }
.lado__cab .medalhao { width: 4.5rem; height: 4.5rem; }
.lado__cab h3 { font-size: 1.625rem; }
.lado__cab div span { display: block; color: var(--tinta-2); font-size: var(--t-pequeno); }
.lado li { display: grid; grid-template-columns: auto 1fr; gap: var(--e-1) var(--e-4); }
.lado li + li { margin-top: var(--e-6); }
.lado li .ic { grid-row: span 2; margin-top: .15rem; }
.lado li strong { font: 500 1.1875rem/1.3 var(--fonte-titulo); }
.lado li p { grid-column: 2; color: var(--tinta-2); font-size: var(--t-pequeno); }
@media (min-width: 62rem) { .mesa { grid-template-columns: 1fr 4px 1fr; gap: var(--e-8); } .mesa__meio { height: auto; background: linear-gradient(180deg, var(--laranja), var(--vermelho)); } }

/* ---------- Como cobramos: diagrama ---------- */
.fluxo { display: grid; gap: var(--e-4); justify-items: start; }
.fluxo__no { display: flex; align-items: center; gap: var(--e-4); }
.fluxo__no strong { display: block; font: 500 1.375rem/1.2 var(--fonte-titulo); }
.fluxo__no div span { display: block; color: var(--tinta-2); font-size: var(--t-pequeno); max-width: 22rem; }
.fluxo__seta { margin-left: 2.5rem; transform: rotate(90deg); }
.fluxo__decisao { display: flex; align-items: center; gap: var(--e-4); font: 500 1.25rem/1.2 var(--fonte-titulo); }
.fluxo__decisao i { width: 3.25rem; height: 3.25rem; margin: .75rem 1.6rem; transform: rotate(45deg); background: var(--degrade); border-radius: 8px; flex: none; }
.fluxo__saidas { display: grid; gap: var(--e-5); }
.fluxo__saida { display: grid; grid-template-columns: auto auto 1fr; align-items: center; gap: var(--e-4); }
.fluxo__saida > em { font: 700 var(--t-rotulo)/1 var(--fonte-texto); font-style: normal; letter-spacing: .1em; text-transform: uppercase; color: var(--destaque-texto); width: 2.5rem; margin-left: 1.9rem; }
.fluxo__saida--nao > em { color: var(--tinta-2); }
@media (min-width: 62rem) {
  .fluxo { grid-template-columns: auto auto auto auto 1fr; align-items: center; justify-items: stretch; gap: var(--e-5); }
  .fluxo__no { flex-direction: column; text-align: center; }
  .fluxo__seta { margin: 0; transform: none; }
  .fluxo__decisao { flex-direction: column; text-align: center; max-width: 9rem; }
  .fluxo__decisao i { margin: .75rem; }
  .fluxo__saidas { gap: var(--e-7); padding-left: var(--e-6); border-left: 4px solid transparent; border-image: linear-gradient(180deg, var(--laranja), var(--vermelho)) 1; }
  .fluxo__saida > em { margin-left: 0; }
  .fluxo__saida .fluxo__no { flex-direction: row; text-align: left; }
}

/* ---------- Rascunho interno (seção que não vai ao ar como está) ---------- */
[data-rascunho] { position: relative; }
.aviso-rascunho { display: flex; flex-wrap: wrap; gap: var(--e-3); align-items: flex-start; border: 2px dashed var(--tinta); border-radius: var(--raio-p); padding: var(--e-4); margin-bottom: var(--e-6); font-size: var(--t-pequeno); background: var(--fundo); }
.aviso-rascunho strong { text-transform: uppercase; letter-spacing: .08em; font-size: var(--t-rotulo); white-space: nowrap; padding-top: .15em; }
.grade { display: grid; gap: var(--e-5); }
@media (min-width: 48rem) { .grade--3 { grid-template-columns: repeat(3, 1fr); } }
.vago { border: 2px dashed var(--linha); border-radius: var(--raio); padding: var(--e-6); min-height: 9rem; display: flex; flex-direction: column; justify-content: space-between; gap: var(--e-5); background: transparent; }
.vago__linhas span { display: block; height: .75rem; border-radius: var(--pilula); background: var(--linha); }
.vago__linhas span + span { margin-top: var(--e-3); width: 70%; }
.vago p { font-size: var(--t-pequeno); color: var(--tinta-2); }

/* ---------- Contato (faixa em degradê) ---------- */
.contato { background: var(--degrade-faixa); color: var(--branco); position: relative; overflow: hidden; }
.contato .caixa { position: relative; display: grid; gap: var(--e-7); padding-block: var(--secao); }
.contato__marca { height: 2.2rem; width: auto; margin-bottom: var(--e-7); }
.contato h2 { font-size: clamp(2.2rem, 5vw, 3.75rem); line-height: 1.04; max-width: 12ch; }
.contato__texto { font: 500 var(--t-lead)/1.35 var(--fonte-titulo); margin-top: var(--e-5); max-width: 24ch; }
.contato__email { display: inline-block; margin-top: var(--e-6); font: 700 clamp(1.1875rem, 2.2vw, 1.5rem)/1.3 var(--fonte-texto); color: var(--branco); text-underline-offset: .25em; text-decoration-thickness: 2px; word-break: break-word; }
@media (min-width: 62rem) { .contato .caixa { grid-template-columns: 1fr minmax(0, 30rem); gap: var(--e-9); align-items: center; } }

/* formulário */
.form { background: var(--fundo); color: var(--tinta); border-radius: var(--raio); padding: clamp(1.25rem, 4vw, 2rem); box-shadow: var(--sombra); }
.form h3 { margin-bottom: var(--e-2); }
.form > p { color: var(--tinta-2); font-size: var(--t-pequeno); }
.campo { margin-top: var(--e-4); }
.campo label { display: block; font-weight: 500; font-size: var(--t-pequeno); margin-bottom: var(--e-2); }
.campo .opc { color: var(--tinta-2); font-weight: 400; }
.campo input, .campo select, .campo textarea { width: 100%; min-height: 3rem; padding: .7rem .85rem; border: 1px solid #8C8486; border-radius: var(--raio-p); background: var(--fundo); color: var(--tinta); font: 400 1rem/1.4 var(--fonte-texto); }
.campo textarea { min-height: 6.5rem; resize: vertical; }
.campo input:focus-visible, .campo select:focus-visible, .campo textarea:focus-visible { outline: 3px solid var(--tinta); outline-offset: 1px; border-color: var(--tinta); }
.form .botao { width: 100%; margin-top: var(--e-5); border: 0; }
.form__nota { margin-top: var(--e-4); font-size: var(--t-rotulo); color: var(--tinta-2); line-height: 1.5; }
.form__nota a { color: var(--tinta); }
.form__estado { margin-top: var(--e-4); padding: var(--e-3) var(--e-4); border-radius: var(--raio-p); border: 1px solid var(--tinta); font-size: var(--t-pequeno); }
.form__estado[hidden] { display: none; }

/* ---------- Rodapé ---------- */
.rodape { background: var(--fundo); padding-block: var(--e-8) var(--e-7); font-size: var(--t-pequeno); color: var(--tinta-2); }
.rodape__topo { display: grid; gap: var(--e-6); padding-bottom: var(--e-6); border-bottom: 1px solid var(--linha); }
.rodape__marca img { height: 1.875rem; width: auto; margin-bottom: var(--e-5); }
.rodape strong { color: var(--tinta); font-weight: 500; }
.rodape nav ul { display: flex; flex-wrap: wrap; gap: var(--e-3) var(--e-5); }
.rodape nav a { color: var(--tinta); display: inline-block; padding-block: var(--e-2); }
.rodape__legal { padding-top: var(--e-6); max-width: 60rem; font-size: var(--t-rotulo); line-height: 1.6; }
@media (min-width: 48rem) { .rodape__topo { grid-template-columns: 1fr auto; align-items: end; } }

/* ---------- Página de texto (privacidade) ---------- */
.pagina-cab { background: var(--degrade); color: var(--branco); }
.pagina-cab .caixa { padding-block: clamp(3rem, 8vw, 5.5rem); }
.pagina-cab h1 { font: 500 clamp(2.4rem, 6vw, 4rem)/1.04 var(--fonte-titulo); letter-spacing: -0.015em; }
.pagina-cab p { font: 500 var(--t-lead)/1.3 var(--fonte-titulo); margin-top: var(--e-4); max-width: 28ch; }
.prosa > * { max-width: 44rem; }
.prosa h2 { font-size: 1.75rem; margin-top: var(--e-7); margin-bottom: var(--e-4); }
.prosa h2:first-child { margin-top: 0; }
.prosa p + p { margin-top: var(--e-4); }
.prosa .pingos { margin-top: var(--e-4); }
.prosa a { color: var(--destaque-texto); font-weight: 500; text-underline-offset: .2em; }
.pendente { border: 2px dashed var(--tinta); border-radius: var(--raio-p); padding: var(--e-4); font-size: var(--t-pequeno); margin-block: var(--e-5); }
.pendente strong { text-transform: uppercase; letter-spacing: .08em; font-size: var(--t-rotulo); }
.dados { margin-top: var(--e-4); border-top: 1px solid var(--linha); }
.dados div { display: grid; gap: var(--e-1) var(--e-5); padding-block: var(--e-4); border-bottom: 1px solid var(--linha); }
.dados dt { color: var(--tinta-2); font-size: var(--t-pequeno); }
@media (min-width: 40rem) { .dados div { grid-template-columns: 12rem 1fr; } }

/* ---------- Problema: número grande ---------- */
.contraste { display: grid; gap: var(--e-6); margin-top: var(--e-7); }
.contraste strong { display: block; font: 500 clamp(4rem, 13vw, 9rem)/.9 var(--fonte-titulo); letter-spacing: -0.03em; padding-bottom: .08em; }
.contraste p:last-child strong { font-size: clamp(3rem, 9.5vw, 7rem); }
.contraste span { display: block; margin-top: var(--e-3); color: var(--tinta-2); max-width: 30rem; }
@media (min-width: 62rem) { .contraste { grid-template-columns: auto 1fr; gap: var(--e-8); align-items: end; } .contraste p:last-child { padding-left: var(--e-8); border-left: 1px solid var(--linha); } }
.vazio { width: 3rem; height: 3rem; border-radius: 50%; border: 2px dashed var(--tinta-2); flex: none; }

/* ---------- Manchete (slogan trocável) ---------- */
.manchete h2 { font-size: clamp(2rem, 5.4vw, 4rem); line-height: 1.05; letter-spacing: -0.015em; max-width: 22ch; }
.manchete .botao { margin-top: var(--e-6); }
.manchete__apoio { font-size: 1.1875rem; color: var(--tinta-2); margin-top: var(--e-5); max-width: 40rem; }

/* ---------- Equipe ---------- */
.equipe { display: grid; gap: var(--e-7); }
.equipe__foto img { aspect-ratio: 3 / 2; object-position: 50% 30%; }
.socios { display: grid; gap: var(--e-7); align-content: start; }
.socio h3 { font-size: 1.625rem; }
.socio__papel { font: 700 var(--t-rotulo)/1.2 var(--fonte-texto); letter-spacing: .1em; text-transform: uppercase; color: var(--destaque-texto); margin-top: var(--e-2); }
.socio__bio { color: var(--tinta-2); font-size: var(--t-pequeno); margin-top: var(--e-3); }
.chips { display: flex; flex-wrap: wrap; gap: var(--e-2); margin-top: var(--e-4); }
.chips li { font-size: var(--t-rotulo); font-weight: 500; padding: .35rem .75rem; border: 1.5px solid var(--laranja); border-radius: var(--pilula); }
.logos { display: flex; flex-wrap: wrap; align-items: center; gap: var(--e-4) var(--e-5); margin-top: var(--e-5); }
.logos img { max-width: 6rem; height: 1.75rem; width: auto; object-fit: contain; filter: grayscale(1) contrast(1.05); opacity: .8; }
@media (min-width: 40rem) { .socios { grid-template-columns: 1fr 1fr; gap: var(--e-6); } }
@media (min-width: 68rem) { .equipe { grid-template-columns: 28rem 1fr; gap: var(--e-8); align-items: center; } .equipe__foto img { aspect-ratio: 4 / 3; } }
.agentes { margin-top: var(--e-8); padding-top: var(--e-7); border-top: 1px solid var(--linha); display: grid; gap: var(--e-6); }
.agentes__cab p { color: var(--tinta-2); margin-top: var(--e-2); max-width: 26rem; }
.agentes__lista { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--e-5) var(--e-4); }
.agentes__lista li { display: flex; align-items: center; gap: var(--e-3); line-height: 1.25; }
.agentes__lista strong { display: block; font: 500 1.0625rem/1.2 var(--fonte-titulo); }
.agentes__lista small { display: block; font-size: var(--t-rotulo); color: var(--tinta-2); margin-top: 2px; }
.agentes__lista .ponto { flex: none; }
@media (min-width: 40rem) { .agentes__lista { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 68rem) { .agentes { grid-template-columns: 1fr 2fr; gap: var(--e-8); align-items: center; } }

/* ---------- Histórico: grade logo + 1 linha + ano ---------- */
.exits { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--e-6) var(--e-5); }
.exit { display: flex; flex-direction: column; gap: var(--e-3); padding-top: var(--e-4); border-top: 4px solid transparent; border-image: var(--degrade-linha) 1; }
.exit__logo { display: grid; place-items: center; height: 5rem; border: 2px dashed var(--linha); border-radius: var(--raio-p); padding: var(--e-3); text-align: center; font: 500 1rem/1.2 var(--fonte-titulo); background: var(--fundo); }
.exit__logo { border-style: solid; border-width: 1px; }
.exit__logo img { max-width: 78%; max-height: 3rem; width: auto; height: auto; object-fit: contain; }
.exit__logo .logo--inverte { filter: invert(1) grayscale(1) contrast(1.4); max-height: 3.6rem; }
.exit p { font-size: var(--t-pequeno); color: var(--tinta-2); flex: 1; }
.exit__ano { font: 500 1.375rem/1 var(--fonte-titulo); color: var(--destaque-texto); }
@media (min-width: 40rem) { .exits { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 68rem) { .exits { grid-template-columns: repeat(5, 1fr); } }
.exit__nome { font: 500 1.0625rem/1.25 var(--fonte-titulo); }
.logos .logo--inverte { filter: invert(1) grayscale(1) contrast(1.4); height: 2.5rem; opacity: .75; }

/* ---------- v4: texto canônico do CLO ---------- */
.lado li p + p { margin-top: var(--e-2); }
.lado__logo { grid-column: 2; height: 2rem; width: auto; margin-top: var(--e-4); }
.lado__nota { margin-top: var(--e-6); font-size: var(--t-pequeno); color: var(--tinta-2); padding-left: var(--e-4); border-left: 3px solid var(--laranja); }
.equipe__foto figcaption { margin-top: var(--e-3); font: 500 1rem/1.3 var(--fonte-titulo); }
.socio__rotulo { font: 700 var(--t-rotulo)/1 var(--fonte-texto); letter-spacing: .1em; text-transform: uppercase; color: var(--tinta-2); margin-top: var(--e-5); }
.socio .logos { margin-top: var(--e-3); }
.equipe__nota { margin-top: var(--e-6); font-size: var(--t-rotulo); color: var(--tinta-2); max-width: 44rem; }
.exits { grid-template-columns: 1fr; }
.exit { border: 0; padding-top: 0; }
.exit .medalhao { width: 4.5rem; height: 4.5rem; margin-bottom: var(--e-2); }
.exit__nome { font-size: 1.1875rem; }
.ressalva--segue { margin-top: var(--e-2); }
@media (min-width: 40rem) { .exits { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 68rem) { .exits { grid-template-columns: repeat(4, 1fr); gap: var(--e-7); } }
.contato__nomes { font: 500 1.5rem/1.3 var(--fonte-titulo); margin-top: var(--e-6); }
.contato__canais { margin-top: var(--e-3); display: grid; gap: var(--e-2); }
.contato__canais a { display: inline-block; padding-block: var(--e-2); font: 700 clamp(1.1875rem, 2.2vw, 1.5rem)/1.3 var(--fonte-texto); color: var(--branco); text-underline-offset: .25em; text-decoration-thickness: 2px; word-break: break-word; }
.versao { color: var(--tinta-2); font-size: var(--t-pequeno); margin-bottom: var(--e-6); }
.contato__aviso { margin-top: var(--e-3); font: 700 1.1875rem/1.4 var(--fonte-texto); max-width: 26rem; }
.contato__aviso a { color: var(--branco); text-underline-offset: .2em; }

/* ---------- v5: Entrar no cabeçalho, formulário que envia, seção do app ---------- */
.topo__acoes { display: flex; align-items: center; gap: var(--e-3); flex: none; }
.entrar { display: inline-flex; align-items: center; min-height: 2.75rem; padding: 0 1rem; border: 2px solid var(--tinta); border-radius: var(--pilula); font-weight: 700; font-size: 1rem; text-decoration: none; color: var(--tinta); }
.entrar:hover { background: var(--fundo-2); }
@media (max-width: 26rem) {
  .topo .caixa { gap: var(--e-2); min-height: 4rem; }
  .marca img { height: 1.25rem; }
  .topo__acoes { gap: var(--e-1); }
  .entrar { border: 0; padding: 0 .5rem; text-decoration: underline; text-underline-offset: .2em; }
  .topo .botao--compacto { padding-inline: .8rem; font-size: 1.1875rem; }
}
.campo--par { display: grid; gap: var(--e-4); }
@media (min-width: 30rem) { .campo--par { grid-template-columns: 1fr 1fr; } }
.armadilha { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.form__envio { display: grid; gap: var(--e-4); margin-top: var(--e-5); align-items: center; }
.form__envio .botao { margin-top: 0; }
.ciencia { display: flex; align-items: center; gap: var(--e-3); font-size: var(--t-pequeno); font-weight: 500; min-height: 2.75rem; }
.ciencia input { width: 1.375rem; height: 1.375rem; accent-color: var(--vermelho); flex: none; }
.ciencia a { color: var(--tinta); }
@media (min-width: 30rem) { .form__envio { grid-template-columns: 1fr auto; } .form .form__envio .botao { width: auto; padding-inline: 2.25rem; } }
.form__estado--ok { border-color: #1F6B45; background: #E7F3EC; color: #14472D; font-weight: 500; }
.form__estado--erro { border-color: var(--vermelho); background: #FBEDEE; }
.form__estado--espera { border-style: dashed; }
.form__estado a { color: inherit; font-weight: 700; }
.campo [aria-invalid="true"] { border-color: var(--vermelho); border-width: 2px; }
.contato h2 { max-width: 12ch; }

/* moldura de navegador e de celular, em CSS */
.mock { position: relative; padding: 0 0 7% 0; }
.mock__nav { border-radius: 12px; overflow: hidden; background: var(--fundo); box-shadow: 0 2px 4px rgba(35,31,32,.08), 0 30px 60px -24px rgba(35,31,32,.45); border: 1px solid var(--linha); }
.mock__barra { display: flex; align-items: center; gap: 6px; padding: 9px 12px; background: #F1EDEA; border-bottom: 1px solid var(--linha); }
.mock__barra i { width: 9px; height: 9px; border-radius: 50%; background: #CFC8C3; }
.mock__barra span { margin-left: 10px; flex: 1; max-width: 16rem; font-size: .6875rem; color: var(--tinta-2); background: var(--fundo); border-radius: var(--pilula); padding: 2px 10px; }
.mock__nav img { width: 100%; height: auto; }
.mock__cel { position: absolute; right: -2%; bottom: 0; width: 24%; border-radius: 18px; border: 5px solid var(--tinta); background: var(--tinta); overflow: hidden; box-shadow: 0 24px 40px -16px rgba(35,31,32,.6); }
.mock__cel img { width: 100%; height: auto; border-radius: 12px; }

/* opção B: seção própria */
.app { background: var(--fundo-2); border-bottom: 1px solid var(--linha); }
.app__grade { display: grid; gap: var(--e-7); }
.app__beneficios { display: grid; gap: var(--e-5); margin-top: var(--e-6); }
.app__beneficios li { display: grid; grid-template-columns: auto 1fr; gap: var(--e-4); align-items: start; }
.app__beneficios h3 { font-size: 1.1875rem; }
.app__beneficios p { color: var(--tinta-2); font-size: var(--t-pequeno); margin-top: var(--e-1); }
.app__fixa { margin-top: var(--e-6); padding-left: var(--e-4); border-left: 3px solid var(--laranja); font-size: var(--t-pequeno); max-width: 34rem; }
.app__acoes { display: flex; flex-wrap: wrap; align-items: center; gap: var(--e-3) var(--e-5); margin-top: var(--e-6); }
.app__acoes span { font-size: var(--t-pequeno); color: var(--tinta-2); }
.app__figura figcaption, .capa__mock figcaption { margin-top: var(--e-3); font-size: var(--t-rotulo); color: var(--tinta-2); }
@media (min-width: 62rem) { .app__grade { grid-template-columns: 5fr 7fr; gap: var(--e-8); align-items: center; } }

/* opção A: mockup na capa */
.capa--app .capa__grade { display: grid; gap: var(--e-7); align-items: center; }
.capa--app h1 { font-size: clamp(2.2rem, 4.6vw, 3.75rem); }
.capa__mock figcaption { color: var(--branco); font: 700 1.1875rem/1.35 var(--fonte-texto); margin-top: var(--e-4); }
@media (min-width: 62rem) { .capa--app .capa__grade { grid-template-columns: 5fr 6fr; gap: var(--e-8); } .capa--app .caixa { padding-block: clamp(3rem, 7vw, 5.5rem); } }
.app-faixa { padding-block: var(--e-8); background: var(--fundo-2); border-bottom: 1px solid var(--linha); }
.app-faixa__cab { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: end; gap: var(--e-4); }
@media (min-width: 62rem) { .app__beneficios--linha { grid-template-columns: repeat(3, 1fr); gap: var(--e-7); } }
/* menu com 8 itens (12/nov: entrou "Blog"): uma linha só; aparece a partir de 80rem, com respiro e corpo menores
   para caber na largura da grade (72rem). Está no limite: um 9º item não cabe. */
.nav a { white-space: nowrap; font-size: 0.875rem; }
.nav ul { gap: var(--e-4); }
.topo .caixa { gap: var(--e-4); }
@media (min-width: 62rem) and (max-width: 79.99rem) { .nav { display: none; } }
.ciencia--optin { margin-top: var(--e-2); align-items: flex-start; font-weight: 400; min-height: 0; padding-block: var(--e-2); }
.ciencia--optin input { margin-top: .1rem; }

/* validação por campo */
.erro { margin-top: var(--e-2); font-size: var(--t-pequeno); font-weight: 500; color: #9E1B24; display: flex; flex-wrap: wrap; gap: var(--e-1) var(--e-2); align-items: baseline; }
.erro[hidden] { display: none; }
.erro::before { content: "!"; display: inline-grid; place-items: center; width: 1.1rem; height: 1.1rem; border-radius: 50%; background: #9E1B24; color: #fff; font-size: .75rem; font-weight: 700; flex: none; }
.erro__acao { border: 0; background: none; padding: .25rem 0; font: inherit; font-weight: 700; color: var(--tinta); text-decoration: underline; text-underline-offset: .2em; cursor: pointer; min-height: 1.75rem; }
.contador { margin-top: var(--e-1); font-size: var(--t-rotulo); color: var(--tinta-2); text-align: right; font-variant-numeric: tabular-nums; }
.contador--estouro { color: #9E1B24; font-weight: 700; }
.ciencia input[aria-invalid="true"] { outline: 2px solid #9E1B24; outline-offset: 2px; }
.form > .erro { margin-top: var(--e-3); }
.form__envio .ciencia { align-items: flex-start; } .form__envio .ciencia input { margin-top: .1rem; }
.campo input[type="checkbox"], .form input[type="checkbox"] { width: 1.375rem; height: 1.375rem; min-height: 0; padding: 0; flex: none; }
.erro { display: block; position: relative; padding-left: 1.6rem; }
.erro::before { position: absolute; left: 0; top: .15em; }
.erro__acao { display: inline; margin-left: .25rem; }
.campo label.ciencia { display: flex; margin-bottom: 0; }
.campo label.ciencia--optin { margin-top: var(--e-3); gap: var(--e-3); }