/* ============================================================
   Empresário Ciborgue · Rafael Guzzo — brand.css
   Sistema de design reutilizável (variáveis + base + componentes)
   ============================================================ */

:root{
  /* Cores conceito */
  --cor-tinta:#141413;
  --cor-papel:#FAF9F5;
  --cor-humano:#E8602C;   /* clay — a pessoa, o comando */
  --cor-maquina:#3173B8;  /* azul — a IA, a execução */
  /* Aliases */
  --cor-primaria:#E8602C;
  --cor-secundaria:#3173B8;
  /* Neutros / texto */
  --cor-texto-suave:#6B675E;
  --cor-linha:#E6E1D5;
  --cor-papel-2:#F2EFE7;            /* superfície clara alternativa */
  --cor-texto-claro:rgba(250,249,245,.92);
  --cor-texto-claro-suave:rgba(250,249,245,.62);
  --cor-linha-escura:rgba(250,249,245,.14);
  /* Tipografia */
  --fonte-titulo:'Poppins',system-ui,-apple-system,sans-serif;
  --fonte-corpo:'Poppins',system-ui,-apple-system,sans-serif;
  --fonte-mono:'Space Mono','IBM Plex Mono',ui-monospace,SFMono-Regular,monospace;
  /* Forma */
  --raio:14px; --raio-sm:8px; --raio-pill:999px;
  --max:1120px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:var(--fonte-corpo);
  font-weight:300;
  color:var(--cor-tinta);
  background:var(--cor-papel);
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
}
img,svg{max-width:100%}
a{color:inherit}

/* Tipografia */
h1,h2,h3,h4{font-family:var(--fonte-titulo);font-weight:700;line-height:1.12;margin:0 0 .4em}
h1{font-size:clamp(2.4rem,6vw,3.6rem);letter-spacing:-.5px}
h2{font-size:clamp(1.6rem,4vw,2.5rem);letter-spacing:-.3px}
h3{font-size:1.2rem}
p{margin:0 0 1rem}
.lead{font-size:clamp(1.05rem,2.4vw,1.3rem);color:var(--cor-texto-suave)}
.secao-escura .lead{color:var(--cor-texto-claro-suave)}

.eyebrow{
  font-family:var(--fonte-mono);text-transform:uppercase;
  letter-spacing:.2em;font-size:.78rem;color:var(--cor-texto-suave);
  display:inline-block;margin-bottom:1rem;font-weight:400;
}
.secao-escura .eyebrow{color:var(--cor-texto-claro-suave)}
.tag-mono{font-family:var(--fonte-mono);text-transform:uppercase;letter-spacing:.12em;font-size:.95rem}
.tag-mono .h{color:var(--cor-humano)}
.tag-mono .m{color:var(--cor-maquina)}

/* Layout */
.wrap{max-width:var(--max);margin:0 auto;padding:0 22px}
.secao{padding:72px 0}
.secao-escura{background:var(--cor-tinta);color:var(--cor-texto-claro)}
.secao-clara-2{background:var(--cor-papel-2)}
.center{text-align:center}
.grid{display:grid;gap:22px}
@media(min-width:760px){
  .secao{padding:104px 0}
  .grid-2{grid-template-columns:1fr 1fr}
  .grid-3{grid-template-columns:repeat(3,1fr)}
}

/* Botões */
.btn{
  display:inline-flex;align-items:center;gap:8px;
  font-family:var(--fonte-mono);text-transform:uppercase;letter-spacing:.1em;
  font-size:.82rem;font-weight:400;cursor:pointer;
  background:var(--cor-humano);color:#fff;
  padding:15px 28px;border-radius:var(--raio-sm);border:1.5px solid var(--cor-humano);
  text-decoration:none;transition:transform .15s ease,opacity .15s ease;
}
.btn:hover{transform:translateY(-1px);opacity:.94}
.btn--ghost{background:transparent;color:var(--cor-tinta);border-color:var(--cor-linha)}
.secao-escura .btn--ghost{color:var(--cor-texto-claro);border-color:var(--cor-linha-escura)}
.btn--azul{background:var(--cor-maquina);border-color:var(--cor-maquina)}

