/* Carol Domingues — prévia do site (Henrique Figueirôa, out/2026)
   O site é um mapa de posicionamento: quem visita é um ponto na multidão do "mais do mesmo" e a rolagem leva
   esse ponto até virar marca (o pingo do "i" de Domingues). Papel de caderno de estratégia, tinta, champanhe.
   Fontes: Lora (serifa de leitura fácil, traço firme) e Hanken Grotesk. */
@font-face{font-family:"Lora";src:url("assets/fontes/lora-latin.woff2") format("woff2");font-weight:400 700;font-display:swap}
@font-face{font-family:"Hanken Grotesk";src:url("assets/fontes/hanken-grotesk-latin.woff2") format("woff2");font-weight:400 600;font-display:swap}

:root{
  --papel:#F3F0EB; --papel-2:#ECE7DF; --linha:#D9D1C5; --tinta:#1C1917; --grafite:#57514B; --nevoa:#8C857C;
  --perola:#C9BFB1; --champanhe:#B48A4E; --champanhe-claro:#E8D9BF; --champanhe-texto:#8C6A35; --noite:#171412;
  --serif:"Lora",Georgia,serif; --sans:"Hanken Grotesk","Helvetica Neue",Arial,sans-serif;
  --barra:72px; --margem:clamp(20px,5vw,72px);
}
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--papel);color:var(--tinta);font:400 17px/1.65 var(--sans);-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%;height:auto}
a{color:inherit}
h1,h2,h3{margin:0;font-weight:500}
p{margin:0}
:focus-visible{outline:2px solid var(--champanhe);outline-offset:3px;border-radius:4px}
.pular-conteudo{position:absolute;left:12px;top:-60px;z-index:100;background:var(--tinta);color:#fff;padding:10px 14px;border-radius:8px}
.pular-conteudo:focus{top:12px}

/* o pingo dourado do "i" (no nome, em todo lugar) */
.pingo{position:relative;display:inline-block}
.pingo::after{content:"";position:absolute;left:50%;top:.115em;width:.17em;height:.17em;margin-left:-.085em;border-radius:50%;background:var(--champanhe)}

/* ── Botões ── */
.botao{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:0 26px;border-radius:999px;border:0;font:500 16px/1 var(--sans);text-decoration:none;cursor:pointer;transition:background-color .2s,color .2s,transform .2s,border-color .2s}
.botao:hover{transform:translateY(-1px)}
.botao-escuro{background:var(--tinta);color:var(--papel)}
.botao-escuro:hover{background:#000}
.botao-claro{background:var(--papel);color:var(--tinta)}
.botao-ouro{background:var(--champanhe);color:#fff}
.botao-ouro:hover{background:#A47B42}
.botao-linha{background:transparent;color:var(--tinta);border:1px solid var(--tinta)}
.botao-linha:hover{background:var(--tinta);color:var(--papel)}

/* ── Barra ── */
.barra{position:fixed;inset:0 0 auto 0;z-index:50;height:var(--barra);display:flex;align-items:center;gap:24px;padding:0 var(--margem);transition:background-color .35s,box-shadow .35s,color .25s}
.barra.solida{background:rgba(243,240,235,.94);box-shadow:0 1px 0 var(--linha);backdrop-filter:blur(10px)}
.barra.escura{color:var(--papel)}
.marca{margin-right:auto;font:500 24px/1 var(--serif);letter-spacing:-.01em;text-decoration:none}
.menu{display:flex;align-items:center;gap:26px;font-size:15px}
.menu a{text-decoration:none}
.menu a:not(.menu-zap):hover{text-decoration:underline;text-underline-offset:6px;text-decoration-thickness:1px}
.menu .menu-zap{padding:11px 18px;border-radius:999px;background:var(--tinta);color:var(--papel);font-weight:500}
.barra.escura .menu .menu-zap{background:var(--papel);color:var(--tinta)}
.menu-botao{display:none}
/* durante a viagem do mapa o cabeçalho fica só com o nome, "Pular a viagem" e "Fale comigo": os links das seções
   eram uma saída no meio da experiência. Quando a foto abre, o menu inteiro volta (classe .viajando no script) */
.barra-pular{display:none;align-items:center;font-size:15px;text-decoration:none;color:inherit;opacity:.78}
.barra-pular:hover{opacity:1;text-decoration:underline;text-underline-offset:6px;text-decoration-thickness:1px}
.barra.viajando .barra-pular{display:inline-flex}
.barra.viajando .menu a:not(.menu-zap){display:none}

/* ── O mapa (a viagem) ── */
.mapa{position:relative;height:640vh}
.mapa-palco{position:sticky;top:0;height:100vh;height:100lvh;overflow:hidden;background:var(--papel)}
.mapa-tela{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:pan-y}
/* marcas das paradas da viagem: no celular, a rolagem nativa encaixa em cada uma (classe .na-viagem no script) */
.paradas{position:absolute;inset:0;pointer-events:none}
.paradas i{position:absolute;left:0;width:1px;height:1px;scroll-snap-align:start;scroll-snap-stop:always}
@media (pointer:coarse){
  html.na-viagem{scroll-snap-type:y mandatory}
  /* o palco tem a altura grande da tela; o que fica embaixo sobe o tanto que a barra do navegador ocupa agora */
  .trilha{bottom:calc(26px + 100lvh - 100dvh)}
}
.abertura{position:absolute;z-index:3;left:calc(var(--margem) - 22px);top:calc(var(--barra) + clamp(16px,5vh,60px));max-width:min(604px,calc(100% - 2*var(--margem) + 44px));padding:22px;border-radius:6px;background:rgba(243,240,235,.9);box-shadow:0 0 40px 24px rgba(243,240,235,.9);transition:opacity .5s,transform .5s}
.abertura.some{opacity:0;transform:translateY(-14px);pointer-events:none}
.abertura-sobre{font-size:14px;letter-spacing:.02em;color:var(--grafite)}
.abertura h1{margin-top:14px;font:500 clamp(36px,4.6vw,66px)/1.04 var(--serif);letter-spacing:-.015em}
.abertura-pergunta{margin-top:26px;font:500 18px/1.3 var(--sans)}
.nichos{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.nichos button{padding:9px 16px;border-radius:999px;border:1px solid var(--linha);background:rgba(243,240,235,.85);font:500 15px var(--sans);color:var(--tinta);cursor:pointer;transition:border-color .2s,background-color .2s,color .2s}
.nichos button:hover{border-color:var(--tinta)}
.nichos button.sim{background:var(--tinta);border-color:var(--tinta);color:var(--papel)}
.abertura-dica{display:flex;align-items:center;gap:10px;margin-top:22px;font-size:14px;color:var(--grafite);max-width:44ch}
.dica-ponto{flex:none;width:12px;height:12px;border-radius:50%;background:var(--champanhe);box-shadow:0 0 0 0 rgba(180,138,78,.5);animation:pulsa 1.8s ease-out infinite}
@keyframes pulsa{to{box-shadow:0 0 0 12px rgba(180,138,78,0)}}
.estacao{position:absolute;z-index:3;right:var(--margem);top:50%;width:min(420px,calc(100% - 2*var(--margem)));padding:26px 28px 28px;border-radius:18px;background:rgba(250,248,245,.94);box-shadow:0 30px 60px -30px rgba(28,25,23,.35),0 0 0 1px var(--linha);opacity:0;transform:translateY(-42%);pointer-events:none;transition:opacity .45s,transform .55s cubic-bezier(.2,.8,.2,1)}
.estacao.ativa{opacity:1;transform:translateY(-50%);pointer-events:auto}
.estacao-num{font-size:13px;letter-spacing:.04em;color:var(--champanhe-texto);font-weight:600}
.estacao h2{margin-top:8px;font:500 clamp(26px,2.4vw,32px)/1.12 var(--serif)}
.estacao>p:last-child{margin-top:12px;color:var(--grafite)}
.chegada{position:absolute;z-index:3;left:0;top:0;margin:-6px 0 0 -14px;padding:6px 14px;border-radius:999px;background:rgba(243,240,235,.94);font:500 clamp(15px,1.3vw,18px)/1.3 var(--sans);color:var(--grafite);opacity:0;transition:opacity .5s;pointer-events:none;white-space:nowrap}
.chegada.ativa{opacity:1}
.revela{position:absolute;inset:0;z-index:4;pointer-events:none;visibility:hidden}
.revela.aberta{visibility:visible}
.revela.toda{pointer-events:auto}
.revela-foto{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform-origin:72% 38%;will-change:transform}
.revela-foto-alta{display:none}
/* sombra no alto da foto: a letra clara do cabeçalho aparece mesmo sobre a cortina clara (no celular ela fica no topo) */
.revela::before{content:"";position:absolute;z-index:1;inset:0 0 auto 0;height:150px;background:linear-gradient(180deg,rgba(23,20,18,.55),rgba(23,20,18,0));pointer-events:none}
.revela::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(23,20,18,.82) 0%,rgba(23,20,18,.4) 42%,rgba(23,20,18,0) 66%);pointer-events:none}
.revela-texto{position:absolute;z-index:2;left:var(--margem);bottom:clamp(48px,12vh,120px);max-width:min(460px,calc(100% - 2*var(--margem)));color:var(--papel);opacity:0;transform:translateY(12px);transition:opacity .45s ease-out,transform .45s ease-out}
.revela.texto .revela-texto{opacity:1;transform:none}
.revela-oi{font:500 clamp(38px,4.6vw,64px)/1.04 var(--serif);letter-spacing:-.015em}
.revela-texto>p:not(.revela-oi){margin-top:14px;color:rgba(243,240,235,.85)}
.revela-texto .botao{margin-top:24px}
.trilha{position:absolute;z-index:3;left:var(--margem);bottom:26px;display:flex;gap:6px;margin:0;padding:0;list-style:none;opacity:0;transition:opacity .4s}
.trilha.ativa{opacity:1}
.trilha li{width:34px;height:3px;border-radius:2px;background:var(--linha);overflow:hidden;position:relative}
.trilha li::after{content:"";position:absolute;inset:0;background:var(--champanhe);transform:scaleX(var(--t,0));transform-origin:left}
.pular{position:absolute;z-index:5;right:var(--margem);bottom:18px;padding:7px 14px;border-radius:999px;background:rgba(243,240,235,.94);box-shadow:0 0 0 1px var(--linha);font-size:13px;font-weight:500;color:var(--grafite);text-decoration:none}
.pular:hover{color:var(--tinta)}
.pular{transition:opacity .3s,visibility .3s}
.mapa.revelando .pular{opacity:0;visibility:hidden}
/* setas da viagem: apoio discreto pra quem está no mouse (no toque, o arrasto já anda uma etapa) */
.setas{display:none}
@media (hover:hover) and (pointer:fine){
  .setas{position:absolute;z-index:5;left:50%;bottom:18px;display:flex;gap:8px;transform:translateX(-50%);transition:opacity .3s,visibility .3s}
  .seta{display:grid;place-items:center;width:38px;height:38px;padding:0;border:0;border-radius:50%;background:rgba(243,240,235,.94);box-shadow:0 0 0 1px var(--linha);color:var(--grafite);cursor:pointer;transition:color .2s,box-shadow .2s,opacity .25s,visibility .25s}
  .seta:hover{color:var(--tinta);box-shadow:0 0 0 1px var(--champanhe)}
  .seta svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
  .seta[hidden]{display:grid;opacity:0;visibility:hidden}
  .mapa.revelando .setas{opacity:0;visibility:hidden}
}
.mapa.na-foto .pular{background:rgba(23,20,18,.6);box-shadow:0 0 0 1px rgba(243,240,235,.25);color:rgba(243,240,235,.9)}

/* ── Sobre ── */
/* Sobre: uma cena presa em dois atos. Ato 1: ela de corpo inteiro num arco + a frase. Ao rolar, a câmera se
   aproxima, o arco fecha num círculo em volta do rosto (o pingo) e o texto troca pela frase que fecha a história.
   Tamanhos (--fw, --palco) medidos no script. */
.sobre{padding:0 var(--margem)}
.sobre-palco{position:relative;height:var(--palco,auto)}
.sobre-cena{position:sticky;top:var(--barra);min-height:calc(100vh - var(--barra));display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(32px,6vw,96px);align-items:center;padding:24px 0}
.sobre-foto{justify-self:center;width:min(100%,var(--fw,100%));margin:0;overflow:hidden;clip-path:inset(0 round 999px 999px 4px 4px)}
.sobre-foto img{display:block;width:100%;aspect-ratio:2/3;object-fit:cover;transform-origin:52% 0%;will-change:transform}
.sobre-texto{display:grid}
.sobre-ato{grid-area:1/1;align-self:center;transition:opacity .55s ease,transform .55s ease,visibility .55s}
.sobre-ato-2{opacity:0;visibility:hidden;transform:translateY(18px)}
.sobre.ato2 .sobre-ato-1{opacity:0;visibility:hidden;transform:translateY(-18px)}
.sobre.ato2 .sobre-ato-2{opacity:1;visibility:visible;transform:none}
.sobre h2,.sobre-frase{font:500 clamp(30px,3.4vw,48px)/1.1 var(--serif);letter-spacing:-.01em;max-width:20ch}
.sobre-ato>p:not(.sobre-assina):not(.sobre-frase){margin-top:20px;color:var(--grafite);max-width:58ch}
.sobre-assina{margin-top:30px;font:500 30px/1 var(--serif)}
/* sem animação: os dois atos um embaixo do outro, foto já no círculo */
.sobre.parado .sobre-cena{position:static}
.sobre.parado .sobre-ato{grid-area:auto;opacity:1;visibility:visible;transform:none}
.sobre.parado .sobre-ato-2{margin-top:40px}

/* ── Diagnóstico ── */
.diag{padding:clamp(90px,12vw,150px) var(--margem);background:var(--papel-2);border-top:1px solid var(--linha);border-bottom:1px solid var(--linha)}
.diag-cabeca{max-width:640px}
.diag h2{font:500 clamp(30px,3.4vw,48px)/1.1 var(--serif);letter-spacing:-.01em}
.diag-cabeca p{margin-top:14px;color:var(--grafite)}
.diag-grade{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:clamp(28px,5vw,80px);align-items:center;margin-top:clamp(32px,4vw,52px)}
.dq{min-width:0;min-height:380px;display:flex;flex-direction:column}
.dq-topo{display:flex;align-items:center;gap:14px;margin-bottom:22px;font-size:13px;color:var(--grafite)}
.dq-barra{flex:1;height:2px;background:var(--linha);overflow:hidden}
.dq-barra i{display:block;height:100%;width:0;background:var(--champanhe);transition:width .45s cubic-bezier(.2,.8,.2,1)}
.dq-passo{display:none;margin:0;padding:0;border:0;min-width:0}
.dq-passo.ativo{display:block;animation:dq-entra .45s cubic-bezier(.2,.8,.2,1)}
@keyframes dq-entra{from{opacity:0;transform:translateX(16px)}to{opacity:1;transform:none}}
.dq-passo legend{padding:0;font:500 clamp(23px,2.2vw,30px)/1.2 var(--serif)}
.dq-opcoes{display:grid;gap:10px;margin-top:22px;max-width:540px}
.dq-opcoes button{padding:15px 18px;border-radius:14px;border:1px solid var(--linha);background:var(--papel);font:500 16px/1.35 var(--sans);color:var(--tinta);text-align:left;cursor:pointer;transition:border-color .2s,background-color .2s,transform .15s}
.dq-opcoes button:hover{border-color:var(--tinta)}
.dq-opcoes button:active{transform:scale(.99)}
.dq-opcoes button.sim{background:var(--tinta);border-color:var(--tinta);color:var(--papel)}
.dq-voltar,.dq-refazer{align-self:flex-start;margin-top:22px;border:0;background:none;padding:6px 0;font:500 14px var(--sans);color:var(--grafite);text-decoration:underline;text-underline-offset:4px;cursor:pointer}
.dq-resultado{animation:dq-entra .5s cubic-bezier(.2,.8,.2,1)}
.dq-rotulo{font-size:13px;letter-spacing:.04em;color:var(--champanhe-texto);font-weight:600}
.dq-quadrante{margin-top:8px;font:500 clamp(34px,3.6vw,52px)/1.05 var(--serif);letter-spacing:-.015em}
.dq-texto{margin-top:14px;color:var(--grafite);max-width:46ch}
.dq-acoes{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px}
.dq-salvo{margin-top:14px;font-size:14px;color:var(--champanhe-texto)}
.dq-mapa{margin:0;padding:clamp(12px,2vw,22px);background:var(--papel);border-radius:22px;box-shadow:0 0 0 1px var(--linha),0 30px 60px -36px rgba(28,25,23,.35)}
.dq-mapa svg{display:block;width:100%;height:auto;overflow:visible}
.dq-grade line{stroke:var(--linha);stroke-width:.6}
.dq-eixo{fill:none;stroke:var(--grafite);stroke-width:1}
.dq-eixo-rot{font:500 12px var(--sans);fill:var(--grafite)}
.dq-quad{font:500 13.5px var(--serif);fill:var(--grafite)}
/* contorno de papel: o texto nunca some atrás de um ponto ou de uma linha */
.dq-eixo-rot,.dq-quad,.dq-voce text{paint-order:stroke;stroke:var(--papel);stroke-width:4px;stroke-linejoin:round}
.dq-multidao circle{fill:var(--perola)}
.dq-rastro{fill:none;stroke:var(--champanhe);stroke-width:1.4;stroke-dasharray:3 4}
.dq-voce{transition:transform .9s cubic-bezier(.3,1.4,.5,1)}
.dq-voce-ponto{fill:var(--champanhe)}
.dq-voce-halo{fill:var(--champanhe);opacity:.18}
.dq-voce text{font:600 11px var(--sans);fill:var(--champanhe-texto)}

/* ── Consultoria ── */
.consultoria{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,4fr);gap:clamp(32px,6vw,96px);align-items:center;padding:clamp(90px,12vw,150px) var(--margem);background:var(--noite);color:var(--papel)}
.cons-sobre{font-size:14px;letter-spacing:.04em;color:var(--champanhe-claro)}
.consultoria h2{margin-top:12px;font:500 clamp(30px,3.4vw,48px)/1.1 var(--serif);letter-spacing:-.01em;max-width:22ch}
.cons-texto>p:not(.cons-sobre){margin-top:18px;color:rgba(243,240,235,.78);max-width:56ch}
.cons-lista{margin:26px 0 0;padding:0;list-style:none;display:grid;gap:10px;max-width:56ch}
.cons-lista li{position:relative;padding-left:22px;color:rgba(243,240,235,.9)}
.cons-lista li::before{content:"";position:absolute;left:0;top:.62em;width:7px;height:7px;border-radius:50%;background:var(--champanhe)}
.cons-preco{padding:clamp(26px,3vw,40px);border-radius:22px;background:var(--papel);color:var(--tinta)}
.cons-parcela{font:600 clamp(40px,4vw,56px)/1 var(--serif);letter-spacing:-.01em}
.cons-parcela span{display:block;margin-bottom:6px;font:500 15px var(--sans);letter-spacing:0;color:var(--grafite)}
.cons-vista{margin-top:10px;color:var(--grafite)}
.cons-preco .botao{width:100%;margin-top:26px}
.cons-nota{margin-top:16px;font-size:14px;color:var(--grafite)}

/* ── Dúvidas ── */
.duvidas{padding:clamp(90px,12vw,150px) var(--margem)}
.duvidas h2{font:500 clamp(30px,3.4vw,48px)/1.1 var(--serif)}
.duv-grade{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:clamp(28px,5vw,80px);margin-top:clamp(28px,4vw,48px);align-items:start}
.duv-perguntas{display:grid;border-top:1px solid var(--linha)}
.duv-perguntas button{position:relative;padding:18px 0 18px 26px;border:0;border-bottom:1px solid var(--linha);background:none;font:500 17px/1.35 var(--sans);color:var(--grafite);text-align:left;cursor:pointer;transition:color .2s}
.duv-perguntas button::before{content:"";position:absolute;left:4px;top:50%;width:9px;height:9px;margin-top:-4.5px;border-radius:50%;border:1px solid var(--perola);transition:background-color .25s,border-color .25s,transform .25s}
.duv-perguntas button[aria-selected="true"]{color:var(--tinta)}
.duv-perguntas button[aria-selected="true"]::before{background:var(--champanhe);border-color:var(--champanhe);transform:scale(1.25)}
.duv-resposta{position:sticky;top:calc(var(--barra) + 30px);font:500 clamp(22px,2vw,28px)/1.35 var(--serif);color:var(--tinta);animation:dq-entra .4s}

/* ── Rodapé ── */
.rodape{padding:clamp(60px,7vw,96px) var(--margem) 26px;background:var(--papel-2);border-top:1px solid var(--linha)}
.rodape-topo{display:grid;grid-template-columns:minmax(0,6fr) repeat(2,minmax(0,3fr));gap:clamp(28px,4vw,56px)}
.rodape-nome{font:500 34px/1 var(--serif)}
.rodape-frase{margin-top:14px;color:var(--grafite);max-width:32ch}
.rodape-col h3{margin-bottom:14px;font:600 13px/1 var(--sans);letter-spacing:.04em;color:var(--champanhe-texto)}
.rodape-col p{font-size:15px;color:var(--grafite)}
.rodape-col p+p{margin-top:10px}
.rodape-col a{text-decoration:none}
.rodape-col a:hover{text-decoration:underline;text-underline-offset:4px}
.rodape-pe{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin-top:clamp(44px,6vw,72px);padding-top:20px;border-top:1px solid var(--linha);font-size:13px;color:var(--grafite)}

/* ── Crédito do Henrique ── */
.hf-credito{display:flex;align-items:center;gap:8px;font-size:13px;opacity:.85}
.hf-credito a{display:inline-flex;align-items:center;gap:7px;font-weight:600;text-decoration:none;color:inherit}
.hf-credito a:hover{text-decoration:underline;text-underline-offset:4px}
.hf-mark{flex:none;border-radius:6px}

/* ── Celular e tablet ── */
@media (max-width:1000px){
  .menu{position:fixed;inset:var(--barra) 0 auto 0;flex-direction:column;align-items:stretch;gap:0;padding:8px var(--margem) 22px;background:rgba(243,240,235,.98);color:var(--tinta);box-shadow:0 20px 40px rgba(0,0,0,.1);opacity:0;visibility:hidden;transform:translateY(-8px);transition:opacity .25s,transform .25s,visibility .25s}
  .menu a{padding:15px 0;border-bottom:1px solid var(--linha);font-size:17px}
  .menu .menu-zap{margin-top:14px;text-align:center;border:0}
  .barra.aberta .menu{opacity:1;visibility:visible;transform:none}
  .barra.aberta{background:rgba(243,240,235,.98);color:var(--tinta)}
  .barra.viajando .menu-botao{display:none}
  .barra.viajando .barra-pular{margin-right:-4px;padding:8px 14px;border-radius:999px;background:rgba(243,240,235,.9);box-shadow:0 0 0 1px var(--linha);font-size:14px;opacity:1}
  .menu-botao{display:grid;place-content:center;gap:7px;width:46px;height:46px;margin-right:-10px;padding:0;border:0;background:none;color:inherit;cursor:pointer}
  .menu-botao span{display:block;width:24px;height:2px;background:currentColor;transition:transform .25s}
  .barra.aberta .menu-botao span:first-child{transform:translateY(4.5px) rotate(45deg)}
  .barra.aberta .menu-botao span:last-child{transform:translateY(-4.5px) rotate(-45deg)}
  .sobre,.diag-grade,.consultoria,.duv-grade{grid-template-columns:minmax(0,1fr)}
  .sobre-cena{grid-template-columns:minmax(0,1fr);align-content:center;gap:22px}
  .sobre h2,.sobre-frase{font-size:clamp(25px,6.6vw,32px)}
  .sobre-ato>p:not(.sobre-assina):not(.sobre-frase){margin-top:14px;font-size:15px}
  .sobre-assina{margin-top:18px;font-size:24px}
  .rodape-topo{grid-template-columns:1fr 1fr}
  .rodape-marca{grid-column:1/-1}
  .duv-resposta{position:static}
}
@media (max-width:640px){
  :root{--barra:64px}
  body{font-size:16px}
  .marca{font-size:21px}
  .mapa{height:560vh}
  .abertura h1{font-size:clamp(31px,8.6vw,40px)}
  .abertura-pergunta{margin-top:18px}
  .nichos button{padding:8px 13px;font-size:14px}
  .abertura-dica{margin-top:16px;font-size:13px}
  .abertura{top:calc(var(--barra) + 6px);padding:14px 16px 16px}
  .dq-mapa{order:-1;width:min(100%,360px);justify-self:center}
  .estacao{left:var(--margem);right:var(--margem);top:auto;bottom:70px;bottom:calc(70px + 100lvh - 100dvh);width:auto;padding:20px 22px 22px;transform:translateY(18px)}
  .estacao.ativa{transform:none}
  .revela-foto-larga{display:none}
  .revela-foto-alta{display:block}
  .revela::after{background:linear-gradient(0deg,rgba(23,20,18,.86) 0%,rgba(23,20,18,.45) 40%,rgba(23,20,18,0) 62%)}
  .revela-texto{bottom:70px;bottom:calc(70px + 100lvh - 100dvh)}
  .rodape-topo{grid-template-columns:1fr}
  .rodape-pe{flex-direction:column;align-items:flex-start}
}
/* sem animação: o mapa vira uma página comum */
.mapa.parado{height:auto}
.mapa.parado .mapa-palco{position:relative;height:auto;min-height:100vh;padding-bottom:40px}
.mapa.parado .mapa-tela{position:relative;height:70vh}
.mapa.parado .estacao{position:relative;inset:auto;transform:none;opacity:1;margin:16px var(--margem);width:auto}
.mapa.parado .revela,.mapa.parado .chegada,.mapa.parado .trilha,.mapa.parado .pular,.mapa.parado .setas{display:none}

/* ── Bio (links do Instagram): mesma identidade, papel quadriculado de caderno de estratégia ── */
.bio-pagina{min-height:100vh;background-color:var(--papel);background-image:linear-gradient(rgba(217,209,197,.5) 1px,transparent 1px),linear-gradient(90deg,rgba(217,209,197,.5) 1px,transparent 1px);background-size:28px 28px}
.bio{max-width:460px;margin:0 auto;padding:44px 20px 28px}
.bio-topo{text-align:center}
.bio-nome{margin-top:18px;font:500 40px/1 var(--serif);letter-spacing:-.01em}
.bio-sub{margin-top:10px;font-size:14px;letter-spacing:.02em;color:var(--champanhe-texto)}
.bio-frase{margin:14px auto 0;max-width:30ch;font:500 19px/1.35 var(--serif);color:var(--grafite)}
.bio-mapa{display:block;margin-top:12px;padding:14px 14px 18px;background:var(--papel);border-radius:14px;box-shadow:0 0 0 1px var(--linha),0 18px 40px -28px rgba(28,25,23,.35);text-decoration:none;transition:transform .2s,box-shadow .2s}
.bio-mapa:hover{transform:translateY(-2px);box-shadow:0 0 0 1px var(--champanhe),0 18px 40px -24px rgba(28,25,23,.4)}
.bio-mapa-svg{display:block;width:100%;height:auto}
.bio-mapa-grade line{stroke:var(--linha);stroke-width:.6}
.bio-mapa-eixo{fill:none;stroke:var(--grafite);stroke-width:.9}
.bio-mapa-multidao circle{fill:var(--perola)}
.bio-mapa-rota{fill:none;stroke:var(--champanhe);stroke-width:1.6;stroke-linecap:round}
.bio-mapa-ponto{fill:var(--champanhe)}
.bio-mapa-svg.chegou .bio-mapa-ponto{animation:bio-pulsa 2.4s ease-in-out infinite;transform-box:fill-box;transform-origin:center}
@keyframes bio-pulsa{50%{transform:scale(1.35)}}
.bio-mapa-texto{display:block;margin-top:12px;padding:0 4px}
.bio-mapa-texto strong{display:block;font:500 22px/1.15 var(--serif)}
.bio-mapa-texto small{display:block;margin-top:6px;font-size:14px;line-height:1.45;color:var(--grafite)}
.bio-links{display:grid;gap:12px;margin-top:28px}
/* o cartão do WhatsApp: escuro, ela à direita se fundindo no fundo, frase em serifa e botão em pílula */
.bio-cartao{position:relative;display:block;min-height:220px;border-radius:18px;overflow:hidden;background:var(--noite);color:var(--papel);text-decoration:none;box-shadow:0 22px 44px -26px rgba(23,20,18,.7);transition:transform .2s,box-shadow .2s}
.bio-cartao:hover{transform:translateY(-2px);box-shadow:0 26px 50px -24px rgba(23,20,18,.75)}
.bio-cartao-foto{position:absolute;right:0;top:0;width:54%;height:100%;object-fit:cover;object-position:50% 18%;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 46%);mask-image:linear-gradient(90deg,transparent 0,#000 46%)}
.bio-cartao-marca{position:absolute;left:30%;top:52%;transform:translate(-50%,-50%);font:500 170px/1 var(--serif);letter-spacing:-.04em;color:rgba(243,240,235,.05);pointer-events:none}
.bio-cartao-texto{position:relative;z-index:1;display:flex;flex-direction:column;align-items:flex-start;max-width:64%;padding:26px 0 24px 22px}
.bio-cartao-rotulo{font-size:12.5px;letter-spacing:.03em;color:var(--champanhe-claro)}
.bio-cartao-titulo{margin-top:10px;font:500 25px/1.16 var(--serif)}
.bio-cartao-botao{display:inline-flex;align-items:center;gap:8px;margin-top:20px;padding:11px 18px;border-radius:999px;background:var(--champanhe);color:var(--noite);font-weight:600;font-size:14px;line-height:1}
.bio-cartao-botao::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--noite)}
.bio-link{display:flex;align-items:center;gap:14px;padding:16px 18px;background:var(--papel);border-radius:14px;box-shadow:0 0 0 1px var(--linha);text-decoration:none;transition:transform .2s,box-shadow .2s}
.bio-link::before{content:"";flex:none;width:10px;height:10px;border-radius:50%;background:var(--perola);transition:background .2s}
.bio-link:hover{transform:translateY(-2px);box-shadow:0 0 0 1px var(--champanhe)}
.bio-link:hover::before{background:var(--champanhe)}
.bio-link span{font-weight:600;font-size:16px;line-height:1.3}
.bio-link small{display:block;margin-top:3px;font-weight:400;font-size:13.5px;color:var(--grafite)}
.bio-link-principal{background:var(--tinta);color:var(--papel);box-shadow:none}
.bio-link-principal::before{background:var(--champanhe)}
.bio-link-principal small{color:rgba(243,240,235,.7)}
.bio-link-principal:hover{box-shadow:0 0 0 1px var(--tinta)}
.bio-pe{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin-top:34px;padding-top:16px;border-top:1px solid var(--linha);font-size:12.5px;color:var(--nevoa)}
.bio-pe a{color:inherit;text-decoration:none}
@media (prefers-reduced-motion: reduce){.bio-mapa-svg.chegou .bio-mapa-ponto{animation:none}}

/* AJUSTE 10/11/2026: o diagnóstico inteiro cabe na tela no computador */
@media (min-width:1001px){
  .diag{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);grid-template-rows:auto 1fr;column-gap:clamp(28px,5vw,80px);align-items:start;padding-top:clamp(48px,7vh,80px);padding-bottom:clamp(48px,7vh,80px)}
  .diag-grade{display:contents}
  .diag-cabeca{grid-column:1;grid-row:1}
  .dq{grid-column:1;grid-row:2;margin-top:clamp(22px,3.4vh,40px);min-height:0}
  .dq-mapa{grid-column:2;grid-row:1 / span 2;justify-self:end;width:min(100%,calc(100svh - var(--barra) - 150px));min-width:360px}
}

/* AJUSTE 10/11/2026: com a foto da poltrona, o zoom fecha o círculo com o rosto no centro (rosto em ~50% x 26% da foto) */
.sobre-foto img{transform-origin:50% 9%}

/* AJUSTE 10/11/2026: a âncora do diagnóstico para abaixo da barra fixa (o espaço de cima da seção diminuiu) */
.diag{scroll-margin-top:var(--barra)}
