/* PROSPECTIVA na marca do site (28/10/2026).
   Carrega por ÚLTIMO, depois de brand/marca.css e do CSS da área (_v4.css ou o
   painel.css das versões do Positivo). Não desenha nada novo: devolve as cores
   e as letras dos painéis aos papéis da marca, para o claro e o escuro.

   - --p4-* (reports v4) e --ink/--line/--accent... (Positivo v2/v3, que vinham
     do talks.css) passam a apontar para --bg, --cartao, --text, --bloco...
   - azul do produto vira o laranja da marca; violeta entra como segunda cor;
     verde/laranja/vermelho/cinza seguem como favorável/misto/adverso/externo.
   - títulos em Bricolage, texto em Figtree; a mono vira Figtree em caixa alta.
   O cabeçalho e o rodapé vêm de brand/topo.html (tools/prospectiva/aplicar_marca.py). */

/* ---------- Base (o que o talks.css fazia) ---------- */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
img, svg { display: block; max-width: 100%; height: auto; }
button { font: inherit; color: inherit; cursor: pointer; border: none; background: none; }
a { color: inherit; text-decoration: none; }
ul { list-style: none; }
body { min-height: 100vh; min-height: 100dvh; display: flex; flex-direction: column; line-height: 1.55; -webkit-font-smoothing: antialiased; }
body > main { flex: 1 0 auto; }
.skip { position: absolute; z-index: 200; top: 10px; left: 10px; padding: 10px 16px; border-radius: 12px; background: var(--text); color: var(--bg); transform: translateY(-200%); }
.skip:focus { transform: none; }

/* ---------- Papéis ---------- */
:root {
  /* reports v4 */
  --p4-paper: var(--bg); --p4-card: var(--cartao); --p4-ink: var(--text); --p4-ink2: var(--body); --p4-ink3: var(--muted);
  --p4-night: var(--bloco); --p4-night2: #241f19; --p4-nline: rgb(255 106 31 / 16%);
  --p4-blue: var(--accent-texto); --p4-sky: var(--accent); --p4-line: var(--line-2);
  --p4-fav: #0f7a3e; --p4-favbg: #e2eedd; --p4-favink: #0c5a32;
  --p4-mix: #b23c08; --p4-mixbg: #f7e4d6; --p4-mixink: #7a2a0a;
  --p4-adv: #a52a27; --p4-advbg: #f6dfdb; --p4-advink: #7a2222;
  --p4-ext: #5d564d; --p4-extbg: #e8e0d1; --p4-extink: #2d2924;
  --p4-mono: var(--sans);
  /* Positivo v2/v3 (nomes do talks.css) */
  --ink: var(--text); --ink-2: var(--body); --ink-3: var(--muted); --bg-soft: var(--surface); --bg-ink: var(--bloco);
  --accent-hover: var(--text); --ff: var(--sans);
  --maxw: 1240px; --pad: clamp(20px, 4vw, 40px); --pad-y: clamp(56px, 8vw, 104px); --radius: 12px; --radius-lg: 20px;
  --pv-fav: #0f7a3e; --pv-fav-bg: #e2eedd; --pv-fav-ink: #0c5a32;
  --pv-mix: #b23c08; --pv-mix-bg: #f7e4d6; --pv-mix-ink: #7a2a0a;
  --pv-adv: #a52a27; --pv-adv-bg: #f6dfdb; --pv-adv-ink: #7a2222;
  --pv-ext: #3d3730; --pv-ext-bg: #e8e0d1; --pv-ext-ink: #2d2924;
  --pv-amber: #a86d0c; --pv-amber-bg: #f3e6c8; --pv-amber-ink: #5e3f08;
}
:root[data-tema="escuro"] {
  --p4-night2: #2e271f; --p4-nline: rgb(255 143 85 / 18%);
  --p4-fav: #4cc283; --p4-favbg: rgb(76 194 131 / 14%); --p4-favink: #8fdcb0;
  --p4-mix: #ff8f55; --p4-mixbg: rgb(255 143 85 / 14%); --p4-mixink: #ffb994;
  --p4-adv: #f07a72; --p4-advbg: rgb(240 122 114 / 14%); --p4-advink: #f6aaa4;
  --p4-ext: #a89f91; --p4-extbg: rgb(168 159 145 / 16%); --p4-extink: #d9d2c5;
  --pv-fav: #4cc283; --pv-fav-bg: rgb(76 194 131 / 14%); --pv-fav-ink: #8fdcb0;
  --pv-mix: #ff8f55; --pv-mix-bg: rgb(255 143 85 / 14%); --pv-mix-ink: #ffb994;
  --pv-adv: #f07a72; --pv-adv-bg: rgb(240 122 114 / 14%); --pv-adv-ink: #f6aaa4;
  --pv-ext: #d9d2c5; --pv-ext-bg: rgb(168 159 145 / 16%); --pv-ext-ink: #d9d2c5;
  --pv-amber: #e3b45a; --pv-amber-bg: rgb(227 180 90 / 14%); --pv-amber-ink: #f0d396;
}