/* Cards */
.card{
  background:#fff;border:1px solid var(--cor-linha);
  border-radius:var(--raio);padding:28px;
}
.secao-escura .card{background:rgba(250,249,245,.04);border-color:var(--cor-linha-escura)}
.card--clay{border-top:3px solid var(--cor-humano)}
.card--azul{border-top:3px solid var(--cor-maquina)}
.card h3{margin-top:0}

/* Logo lockup */
.ec-lockup{display:flex;align-items:center;gap:13px}
.ec-lockup svg{width:42px;height:42px;flex:none}
.ec-wm{display:flex;flex-direction:column;line-height:1;font-family:var(--fonte-titulo)}
.ec-wm b{font-weight:300;letter-spacing:.18em;font-size:.72rem}
.ec-wm strong{font-weight:700;letter-spacing:.03em;font-size:1.02rem}

/* Navbar */
.nav{position:sticky;top:0;z-index:50;background:rgba(250,249,245,.86);
  backdrop-filter:saturate(140%) blur(10px);border-bottom:1px solid var(--cor-linha)}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;height:68px}
.nav a.link{font-family:var(--fonte-mono);text-transform:uppercase;letter-spacing:.12em;
  font-size:.72rem;text-decoration:none;color:var(--cor-texto-suave);margin-left:20px}
.nav a.link:hover{color:var(--cor-tinta)}
.nav-links{display:none}
@media(min-width:760px){.nav-links{display:flex;align-items:center}}

/* Hero */
.hero{padding:84px 0 64px}
.hero h1{max-width:20ch}
.hero .center h1{max-width:24ch;margin-left:auto;margin-right:auto}
.hero .lead{max-width:48ch}
.hero-cta{display:flex;flex-wrap:wrap;gap:14px;margin-top:30px}

/* Listas pra-quem / inclui */
.lista{list-style:none;padding:0;margin:0}
.lista li{position:relative;padding:10px 0 10px 30px;border-bottom:1px solid var(--cor-linha)}
.secao-escura .lista li{border-color:var(--cor-linha-escura)}
.lista li::before{position:absolute;left:0;top:9px;font-family:var(--fonte-mono);font-size:1rem}
.lista--sim li::before{content:'+';color:var(--cor-maquina)}
.lista--nao li::before{content:'×';color:var(--cor-humano)}
.lista--num{counter-reset:s}
.lista--num li{counter-increment:s;padding-left:44px}
.lista--num li::before{content:counter(s,decimal-leading-zero);color:var(--cor-humano);font-size:.85rem;top:12px}

/* Preço */
.preco{font-family:var(--fonte-titulo);font-weight:700;font-size:clamp(2.4rem,7vw,3.4rem)}
.preco small{display:block;font-family:var(--fonte-mono);font-size:.8rem;font-weight:400;
  letter-spacing:.12em;color:var(--cor-texto-suave);text-transform:uppercase}

/* FAQ */
.faq details{border-bottom:1px solid var(--cor-linha);padding:14px 0}
.secao-escura .faq details{border-color:var(--cor-linha-escura)}
.faq summary{cursor:pointer;font-weight:500;list-style:none;display:flex;justify-content:space-between;gap:12px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:'+';font-family:var(--fonte-mono);color:var(--cor-humano)}
.faq details[open] summary::after{content:'–'}
.faq p{margin:12px 0 4px;color:var(--cor-texto-suave)}
.secao-escura .faq p{color:var(--cor-texto-claro-suave)}

/* Footer */
.footer{background:var(--cor-tinta);color:var(--cor-texto-claro-suave);padding:54px 0}
.footer a{color:var(--cor-texto-claro);text-decoration:none}
.footer .ec-wm{color:var(--cor-texto-claro)}

/* Util */
.divisor{height:1px;background:var(--cor-linha);margin:0}
.pill{display:inline-block;font-family:var(--fonte-mono);font-size:.7rem;text-transform:uppercase;
  letter-spacing:.14em;padding:6px 12px;border-radius:var(--raio-pill);border:1px solid var(--cor-linha);color:var(--cor-texto-suave)}
