/* ==========================================================================================
   Raio-X do Lattes: página de vendas, padrão "Laudo".
   Faixas "filme" (verde muito escuro, linhas de luz verde) e faixas "laudo" (papel claro, tinta verde-escura),
   com o petróleo da marca como acento. Contraste conferido (o mapa está em MODELO.md).
   ========================================================================================== */

@font-face { font-family: "Space Grotesk"; src: url("assets/fonts/space-grotesk-variavel.woff2") format("woff2"); font-weight: 300 700; font-display: swap; }
@font-face { font-family: "IBM Plex Sans"; src: url("assets/fonts/plex-sans-400.woff2") format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "IBM Plex Sans"; src: url("assets/fonts/plex-sans-600.woff2") format("woff2"); font-weight: 600 700; font-display: swap; }
@font-face { font-family: "IBM Plex Mono"; src: url("assets/fonts/plex-mono-500.woff2") format("woff2"); font-weight: 500; font-display: swap; }

:root {
  /* Filme: o verde do exame */
  --filme: #061B16;        /* fundo das faixas filme */
  --filme-2: #0B2A22;      /* painéis dentro do filme */
  --filme-3: #020F0C;      /* o visor do aparelho */
  --filme-linha: #1E4A3D;  /* bordas finas no filme (desenho, sem texto) */
  --luz: #62E6A6;          /* a luz verde: linhas, números e botão no filme (11,4 para 1 no filme) */
  --luz-suave: #A9D8C4;    /* texto de apoio no filme (11,3 para 1) */
  /* Laudo: o papel */
  --papel: #EEF4EF;        /* fundo das faixas laudo */
  --folha: #FBFDFB;        /* as folhas e cartões */
  --tinta: #0A2620;        /* texto (14,4 para 1 no papel) */
  --suave: #3D584F;        /* texto de apoio (7,0 para 1 no papel) */
  --verde: #17603F;        /* rótulos e destaques em tinta verde (6,8 para 1 no papel) */
  --linha: #C9D9CF;        /* pautas e divisórias (desenho) */
  /* Marca */
  --petroleo: #0E5A69;     /* acento: botões no papel (7,8 para 1 com letra branca), a faixa da proteção */
  --petroleo-escuro: #0A4652;
  /* Estados (sempre com a palavra) */
  --ambar: #7A4E00;  --ambar-luz: #F2C35E;
  --vermelho: #A12A20; --vermelho-luz: #FF9C90;

  --t-titulo: "Space Grotesk", "Segoe UI", system-ui, sans-serif;
  --t-texto: "IBM Plex Sans", "Segoe UI", system-ui, -apple-system, Roboto, Arial, sans-serif;
  --t-mono: "IBM Plex Mono", ui-monospace, "Cascadia Mono", Consolas, monospace;
  --raio: 14px;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 76px; -webkit-text-size-adjust: 100%; }
body { margin: 0; font-family: var(--t-texto); font-size: 1rem; line-height: 1.6; color: var(--tinta); background: var(--papel); }
@media (min-width: 1024px) { body { font-size: 1.0625rem; } }
img { max-width: 100%; height: auto; display: block; }
h1, h2, h3 { font-family: var(--t-titulo); line-height: 1.1; margin: 0; font-weight: 700; letter-spacing: -0.015em; }
p { margin: 0 0 1em; }
a { color: inherit; }
:focus-visible { outline: 3px solid var(--petroleo); outline-offset: 3px; border-radius: 4px; }
.filme :focus-visible, .protecao :focus-visible, .topo :focus-visible, .barra-fixa :focus-visible { outline-color: var(--luz); }

.so-leitor { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.pular { position: absolute; left: 12px; top: -60px; z-index: 50; background: var(--luz); color: var(--filme); padding: 10px 16px; border-radius: 8px; font-weight: 600; }
.pular:focus { top: 12px; }

.miolo { width: min(1240px, calc(100% - 32px)); margin-inline: auto; }
@media (min-width: 1024px) { .miolo { width: min(1240px, 90%); } }

/* ---------- Faixas ---------- */
.filme {
  background-color: var(--filme);
  background-image: repeating-linear-gradient(0deg, rgba(98, 230, 166, 0.035) 0 1px, transparent 1px 4px);
  color: #E6F3EC;
  position: relative;
}
/* As marcas da borda do filme (só desenho, por pseudoelemento) */
.filme::before, .filme::after {
  content: "RX  ▸  01   02   03   04   05   06   07   08   09   10   11   12   13   14   15   16   17   18   19   20";
  position: absolute; left: 0; right: 0; height: 22px; overflow: hidden; white-space: nowrap;
  font: 500 10px/22px var(--t-mono); letter-spacing: 0.3em; color: rgba(98, 230, 166, 0.28);
  padding-left: 5%; pointer-events: none;
  border-color: rgba(98, 230, 166, 0.16);
}
.filme::before { top: 0; border-bottom: 1px solid rgba(98, 230, 166, 0.16); }
.filme::after { bottom: 0; border-top: 1px solid rgba(98, 230, 166, 0.16); }
.rodape.filme::before { display: none; }
.laudo { background: var(--papel); }

.rotulo, .rotulo-laudo {
  font: 500 0.8125rem/1.3 var(--t-mono); letter-spacing: 0.12em; text-transform: uppercase; margin: 0 0 14px;
  display: inline-flex; align-items: center; gap: 10px;
}
.rotulo { color: var(--verde); }
.rotulo::before { content: ""; width: 22px; height: 2px; background: var(--verde); }
.rotulo-laudo { color: var(--luz); }
.rotulo-laudo::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--luz); box-shadow: 0 0 0 4px rgba(98, 230, 166, 0.18); }

.titulo-secao { font-size: clamp(1.9rem, 2.6vw + 1rem, 3.25rem); margin-bottom: 18px; text-wrap: balance; }