/* ---------- Letras ---------- */
body, .p4 { font-family: var(--sans); }
.p4 h1, .p4 h2, .p4 h3, .p4hero .thesis, .num .v, .pv-h1, .pv-h2, .pv-h3, .doc-title, .pr-titulo {
  font-family: var(--display); font-stretch: 88%;
}
.p4hero .thesis, .p4sec h2, .pv-h1, .pv-h2 { font-weight: 800; letter-spacing: -.035em; }
.p4hero .thesis { font-stretch: 86%; line-height: .98; }
.p4 h3 { letter-spacing: -.015em; }
/* A mono virou Figtree em caixa alta: um pouco mais de peso para segurar o tracking. */
.k, .rail-brand, .rail-acts a, .p4hero .back, .p4hero .client, .p4hero .meta { font-weight: 700; }

/* ---------- Cabeçalho e trilho ----------
   Nos reports o cabeçalho do site rola junto (como era antes): quem fica no
   topo ao rolar é o trilho do report. */
.p4 .gz-topo, body:has(.pv-vswitch) .gz-topo { position: relative; }
/* Positivo v2: o cabeçalho rola e a faixa de versão (sticky) assume o topo. */
.rail { background: rgb(22 19 15 / 94%); border-bottom: 1px solid var(--p4-nline); }
[data-tema="escuro"] .rail { background: rgb(38 32 25 / 94%); }
.rail-brand { color: #f3eee5; }
.rail-acts a { color: rgb(243 238 229 / 55%); }
.rail-acts a:hover, .rail-acts a.on { color: #f3eee5; }
.rail-acts a.on { background: rgb(255 106 31 / 18%); }

/* ---------- Atos escuros ---------- */
.act { background: var(--bloco); color: #f3eee5; }
[data-tema="escuro"] .act { border-block: 1px solid var(--line); }
.k .idx { border-color: rgb(255 106 31 / 45%); }
.p4sec .k .idx { border-color: var(--line-2); }
/* Os anéis seguram o lado direito da abertura (regra: nada de meia tela vazia). */
.p4hero .ring { border: 1.5px solid rgb(255 106 31 / 34%); background: radial-gradient(circle at 50% 50%, rgb(255 106 31 / 10%), transparent 62%); }
.p4hero .ring::before, .p4hero .ring::after { border: 1.5px solid rgb(255 106 31 / 45%); }
.p4btn-sky { color: var(--sobre-acc); }
.p4btn-sky:hover { color: var(--sobre-acc); box-shadow: 0 10px 30px rgb(255 106 31 / 35%); }
.p4btn-blue { color: #fff; }
.p4btn-blue:hover { box-shadow: 0 10px 28px rgb(178 60 8 / 30%); }
.p4btn-line { border-color: var(--line-2); }
.ind .lamp { box-shadow: 0 0 10px rgb(255 106 31 / 70%); }
.ainote .els { background: var(--bloco); color: var(--accent); }

/* ---------- Miolo claro ---------- */
.find:hover { background: rgb(255 106 31 / 5%); }
.cardi:hover, .vc:hover, .quad.on, .hcol .cell.sel { box-shadow: 0 12px 28px -14px var(--sombra); }
.vc.pref { box-shadow: 0 16px 44px -18px rgb(19 138 71 / 45%); }
.duel .f1 { background: var(--accent); } .duel .f2 { background: var(--violeta); }
.layer:nth-child(2) .layer-n { background: var(--violeta); } .layer:nth-child(3) .layer-n { background: #3a2a8f; }
.cmpt td.br, .cmpt .st-br, .cmpt tr.licao td.br { background: rgb(255 106 31 / 10%); border-left: 0; }
.cmpt .st-mercado, .t-imp { background: var(--pv-amber-bg); color: var(--pv-amber-ink); }
.cmpt .st-estado, .t-inst { background: rgb(91 46 230 / 12%); color: var(--violeta-texto); }
.face-back, .face-back .sinal { border-color: rgb(19 138 71 / 22%); }
.sig { border-color: var(--cartao); }
.sig.sel { box-shadow: 0 0 0 4px rgb(255 106 31 / 25%); }
.pv-fab { background: var(--accent); color: var(--sobre-acc); box-shadow: 0 8px 28px -10px rgb(255 106 31 / 70%); }
.pv-fab:hover { background: var(--text); color: var(--bg); box-shadow: 0 12px 36px -12px var(--sombra); }
.pv-fab-ghost { background: var(--violeta); color: #fff; box-shadow: 0 8px 28px -10px rgb(91 46 230 / 60%); }
.pv-fab-ghost:hover { background: var(--text); color: var(--bg); }
.pv-modal-card button[type=submit]:hover:not(:disabled) { background: var(--text); color: var(--bg); }
.pv-modal-card .sent-check { background: var(--p4-favbg); color: var(--p4-fav); }
#tip { background: var(--text); color: var(--bg); }

/* Citação e cenas: sem barra lateral; aspas da marca e caixa inteira. */
.pq, .pv-quote { position: relative; padding-left: 0 !important; border-left: 0 !important; font-family: var(--display); font-stretch: 90%; font-weight: 700; }
.pq::before, .pv-quote::before { content: "\201C"; display: block; height: .55em; font-size: 2.6em; line-height: 1; color: var(--accent); }
.cena, .role-move, .pv-anchor, .pv-role-move, .pv-diag-move { border-left: 0 !important; border-radius: 16px !important; }
.pv-anchor { background: var(--cartao); box-shadow: inset 0 0 0 1px var(--line-2); }
.pv-anchor b { color: var(--accent-texto); }
.pv-sig[class] { border-left: 1px solid var(--line-2); }

/* ---------- Positivo v2/v3 ---------- */
.pv-btn-primary { background: var(--accent); color: var(--sobre-acc); }
.pv-btn-primary:hover { background: var(--text); color: var(--bg); }
.pv-btn-ghost { background: var(--cartao); border-color: var(--line-2); }
.pv-client, .pv-kicker, .pv-num-sec, .pv-back:hover, .pv-chip:hover, .pv-sigf:hover { color: var(--accent-texto); }
.pv-client::before { background: var(--accent); }
.pv-chip { background: var(--cartao); }
.pv-chip:hover { border-color: var(--accent); }
.pv-gap, .pv-metaphor, .pv-layer-n { color: #f3eee5; }
.pv-vswitch { background: var(--surface); border-bottom: 1px solid var(--line); }
.pv-vswitch .lbl { color: var(--body); }
.pv-vswitch .lbl b { color: var(--accent-texto); }
.pv-vswitch a { border-color: var(--line-2); color: var(--text); }
.pv-vswitch a:hover { border-color: var(--accent); color: var(--accent-texto); }
.pv-vswitch a.cur { background: var(--text); border-color: var(--text); color: var(--bg); }

/* ---------- "Painel em preparação" (brz, charth) ---------- */
.section { padding: var(--pad-y) 0; }
.doc-back { display: inline-flex; align-items: center; gap: 6px; margin-bottom: 28px; font-size: 14px; font-weight: 600; color: var(--accent-texto); }
.doc-back svg { width: 16px; height: 16px; }
.doc-eyebrow { display: block; margin-bottom: 14px; font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--accent-texto); }
.doc-title { font-weight: 800; font-size: clamp(40px, 6vw, 76px); line-height: .96; letter-spacing: -.04em; }
.doc-desc { max-width: 52ch; margin-top: 18px; font-size: 19px; line-height: 1.6; color: var(--body); }

/* ---------- Largura ----------
   A coluna é a mesma do cabeçalho (--gz-largura, de brand/marca.css) em todas
   as páginas: reports, Positivo v2/v3, vitrine e painéis em preparação. */
.wrap, .pvw, .rail-in, .pv-wrap, .pv-sec, .pv-chips, .pv-vswitch-in { width: var(--gz-largura); max-width: none; margin-inline: auto; padding-inline: 0; }
.p4hero .pvw { position: relative; }

/* A abertura padrão nos painéis em preparação e na vitrine. */
main.section:has(.pr-abre) { padding-top: 0; }
.pr-abre { padding-top: clamp(24px, 3vw, 40px); }
.pr-abre .doc-back { margin-bottom: 18px; }
.pr-abre + div[style] { margin-top: 0 !important; }

/* ---------- Telas estreitas (nada passa da borda) ---------- */
.map7 { grid-template-columns: minmax(0, 1fr) minmax(0, 2.1fr) minmax(0, 1fr); }
.tb2 { gap: clamp(10px, 4vw, 64px); }
.tb2 .tb { flex: 1 1 0; min-width: 0; }
.tb2 .tb .bar { width: min(100%, clamp(56px, 9vw, 96px)); }
.tb2 .tb .y { text-align: center; }
@media (max-width: 860px) { .map7 { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 700px) {
  .ind-btn { flex-wrap: wrap; row-gap: 4px; }
  .in-name { flex: 1 1 calc(100% - 60px); }
  .in-freq { order: 3; flex-basis: 100%; padding-left: 23px; white-space: normal; }
  .p4hero .thesis em { white-space: normal; }
}

/* Corpo no tamanho do resto do site (os reports .p4 têm medidas próprias). */
body:not(.p4) { font-size: 18px; line-height: 1.6; }

/* Vitrine (Gui, 30/10/2026: o padrão é /conteudos/): os estudos como bilhetes
   soltos e o pedido na faixa laranja reta, com o raio saindo da borda (marca.css). */
.tk-grid { gap: 24px 20px; padding-bottom: 14px; }
.tk-grid .tk-card:nth-child(6n+1) { rotate: calc(-1.2deg * var(--giro)); }
.tk-grid .tk-card:nth-child(6n+2) { rotate: calc(.8deg * var(--giro)); translate: 0 12px; }
.tk-grid .tk-card:nth-child(6n+3) { rotate: calc(-.6deg * var(--giro)); }
.tk-grid .tk-card:nth-child(6n+4) { rotate: calc(1.1deg * var(--giro)); translate: 0 10px; }
.tk-grid .tk-card:nth-child(6n+5) { rotate: calc(-.9deg * var(--giro)); }
.tk-grid .tk-card:nth-child(6n+6) { rotate: calc(.7deg * var(--giro)); translate: 0 12px; }
.tk-cta { position: relative; isolation: isolate; margin-top: clamp(56px, 7vw, 88px); padding: clamp(72px, 8vw, 108px) 0; border: 0; border-radius: 0; background: none; color: var(--sobre-acc); }
.tk-cta .t, .tk-cta .s { color: var(--sobre-acc); }
.tk-cta a.dark { border-color: var(--sobre-acc); background: var(--sobre-acc); color: #f1ece2; }
.tk-cta a.ghost { border-color: var(--sobre-acc); background: transparent; color: var(--sobre-acc); }
@media (max-width: 720px) { .tk-grid .tk-card:nth-child(n) { rotate: 0deg; translate: 0 0; } }