.mt-0{margin-top:0}.mb-0{margin-bottom:0}

/* --- nav mobile + hero + cards --- */
.nav-right{display:flex;align-items:center;gap:10px}
.nav-cta{padding:9px 16px}
@media(max-width:759px){.nav-cta{padding:8px 14px;font-size:.7rem;letter-spacing:.06em}}
.card{display:flex;flex-direction:column}
.card .btn{margin-top:auto;align-self:flex-start}

/* --- Rafael Guzzo lockup (marca do site / nav / footer) --- */
.rg-lockup{display:flex;align-items:center;gap:11px;text-decoration:none;color:var(--cor-tinta)}
.rg-lockup svg{flex:none}
.rg-wm{font-family:var(--fonte-titulo);font-weight:300;letter-spacing:.22em;font-size:.86rem;white-space:nowrap}
.footer .rg-lockup{color:var(--cor-texto-claro)}
/* --- Empresário Ciborgue lockup (produto / destaque) --- */
.ec-hero{display:flex;flex-direction:column;align-items:center;gap:14px;text-align:center}
.ec-hero .ec-emp{font-family:var(--fonte-titulo);font-weight:300;letter-spacing:.2em;line-height:1;color:var(--cor-tinta)}
.ec-hero .ec-cib{font-family:var(--fonte-titulo);font-weight:700;letter-spacing:.02em;line-height:1.02;color:var(--cor-tinta)}
.ec-hero .ec-dash{display:flex;gap:6px;justify-content:center;margin-top:8px}
.ec-hero .ec-dash i{height:6px;border-radius:3px;display:block}
.secao-escura .ec-hero .ec-emp,.secao-escura .ec-hero .ec-cib{color:var(--cor-texto-claro)}

/* --- QA rodada 2: nav-cta, preço em card, eyebrow centralizada --- */
.nav-cta{white-space:nowrap}
.card .preco{font-size:1.9rem}
.eyebrow.center{display:block;text-align:center}

/* --- Destaques de texto (headline e corpo) --- */
.hl{color:var(--cor-humano)}
strong{font-weight:600}
.destaque-frase{font-family:var(--fonte-titulo);font-weight:500;font-size:clamp(1.2rem,2.8vw,1.6rem);line-height:1.3;color:var(--cor-tinta);margin:1.4rem 0}
.secao-escura .destaque-frase{color:var(--cor-texto-claro)}
/* --- Vagas em destaque grande (mentoria) --- */
.vagas-big{list-style:none;padding:0;margin:8px 0 24px}
.vagas-big li{font-family:var(--fonte-titulo);font-weight:700;font-size:clamp(1.7rem,5.4vw,3.1rem);line-height:1.12;padding:14px 0;border-bottom:1px solid var(--cor-linha-escura)}
.vagas-big li:last-child{border-bottom:0}
/* --- Hero 2 colunas (ignicao) --- */
.hero-2col{display:flex;flex-direction:column;gap:34px;align-items:center}
.hero-2col .col-txt{width:100%}
@media(min-width:820px){.hero-2col{flex-direction:row}.hero-2col .col-txt{flex:1.1}.hero-2col .col-viz{flex:.9;display:flex;justify-content:center}}
/* --- Radar: REMOVIDO em 18/08/2026. Era metáfora de exame e saiu junto
   com o nome Raio-X. O lugar dele é a órbita, no bloco v4 lá embaixo --- */

/* --- Cards de exemplo antes/frase (home, mentoria, ignicao) ---
   A frase é o que o leitor tem que parar pra ler, então ela leva o laranja.
   O "antes" é contexto e fica em texto suave. */
.ex-antes{font-size:.95rem;color:var(--cor-texto-suave);margin:0 0 14px}
.secao-escura .ex-antes{color:var(--cor-texto-claro-suave)}
/* A frase vira balão de mensagem enviada: o produto é falar, e o card mostra isso */
.ex-frase{font-family:var(--fonte-mono);font-size:.86rem;line-height:1.65;
  background:var(--cor-papel-2);border:1px solid var(--cor-linha);
  border-left:3px solid var(--cor-humano);
  border-radius:14px 14px 2px 14px;padding:12px 16px;margin:0}