/* ---------- Botões ---------- */
.botao {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  min-height: 48px; padding: 12px 22px; border-radius: 10px; border: 2px solid transparent;
  font: 600 1rem/1.2 var(--t-texto); text-decoration: none; cursor: pointer;
  transition: transform .15s ease, background-color .15s ease, box-shadow .15s ease;
}
.botao svg { flex: none; }
.botao-luz { background: var(--luz); color: var(--filme); box-shadow: 0 0 0 0 rgba(98, 230, 166, 0); }
.botao-luz:hover { background: #8AF0BE; box-shadow: 0 0 0 6px rgba(98, 230, 166, 0.16); }
.botao-petroleo { background: var(--petroleo); color: #FFFFFF; }
.botao-petroleo:hover { background: var(--petroleo-escuro); }
.botao:active { transform: translateY(1px); }
.botao-grande { min-height: 56px; padding: 14px 26px; font-size: 1.0625rem; }
.botao-largo { width: 100%; }
.botao-mini {
  display: inline-flex; align-items: center; gap: 6px; min-height: 36px; padding: 6px 12px; border-radius: 8px;
  border: 1.5px solid var(--luz); background: transparent; color: var(--luz); font: 600 0.875rem var(--t-texto); cursor: pointer;
}
.botao-mini:hover { background: rgba(98, 230, 166, 0.12); }
.link-luz { color: var(--luz); font-weight: 600; text-underline-offset: 4px; text-decoration-thickness: 1.5px; }

/* ---------- 1. Topo ---------- */
.topo { position: sticky; top: 0; z-index: 30; background: var(--filme); border-bottom: 1px solid var(--filme-linha); color: #E6F3EC; }
.topo-miolo { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 64px; }
.marca { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; font: 700 1.125rem/1 var(--t-titulo); letter-spacing: -0.01em; }
.marca-simbolo { box-shadow: 0 0 0 1px rgba(98, 230, 166, 0.35); border-radius: 8px; }
.topo-acoes { display: flex; align-items: center; gap: 18px; }
.link-assinante { display: none; color: var(--luz-suave); font-size: 0.9375rem; text-underline-offset: 3px; }
.botao-topo { min-height: 44px; padding: 8px 16px; font-size: 0.9375rem; }
.topo-preco { display: none; }
@media (min-width: 420px) { .topo-preco { display: inline; } }
@media (min-width: 760px) { .link-assinante { display: inline; } }

/* ---------- 2. Abertura ---------- */
.abertura { padding: 36px 0 56px; overflow: hidden; }
.abertura-miolo { display: grid; gap: 22px; }
.titulo-abertura { font-size: clamp(2.15rem, 5.2vw + 0.6rem, 4.6rem); line-height: 1.02; letter-spacing: -0.03em; color: #F2FAF5; text-wrap: balance; }
.abertura-texto .rotulo-laudo { margin-bottom: 14px; }
.subtitulo { font-size: 1.0625rem; color: var(--luz-suave); max-width: 40em; }
.abertura-botoes { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 24px; margin: 22px 0 22px; }
.selos { list-style: none; margin: 0 0 20px; padding: 0; display: grid; gap: 6px; }
.selos li { display: flex; align-items: center; gap: 10px; font-size: 0.9375rem; color: #DCEFE5; }
.selos li::before { content: ""; flex: none; width: 14px; height: 8px; border-left: 2px solid var(--luz); border-bottom: 2px solid var(--luz); transform: rotate(-45deg) translateY(-2px); }
.aviso-cnpq { display: flex; gap: 10px; align-items: flex-start; margin: 0; padding: 12px 14px; border-left: 3px solid var(--ambar-luz); background: var(--filme-2); border-radius: 0 8px 8px 0; color: #E6F3EC; font-size: 0.9375rem; max-width: 40em; }
.aviso-cnpq svg { color: var(--ambar-luz); flex: none; margin-top: 2px; }
.aviso-cnpq b { color: #FFF6DE; }

@media (min-width: 1024px) {
  .abertura { padding: 64px 0 88px; }
  .abertura-miolo { grid-template-columns: minmax(0, 1.08fr) minmax(0, 0.92fr); grid-template-areas: "texto aparelho" "chamada aparelho"; column-gap: 56px; row-gap: 0; align-items: start; }
  .abertura-texto { grid-area: texto; }
  .aparelho { grid-area: aparelho; align-self: center; }
  .abertura-chamada { grid-area: chamada; padding-top: 22px; }
}

/* O aparelho */
.aparelho { margin: 0; background: var(--filme-3); border: 1px solid var(--filme-linha); border-radius: 18px; padding: 10px; box-shadow: 0 30px 60px -30px rgba(0, 0, 0, 0.8), 0 0 0 6px rgba(98, 230, 166, 0.05); }
.aparelho-cabeca { display: flex; justify-content: space-between; gap: 8px; font: 500 10px/1 var(--t-mono); letter-spacing: 0.14em; text-transform: uppercase; color: var(--luz-suave); padding: 4px 6px 10px; }
.aparelho-ok { color: var(--luz); }
.visor { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 12px; align-items: center; padding: 12px; border-radius: 12px; background: radial-gradient(120% 90% at 30% 40%, #0B2E25 0%, #041410 70%); overflow: hidden; }
.visor-folha { position: relative; aspect-ratio: 0.74; width: 100%; }
.cv { position: absolute; inset: 0; border-radius: 6px; padding: 9% 9%; display: flex; flex-direction: column; gap: 6%; overflow: hidden; }
.cv-papel { background: #F4F2EA; box-shadow: 0 10px 22px rgba(0, 0, 0, 0.45); animation: entra 0.55s cubic-bezier(.2,.7,.2,1) both; }
.cv-chapa { background: #071E18; border: 1px solid rgba(98, 230, 166, 0.35); box-shadow: 0 0 24px rgba(98, 230, 166, 0.18) inset; clip-path: inset(0 0 100% 0); animation: revela 0.7s 0.5s linear forwards; }
.cv-cabeca, .cv-bloco { display: flex; flex-direction: column; gap: 4px; }
.cv b { font: 700 clamp(9px, 1.05vw, 13px)/1.1 var(--t-titulo); }
.cv em { font: 500 clamp(6px, 0.62vw, 8px)/1 var(--t-mono); font-style: normal; text-transform: uppercase; letter-spacing: 0.12em; }
.cv i { display: block; height: 3px; border-radius: 2px; width: 92%; }
.cv i.media { width: 66%; } .cv i.curta { width: 42%; }
.cv-papel b { color: #1B2B26; } .cv-papel em { color: #4C5F58; } .cv-papel i { background: #C9CFC8; }
.cv-chapa b { color: #CFF6E2; } .cv-chapa em { color: rgba(98, 230, 166, 0.75); } .cv-chapa i { background: rgba(98, 230, 166, 0.18); }
.cv-teia { position: absolute; left: 8%; top: 22%; width: 84%; height: auto; overflow: visible; }
.teia-grade { fill: none; stroke: rgba(98, 230, 166, 0.28); stroke-width: 1; }
.teia-dado { fill: rgba(98, 230, 166, 0.22); stroke: var(--luz); stroke-width: 2.5; stroke-linejoin: round; stroke-dasharray: 100; stroke-dashoffset: 100; animation: desenha 0.6s 1.05s ease-out forwards; filter: drop-shadow(0 0 4px rgba(98, 230, 166, 0.7)); }
.teia-pontos circle { fill: var(--luz); opacity: 0; animation: aparece 0.3s 1.5s forwards; }
.cv-achado { position: absolute; left: 8%; right: 8%; bottom: 5%; margin: 0; padding: 4px 6px; border: 1px dashed rgba(242, 195, 94, 0.7); border-radius: 4px; font: 600 clamp(8px, 0.95vw, 12px)/1.2 var(--t-texto); color: var(--ambar-luz); text-align: center; opacity: 0; animation: aparece 0.3s 1.75s forwards; }
.raio { position: absolute; left: -6%; right: -6%; top: 0; height: 3px; background: var(--luz); box-shadow: 0 0 12px 3px rgba(98, 230, 166, 0.75), 0 0 36px 8px rgba(98, 230, 166, 0.25); opacity: 0; animation: varre 0.7s 0.5s linear forwards; }
.visor-numeros { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.visor-numeros li { opacity: 0; animation: sobe 0.4s ease-out forwards; border-left: 2px solid var(--luz); padding: 2px 0 2px 10px; }
.visor-numeros li:nth-child(1) { animation-delay: 1.3s; } .visor-numeros li:nth-child(2) { animation-delay: 1.45s; } .visor-numeros li:nth-child(3) { animation-delay: 1.6s; }
.visor-numeros b { display: block; font: 700 clamp(1.6rem, 3vw, 2.6rem)/1 var(--t-titulo); color: var(--luz); font-variant-numeric: tabular-nums; letter-spacing: -0.02em; }
.visor-numeros small { font-size: 0.5em; color: var(--luz-suave); font-weight: 600; }
.visor-numeros span { display: block; font-size: 0.8125rem; line-height: 1.3; color: #DCEFE5; margin-top: 4px; }
.aparelho-legenda { font: 500 0.75rem/1.4 var(--t-mono); color: var(--luz-suave); padding: 10px 6px 2px; }

@keyframes entra { from { transform: translateX(-125%) rotate(-4deg); } to { transform: none; } }
@keyframes revela { from { clip-path: inset(0 0 100% 0); } to { clip-path: inset(0 0 0 0); } }
@keyframes varre { 0% { top: 0; opacity: 1; } 92% { opacity: 1; } 100% { top: 100%; opacity: 0; } }
@keyframes desenha { to { stroke-dashoffset: 0; } }
@keyframes aparece { to { opacity: 1; } }
@keyframes sobe { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }

@media (max-width: 599px) {
  .aparelho-cabeca span:nth-child(2) { display: none; }
  .cv-bloco:last-of-type { display: none; }
  .cv-achado { bottom: 4%; padding: 2px 4px; }
}
@media (max-width: 1023px) {
  .aparelho-legenda { display: none; }
  .visor { grid-template-columns: 0.9fr 1.1fr; }
  .visor-folha { max-height: 230px; justify-self: center; width: auto; height: 100%; }
}
@media (max-width: 1023px) and (min-width: 600px) { .visor-folha { max-height: 300px; } .aparelho-legenda { display: block; } }

/* ---------- 3. Dor ---------- */
.dor { padding: 72px 0 40px; }
.dor-miolo { display: grid; gap: 32px; }
.dor-paragrafos p { color: var(--suave); max-width: 36em; }
.dor-paragrafos b { color: var(--tinta); }
.anamnese { background: var(--folha); border: 1px solid var(--linha); border-radius: var(--raio); box-shadow: 0 18px 40px -28px rgba(10, 38, 32, 0.45); overflow: hidden; }
.anamnese-cabeca { display: flex; justify-content: space-between; gap: 12px; margin: 0; padding: 12px 18px; background: var(--tinta); color: #E6F3EC; font: 500 0.75rem/1.3 var(--t-mono); letter-spacing: 0.12em; text-transform: uppercase; }
.anamnese-cabeca span:first-child { color: var(--luz); }
.anamnese dl { margin: 0; }
.anamnese dl > div { display: grid; grid-template-columns: 1fr; gap: 2px; padding: 11px 18px; border-bottom: 1px dashed var(--linha); }
.anamnese dt { font: 500 0.75rem/1.3 var(--t-mono); letter-spacing: 0.08em; text-transform: uppercase; color: var(--suave); }
.anamnese dd { margin: 0; font-weight: 600; font-size: 1.0625rem; }
.anamnese-ponte { margin: 0; padding: 14px 18px; background: #E3EEE7; }
.anamnese-ponte a { color: var(--verde); font-weight: 600; text-underline-offset: 3px; }
@media (min-width: 640px) { .anamnese dl > div { grid-template-columns: 11em 1fr; gap: 16px; align-items: baseline; } }
@media (min-width: 1024px) { .dor { padding: 104px 0 56px; } .dor-miolo { grid-template-columns: 1.05fr 0.95fr; gap: 64px; align-items: start; } .anamnese { position: sticky; top: 100px; margin-top: 8px; } }

/* ---------- 4. Antes e depois: cada linha é um achado ---------- */
.achado { padding: 40px 0 88px; }
.achado-cabeca { max-width: 40em; margin-bottom: 24px; }
.achados { list-style: none; margin: 0; padding: 0; counter-reset: achado; background: var(--folha); border: 1px solid var(--linha); border-radius: var(--raio); overflow: hidden; box-shadow: 0 18px 40px -28px rgba(10, 38, 32, 0.45); }
.achados li { counter-increment: achado; display: grid; grid-template-columns: 1fr; border-bottom: 1px solid var(--linha); position: relative; }
.achados li:last-child { border-bottom: 0; }
.achados p { margin: 0; padding: 14px 18px 14px 52px; position: relative; }
.achados li::before { content: counter(achado, decimal-leading-zero); position: absolute; left: 16px; top: 15px; font: 500 0.8125rem var(--t-mono); color: var(--suave); z-index: 1; }
.achados .antes { color: var(--suave); }
.achados .depois { background: #E8F3EC; color: var(--tinta); font-weight: 600; }
.marca-ad { display: block; font: 500 0.6875rem/1.4 var(--t-mono); letter-spacing: 0.12em; text-transform: uppercase; margin-bottom: 2px; }
.antes .marca-ad { color: var(--vermelho); }
.depois .marca-ad { color: var(--verde); }
@media (min-width: 820px) {
  .achados li { grid-template-columns: 1fr 1fr; }
  .achados .depois { padding-left: 22px; border-left: 2px dashed #B7CDBF; }
}
@media (min-width: 1024px) { .achado { padding: 56px 0 120px; } .achados p { padding-top: 18px; padding-bottom: 18px; } .achados li::before { top: 19px; } }

/* ---------- 5. Os casos (demonstração) ---------- */
.exame { padding: 72px 0 72px; }
.exame-cabeca { max-width: 46em; }
.exame-cabeca .titulo-secao { color: #F2FAF5; }
.exame-cabeca p:last-child { color: var(--luz-suave); }
.perfis { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 24px 0 14px; }
.perfil { text-align: left; display: flex; flex-direction: column; gap: 2px; padding: 12px; min-height: 48px; border-radius: 12px; background: var(--filme-2); border: 1.5px solid var(--filme-linha); color: #E6F3EC; font: inherit; cursor: pointer; transition: border-color .2s, background-color .2s, box-shadow .2s; }
.perfil b { font: 700 1rem/1.2 var(--t-titulo); }
.perfil span { font-size: 0.8125rem; line-height: 1.35; color: var(--luz-suave); }
.perfil:hover { border-color: rgba(98, 230, 166, 0.6); }
.perfil[aria-pressed="true"] { border-color: var(--luz); background: #0F3A2E; box-shadow: 0 0 0 4px rgba(98, 230, 166, 0.14), 0 0 22px rgba(98, 230, 166, 0.18); }
.perfil[aria-pressed="true"] b { color: var(--luz); }
@media (max-width: 559px) { .perfis { grid-template-columns: 1fr; gap: 6px; } .perfil { flex-direction: row; align-items: baseline; justify-content: space-between; gap: 10px; padding: 10px 14px; } .perfil span { text-align: right; } }
@media (min-width: 720px) { .perfil { padding: 14px 18px; } .perfil b { font-size: 1.125rem; } .perfil span { font-size: 0.875rem; } }
.exame-honesto { display: flex; gap: 10px; align-items: flex-start; margin: 0 0 16px; font-size: 0.875rem; color: var(--luz-suave); max-width: 60em; }
.exame-honesto svg { color: var(--luz); flex: none; margin-top: 2px; }
.sozinha { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; margin: 0 0 14px; font-size: 0.9375rem; color: var(--luz-suave); }
.sozinha[hidden] { display: none; }
.sozinha-ponto { width: 10px; height: 10px; border-radius: 50%; background: var(--luz); animation: pulsa 1s ease-in-out infinite alternate; }
@keyframes pulsa { from { opacity: 0.35; } to { opacity: 1; } }

.exame-corpo { display: grid; gap: 16px; }
.exame-corpo.trocou > * { animation: troca 0.45s ease-out; }
@keyframes troca { from { opacity: 0.25; transform: translateY(6px); } to { opacity: 1; transform: none; } }
.negatoscopio { background: var(--filme-3); border: 1px solid var(--filme-linha); border-radius: 16px; padding: 18px; display: grid; gap: 20px; align-content: start; box-shadow: 0 0 60px -20px rgba(98, 230, 166, 0.25) inset; }
.caso-quem { margin: 0; display: grid; gap: 4px; font-size: 0.875rem; color: var(--luz-suave); padding-bottom: 14px; border-bottom: 1px solid var(--filme-linha); }
.caso-quem b { font: 700 1.0625rem/1.3 var(--t-titulo); color: #F2FAF5; }
.caso-quem span:nth-of-type(1) { color: var(--luz); font: 500 0.8125rem/1.4 var(--t-mono); letter-spacing: 0.04em; }
.chapa-titulo { font: 600 1rem/1.3 var(--t-texto); letter-spacing: 0; color: #F2FAF5; margin-bottom: 10px; display: flex; flex-wrap: wrap; gap: 2px 10px; align-items: baseline; }
.chapa-titulo span { font: 500 0.75rem var(--t-mono); color: var(--luz-suave); letter-spacing: 0.04em; }
.teia-e-leitura { display: grid; gap: 10px; align-items: center; }
.teia { width: 100%; max-width: 380px; height: auto; justify-self: center; overflow: visible; }
.teia .grade { fill: none; stroke: rgba(98, 230, 166, 0.26); stroke-width: 1; }
.teia-dado-demo { fill: rgba(98, 230, 166, 0.2); stroke: var(--luz); stroke-width: 2.5; stroke-linejoin: round; filter: drop-shadow(0 0 5px rgba(98, 230, 166, 0.6)); transform-origin: 100px 100px; }
.trocou .teia-dado-demo { animation: abre 0.6s ease-out; }
@keyframes abre { from { transform: scale(0.2); opacity: 0; } to { transform: none; opacity: 1; } }
.teia .ponto { fill: var(--luz); }
.teia text { font-family: var(--t-texto); font-size: 11px; fill: #DCEFE5; }
.teia text .n { fill: var(--luz); font-weight: 600; }
.leitura-teia { margin: 0; font-size: 0.875rem; color: #DCEFE5; padding: 10px 12px; border-radius: 8px; background: var(--filme-2); border-left: 3px solid var(--luz); }
.anos { list-style: none; margin: 0; padding: 0; display: grid; gap: 5px; }
.anos li { display: grid; grid-template-columns: 3.2em 1fr; gap: 10px; align-items: center; font: 500 0.75rem/1 var(--t-mono); color: var(--luz-suave); }
.anos .barra { display: flex; align-items: center; gap: 8px; min-height: 18px; }
.anos .barra i { display: block; height: 12px; border-radius: 3px; background: var(--luz); box-shadow: 0 0 8px rgba(98, 230, 166, 0.45); width: var(--w, 0%); }
.trocou .anos .barra i { animation: cresce 0.5s ease-out; transform-origin: left; }
@keyframes cresce { from { transform: scaleX(0); } to { transform: none; } }
.anos .barra b { color: #F2FAF5; font-weight: 500; }
.anos .vazio .barra span { color: var(--ambar-luz); font: 600 0.8125rem/1.3 var(--t-texto); border: 1px dashed rgba(242, 195, 94, 0.6); border-radius: 4px; padding: 2px 8px; }
.sem-teia { padding: 14px; border: 1px dashed rgba(98, 230, 166, 0.4); border-radius: 12px; }
.sem-teia p { margin: 0; color: #DCEFE5; font-size: 0.9375rem; }
.primeiro-abertura, .primeiro-outras { font-size: 0.875rem; color: var(--luz-suave); margin: 0 0 10px; }
.primeiro-outras { margin: 10px 0 0; }
.respostas { margin: 0; display: grid; gap: 8px; }
.respostas div { background: var(--filme-2); border-radius: 10px; padding: 10px 12px; border-left: 3px solid var(--luz); }
.respostas dt { font: 500 0.75rem/1.3 var(--t-mono); color: var(--luz); letter-spacing: 0.04em; margin-bottom: 4px; }
.respostas dd { margin: 0; color: #F2FAF5; font-size: 0.9375rem; }

.laudo-folha { background: var(--folha); color: var(--tinta); border-radius: 16px; padding: 18px; box-shadow: 0 20px 50px -20px rgba(0, 0, 0, 0.6); display: grid; gap: 18px; align-content: start; }
.laudo-cabeca { display: flex; flex-wrap: wrap; gap: 4px 16px; margin: -18px -18px 0; padding: 12px 18px; border-radius: 16px 16px 0 0; background: #E3EEE7; font: 500 0.75rem/1.4 var(--t-mono); letter-spacing: 0.08em; text-transform: uppercase; color: var(--suave); border-bottom: 1px solid var(--linha); }
.laudo-cabeca span:first-child { color: var(--verde); }
.laudo-cabeca span:nth-child(2) { color: var(--tinta); }
.laudo-bloco + .laudo-bloco { border-top: 1px dashed var(--linha); padding-top: 16px; }
.laudo-sub { font: 700 1.0625rem/1.3 var(--t-titulo); letter-spacing: -0.005em; margin: 0 0 8px; }
.capa-titulo { margin: -2px 0 8px; font-size: 0.875rem; color: var(--suave); }
.capa { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border: 1px solid var(--linha); border-radius: 10px; overflow: hidden; }
.capa li { padding: 10px; border-right: 1px solid var(--linha); border-bottom: 1px solid var(--linha); }
.capa li:nth-child(3n) { border-right: 0; }
.capa li:nth-last-child(-n+3) { border-bottom: 0; }
.capa b { display: block; font: 700 clamp(1.4rem, 2.2vw, 1.9rem)/1 var(--t-titulo); color: var(--petroleo); font-variant-numeric: tabular-nums; }
.capa b small { font-size: 0.55em; }
.capa span { display: block; font-size: 0.8125rem; line-height: 1.3; margin-top: 4px; }
.capa li > small { display: block; font-size: 0.75rem; color: var(--suave); line-height: 1.3; }
.bloco-nota { font-size: 0.875rem; color: var(--suave); margin: 0 0 10px; }
.bloco-nota:last-child { margin: 10px 0 0; }
.matriz { display: grid; grid-template-columns: 1fr; gap: 8px; }
.caixa { border: 1px solid var(--linha); border-top: 4px solid var(--cor); border-radius: 10px; padding: 10px 12px; }
.caixa h4 { margin: 0 0 4px; display: flex; align-items: center; gap: 6px; font: 700 0.9375rem/1.2 var(--t-titulo); color: var(--cor); }
.caixa p { margin: 0 0 4px; font-size: 0.875rem; line-height: 1.45; }
.caixa .viu { font-weight: 600; }
.caixa .no-curriculo { color: var(--suave); font-size: 0.8125rem; border-left: 2px solid var(--linha); padding-left: 8px; }
.caixa .acao b { color: var(--petroleo); }
.caixa.forcas { --cor: var(--verde); } .caixa.fraquezas { --cor: var(--vermelho); }
.caixa.oportunidades { --cor: var(--petroleo); } .caixa.ameacas { --cor: var(--ambar); }
@media (min-width: 560px) { .matriz { grid-template-columns: 1fr 1fr; } }
.edital-tabela { width: 100%; border-collapse: collapse; font-size: 0.875rem; }
.edital-tabela th { text-align: left; font: 500 0.6875rem/1.3 var(--t-mono); letter-spacing: 0.06em; text-transform: uppercase; color: var(--suave); padding: 0 6px 6px 0; border-bottom: 1px solid var(--linha); }
.edital-tabela th:not(:first-child), .edital-tabela td:not(:first-child) { text-align: right; white-space: nowrap; }
.edital-tabela th:last-child, .edital-tabela td:last-child { padding-right: 0; }
.edital-tabela td { padding: 8px 6px 8px 0; border-bottom: 1px solid var(--linha); vertical-align: top; line-height: 1.4; font-weight: 600; }
.edital-tabela td:not(:first-child) { font-variant-numeric: tabular-nums; }
.edital-tabela td small { display: block; color: var(--suave); font-size: 0.75rem; font-weight: 400; margin-top: 2px; }
.edital-total { margin: 12px 0 8px; display: grid; gap: 4px; }
.edital-total b { font: 700 clamp(2rem, 3.4vw, 2.6rem)/1 var(--t-titulo); color: var(--petroleo); letter-spacing: -0.02em; }
.edital-total span { color: var(--suave); font-size: 0.875rem; }
.edital-extras, .lista-laudo { margin: 0; padding: 0; list-style: none; display: grid; gap: 6px; font-size: 0.875rem; }
.edital-extras li, .lista-laudo li { padding-left: 14px; position: relative; }
.edital-extras li::before, .lista-laudo li::before { content: ""; position: absolute; left: 0; top: 0.55em; width: 6px; height: 6px; background: var(--petroleo); border-radius: 1px; }
.lugar { border: 1px solid var(--linha); border-top: 4px solid var(--petroleo); border-radius: 10px; padding: 10px 12px; }
.lugar + .lugar { margin-top: 8px; }
.lugar-secao { margin: 0 0 8px; display: grid; font-size: 0.9375rem; }
.lugar-secao span { font-size: 0.8125rem; color: var(--suave); }
.campos { margin: 0; display: grid; gap: 4px; }
.campos div { display: grid; grid-template-columns: 9em 1fr; gap: 8px; padding: 6px 8px; border-radius: 6px; background: #EEF3EF; font-size: 0.8125rem; }
.campos dt { color: var(--suave); }
.campos dd { margin: 0; font-weight: 600; }
.campos .falta { background: transparent; border: 1px dashed #B8913F; }
.campos .falta dd { color: var(--ambar); }
.lugar-texto { font-size: 0.875rem; margin: 0 0 6px; }
.lugar-nota { font-size: 0.8125rem; color: var(--suave); margin: 8px 0 0; }
.lista-falta { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.lista-falta li { display: grid; gap: 4px; padding: 8px 10px; border: 1px solid var(--linha); border-radius: 8px; font-size: 0.875rem; }
.lista-falta b { font-size: 0.8125rem; justify-self: start; padding: 2px 8px; border-radius: 999px; background: #EEF3EF; }
.lista-falta .selo-sim { color: var(--verde); border: 1px solid var(--verde); }
.lista-falta .selo-nao { color: var(--suave); border: 1px solid var(--suave); }
@media (min-width: 560px) { .lista-falta li { grid-template-columns: 1fr auto; align-items: center; } }
.lista-gaveta { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.lista-gaveta li { display: grid; grid-template-columns: 6em 1fr; gap: 8px; font-size: 0.875rem; padding: 6px 0; border-bottom: 1px dashed var(--linha); }
.lista-gaveta b { font: 500 0.75rem/1.6 var(--t-mono); color: var(--verde); text-transform: uppercase; letter-spacing: 0.06em; }
.aviso-gaveta { margin: 10px 0 0; padding: 8px 10px; border-left: 3px solid var(--ambar); background: #FBF4E6; font-size: 0.8125rem; font-weight: 600; border-radius: 0 6px 6px 0; }
.exame-depois { margin: 20px 0 0; color: var(--luz-suave); max-width: 52em; }
@media (min-width: 1024px) {
  .exame { padding: 104px 0 96px; }
  .exame-corpo { grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr); gap: 20px; align-items: start; }
  .negatoscopio { padding: 24px; position: sticky; top: 84px; }
  .laudo-folha { padding: 24px; }
  .laudo-cabeca { margin: -24px -24px 0; padding: 12px 24px; }
}

/* Lugar pronto para o vídeo */
.video { padding: 0 0 56px; }
.video-moldura { aspect-ratio: 16 / 9; border-radius: var(--raio); background: var(--filme); }

/* ---------- 6. Compra no meio ---------- */
.compra-meio { padding: 40px 0; border-bottom: 1px solid var(--linha); }
.compra-meio-miolo { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px 32px; }
.compra-frase { margin: 0; font: 600 clamp(1.15rem, 1vw + 0.9rem, 1.5rem)/1.35 var(--t-titulo); max-width: 22em; }
.compra-acao { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; }
.compra-preco { margin: 0; display: flex; align-items: baseline; gap: 6px; }
.compra-preco b { font: 700 2.25rem/1 var(--t-titulo); color: var(--petroleo); letter-spacing: -0.02em; }
.compra-preco span { color: var(--suave); font-weight: 600; }

/* ---------- 7. Técnica do exame (como funciona) ---------- */
.tecnica { padding: 72px 0 80px; }
.tecnica-cabeca { max-width: 44em; margin-bottom: 28px; }
.tecnica-cabeca p:last-child { color: var(--suave); }
.telas { display: grid; gap: 28px; }
.tela-texto h3 { font-size: 1.375rem; margin-bottom: 8px; display: flex; gap: 10px; align-items: baseline; }
.tela-texto p { color: var(--suave); max-width: 36em; }
.aba-n { font: 500 0.8125rem var(--t-mono); color: var(--verde); letter-spacing: 0.06em; }
.tela-chapa { margin: 0; padding: 10px; border-radius: 16px; background: var(--filme); border: 1px solid var(--filme-linha); box-shadow: 0 0 0 6px rgba(14, 90, 105, 0.08), 0 24px 50px -28px rgba(6, 27, 22, 0.8); position: relative; }
.tela-chapa::before { content: ""; position: absolute; top: -7px; left: 50%; width: 64px; height: 12px; margin-left: -32px; border-radius: 4px; background: #9FB3A9; box-shadow: inset 0 -2px 0 rgba(0, 0, 0, 0.2); }
.tela-chapa picture { display: block; }
.tela-chapa img { border-radius: 9px; width: 100%; background: #F6F6F8; }
.abas[hidden] { display: none; }
.js .abas { display: flex; gap: 6px; overflow-x: auto; padding: 4px 2px 10px; margin: 0 -2px 14px; scroll-snap-type: x proximity; scrollbar-width: thin; }
.js .abas button { scroll-snap-align: start; flex: none; display: inline-flex; align-items: baseline; gap: 8px; min-height: 44px; padding: 10px 14px; border-radius: 10px; border: 1.5px solid var(--linha); background: var(--folha); color: var(--tinta); font: 600 0.9375rem/1.2 var(--t-texto); cursor: pointer; text-align: left; }
.js .abas button:hover { border-color: var(--verde); }
.js .abas button[aria-selected="true"] { background: var(--tinta); border-color: var(--tinta); color: #F2FAF5; }
.js .abas button[aria-selected="true"] .aba-n { color: var(--luz); }
.js .tela[hidden] { display: none; }
.js .tela { display: grid; gap: 16px; }
.js .tela-texto h3 .aba-n { display: none; }
.tecnica-botao { margin: 32px 0 0; }
@media (min-width: 1024px) {
  .tecnica { padding: 112px 0 112px; }
  .js .tecnica-corpo { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 40px; align-items: start; }
  .js .abas { flex-direction: column; overflow: visible; margin: 0; padding: 0; position: sticky; top: 96px; }
  .js .abas button { width: 100%; padding: 12px 16px; }
  .js .tela { grid-template-columns: 1fr; }
  .telas { gap: 48px; }
  .tela:not([role]) { grid-template-columns: 1fr 1.6fr; }
}

/* ---------- 8. Conclusão do laudo (benefícios) ---------- */
.conclusao { padding: 0 0 88px; }
.conclusao-folha { background: var(--folha); border: 1px solid var(--linha); border-radius: 18px; padding: 0 20px 24px; box-shadow: 0 18px 40px -28px rgba(10, 38, 32, 0.45); }
.conclusao-cabeca { display: flex; justify-content: space-between; gap: 12px; margin: 0 -20px 24px; padding: 12px 20px; border-radius: 18px 18px 0 0; background: var(--tinta); color: var(--luz); font: 500 0.75rem/1.3 var(--t-mono); letter-spacing: 0.12em; text-transform: uppercase; }
.conclusao-cabeca span:last-child { color: #E6F3EC; }
.conclusoes { list-style: none; margin: 0; padding: 0; counter-reset: conc; display: grid; gap: 0; }
.conclusoes li { counter-increment: conc; padding: 16px 0 16px 48px; border-top: 1px solid var(--linha); position: relative; }
.conclusoes li::before { content: counter(conc, decimal-leading-zero); position: absolute; left: 0; top: 16px; font: 700 1.5rem/1 var(--t-titulo); color: var(--petroleo); }
.conclusoes h3 { font-size: 1.1875rem; margin-bottom: 6px; }
.conclusoes p { margin: 0; color: var(--suave); }
@media (min-width: 900px) {
  .conclusao-folha { padding: 0 48px 40px; }
  .conclusao-cabeca { margin: 0 -48px 32px; padding: 12px 48px; }
  .conclusoes { grid-template-columns: 1fr 1fr; column-gap: 48px; }
}
@media (min-width: 1024px) { .conclusao { padding: 0 0 120px; } }

/* ---------- 9. Proteção (privacidade). Faixa petróleo ---------- */
.protecao { background: var(--petroleo); color: #F2FAF5; padding: 72px 0; position: relative; overflow: hidden; }
.protecao::before { content: ""; position: absolute; inset: 0; background: repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.04) 0 1px, transparent 1px 48px); pointer-events: none; }
.protecao-miolo { position: relative; display: grid; gap: 32px; }
.protecao .rotulo-laudo { color: #DFF9EC; }
.protecao-texto p { color: #E3F1EF; max-width: 36em; }
.protecao-desenho { background: rgba(2, 15, 12, 0.32); border: 1px solid rgba(255, 255, 255, 0.22); border-radius: var(--raio); padding: 18px; }
.aparelho-dentro { border: 2px dashed rgba(223, 249, 236, 0.6); border-radius: 12px; padding: 14px; margin-bottom: 14px; }
.desenho-rotulo { display: flex; align-items: center; gap: 8px; margin: 0 0 10px; font: 500 0.75rem/1.3 var(--t-mono); letter-spacing: 0.1em; text-transform: uppercase; color: #DFF9EC; }
.desenho-rotulo svg { color: var(--luz); }
.aparelho-dentro ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.aparelho-dentro li { background: rgba(255, 255, 255, 0.1); border-radius: 6px; padding: 6px 10px; font-size: 0.875rem; font-weight: 600; }
.saidas { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.saidas li { display: grid; grid-template-columns: 5.6em 1fr; gap: 10px; align-items: start; font-size: 0.875rem; color: #E3F1EF; padding: 8px 0; border-top: 1px solid rgba(255, 255, 255, 0.16); }
.saida-estado { font: 500 0.6875rem/1.6 var(--t-mono); letter-spacing: 0.1em; text-transform: uppercase; text-align: center; border-radius: 4px; padding: 1px 4px; }
.aberta .saida-estado { background: var(--luz); color: var(--filme); }
.fechada .saida-estado { border: 1.5px solid #FFC9C2; color: #FFE3DF; }
.fechada b { text-decoration: line-through 2px; color: #FFE3DF; }
.saidas b { color: #FFFFFF; }
.protecao-destaque { margin: 14px 0 0; padding: 12px 14px; border-left: 3px solid var(--luz); background: rgba(2, 15, 12, 0.32); border-radius: 0 8px 8px 0; font-weight: 600; font-size: 0.9375rem; }
.protecao-pratica h3 { font-size: 1.25rem; margin-bottom: 10px; color: #FFFFFF; }
.protecao-pratica p { color: #E3F1EF; }
@media (min-width: 1024px) {
  .protecao { padding: 104px 0; }
  .protecao-miolo { grid-template-columns: 1fr 1fr; column-gap: 64px; row-gap: 24px; align-items: start; }
  .protecao-pratica { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 2fr; gap: 64px; border-top: 1px solid rgba(255, 255, 255, 0.2); padding-top: 28px; }
  .protecao-pratica > div { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; }
}

/* ---------- 10. Oferta ---------- */
.oferta { padding: 80px 0 88px; }
.oferta-cabeca { max-width: 40em; margin-bottom: 28px; }
.requisicao { display: grid; background: var(--folha); border: 1px solid var(--linha); border-radius: 18px; overflow: hidden; box-shadow: 0 30px 60px -36px rgba(10, 38, 32, 0.55); }
.requisicao-preco { padding: 26px 22px; background: var(--folha); position: relative; border-bottom: 2px dashed var(--linha); }
.requisicao-preco::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 6px; background: linear-gradient(90deg, var(--petroleo) 0 60%, var(--luz) 60% 100%); }
.requisicao-nome { font: 500 0.8125rem/1.3 var(--t-mono); letter-spacing: 0.1em; text-transform: uppercase; color: var(--verde); margin-bottom: 10px; }
.preco { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 12px; margin: 0 0 6px; }
.preco-valor { font: 700 clamp(4rem, 9vw, 6.25rem)/0.95 var(--t-titulo); letter-spacing: -0.04em; color: var(--tinta); font-variant-numeric: tabular-nums; }
.preco-periodo { font: 600 1.25rem var(--t-titulo); color: var(--suave); }
.preco-dia { font-size: 1rem; color: var(--suave); margin-bottom: 20px; }
.preco-dia span { color: var(--verde); font-weight: 600; }
.preco-extra { font-size: 0.9375rem; color: var(--suave); }
.sob-botao { font-size: 0.875rem; color: var(--suave); margin: 12px 0 14px; }
.uso-justo { font-size: 0.8125rem; color: var(--suave); border-top: 1px solid var(--linha); padding-top: 12px; margin: 0; }
.requisicao-itens { padding: 26px 22px; }
.requisicao-itens h3 { font-size: 1.25rem; margin-bottom: 14px; }
.requisicao-itens ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.requisicao-itens li { display: grid; grid-template-columns: 22px 1fr; gap: 10px; font-size: 0.9375rem; line-height: 1.45; }
.requisicao-itens li svg { color: var(--verde); margin-top: 1px; }
@media (min-width: 900px) {
  .requisicao { grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr); }
  .requisicao-preco { border-bottom: 0; border-right: 2px dashed var(--linha); padding: 40px 40px; }
  .requisicao-itens { padding: 40px 40px; }
  .requisicao-itens ul { grid-template-columns: 1fr; }
}
@media (min-width: 1024px) { .oferta { padding: 112px 0 120px; } }

/* ---------- 11. Quem criou ---------- */
.quem { padding: 72px 0; border-top: 1px solid var(--linha); }
.quem-miolo { display: grid; gap: 28px; }
.quem-foto { margin: 0; max-width: 260px; }
.quem-foto img { border-radius: var(--raio); filter: saturate(0.92); box-shadow: 0 0 0 6px var(--folha), 0 0 0 7px var(--linha); }
.numeros { list-style: none; margin: 4px 0 20px; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 12px 20px; }
.numeros b { display: block; font: 700 1.75rem/1 var(--t-titulo); color: var(--petroleo); }
.numeros span { font-size: 0.875rem; color: var(--suave); line-height: 1.35; display: block; margin-top: 4px; }
.quem p:last-child { color: var(--suave); max-width: 44em; }
@media (min-width: 900px) { .quem-miolo { grid-template-columns: 300px 1fr; gap: 56px; align-items: center; } .quem-foto { max-width: none; } .numeros { grid-template-columns: repeat(4, 1fr); } }

/* ---------- 12. Perguntas ---------- */
.duvidas { padding: 72px 0 88px; background: #E4EDE7; }
.duvidas-miolo { max-width: 860px; }
.lista-duvidas details { border-bottom: 1px solid var(--linha); }
.lista-duvidas summary { list-style: none; cursor: pointer; padding: 18px 40px 18px 0; position: relative; font: 600 1.0625rem/1.4 var(--t-texto); }
.lista-duvidas summary::-webkit-details-marker { display: none; }
.lista-duvidas summary::after { content: ""; position: absolute; right: 8px; top: 50%; width: 12px; height: 12px; margin-top: -8px; border-right: 2px solid var(--verde); border-bottom: 2px solid var(--verde); transform: rotate(45deg); transition: transform .2s; }
.lista-duvidas details[open] summary::after { transform: rotate(-135deg); margin-top: -2px; }
.lista-duvidas details p { margin: 0 0 20px; color: var(--suave); max-width: 46em; }
@media (min-width: 1024px) { .duvidas { padding: 104px 0 120px; } }

/* ---------- 13. Fecho ---------- */
.fecho { padding: 88px 0 96px; text-align: left; }
.titulo-fecho { max-width: 16em; }
.titulo-fecho { font-size: clamp(2.1rem, 4.2vw + 0.6rem, 4rem); line-height: 1.04; letter-spacing: -0.03em; color: #F2FAF5; margin-bottom: 20px; text-wrap: balance; }
.fecho p { color: var(--luz-suave); font-size: 1.0625rem; max-width: 40em; margin-bottom: 28px; }
@media (min-width: 1024px) { .fecho { padding: 128px 0 136px; } }

/* ---------- 14. Rodapé ---------- */
.rodape { padding: 40px 0 120px; border-top: 1px solid var(--filme-linha); font-size: 0.875rem; color: var(--luz-suave); }
.rodape-miolo { display: grid; gap: 6px; }
.rodape-marca { display: flex; align-items: center; gap: 10px; font: 700 1.0625rem var(--t-titulo); color: #F2FAF5; margin-bottom: 8px; }
.rodape-cnpq { color: #FFF6DE; }
.rodape-fic { font: 500 0.75rem var(--t-mono); letter-spacing: 0.06em; }
@media (min-width: 900px) { .rodape { padding-bottom: 56px; } }

/* ---------- 15. Barra fixa do celular ---------- */
.barra-fixa { position: fixed; left: 0; right: 0; bottom: 0; z-index: 40; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 16px calc(10px + env(safe-area-inset-bottom)); background: var(--filme); border-top: 1px solid var(--filme-linha); color: #F2FAF5; transform: translateY(110%); transition: transform .25s ease; }
.barra-fixa p { margin: 0; display: flex; align-items: baseline; gap: 6px; }
.barra-fixa b { font: 700 1.5rem/1 var(--t-titulo); color: var(--luz); }
.barra-fixa span { color: var(--luz-suave); font-size: 0.9375rem; }
.barra-fixa .botao { min-height: 44px; padding: 8px 22px; }
.barra-fixa.visivel { transform: none; }
@media (min-width: 900px) { .barra-fixa { display: none; } }

/* ---------- Revelar ao rolar (só com script) ---------- */
.js .revelar { opacity: 0; transform: translateY(14px); transition: opacity .5s ease, transform .5s ease; }
.js .revelar.visto { opacity: 1; transform: none; }

/* ---------- Menos movimento: tudo no estado final ---------- */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
  .cv-papel { transform: none; }
  .cv-chapa { clip-path: none; }
  .raio { display: none; }
  .teia-dado { stroke-dashoffset: 0; }
  .teia-pontos circle, .visor-numeros li, .cv-achado { opacity: 1; }
  .js .revelar { opacity: 1; transform: none; }
}

/* ---------- Impressão ---------- */
@media print {
  .topo, .barra-fixa, .botao, .perfis, .sozinha, .abas { display: none !important; }
  .filme, .protecao { background: #FFFFFF !important; color: #000 !important; }
  .js .tela[hidden] { display: grid !important; }
}

/* Ajustes finos do celular */
@media (max-width: 480px) {
  .edital-tabela th { letter-spacing: 0.02em; font-size: 0.625rem; }
  .edital-tabela th:not(:first-child) { white-space: normal; max-width: 5.5em; }
}