/* LP de direito da saúde — TCG Advogados.
   Layout de 26/10/2026 no molde do tema GadgetFix (madebydesignesia.com/themes/gadgetfix): topo escuro
   fixo, abertura de foto cheia com os cartões das áreas montados na borda de baixo, grade de motivos,
   seções escuras para a urgência e a equipe, faixas verdes de chamada, perguntas com foto ao lado e
   rodapé em colunas. Cores e fontes continuam as da marca (verde TCG, Archivo e Source Serif 4), e o
   laudo continua sendo a peça da lei. Corrigida pela Smart em 26/10: sem rótulos acima dos títulos,
   sem numeração decorativa, sem sombras e sem fios fora do laudo e das perguntas (DESIGN.md). */

@font-face {
  font-family: "Archivo";
  src: url("fonts/archivo.woff2") format("woff2");
  font-weight: 400 600;
  font-stretch: 62% 125%;
  font-display: swap;
}
@font-face {
  font-family: "Source Serif 4";
  src: url("fonts/source-serif-4.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

:root {
  color-scheme: light;
  --bg: #FFFFFF;
  --fundo: #EEF2EF;        /* seções claras alternadas */
  --ink: #141414;
  --muted: #4E5350;
  --line: #C9D1CC;
  --green: #1F6B4A;
  --green-escuro: #17543A;
  --green-claro: #E1EEE6;
  --green-hover: #CFE3D7;  /* também o verde dos ícones e rótulos sobre o escuro */
  --noite: #10271D;        /* verde quase preto (o do véu da foto): topo, cartões, seções escuras e rodapé */
  --sobre-noite: rgba(255, 255, 255, 0.74); /* texto secundário sobre o escuro (9:1) */
  --linha-noite: rgba(255, 255, 255, 0.14);
  /* Dourado (05/11/2026, pedido do Guidoni): só sobre o verde-noite e o verde, em pontos contados:
     a 2ª linha do título, as setas e o "+" dos cartões das áreas, os números dos passos, o contorno
     do sócio diretor e o risco da abertura. Nunca em texto sobre o branco (não passa no contraste). */
  --ouro: #D4B06A;         /* 8,6:1 sobre o --noite */
  --ouro-fundo: rgba(212, 176, 106, 0.14);

  --sans: "Archivo", "Arial Narrow", Arial, sans-serif;
  --serif: "Source Serif 4", Georgia, "Times New Roman", serif;

  /* Cinco degraus, e só eles */
  --t-peq: 1rem;                                       /* 16 (texto corrido nunca abaixo de 16) */
  --t-corpo: clamp(1.0625rem, 1rem + 0.2vw, 1.125rem); /* 17–18 */
  --t-dest: clamp(1.25rem, 1.1rem + 0.5vw, 1.5rem);    /* 20–24 */
  --t-h2: clamp(1.875rem, 1rem + 2.8vw, 3rem);         /* 30–48 */
  --t-h1: clamp(2.125rem, 0.4rem + 5.2vw, 5rem);       /* 34–80 */

  --raio: 14px;            /* cartões, fotos, laudo */
  --raio-g: 48px;          /* o canto grande da foto das perguntas */
  --pilula: 999px;         /* botões e etiquetas */
  --curva: cubic-bezier(0.16, 1, 0.3, 1);

  --faixa: 1180px;
  --lado: clamp(20px, 4vw, 40px);
  --entre: clamp(72px, 4vw + 44px, 112px);
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: 92px; }
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }
body {
  margin: 0;
  background: var(--bg);
  color: var(--ink);
  font: 400 var(--t-corpo)/1.6 var(--sans);
  font-variant-numeric: tabular-nums;
  -webkit-font-smoothing: antialiased;
}
img { display: block; max-width: 100%; height: auto; }
h1, h2, h3 { margin: 0; font-weight: 500; text-wrap: balance; }
p, ul, ol, dl, dd, figure, blockquote { margin: 0; }
a { color: inherit; text-underline-offset: 0.18em; text-decoration-thickness: 1px; }
a:hover { text-decoration-thickness: 2px; }
::selection { background: var(--green-claro); color: var(--ink); }
:focus-visible { outline: 3px solid var(--green); outline-offset: 2px; }
.escuro :focus-visible, .timbre :focus-visible, .rodape :focus-visible, .faixa-verde :focus-visible, .cartao :focus-visible { outline-color: #fff; }
cite { font-style: normal; }
.so-leitor { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; } /* taste-skill-ignore: utilitário de leitor de tela, não é linha */
.ico-linha { fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }

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

/* Dado que falta: impossível de ignorar até alguém preencher */
.preencher {
  display: inline-block;
  background: #FFE600;
  color: #000;
  font: 600 var(--t-peq)/1.3 var(--sans);
  padding: 2px 6px;
  outline: 2px dashed #000;
  outline-offset: 1px;
}

/* Área de toque mínima para links soltos */
.alvo { display: inline-flex; align-items: center; min-height: 44px; }

/* ------------------------------------------------------------- títulos */
h1 { font-size: var(--t-h1); font-stretch: 80%; line-height: 1.02; letter-spacing: -0.02em; }
h2 { font-size: var(--t-h2); font-stretch: 82%; line-height: 1.08; letter-spacing: -0.015em; }

.cabeca { max-width: 46rem; }
.cabeca h2 { margin-top: 0; }
.cabeca .abre { margin-top: 18px; }
.cabeca .abre + .abre { margin-top: 10px; }
.cabeca.centro { margin-inline: auto; text-align: center; }
.abre { max-width: 46ch; }
.cabeca.centro .abre { margin-inline: auto; max-width: 52ch; }
.tom { color: var(--muted); }
.lei-inline { font-family: var(--serif); }

/* ------------------------------------------------------------- botões */
.botao {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  min-height: 52px; padding: 14px 26px;
  font: 600 var(--t-corpo)/1.2 var(--sans);
  text-decoration: none; border: 0; border-radius: var(--pilula); cursor: pointer;
  transition: background-color 0.15s, color 0.15s, transform 0.12s;
}
.botao:active { transform: translateY(1px); }
.botao-p { background: var(--green); color: #fff; }
.botao-p:hover { background: var(--green-escuro); }
.botao-claro { background: #fff; color: var(--green-escuro); }
.botao-claro:hover { background: var(--green-claro); }
.botao-contorno { background: #32453D; color: #fff; } /* chapado desde 05/11 (sem transparência): o tom que o branco 14% dava sobre o verde-noite */
.botao-contorno:hover { background: #495B53; }
.botao-g { min-height: 58px; padding-inline: 30px; }
.botao-m { min-height: 48px; padding: 12px 22px; font-size: var(--t-peq); }
.ico-wa { width: 20px; height: 20px; flex: none; }
.link { font-weight: 600; }
.link:hover { color: var(--green-escuro); }

/* ------------------------------------------------------------- timbre */
/* Só o timbre escuro, que acompanha a rolagem (a barra de endereço saiu em 05/11/2026, pedido do Guidoni) */
.timbre { position: sticky; top: 0; z-index: 30; background: var(--noite); color: #fff; }
.timbre-in { display: flex; align-items: center; justify-content: space-between; gap: 24px; min-height: 76px; }
.marca { display: flex; align-items: center; min-height: 48px; flex: none; }
.marca img { width: 150px; height: auto; filter: brightness(0) invert(1); }
.menu { display: flex; gap: 4px 30px; }
.menu a { position: relative; padding-block: 14px; font-size: var(--t-peq); font-weight: 600; color: #fff; text-decoration: none; }
.menu a::after { content: ""; position: absolute; left: 0; right: 0; bottom: 8px; height: 2px; background: var(--green-hover); transform: scaleX(0); transform-origin: left center; transition: transform 0.3s var(--curva); }
.menu a:hover::after { transform: none; }
/* timbre da política de privacidade */
.timbre-dados { display: grid; gap: 2px; text-align: right; }
.timbre-dados b { font-weight: 600; font-stretch: 85%; font-size: var(--t-dest); line-height: 1.1; }
.timbre-dados span { font-size: var(--t-peq); color: var(--sobre-noite); }

/* ------------------------------------------------------------- abertura */
/* A foto do Centro de São Paulo, em preto e branco, sob o véu verde escuro chapado. Embaixo fica
   espaço para os cartões das áreas, que sobem por cima da borda da foto. */
.abertura { position: relative; overflow: hidden; color: #fff; background: var(--noite); }
/* Fundo desde 05/11/2026: casal lendo a carta do plano na mesa da cozinha (desde a tarde de 05/11). No computador a foto
   ocupa a direita e se dissolve no verde-noite onde está o texto; no celular cobre tudo sob um véu. */
.abertura-fundo { position: absolute; inset: 0; overflow: hidden; }
.abertura-fundo picture { display: contents; }
/* no celular o fundo é só o corredor de hospital, sem pessoas (pedido do Guidoni em 05/11: o casal
   espremido atrás do texto ficava ruim); a foto do casal fica para o computador */
.abertura-foto { width: 100%; height: 100%; object-fit: cover; object-position: center bottom; }
/* a imagem do celular (enviada pelo Guidoni em 05/11) já vem escurecida na parte de cima; o véu só garante o texto */
.abertura-fundo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(16, 39, 29, 0.3), rgba(16, 39, 29, 0.1) 80%); }
.abertura-in { position: relative; z-index: 1; display: grid; align-items: center; gap: 32px; padding-block: clamp(32px, 4vw, 52px) clamp(140px, 13vw, 180px); }
/* Duas linhas: "Problemas com o seu / Plano de Saúde?" (o <br> fixa a quebra; a Archivo estreitada faz caber) */
.abertura h1 { margin-top: 16px; color: #fff; font-stretch: 74%; white-space: nowrap; }
.abertura h1 .ouro { color: var(--ouro); }
.h1-sub { margin-top: 16px; font-size: var(--t-dest); font-stretch: 90%; line-height: 1.35; color: var(--sobre-noite); max-width: 34ch; }
.acoes { margin-top: 26px; display: flex; flex-wrap: wrap; align-items: center; gap: 12px 14px; }
.micro { margin-top: 12px; font-size: var(--t-peq); color: var(--muted); max-width: 44ch; }
.abertura .micro { margin-top: 16px; color: var(--sobre-noite); }
.abertura ::selection { background: #fff; color: var(--ink); }
.anima .abertura-foto { animation: assenta 1.8s var(--curva) both; }
@keyframes assenta { from { transform: scale(1.08); } to { transform: none; } }

/* ------------------------------------------------------------- cartões das áreas */
/* Três cartões escuros, um por área, e o quarto em verde com o contato. Cada caso é um link que
   abre o WhatsApp com a mensagem daquele caso. */
.casos-sec { position: relative; z-index: 2; margin-top: calc(-1 * clamp(110px, 12vw, 160px)); }
.cartoes { display: grid; gap: 20px; }
.cartao { display: flex; flex-direction: column; gap: 14px; min-width: 0; padding: 30px 28px 26px; background: var(--noite); color: #fff; border-radius: var(--raio); scroll-margin-top: 96px; }
.cartao h3 { font-size: var(--t-dest); font-stretch: 90%; font-weight: 600; line-height: 1.2; }
.cartao > p { font-size: var(--t-peq); color: var(--sobre-noite); }
/* Cartões sobem 6 px e ganham um contorno claro no hover. Usa "translate" (e não "transform")
   para não brigar com a entrada dos blocos ao rolar. */
.cartao, .mat { transition: translate 0.35s var(--curva), background-color 0.3s; }
.cartao:hover, .mat:hover { translate: 0 -6px; }
.casos { list-style: none; margin: 4px 0 0; padding: 0; display: grid; gap: 2px; }
/* Hover do caso: a linha acende num fundo claro, o texto entra um pouco e a seta vira um círculo verde */
.caso {
  position: relative; display: flex; align-items: center; justify-content: space-between; gap: 12px;
  min-height: 46px; margin-inline: -10px; padding: 9px 10px; border-radius: 8px;
  font-size: var(--t-peq); line-height: 1.35; color: #fff; text-decoration: none;
  transition: background-color 0.2s, color 0.2s, padding 0.25s var(--curva);
}
.caso::after {
  content: ""; flex: none; width: 30px; height: 30px; border-radius: 50%;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23D4B06A' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h13M13 6.5 18.5 12 13 17.5'/%3E%3C/svg%3E") center / 18px no-repeat;
  transition: background-color 0.2s, transform 0.25s var(--curva);
}
.caso:hover, .caso:focus-visible { background: rgba(255, 255, 255, 0.08); color: #fff; padding-left: 16px; }
.caso:hover::after, .caso:focus-visible::after { background-color: var(--ouro); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2310271D' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h13M13 6.5 18.5 12 13 17.5'/%3E%3C/svg%3E"); transform: translateX(2px); }
.caso:active { background: var(--linha-noite); }
/* Hover do "+": o círculo enche de verde, o + gira e o texto acompanha */
.cartao-mais { margin-top: auto; padding-top: 10px; display: inline-flex; align-items: center; gap: 12px; min-height: 44px; font-size: var(--t-peq); font-weight: 600; color: #fff; text-decoration: none; transition: color 0.2s; }
.mais-circulo { position: relative; width: 40px; height: 40px; flex: none; border-radius: 50%; color: var(--ouro); background: var(--ouro-fundo); border: 1.5px solid var(--ouro); transition: background-color 0.25s, color 0.25s, transform 0.3s var(--curva); }
.mais-circulo::before, .mais-circulo::after { content: ""; position: absolute; left: 50%; top: 50%; width: 13px; height: 1.5px; margin: -0.75px 0 0 -6.5px; background: currentColor; transition: transform 0.3s var(--curva); }
.mais-circulo::after { transform: rotate(90deg); }
.cartao-mais:hover, .cartao-mais:focus-visible { color: var(--ouro); }
.cartao-mais:hover .mais-circulo, .cartao-mais:focus-visible .mais-circulo { background: var(--ouro); color: var(--noite); transform: scale(1.08); }
.cartao-mais:hover .mais-circulo::before, .cartao-mais:focus-visible .mais-circulo::before { transform: rotate(90deg); }
.cartao-mais:hover .mais-circulo::after, .cartao-mais:focus-visible .mais-circulo::after { transform: rotate(180deg); }
.cartao-contato .cartao-mais:hover, .cartao-contato .cartao-mais:focus-visible { color: #fff; }
.cartao-contato .cartao-mais:hover .mais-circulo, .cartao-contato .cartao-mais:focus-visible .mais-circulo { background: var(--ouro); color: var(--noite); }
.cartao-contato a:not(.cartao-mais):hover { text-decoration-thickness: 2px; }
.cartao-contato { background: var(--green); }
.cartao-contato > p { color: rgba(255, 255, 255, 0.9); }
.cartao-contato a:not(.cartao-mais) { display: inline-flex; align-items: center; min-height: 44px; color: #fff; }

/* ------------------------------------------------------------- seções */
.secao { padding-block: var(--entre); }
.escuro { background: var(--noite); color: #fff; padding-block: var(--entre); }
.escuro .abre { color: var(--sobre-noite); }
.escuro ::selection { background: #fff; color: var(--ink); }

/* motivos: ícone em caixa à esquerda, título e texto à direita */
.motivos { list-style: none; margin: clamp(40px, 5vw, 64px) 0 0; padding: 0; display: grid; gap: 36px 40px; }
.motivos li { display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 22px; align-items: start; }
.motivo-ico { display: grid; place-items: center; width: 64px; height: 64px; border-radius: var(--raio); background: var(--green-claro); color: var(--green); transition: background-color 0.2s, color 0.2s; }
.motivo-ico svg { width: 28px; height: 28px; stroke-width: 2; }
.motivos li:hover .motivo-ico { background: var(--green); color: #fff; }
.motivos h3 { font-size: var(--t-dest); font-stretch: 90%; font-weight: 600; line-height: 1.25; }
.motivos p { margin-top: 8px; color: var(--muted); }

/* ------------------------------------------------------------- o laudo */
/* À esquerda, o convite e os tratamentos que costumam ser negados; à direita, o laudo */
.laudo-sec { background: var(--fundo); }
.laudo-grade { display: grid; gap: 40px; align-items: start; }
.laudo-intro h2 { margin-top: 16px; }
.laudo-intro .abre { margin-top: 18px; }
.etiquetas-tit { margin-top: 30px; font-weight: 600; }
.etiquetas { list-style: none; margin: 12px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.etiquetas li { padding: 7px 14px; border-radius: var(--pilula); background: var(--bg); font-size: var(--t-peq); line-height: 1.3; }

.laudo { overflow: hidden; background: var(--bg); border: 1px solid var(--line); border-radius: var(--raio); } /* taste-skill-ignore: moldura do papel do laudo */
.laudo-cab { background: var(--fundo); padding: 18px 22px 16px; }
.laudo-titulo { font-size: var(--t-dest); font-stretch: 85%; line-height: 1.2; }
.laudo-campos { margin-top: 10px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px 24px; }
.laudo-campos div { min-width: 0; }
.laudo-campos dt { font-size: var(--t-peq); color: var(--muted); }
.laudo-campos dd { font-size: var(--t-peq); line-height: 1.4; color: var(--ink); }

.laudo-tab { width: 100%; border-collapse: collapse; }
.laudo-tab thead th { text-align: left; font: 400 var(--t-peq)/1.3 var(--sans); color: var(--muted); padding: 12px 14px 8px; border-bottom: 2px solid var(--ink); }
.laudo-tab thead th:first-child { padding-left: 22px; }
.laudo-tab tbody tr > * { transition: background-color 0.2s, color 0.2s; }
.laudo-tab tbody tr + tr > * { border-top: 1px solid var(--line); } /* taste-skill-ignore: fio da tabela do laudo */
.laudo-tab tbody th, .laudo-tab td { padding: 16px 14px; vertical-align: top; text-align: left; }
.laudo-tab tbody th { padding-left: 22px; font-weight: 600; width: 26%; }
.laudo-tab td.lei { font-family: var(--serif); line-height: 1.45; }
.laudo-tab td.lei cite { display: block; margin-top: 4px; font-family: var(--sans); font-size: var(--t-peq); color: var(--muted); }
.ast { color: var(--green); font-family: var(--sans); font-weight: 600; margin-left: 2px; }
.laudo-tab td.escolha { width: 1%; white-space: nowrap; vertical-align: middle; padding-right: 22px; }
.marcar {
  display: inline-flex; align-items: center; min-height: 44px; padding: 10px 16px;
  font: 600 var(--t-peq)/1.2 var(--sans); text-decoration: none; border-radius: var(--pilula);
  color: var(--green-escuro); background: var(--green-claro); cursor: pointer;
  transition: background-color 0.15s, color 0.15s;
}
.marcar:hover { background: var(--green-hover); }
.marcar[aria-pressed="true"] { background: var(--green); color: #fff; }
.laudo-tab tr.marcada > * { background: var(--green-claro); }
.laudo-tab tr.apagada > * { color: var(--muted); }

.laudo-nota { padding: 10px 22px 14px; font-size: var(--t-peq); color: var(--muted); }
.laudo-nota span { color: var(--green); font-weight: 600; }
.laudo-resumo { padding: 18px 22px 22px; background: var(--green-claro); }
.laudo-resumo p + p { margin-top: 8px; }
.resumo-caso { font-size: var(--t-dest); font-stretch: 85%; line-height: 1.25; }
.laudo-resumo .botao { margin-top: 16px; }
.laudo-ref { padding: 12px 22px; font-size: var(--t-peq); color: var(--muted); }
.laudo-ref b { color: var(--ink); font-weight: 600; }
.laudo-ref a { color: var(--ink); }
.laudo-assina { display: flex; gap: 14px; align-items: flex-start; margin: 4px 22px 0; padding: 14px 0 18px; border-top: 2px solid var(--ink); } /* taste-skill-ignore: fio de assinatura do laudo */
.laudo-assina img { width: 56px; height: 64px; object-fit: cover; flex: none; border-radius: 6px; filter: grayscale(1) contrast(1.06); }
.assina-texto { display: grid; gap: 2px; min-width: 0; }
.assina-nome { font-weight: 600; font-size: var(--t-corpo); }
.assina-cargo { font-size: var(--t-peq); color: var(--ink); }
.assina-aviso { margin-top: 6px; font-size: var(--t-peq); color: var(--muted); }

/* ------------------------------------------------------------- urgência */
/* Redesenho de 05/11/2026. À esquerda, o que é a liminar e o aviso do pronto-socorro; à direita,
   "Comece hoje" como uma sequência ligada por uma linha, números em dourado, e o botão logo depois
   do último passo (que é justamente "mande o que já tiver"). */
.urg-grade { display: grid; gap: 40px 72px; align-items: start; }
.urg-lead { margin-top: 20px; font-size: var(--t-dest); font-stretch: 90%; font-weight: 500; line-height: 1.35; color: #fff; max-width: 32ch; }
.urg-fatos { margin-top: 28px; display: grid; gap: 18px; }
.urg-fatos > div { display: grid; gap: 4px; }
.urg-fatos dt { font: 600 var(--t-peq)/1.2 var(--sans); color: var(--ouro); }
.urg-fatos dd { font-size: var(--t-peq); line-height: 1.55; color: var(--sobre-noite); max-width: 52ch; }
.urg-fatos .lei-inline { color: #fff; }
.aviso { margin-top: 28px; display: flex; gap: 14px; align-items: flex-start; padding: 16px 18px; border-radius: var(--raio); background: rgba(255, 255, 255, 0.07); color: var(--sobre-noite); font-size: var(--t-peq); line-height: 1.5; }
.aviso strong { color: #fff; font-weight: 600; }
.aviso svg { width: 24px; height: 24px; flex: none; margin-top: 1px; color: var(--ouro); }

/* A carta de negativa: o papel que a pessoa tem na mão, desenhado em HTML (legível, leve, sem texto
   inventado por IA). Uma folha de baixo, girada, dá a pilha sem sombra; o carimbo é o único vermelho. */
.negativa { position: relative; width: min(100%, 460px); justify-self: center; margin-block: 8px; }
.negativa::before { content: ""; position: absolute; inset: 0; border-radius: 6px; background: rgba(255, 255, 255, 0.12); transform: rotate(4deg) translate(10px, 6px); }
.neg-papel {
  position: relative; display: grid; gap: 14px; padding: 28px 28px 30px; border-radius: 6px;
  background: #F6F3EC; color: #2A2E2C; transform: rotate(-2deg);
  font: 400 0.875rem/1.45 var(--sans);
}
.neg-cab { display: flex; justify-content: space-between; gap: 12px; padding-bottom: 12px; border-bottom: 1px solid #D5D0C4; color: #4A4F4C; } /* taste-skill-ignore: cabeçalho de documento */
.neg-emissor { font-weight: 600; color: #2A2E2C; }
.neg-tit { font: 600 1.5rem/1.1 var(--sans); font-stretch: 82%; color: #141414; }
.neg-campos { display: grid; gap: 8px; }
.neg-campos > div { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 10px; }
.neg-campos dt { color: #5A5F5C; }
.neg-campos dd { color: #141414; font-weight: 500; }
.neg-borrao { display: inline-block; width: 70%; height: 0.8em; border-radius: 3px; background: #CFC9BC; vertical-align: middle; }
.neg-linha { display: block; height: 7px; border-radius: 4px; background: #E2DDD2; }
.neg-curta { width: 62%; }
.neg-pe { display: grid; justify-items: end; gap: 6px; margin-top: 10px; color: #5A5F5C; }
.neg-assina { width: 44%; height: 2px; background: #8E897E; }
.neg-carimbo {
  position: absolute; left: 30px; bottom: 34px; padding: 8px 16px; border: 3px solid #B3261E; border-radius: 8px;
  color: #B3261E; font: 600 1.625rem/1 var(--sans); font-stretch: 80%; text-transform: uppercase; letter-spacing: 0.04em;
  transform: rotate(-11deg); background: rgba(246, 243, 236, 0.82);
}

/* ------------------------------------------------------------- faixas verdes */
/* As duas chamadas de cor cheia: o contato, no meio, e o fechamento, antes do rodapé */
.faixa-verde { background: var(--green); color: #fff; padding-block: clamp(40px, 5vw, 60px); }
.faixa-verde ::selection { background: #fff; color: var(--green-escuro); }
/* "Comece hoje" (05/11/2026): os quatro passos lado a lado, ligados por uma linha, números em disco
   dourado com o algarismo verde-noite (8,6:1). O botão fica no alto à direita no computador e no fim no
   celular, depois do passo 4. */
.contato-in { display: grid; gap: 28px 48px; grid-template-areas: "cab" "passos" "acao"; }
.contato-cab { grid-area: cab; }
.contato .passos { grid-area: passos; }
.contato-acao { grid-area: acao; }
.contato.faixa-verde { padding-block: clamp(32px, 4vw, 44px); }
.contato h2 { font-size: clamp(1.75rem, 1rem + 1.6vw, 2.25rem); font-stretch: 82%; }
.contato h2 + p { margin-top: 6px; color: rgba(255, 255, 255, 0.9); max-width: 46ch; }
.contato .passo-num { width: 36px; height: 36px; font-size: 1rem; }
.contato .passos li { grid-template-columns: 36px minmax(0, 1fr); gap: 12px; padding-bottom: 14px; }
.contato .passos li:not(:last-child)::before { left: 17px; top: 42px; }
.contato .passos p { padding-top: 6px; font-size: var(--t-peq); line-height: 1.4; }
.passos { list-style: none; margin: 0; padding: 0; display: grid; }
.passos li { position: relative; display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 16px; align-items: start; padding-bottom: 20px; }
.passos li:not(:last-child)::before { content: ""; position: absolute; left: 21px; top: 50px; bottom: 6px; width: 2px; border-radius: 2px; background: rgba(255, 255, 255, 0.3); } /* taste-skill-ignore: trilho da sequência de passos */
.passo-num { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: var(--ouro); color: var(--noite); font: 600 1.125rem/1 var(--sans); }
.passos p { padding-top: 10px; font-size: var(--t-corpo); font-weight: 500; line-height: 1.45; color: #fff; }
.fecho-in { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 22px 40px; }
.fecho-frase { display: flex; align-items: center; gap: 16px; font-size: var(--t-dest); font-stretch: 90%; font-weight: 600; line-height: 1.3; max-width: 42ch; }
.fecho-frase svg { width: 34px; height: 34px; flex: none; }

/* ------------------------------------------------------------- documentos */
.materiais { margin-top: clamp(40px, 5vw, 64px); display: grid; gap: 20px; }
.mat { min-width: 0; padding: 28px 28px 30px; border-radius: var(--raio); background: var(--noite); color: #fff; }
.mat:hover ul { color: #fff; }
.mat ul { transition: color 0.3s; }
.mat h3 { font-size: var(--t-dest); font-stretch: 90%; font-weight: 600; line-height: 1.25; }
.mat ul { margin-top: 14px; padding: 0; list-style: none; display: grid; gap: 10px; font-size: var(--t-peq); color: var(--sobre-noite); }
.mat li { position: relative; padding-left: 24px; }
.mat li::before { content: ""; position: absolute; left: 2px; top: 0.4em; width: 11px; height: 6px; border-left: 2px solid var(--green-hover); border-bottom: 2px solid var(--green-hover); transform: rotate(-45deg); }
/* O caso marcado no laudo acende o cartão dos papéis dele */
.mat.ativo { background: var(--green); }
.mat.ativo ul { color: #fff; }
.mat.ativo h3::after { content: " · o seu caso"; color: var(--green-claro); font-weight: 400; }
.faltou { margin-top: 20px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 4px 20px; padding: 16px 24px; border-radius: var(--raio); background: var(--green-claro); }
.faltou b { font-weight: 600; }


/* ------------------------------------------------------------- quem são */
/* As fotos chegaram de lugares diferentes (fundo branco, escritório, selfie); o preto e branco
   multiplicado pelo verde-claro as põe na mesma luz. */
.proposito { margin: 22px auto 0; max-width: 34ch; font-size: var(--t-dest); font-stretch: 90%; line-height: 1.35; color: var(--green-claro); }
.socios { list-style: none; margin: clamp(40px, 5vw, 64px) 0 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px 18px; }
.socios b { display: block; margin-top: 16px; font-weight: 600; line-height: 1.3; }
.socios span:not(.retrato) { display: block; margin-top: 2px; font-size: var(--t-peq); color: var(--sobre-noite); }
.retrato { position: relative; display: block; overflow: hidden; border-radius: var(--raio); background: var(--fundo); }
.retrato img { width: 100%; aspect-ratio: 360 / 408; object-fit: cover; filter: grayscale(1) contrast(1.08);
  transition: filter 0.6s var(--curva), transform 0.8s var(--curva); }
.retrato::after { content: ""; position: absolute; inset: 0; background: var(--fundo); mix-blend-mode: multiply; pointer-events: none; transition: opacity 0.6s; }
/* A foto ganha cor ao passar o mouse; no celular, quando chega ao meio da tela (script.js) */
.retrato.viva img { filter: none; transform: scale(1.03); }
.retrato.viva::after { opacity: 0; }
@media (hover: hover) {
  .socios li:hover .retrato img { filter: none; transform: scale(1.03); }
  .socios li:hover .retrato::after { opacity: 0; }
}
/* O sócio diretor em destaque, sem passar do que a foto aguenta (até ~300 px de largura): no
   computador, a mesma fileira das outras com 1,4 vez a largura; até 999 px, sozinho na primeira
   linha. Contorno verde, nome maior e o cargo em verde. */
.socio-dir { grid-column: 1 / -1; }
.socio-dir .retrato { max-width: 300px; outline: 2px solid var(--ouro); outline-offset: 6px; }
.socio-dir b { margin-top: 22px; font-size: var(--t-dest); font-stretch: 90%; line-height: 1.2; }
.socios .socio-dir span:not(.retrato) { margin-top: 4px; font-size: var(--t-corpo); font-weight: 600; color: var(--ouro); }
.ficha { margin-top: clamp(48px, 6vw, 72px); display: grid; gap: 20px 40px; }
.ficha > div { min-width: 0; }
.ficha dt { font-size: var(--t-peq); color: var(--sobre-noite); }
.ficha dd { margin-top: 4px; line-height: 1.45; }
.ficha .link { color: var(--green-hover); }
.ficha .link:hover { color: #fff; }

/* ------------------------------------------------------------- perguntas */
/* Foto à esquerda até a borda da tela, com o canto grande arredondado; a sanfona à direita */
.perguntas { padding-block: var(--entre); }
.perguntas-grade { display: grid; gap: 36px; }
.perguntas-foto { margin-inline: var(--lado); height: 240px; overflow: hidden; border-radius: var(--raio); }
.perguntas-foto img { width: 100%; height: 100%; object-fit: cover; object-position: 30% center; filter: grayscale(1); }
.perguntas-txt { padding-inline: var(--lado); min-width: 0; }
.perguntas-txt h2 { margin-top: 16px; }
.perguntas-txt .abre { margin-top: 14px; }
.sanfona { margin-top: 28px; min-width: 0; }
.sanfona details { border-top: 1px solid var(--line); } /* taste-skill-ignore: divisão da sanfona pedida pelo cliente */
.sanfona details:last-child { border-bottom: 1px solid var(--line); } /* taste-skill-ignore: divisão da sanfona pedida pelo cliente */
.sanfona summary { position: relative; list-style: none; cursor: pointer; min-height: 56px; padding: 16px 52px 16px 0; font-weight: 600; line-height: 1.4; }
.sanfona summary::-webkit-details-marker { display: none; }
.sanfona summary:hover { color: var(--green-escuro); }
.mais { position: absolute; right: 8px; top: 50%; width: 18px; height: 18px; margin-top: -9px; }
.mais::before, .mais::after { content: ""; position: absolute; left: 0; top: 8px; width: 18px; height: 2px; background: var(--green); transition: transform 0.2s var(--curva); }
.mais::after { transform: rotate(90deg); }
.sanfona details[open] .mais::after { transform: rotate(0deg); }
.sanfona details[open] summary { cursor: default; color: var(--green-escuro); } /* a aberta não fecha (script.js) */
.sanfona details p { padding: 0 52px 20px 0; max-width: 62ch; color: var(--muted); }

/* ------------------------------------------------------------- rodapé */
/* Enxuto desde 05/11/2026: marca e contato numa faixa, o texto legal numa linha corrida embaixo */
.rodape { background: var(--noite); color: var(--sobre-noite); font-size: var(--t-peq); }
.rodape-linha { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 20px 40px; padding-block: 36px 24px; }
.rodape-marca { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 24px; }
.rodape-marca img { width: 130px; height: auto; filter: brightness(0) invert(1); }
.rodape-marca p { max-width: 34ch; line-height: 1.4; }
.rodape b { color: #fff; font-weight: 600; }
.rodape-contato { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 4px 24px; }
.rodape-contato li { display: flex; align-items: center; gap: 8px; min-height: 44px; }
.rodape-contato svg { width: 18px; height: 18px; flex: none; color: var(--ouro); }
.rodape a { color: var(--sobre-noite); }
.rodape a:hover { color: #fff; }
.rodape-contato a { text-decoration: none; }
.rodape-contato a:hover { text-decoration: underline; }
.rodape-legal { padding-block: 18px 28px; border-top: 1px solid var(--linha-noite); } /* taste-skill-ignore: divisão do texto legal no rodapé */
.rodape-legal p { max-width: 110ch; font-size: 0.875rem; line-height: 1.55; color: rgba(255, 255, 255, 0.66); }
.rodape-legal a { text-decoration: underline; }
.rodape > .faixa:only-child { padding-block: 40px 44px; } /* rodapé curto da política */
.rodape > .faixa:only-child a { text-decoration: underline; }
.rodape > .faixa:only-child p + p { margin-top: 6px; }

/* botão flutuante (05/11/2026): o redondo verde do WhatsApp no canto de baixo à direita, o padrão
   brasileiro. Abre a janela do formulário. Chapado, sem sombra. */
.flutuante {
  position: fixed; z-index: 20;
  right: max(16px, env(safe-area-inset-right, 0px)); bottom: calc(16px + env(safe-area-inset-bottom, 0px));
  display: grid; place-items: center; width: 60px; height: 60px;
  color: #fff; background: #1A9E55; border-radius: 50%;
  transition: transform 0.25s var(--curva), opacity 0.2s, background-color 0.15s, visibility 0.25s;
}
.flutuante .ico-wa { width: 32px; height: 32px; }
.flutuante:hover { background: #158646; }
.flutuante.escondida { transform: scale(0.4); opacity: 0; visibility: hidden; pointer-events: none; }

/* ------------------------------------------------------------- janela do formulário */
.janela {
  width: min(100% - 32px, 520px); max-height: min(100dvh - 32px, 760px); margin: auto; padding: 26px 26px 24px;
  overflow-y: auto; overscroll-behavior: contain;
  border: 0; border-radius: var(--raio); background: var(--bg); color: var(--ink);
}
.janela::backdrop { background: rgba(10, 26, 19, 0.72); }
.janela[open] { animation: janela-entra 0.28s var(--curva); }
@keyframes janela-entra { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }
.janela-cab { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.janela h2 { font-size: clamp(1.625rem, 1.2rem + 1.6vw, 2.125rem); font-stretch: 82%; line-height: 1.1; }
.janela-sub { margin-top: 8px; color: var(--muted); font-size: var(--t-peq); }
.janela-fechar { position: relative; flex: none; width: 44px; height: 44px; margin: -8px -10px 0 0; border: 0; border-radius: 50%; background: transparent; color: var(--ink); cursor: pointer; }
.janela-fechar:hover { background: var(--fundo); }
.janela-fechar span::before, .janela-fechar span::after { content: ""; position: absolute; left: 50%; top: 50%; width: 18px; height: 2px; margin: -1px 0 0 -9px; background: currentColor; transform: rotate(45deg); }
.janela-fechar span::after { transform: rotate(-45deg); }

.form { margin-top: 18px; display: grid; gap: 14px; }
.form-resumo:empty, .erro:empty, .form-status:empty, .form[hidden], .janela-ok[hidden] { display: none; }
.form-resumo { padding: 10px 14px; border-radius: 8px; background: #FDECEA; color: #8A1C12; font-size: var(--t-peq); font-weight: 600; }
.campo { display: grid; gap: 6px; min-width: 0; }
.campo label { font-size: var(--t-peq); font-weight: 600; }
.opcional { font-weight: 400; color: var(--muted); }
.campo input[type="text"], .campo input[type="tel"], .campo select, .campo textarea {
  width: 100%; min-height: 50px; padding: 12px 14px;
  font: 400 var(--t-peq)/1.4 var(--sans); color: var(--ink);
  background: var(--bg); border: 1.5px solid #8A938E; border-radius: 10px; /* taste-skill-ignore: contorno do campo do formulário */
}
.campo textarea { min-height: 88px; resize: vertical; }
.campo select { appearance: none; padding-right: 42px; background-image: linear-gradient(45deg, transparent 50%, var(--ink) 50%), linear-gradient(-45deg, transparent 50%, var(--ink) 50%); background-position: right 20px center, right 14px center; background-size: 6px 6px; background-repeat: no-repeat; }
.campo input:focus-visible, .campo select:focus-visible, .campo textarea:focus-visible { outline: 3px solid var(--green); outline-offset: 1px; border-color: var(--green); }
.campo [aria-invalid="true"] { border-color: #B3261E; }
.erro { color: #B3261E; font-size: var(--t-peq); }
.campo-aceite { grid-template-columns: 24px minmax(0, 1fr); align-items: start; gap: 4px 12px; }
.campo-aceite input { width: 22px; height: 22px; margin: 2px 0 0; accent-color: var(--green); }
.campo-aceite label { font-weight: 400; line-height: 1.45; }
.campo-aceite label a { color: var(--green-escuro); font-weight: 600; }
.campo-aceite .erro { grid-column: 2; }
.mel { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.form-enviar { width: 100%; margin-top: 4px; }
.form-enviar:disabled { opacity: 0.7; cursor: wait; }
.form-status { font-size: var(--t-peq); color: var(--muted); text-align: center; }
.form-status a { color: var(--green-escuro); font-weight: 600; }
.janela-ok { margin-top: 18px; display: grid; justify-items: start; gap: 10px; }
.janela-ok svg { width: 44px; height: 44px; color: var(--green); }
.janela-ok-tit { font-size: var(--t-dest); font-weight: 600; }
.janela-ok .botao { margin-top: 8px; }
@media (prefers-reduced-motion: reduce) { .janela[open] { animation: none; } }

/* ------------------------------------------------------------- movimento */
/* Cartões, motivos, passos, papéis e retratos sobem de leve ao chegar à tela; a foto das perguntas assenta da escala 1,12 para 1.
   Sem script ou com menos movimento, tudo já está no lugar. */
.anima .js-sobe { transition: opacity 0.7s var(--curva), transform 0.9s var(--curva), background-color 0.3s; }
.anima .js-sobe.espera { opacity: 0; transform: translateY(28px); }
.anima .js-sobe.visto { opacity: 1; transform: none; }
.anima .js-obturador { transition: transform 1.6s var(--curva); }
.anima .js-obturador.espera { transform: scale(1.12); }
.anima .js-obturador.visto { transform: none; }
@media (prefers-reduced-motion: reduce) {
  .anima .js-obturador, .anima .js-sobe, .mais::before, .mais::after { transition: none; }
  .anima .js-sobe { transform: none; opacity: 1; }
  .anima .abertura-foto { animation: none; }
  .botao, .marcar, .caso, .caso::after, .mais-circulo, .cartao-mais, .flutuante, .laudo-tab tbody tr > *, .retrato img, .retrato::after, .menu a::after, .motivo-ico, .mat { transition: none; }
  .retrato img { transform: none !important; }
  .cartao, .mat, .mat ul { transition: none; }
  .cartao:hover, .mat:hover { translate: none; }
}

/* ------------------------------------------------------------- larguras */
@media (min-width: 640px) {
  .cartoes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 700px) {
  .motivos { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .materiais { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .socios { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 32px 20px; }
  .ficha { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (min-width: 1000px) {
  .abertura-in { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); }
  /* Banner horizontal (05/11, enviado pelo Guidoni): filha e mãe à mesa, parede verde-escura à
     esquerda já pensada para o texto. Ocupa a abertura inteira; o véu só reforça o lado do texto. */
  .abertura-fundo { inset: 0; }
  .abertura-foto { object-position: 70% 30%; filter: none; }
  .abertura-fundo::after { background: linear-gradient(90deg, rgba(16, 39, 29, 0.6) 0%, rgba(16, 39, 29, 0.4) 25%, rgba(16, 39, 29, 0.12) 45%, rgba(16, 39, 29, 0) 60%); }
  .motivos { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .laudo-grade { grid-template-columns: minmax(0, 4.4fr) minmax(0, 7.6fr); gap: 56px; }
  .laudo-intro { position: sticky; top: 120px; }
  .contato-in { grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "cab acao" "passos passos"; align-items: center; row-gap: 26px; }
  .contato-cab { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 28px; }
  .contato h2 + p { margin-top: 0; max-width: 40ch; }
  /* no computador o número fica ao lado do texto, sem a linha: a faixa cai para menos da metade da altura */
  .contato .passos { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; padding-top: 22px; border-top: 1px solid rgba(255, 255, 255, 0.22); } /* taste-skill-ignore: divisão entre a chamada e os passos */
  .contato .passos li { padding-bottom: 0; }
  .contato .passos li:not(:last-child)::before { display: none; }
  .contato .passos p { max-width: 30ch; }
  .urg-grade { grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); align-items: center; }
  /* As outras quatro (foto e nome) terminam na base da foto do Marcelo; o nome dele fica embaixo
     da foto, fora da conta da altura */
  .socios { grid-template-columns: minmax(0, 1.4fr) repeat(4, minmax(0, 1fr)); gap: 24px; align-items: end; margin-bottom: 150px; }
  .socio-dir { position: relative; grid-column: auto; }
  .socio-dir .retrato { max-width: none; }
  .socio-legenda { position: absolute; left: 0; right: 0; top: 100%; }
  .perguntas-grade { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(48px, 6vw, 96px); align-items: start; }
  /* Altura da lista com a resposta mais longa aberta (script.js): trocar de pergunta não mexe na foto */
  .perguntas-foto { margin: 0; height: var(--foto-alt, 640px); border-radius: 0 var(--raio-g) var(--raio-g) 0; }
  .perguntas-txt { padding-left: 0; padding-right: max(var(--lado), calc((100vw - var(--faixa)) / 2)); }
}
@media (min-width: 1140px) {
  .cartoes { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 1080px) {
  .menu { display: none; }
}
@media (max-width: 760px) {
  /* Cabeçalho do laudo compacto no celular: os três campos numa linha corrida */
  .laudo-cab { padding-block: 14px 12px; }
  .laudo-campos { display: block; margin-top: 6px; font-size: var(--t-peq); line-height: 1.45; }
  .laudo-campos div { display: inline; }
  .laudo-campos dt, .laudo-campos dd { display: inline; }
  .laudo-campos dt::after { content: ": "; }
  .laudo-campos div + div::before { content: " · "; color: var(--muted); }
  .laudo-tab thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); } /* taste-skill-ignore: cabeçalho da tabela só para leitor de tela no celular */
  .laudo-tab, .laudo-tab tbody, .laudo-tab tr, .laudo-tab tbody th, .laudo-tab td { display: block; width: auto; }
  .laudo-tab tbody tr { padding: 14px 18px 16px; transition: background-color 0.2s; }
  .laudo-tab tbody tr + tr { border-top: 1px solid var(--line); } /* taste-skill-ignore: fio da tabela do laudo */
  .laudo-tab tbody tr + tr > * { border-top: 0; }
  .laudo-tab tbody tr:first-child { border-top: 2px solid var(--ink); }
  .laudo-tab tbody th, .laudo-tab td { padding: 0; }
  .laudo-tab td[data-rotulo] { margin-top: 6px; }
  .laudo-tab td[data-rotulo]::before { content: attr(data-rotulo); display: block; font: 400 var(--t-peq)/1.3 var(--sans); color: var(--muted); }
  .laudo-tab td.escolha { margin-top: 10px; width: auto; }
  .laudo-tab tr.marcada { background: var(--green-claro); }
  .laudo-cab, .laudo-nota, .laudo-resumo, .laudo-ref { padding-inline: 18px; }
  .laudo-assina { margin-inline: 18px; }
}
@media (max-width: 640px) {
  html { scroll-padding-top: 76px; }
  .timbre-in { min-height: 64px; }
  .marca img { width: 118px; }
  .abertura-in { min-height: 0; }
  .casos-sec { margin-top: -88px; }
  .acoes .botao { width: 100%; }
  .flutuante { right: 14px; bottom: calc(14px + env(safe-area-inset-bottom, 0px)); }
  .rodape-legal { padding-bottom: 92px; }
  .motivos li { grid-template-columns: 52px minmax(0, 1fr); gap: 18px; }
  .motivo-ico { width: 52px; height: 52px; }
}

/* ------------------------------------------------------------- celular (05/11/2026) */
/* Pensado primeiro para o celular: o que repete outra seção some, e as listas longas viram
   faixas que passam com o dedo (com um pedaço do próximo à vista). No computador nada muda. */
@media (max-width: 640px) {
  .so-grande { display: none !important; }
  :root { --entre: 56px; }
  .motivos { gap: 24px; margin-top: 28px; }
  .motivos li { grid-template-columns: 44px minmax(0, 1fr); gap: 14px; }
  .motivo-ico { width: 44px; height: 44px; border-radius: var(--raio); }
  .motivo-ico svg { width: 22px; height: 22px; }
  .motivos p { margin-top: 4px; font-size: var(--t-peq); }

  /* Cartões das áreas e dos documentos: um por vez, passando de lado */
  .cartoes, .materiais {
    display: flex; gap: 12px; overflow-x: auto; scroll-snap-type: x mandatory; overscroll-behavior-x: contain;
    margin-inline: 0; padding: 4px var(--lado) 14px; scroll-padding-inline: var(--lado); scrollbar-width: none;
  }
  .cartoes::-webkit-scrollbar, .materiais::-webkit-scrollbar, .socios::-webkit-scrollbar { display: none; }
  .cartao, .mat { flex: 0 0 84%; scroll-snap-align: start; }
  .cartao { padding: 24px 22px 20px; }
  .casos-sec .cartoes { padding-bottom: 6px; }
  .materiais { margin: 28px calc(-1 * var(--lado)) 0; }

  /* Urgência: a carta menor, logo depois do aviso */
  .urg-grade { gap: 36px; }
  .negativa { width: min(100% - 16px, 330px); }
  .neg-papel { padding: 22px 20px 24px; gap: 12px; }
  .neg-campos > div { grid-template-columns: 84px minmax(0, 1fr); }
  .neg-carimbo { font-size: 1.125rem; left: 20px; bottom: 28px; }
  .passos p { font-size: var(--t-peq); }

  /* Equipe: os cinco numa faixa só */
  .socios { display: flex; gap: 14px; overflow-x: auto; scroll-snap-type: x mandatory; margin: 28px calc(-1 * var(--lado)) 0; padding: 8px var(--lado) 14px; scroll-padding-inline: var(--lado); scrollbar-width: none; }
  .socios li { flex: 0 0 62%; scroll-snap-align: start; }
  .socio-dir .retrato { max-width: none; }
  .ficha { margin-top: 32px; gap: 14px; }

  .perguntas-foto { display: none; }
  .perguntas-txt h2 { margin-top: 0; }
  .contato .botao, .fecho .botao { width: 100%; }
}

/* ------------------------------------------------------------- política de privacidade */
.politica { padding-block: clamp(32px, 5vw, 64px) clamp(56px, 7vw, 96px); }
.politica .faixa > * { max-width: 44rem; }
.politica h1 { font-size: var(--t-h2); font-stretch: 80%; line-height: 1.08; margin-top: 20px; }
.politica .sub { margin-top: 12px; font-size: var(--t-dest); line-height: 1.4; }
.politica .tom { margin-top: 8px; }
.politica h2 { font-size: var(--t-dest); font-stretch: 85%; font-weight: 600; line-height: 1.25; margin-top: 40px; }
.politica h2 + p, .politica h2 + ul { margin-top: 10px; }
.politica p + p { margin-top: 12px; }
.politica ul { padding-left: 1.2em; display: grid; gap: 8px; }
.politica ul + p { margin-top: 12px; }
.politica-volta { margin-top: 40px; }