.ex-frase::before{content:"você, pro Claude:";display:block;font-size:.6rem;
  letter-spacing:.14em;text-transform:uppercase;color:var(--cor-texto-suave);margin-bottom:7px}
.secao-escura .ex-frase{background:rgba(250,249,245,.07);color:var(--cor-texto-claro);
  border-color:var(--cor-linha-escura);border-left-color:var(--cor-humano)}
.secao-escura .ex-frase::before{color:var(--cor-texto-claro-suave)}
/* Cursor piscando no fim da frase: a mensagem parece estar sendo digitada agora */
.ex-frase::after{content:"▍";color:var(--cor-humano);margin-left:3px;
  animation:cursor-pisca 1.1s steps(1) infinite}
@keyframes cursor-pisca{50%{opacity:0}}
/* Card responde ao passar do mouse: convite a ler um por um */
.card--azul,.card--clay{transition:transform .18s ease,box-shadow .18s ease}
.card--azul:hover,.card--clay:hover{transform:translateY(-3px);
  box-shadow:0 10px 28px rgba(20,20,19,.08)}
.ex-nota{font-size:.88rem;color:var(--cor-humano);margin:12px 0 0}
.card--largo{grid-column:1/-1}
.linha-mecanismo{font-family:var(--fonte-mono);font-size:.86rem;letter-spacing:.04em;
  color:var(--cor-texto-suave);margin-top:26px}
.secao-escura .linha-mecanismo{color:var(--cor-texto-claro-suave)}

/* --- Itens de camada (mentoria: Arsenal, Acompanhamento) --- */
/* Só os filhos diretos levam separador. Lista aninhada dentro de um item
   continua sendo uma .lista normal. */
.camada{list-style:none;padding:0;margin:26px 0 0}
.camada>li{padding:20px 0;border-bottom:1px solid var(--cor-linha)}
.secao-escura .camada>li{border-color:var(--cor-linha-escura)}
.camada>li:last-child{border-bottom:0}
.camada>li>b{display:block;font-family:var(--fonte-titulo);font-weight:700;
  font-size:1.12rem;line-height:1.25;margin-bottom:7px}
.camada>li>span{color:var(--cor-texto-suave)}
.secao-escura .camada>li>span{color:var(--cor-texto-claro-suave)}
.camada .lista{margin-top:14px;margin-left:2px}
.camada .lista li{font-size:.96rem;color:var(--cor-texto-suave);padding:8px 0 8px 26px}
.camada .lista li:last-child{border-bottom:0}
.nota-api{font-family:var(--fonte-mono);font-size:.76rem;line-height:1.8;
  color:var(--cor-texto-suave);margin:20px 0 0;padding-top:16px;border-top:1px solid var(--cor-linha)}
.secao-escura .nota-api{color:var(--cor-texto-claro-suave);border-color:var(--cor-linha-escura)}

/* --- Bloco de caso real --- */
.caso{border-left:4px solid var(--cor-humano);padding-left:26px;max-width:68ch}
@media(max-width:759px){.caso{padding-left:16px}}
.caso .fecho{font-weight:500;color:var(--cor-tinta)}
.secao-escura .caso .fecho{color:var(--cor-texto-claro)}

/* --- Divisor dentro de seção escura --- */
.div-escuro{height:1px;background:var(--cor-linha-escura);border:0;margin:52px 0}

/* --- Stats do caso real (números como proporção, nunca valor de cliente) --- */
.stats{display:flex;flex-wrap:wrap;gap:38px;margin-top:30px}
.stats b{display:block;font-family:var(--fonte-titulo);font-weight:700;
  font-size:clamp(2.2rem,6vw,3.2rem);line-height:1;color:var(--cor-humano)}
.stats span{font-family:var(--fonte-mono);font-size:.72rem;text-transform:uppercase;
  letter-spacing:.14em;color:var(--cor-texto-suave)}

/* ============================================================
   v3 · reforço visual da mentoria (13/08, rodada 2 de feedback)
   Padrões do _insumo-3-secao-oferta.md: ficha técnica, trilho
   dos 6 meses, inventário, manifesto do arsenal, esteira, recap
   ============================================================ */

/* Chip de tempo nos cards de exemplo (a faixa é a isca, vai em clay) */
.ex-tempo{font-family:var(--fonte-mono);font-size:.66rem;text-transform:uppercase;
  letter-spacing:.12em;color:var(--cor-texto-suave);margin:0 0 10px}
.ex-tempo b{color:var(--cor-humano);font-weight:700}

/* Ficha técnica (spec bar): "6 meses" como fato, não promessa */
.ficha{display:flex;flex-wrap:wrap;border-top:1px solid var(--cor-linha-escura);
  border-bottom:1px solid var(--cor-linha-escura);margin:34px 0 0}
.ficha>div{flex:1 1 190px;padding:20px 22px;border-left:1px solid var(--cor-linha-escura)}
.ficha>div:first-child{border-left:0}
.ficha small{display:block;font-family:var(--fonte-mono);font-size:.64rem;text-transform:uppercase;
  letter-spacing:.16em;color:var(--cor-texto-claro-suave);margin-bottom:6px}
.ficha b{font-family:var(--fonte-titulo);font-weight:700;font-size:1.18rem;color:var(--cor-texto-claro)}
@media(max-width:759px){.ficha>div{flex:1 1 44%;border-left:0;border-top:1px solid var(--cor-linha-escura)}
  .ficha>div:nth-child(-n+2){border-top:0}}

/* Trilho dos 6 meses: numeral gigante + régua de 12 encontros */
.trilho{display:flex;align-items:center;gap:48px;margin:48px 0 0;flex-wrap:wrap}
.trilho-num{display:flex;align-items:baseline;gap:12px;flex:0 0 auto}
.trilho-num b{font-family:var(--fonte-titulo);font-weight:700;
  font-size:clamp(4.5rem,13vw,8.5rem);line-height:.9;color:var(--cor-humano)}
.trilho-num span{font-family:var(--fonte-mono);font-size:.8rem;letter-spacing:.22em;
  color:var(--cor-texto-claro-suave)}
.regua{flex:1 1 300px;min-width:280px}
.regua ol{list-style:none;display:flex;justify-content:space-between;position:relative;
  padding:0;margin:0;height:14px}
.regua ol::before{content:"";position:absolute;left:0;right:0;top:50%;height:1px;
  background:var(--cor-linha-escura)}
.regua li{position:relative;width:14px;height:14px;border-radius:50%}
.regua li.e{background:var(--cor-humano)}
.regua li.t{background:var(--cor-tinta);border:2px solid var(--cor-maquina);box-sizing:border-box}
.regua-meses{display:flex;justify-content:space-between;font-family:var(--fonte-mono);
  font-size:.62rem;letter-spacing:.08em;color:var(--cor-texto-claro-suave);margin-top:12px}
.regua-leg{font-family:var(--fonte-mono);font-size:.7rem;line-height:2;
  color:var(--cor-texto-claro-suave);margin-top:18px}
.regua-leg i{display:inline-block;width:10px;height:10px;border-radius:50%;
  margin-right:7px;vertical-align:baseline}
.regua-leg .li-e{background:var(--cor-humano)}
.regua-leg .li-t{background:transparent;border:2px solid var(--cor-maquina);box-sizing:border-box}

/* Inventário (livro-razão): índice azul porque é etiqueta; o nome é quem fala */
.inventario{margin-top:48px;border-top:1px solid var(--cor-linha-escura)}
.inventario>div{display:grid;grid-template-columns:44px minmax(0,1fr) minmax(0,1.4fr);
  gap:6px 20px;padding:18px 0;border-bottom:1px solid var(--cor-linha-escura);align-items:baseline}
.inv-num{font-family:var(--fonte-mono);font-size:.78rem;color:var(--cor-maquina)}
.inv-nome{font-family:var(--fonte-titulo);font-weight:700;font-size:1.08rem;color:var(--cor-texto-claro)}
.inv-desc{color:var(--cor-texto-claro-suave);font-size:.96rem}
.inventario>div.inv-arsenal{border-left:3px solid var(--cor-humano);padding-left:18px}
.inv-arsenal .inv-num{color:var(--cor-humano)}
@media(max-width:759px){.inventario>div{grid-template-columns:44px 1fr}.inv-desc{grid-column:2}}

/* Manifesto do arsenal: densidade como prova, sem screenshot */
.manifesto{background:var(--cor-papel-2);border:1px solid var(--cor-linha);
  border-radius:var(--raio);padding:24px 28px;margin-top:30px}
.mf-head{display:flex;justify-content:space-between;gap:12px;font-family:var(--fonte-mono);
  font-size:.66rem;text-transform:uppercase;letter-spacing:.16em;
  color:var(--cor-texto-suave);margin-bottom:18px}
.manifesto ul{list-style:none;padding:0;margin:0;display:grid;
  grid-template-columns:repeat(auto-fill,minmax(185px,1fr));gap:7px 22px;
  font-family:var(--fonte-mono);font-size:.79rem;color:var(--cor-texto-suave)}
.manifesto li.hot{color:var(--cor-humano)}
@media(max-width:600px){.manifesto ul{grid-template-columns:repeat(2,minmax(0,1fr));
  font-size:.7rem;gap:6px 14px}}

/* Esteira da Fábrica: o ato humano em clay, a execução em azul */
.esteira{display:flex;align-items:flex-start;gap:6px;margin:32px 0 6px}
.esteira .etapa{display:flex;flex-direction:column;align-items:center;gap:10px;flex:0 0 auto}
.esteira .no{width:44px;height:44px;border-radius:8px}
.esteira .no-h{background:var(--cor-humano)}
.esteira .no-m{border:2px solid var(--cor-maquina);box-sizing:border-box}
.esteira small{font-family:var(--fonte-mono);font-size:.6rem;letter-spacing:.08em;
  text-transform:uppercase;color:var(--cor-texto-suave);white-space:nowrap}
.esteira .seta{flex:1 1 12px;height:44px;display:flex;align-items:center;min-width:10px}
.esteira .seta::before{content:"";flex:1;height:1px;background:var(--cor-texto-suave);opacity:.5}
@media(max-width:600px){.esteira{flex-direction:column;align-items:flex-start;gap:14px}
  .esteira .etapa{flex-direction:row}
  .esteira .seta{flex:none;height:18px;width:44px;justify-content:center}
  .esteira .seta::before{width:1px;height:100%;flex:none}}

/* Miniaturas geométricas dos cards de bônus (wireframe assumido, não print) */
.mini{height:112px;display:flex;align-items:center;justify-content:center;gap:14px;
  margin-bottom:14px;position:relative;z-index:0}
.mini i{display:block;border:1.5px solid var(--cor-linha);border-radius:5px;
  background:var(--cor-papel);position:relative;overflow:hidden}
.mini .r34{width:63px;height:84px}
.mini .r916{width:47px;height:84px}
.mini .r169{width:142px;height:80px}
.mini .barra::before{content:"";position:absolute;left:8px;right:8px;top:9px;height:7px;
  border-radius:3px;background:var(--cor-humano)}
.mini .linhas::after{content:"";position:absolute;left:8px;right:8px;top:26px;height:26px;
  background:repeating-linear-gradient(to bottom,var(--cor-linha) 0 3px,transparent 3px 11px)}
.mini .faixa::before{content:"";position:absolute;left:0;right:0;bottom:0;height:22%;
  background:var(--cor-humano)}
.mini .cortes::after{content:"";position:absolute;top:10px;bottom:28%;left:36px;width:1px;
  background:var(--cor-linha);box-shadow:34px 0 var(--cor-linha),68px 0 var(--cor-linha)}
.mini .leque{transform:rotate(-7deg);margin-right:-46px}
.mini .leque2{transform:rotate(7deg);margin-left:-46px;z-index:-1}

/* CTA final: recapitulação + eco de garantia + porta dupla */
.recap{columns:2;column-gap:48px;margin:30px auto 0;max-width:780px;text-align:left}
.recap p{break-inside:avoid;font-size:.94rem;color:var(--cor-texto-claro-suave);
  border-bottom:1px solid var(--cor-linha-escura);padding:9px 0 9px 26px;position:relative;margin:0}
.recap p::before{content:'+';position:absolute;left:2px;font-family:var(--fonte-mono);
  color:var(--cor-maquina)}
@media(max-width:759px){.recap{columns:1}}
.eco-garantia{display:flex;gap:18px;align-items:baseline;border:1px solid var(--cor-humano);
  border-radius:var(--raio-sm);padding:15px 20px;margin:34px auto 0;max-width:660px;text-align:left}
.eco-garantia small{font-family:var(--fonte-mono);font-size:.66rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--cor-humano);white-space:nowrap}
.eco-garantia span{color:var(--cor-texto-claro);font-size:.95rem}
.btn--maior{padding:20px 42px;font-size:.92rem}
.recap-nota{font-family:var(--fonte-mono);font-size:.66rem;letter-spacing:.06em;
  color:var(--cor-texto-claro-suave);max-width:780px;margin:12px auto 0;text-align:left}

/* Painel invertido do fecho (padrão Craft): claro na seção escura, botão transbordando */
.painel{background:var(--cor-papel);border-radius:var(--raio);padding:44px 46px 56px;
  position:relative;max-width:860px;margin:34px auto 0;text-align:left}
.painel .eco-garantia{margin:30px 0 0;max-width:none}
.painel .eco-garantia span{color:var(--cor-tinta)}
.painel .recap-nota{color:var(--cor-texto-suave);margin:12px 0 0;max-width:none}
.painel-btn{text-align:center;position:absolute;left:0;right:0;bottom:0;transform:translateY(50%)}
/* .microlinha define margin-top depois no arquivo; a dupla classe garante a folga
   pro botão que transborda o painel (o bug do botão em cima do texto veio daqui) */
.microlinha.pos-painel{margin-top:88px}
.recap2{display:grid;grid-template-columns:1fr 1.15fr;gap:0 52px}
.recap2 small{display:block;font-family:var(--fonte-mono);font-size:.68rem;
  letter-spacing:.16em;text-transform:uppercase;color:var(--cor-texto-suave);margin-bottom:10px}
.recap2 p{font-size:.94rem;color:var(--cor-texto-suave);border-bottom:1px solid var(--cor-linha);
  padding:9px 0 9px 26px;position:relative;margin:0}
.recap2 p::before{content:'+';position:absolute;left:2px;font-family:var(--fonte-mono);
  color:var(--cor-maquina)}
@media(max-width:759px){.recap2{grid-template-columns:1fr}.recap2>div+div{margin-top:26px}
  .painel{padding:30px 24px 50px}}
.microlinha{font-family:var(--fonte-mono);font-size:.7rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--cor-texto-claro-suave);margin-top:24px}
/* Nasceu em seção escura. Em seção clara ficava branca sobre papel, invisível. */
.secao:not(.secao-escura) .microlinha{color:var(--cor-texto-suave)}

/* ============================================================
   v4 · Ignição Ciborgue (ex Raio-X). O radar saiu junto com o
   nome: era metáfora de exame. Entram o símbolo de órbita e as
   variantes claras dos componentes que nasceram em seção escura
   ============================================================ */

/* Órbita: o olho da marca com três agentes em volta. O primeiro é sólido em
   clay (o garantido), os outros dois são anel azul (dependem da dedicação).
   Mesma gramática da régua da mentoria: cheio = certo, vazado = opcional. */
.orbita{width:min(300px,78vw);height:auto}
.orb-gira{transform-origin:100px 100px;animation:orbgira 26s linear infinite}
@keyframes orbgira{from{transform:rotate(0)}to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.orb-gira{animation:none}}

/* Ficha técnica em seção clara */
.ficha--clara{border-color:var(--cor-linha)}
.ficha--clara>div{border-left-color:var(--cor-linha)}
.ficha--clara small{color:var(--cor-texto-suave)}
.ficha--clara b{color:var(--cor-tinta)}
@media(max-width:759px){.ficha--clara>div{border-top-color:var(--cor-linha)}}

/* Inventário em seção clara */
.inventario--claro{border-top-color:var(--cor-linha)}
.inventario--claro>div{border-bottom-color:var(--cor-linha)}
.inventario--claro .inv-nome{color:var(--cor-tinta)}
.inventario--claro .inv-desc{color:var(--cor-texto-suave)}

/* Painel invertido ao contrário: escuro dentro de seção clara.
   A inversão funciona nos dois sentidos; aqui a página fecha clara. */
.painel--escuro{background:var(--cor-tinta)}
.painel--escuro .recap2 small{color:var(--cor-texto-claro-suave)}
.painel--escuro .recap2 p{color:var(--cor-texto-claro-suave);border-bottom-color:var(--cor-linha-escura)}
.painel--escuro .eco-garantia span{color:var(--cor-texto-claro)}
.painel--escuro .recap-nota{color:var(--cor-texto-claro-suave)}

/* --- Botão flutuante de WhatsApp (padrão BR) --- */
.wa-float{position:fixed;right:20px;bottom:20px;z-index:200;width:60px;height:60px;
  border-radius:50%;background:#25D366;display:flex;align-items:center;justify-content:center;
  box-shadow:0 6px 20px rgba(0,0,0,.25);transition:transform .18s ease,box-shadow .18s ease}
.wa-float:hover{transform:scale(1.06);box-shadow:0 8px 26px rgba(0,0,0,.32)}
.wa-float svg{width:34px;height:34px;display:block}
.wa-float::after{content:"";position:absolute;inset:0;border-radius:50%;
  animation:wapulse 2.6s ease-out infinite;pointer-events:none}
@keyframes wapulse{0%{box-shadow:0 0 0 0 rgba(37,211,102,.45)}70%{box-shadow:0 0 0 16px rgba(37,211,102,0)}100%{box-shadow:0 0 0 0 rgba(37,211,102,0)}}
@media(max-width:759px){.wa-float{width:54px;height:54px;right:16px;bottom:16px}.wa-float svg{width:30px;height:30px}}

/* ============================================================
   v5 · Seção do caso real na Ignição. Antes e agora, em duas
   colunas. NÃO narrar reunião por reunião: o produto vende dois
   encontros e o caso teve mais, então contar sessão a sessão
   promete o que a oferta não tem
   ============================================================ */

/* Filete no topo carrega a regra de cor do manual: clay no "agora",
   que é o que se quer que parem pra ler. O "antes" fica no filete
   neutro. Azul aqui seria uso errado: não é termo técnico. */
.tempos{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;margin:36px 0 34px}
.tempos>div{border-top:3px solid var(--cor-linha);padding-top:16px}
.tempos .t-h{border-top-color:var(--cor-humano)}
.tempos .t-m{border-top-color:var(--cor-maquina)}
.tempos small{display:block;font-family:var(--fonte-mono);font-size:.64rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--cor-texto-suave);margin-bottom:9px}
.tempos b{display:block;font-family:var(--fonte-titulo);font-weight:700;font-size:1.02rem;
  line-height:1.28;margin-bottom:9px;color:var(--cor-tinta)}
.tempos p{font-size:.92rem;line-height:1.6;color:var(--cor-texto-suave);margin:0}
@media(max-width:759px){.tempos{grid-template-columns:1fr;gap:24px;margin:28px 0}}
.tempos--2{grid-template-columns:repeat(2,1fr);gap:34px}
@media(max-width:759px){.tempos--2{grid-template-columns:1fr}}

/* O agente sob medida dos Sprints: filete clay pra separar do catálogo.
   Usado pela /sprint-advogado e pela /sprint-ciborgue. */
.inventario>div.inv-sobmedida{border-left:3px solid var(--cor-humano);padding-left:18px}
.inv-sobmedida .inv-num{color:var(--cor-humano)}