/* =============================================================
   Flecha127 · site institucional
   Base: Design System Flecha127 (tokens, fontes e logos oficiais)
   ============================================================= */

/* ---------- fontes oficiais ---------- */
@font-face{font-family:"Neue Montreal";src:url(assets/fonts/NeueMontreal-Light.woff2) format("woff2");font-weight:300;font-style:normal;font-display:swap}
@font-face{font-family:"Neue Montreal";src:url(assets/fonts/NeueMontreal-Regular.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Neue Montreal";src:url(assets/fonts/NeueMontreal-Italic.woff2) format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"Neue Montreal";src:url(assets/fonts/NeueMontreal-Medium.woff2) format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"Neue Montreal";src:url(assets/fonts/NeueMontreal-Bold.woff2) format("woff2");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"Times Now";src:url(assets/fonts/TimesNow-Light.woff2) format("woff2");font-weight:300;font-style:normal;font-display:swap}
@font-face{font-family:"Times Now";src:url(assets/fonts/TimesNow-LightItalic.woff2) format("woff2");font-weight:300;font-style:italic;font-display:swap}
@font-face{font-family:"Times Now";src:url(assets/fonts/TimesNow-SemiLight.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Times Now";src:url(assets/fonts/TimesNow-SemiLightItalic.woff2) format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"Times Now";src:url(assets/fonts/TimesNow-BoldItalic.woff2) format("woff2");font-weight:700;font-style:italic;font-display:swap}

/* ---------- tokens (Design System Flecha127) ---------- */
:root{
  --preto:#1C1C1C; --preto-elev:#262626; --papel:#F2F2F2; --branco:#FFFFFF;
  --amarelo:#F8BD01; --tinta:#1C1C1C;
  --sans:"Neue Montreal","Helvetica Neue",Helvetica,Arial,sans-serif;
  --serif:"Times Now","Times New Roman",Times,serif;
  --wrap:1240px; --gutter:clamp(16px,5vw,64px);
  --secao:clamp(88px,11vw,160px);
  --col-gap:clamp(40px,6vw,96px); --grade-2:minmax(0,7fr) minmax(0,5fr);
  color-scheme:dark;
}
/* cada faixa de cor define seus papéis: fundo, texto, apoio, linha, destaque */
.tema-escuro{--bg:var(--preto);--ink:var(--branco);--muted:#A7A7A7;--line:#3A3A3A;--line-forte:var(--papel);--dest:var(--amarelo);background:var(--bg);color:var(--ink)}
.tema-claro{--bg:var(--papel);--ink:#111111;--muted:#4F4F4F;--line:#C9C9C9;--line-forte:var(--preto);--dest:var(--amarelo);background:var(--bg);color:var(--ink)}
.tema-amarelo{--bg:var(--amarelo);--ink:var(--preto);--muted:rgba(28,28,28,.78);--line:rgba(28,28,28,.28);--line-forte:var(--preto);--dest:var(--preto);background:var(--bg);color:var(--ink)}

/* ---------- base ---------- */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--preto);color:var(--branco);font-family:var(--sans);font-size:17px;line-height:1.55;font-weight:400;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden}
img,svg{display:block;max-width:100%}
a{color:inherit}
h1,h2,h3,p,ul,ol,figure{margin:0;padding:0}
ul,ol{list-style:none}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--gutter)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link{position:fixed;left:16px;top:-80px;z-index:100;padding:12px 16px;background:var(--amarelo);color:var(--preto);font-weight:700;text-decoration:none}
.skip-link:focus{top:16px}
:focus-visible{outline:2px solid var(--amarelo);outline-offset:3px}
.tema-claro :focus-visible,.tema-amarelo :focus-visible{outline-color:var(--preto)}
::selection{background:var(--amarelo);color:var(--preto)}

/* ---------- tipografia: Neue Montreal informa, Times Now marca ---------- */
.display{font-family:var(--serif);font-weight:400;font-size:clamp(42px,6.2vw,92px);line-height:1;letter-spacing:-.02em}
.titulo{font-family:var(--serif);font-weight:400;font-size:clamp(34px,4.3vw,62px);line-height:1.04;letter-spacing:-.015em}
.display i,.titulo i,.display mark,.titulo mark,h3 i{font-style:italic;font-weight:400}
/* destaque: amarelo itálico no escuro; bloco amarelo atrás do texto no claro (contraste) */
.tema-escuro .display mark,.tema-escuro .titulo mark{background:none;color:var(--amarelo)}
.tema-claro .display mark,.tema-claro .titulo mark{background:var(--amarelo);color:var(--preto);padding:0 .12em;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.tema-amarelo mark{background:none;color:inherit}
.lead{font-size:clamp(18px,1.6vw,21px);line-height:1.5;color:var(--muted);max-width:620px}
.apoio{color:var(--muted);max-width:44ch}
strong,b{font-weight:700}

/* etiqueta amarela (fx-tag) */
.tag{display:inline-block;background:var(--amarelo);color:var(--preto);font-weight:700;font-size:13px;line-height:1;letter-spacing:.02em;text-transform:uppercase;padding:10px 12px 9px}

/* ---------- moldura da marca: pílula e cabeçalho de seção ---------- */
.pill{display:flex;justify-content:space-between;align-items:center;height:32px;padding:0 18px;border:2px solid var(--line-forte);border-radius:16px;font-size:15px;line-height:1}
.handle{letter-spacing:-.03em;white-space:nowrap}
.handle b{font-weight:300}
.ed{letter-spacing:-.02em;white-space:nowrap}
.ed i{font-family:var(--serif);font-style:italic;font-weight:700;letter-spacing:0}
.cabeca-secao{display:flex;justify-content:space-between;align-items:center;padding-bottom:10px;border-bottom:2px solid var(--line-forte);margin-bottom:clamp(48px,6vw,88px);font-size:15px;line-height:1}
.cabeca-secao .num{font-weight:500;letter-spacing:.02em}

/* ---------- botões ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:14px;min-height:52px;padding:0 24px;font-family:var(--sans);font-size:15px;font-weight:500;line-height:1.2;text-decoration:none;border:2px solid transparent;border-radius:4px;transition:background-color .2s,color .2s,border-color .2s}
.btn-s{min-height:40px;padding:0 16px;font-size:14px}
.btn-amarelo{background:var(--amarelo);color:var(--preto)}
.btn-amarelo:hover{background:var(--branco)}
.btn-linha{border-color:var(--line-forte);color:var(--ink)}
.btn-linha:hover{background:var(--ink);color:var(--bg)}
.btn-preto{background:var(--preto);color:var(--amarelo)}
.btn-preto:hover{background:#000;color:var(--branco)}
.seta-ico{width:28px;height:10px;flex:none;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 10'%3E%3Cpath d='M0 5h26M21 1l5 4-5 4' fill='none' stroke='black' stroke-width='1.8'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 10'%3E%3Cpath d='M0 5h26M21 1l5 4-5 4' fill='none' stroke='black' stroke-width='1.8'/%3E%3C/svg%3E") center/contain no-repeat}

/* ---------- cabeçalho ---------- */
.site-header{position:fixed;inset:0 0 auto;z-index:50;background:var(--preto);border-bottom:1px solid transparent;transition:border-color .25s}
.site-header.rolou{border-bottom-color:#3A3A3A}
.header-inner{max-width:var(--wrap);margin:0 auto;padding:0 var(--gutter);height:76px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand img{width:auto;height:30px}
.nav{display:flex;align-items:center;gap:clamp(18px,2.4vw,36px);font-size:14px}
.nav>a:not(.btn){color:#D6D6D6;text-decoration:none;padding:6px 0;border-bottom:1px solid transparent}
.nav>a:not(.btn):hover{color:var(--amarelo);border-bottom-color:var(--amarelo)}
.menu-button{display:none;background:none;border:0;color:var(--branco);padding:10px;margin-right:-10px;cursor:pointer}
.menu-button .bar{display:block;width:24px;height:2px;background:currentColor;transition:transform .2s}
.menu-button .bar+.bar{margin-top:6px}
.menu-button[aria-expanded="true"] .bar:first-child{transform:translateY(4px) rotate(45deg)}
.menu-button[aria-expanded="true"] .bar:nth-child(2){transform:translateY(-4px) rotate(-45deg)}

/* ---------- hero ---------- */
.hero{padding:calc(76px + clamp(24px,3vw,40px)) 0 clamp(56px,7vw,96px)}
.hero-grid{display:grid;grid-template-columns:var(--grade-2);gap:var(--col-gap);align-items:center;margin-top:clamp(48px,7vw,104px)}
.hero .tag{margin-bottom:32px}
.hero .lead{margin-top:32px}
.acoes{display:flex;flex-wrap:wrap;gap:12px;margin-top:40px}

/* painel = símbolo oficial em proporção real (117 x 109,2); conteúdo inscrito na área útil da forma */
.hero-painel{position:relative;width:100%;aspect-ratio:117/109.2;color:var(--preto);container-type:inline-size}
.painel-forma{position:absolute;inset:0;width:100%;height:100%}
.painel-forma path{fill:var(--amarelo)}
.painel-conteudo{position:absolute;left:11%;right:24%;top:24%;bottom:9%;display:flex;flex-direction:column;justify-content:flex-end}
.painel-chapeu{font-family:var(--serif);font-style:italic;font-size:clamp(16px,5.2cqw,24px);line-height:1.15;padding-bottom:clamp(8px,2.8cqw,14px)}
.painel-lista li{display:grid;grid-template-columns:clamp(30px,8.5cqw,40px) 1fr;align-items:baseline;padding:clamp(7px,3cqw,14px) 0;border-top:2px solid var(--preto)}
.painel-lista li:last-child{padding-bottom:0}
.painel-lista .n{font-family:var(--serif);font-style:italic;font-weight:300;font-size:clamp(16px,4.8cqw,22px)}
.painel-lista strong{display:block;font-weight:500;font-size:clamp(16px,5.2cqw,23px);line-height:1.15;letter-spacing:-.01em}
.painel-lista small{display:block;font-size:clamp(12px,3.3cqw,15px);line-height:1.3;margin-top:3px;color:rgba(28,28,28,.82)}
.faixa-posicionamento{display:flex;flex-wrap:wrap;margin-top:clamp(56px,7vw,96px);border-top:2px solid var(--line-forte)}
.faixa-posicionamento span{flex:1 1 200px;padding:18px 20px 0 0;font-size:15px;color:#D6D6D6}
.faixa-posicionamento span::before{content:"";display:inline-block;width:10px;height:10px;margin-right:10px;background:var(--amarelo);transform:skewX(-8deg) rotate(-12deg)}

/* ---------- seções ---------- */
.secao{padding:var(--secao) 0}
.titulo-bloco{display:grid;grid-template-columns:var(--grade-2);gap:var(--col-gap);align-items:end;margin-bottom:clamp(48px,6vw,80px)}
.titulo-bloco .titulo{max-width:16ch}

/* 01 tese */
.tese-grid{display:grid;grid-template-columns:var(--grade-2);gap:var(--col-gap);align-items:end}
.tese-texto p{color:var(--muted)}
.tese-texto p+p{margin-top:18px}
.tese-texto strong{color:var(--ink)}

/* 02 atuação */
.frentes{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:repeat(4,auto);border-top:2px solid var(--line-forte)}
.frente{padding:28px 28px 32px 0;display:grid;grid-row:span 4;grid-template-rows:subgrid;row-gap:0}
.frente+.frente{padding-left:28px;border-left:1px solid var(--line)}
.frente-topo{display:flex;justify-content:space-between;align-items:center;margin-bottom:40px}
.frente-topo .n,.lista-numerada .n,.compromissos .n{font-family:var(--serif);font-style:italic;font-weight:300}
.frente-topo .n{font-size:22px;color:var(--muted)}
.ico{width:40px;height:40px;fill:none;stroke:var(--ink);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.ico .a{stroke:var(--amarelo)}
.frente h3{font-weight:500;font-size:22px;line-height:1.15;letter-spacing:-.01em;margin-bottom:14px}
.frente p{font-size:15px;color:var(--muted)}
.frente ul{align-self:end;padding-top:28px;font-size:14px}
.frente li{padding:10px 0;border-top:1px solid var(--line)}

/* 03 método */
.metodo-grid{display:grid;grid-template-columns:var(--grade-2);gap:var(--col-gap)}
.metodo-intro{position:sticky;top:120px;align-self:start}
.metodo-intro p{margin-top:28px;max-width:460px;color:var(--muted)}
.lista-numerada li{display:grid;grid-template-columns:64px 1fr;align-items:baseline;padding:26px 0;border-top:2px solid var(--preto)}
.lista-numerada li:last-child{border-bottom:2px solid var(--preto)}
.lista-numerada .n{font-size:30px;line-height:1}
.lista-numerada h3{font-family:var(--serif);font-weight:400;font-size:clamp(28px,3vw,40px);line-height:1;letter-spacing:-.015em;margin-bottom:10px}
.lista-numerada p{color:var(--muted);max-width:480px}

/* 04 trabalhos */
.trabalhos{display:grid;grid-template-columns:1.2fr .8fr;gap:clamp(24px,3vw,40px)}
.trabalho{display:flex;flex-direction:column;padding-bottom:28px;border-bottom:1px solid var(--line)}
.trabalho-grande{grid-row:span 2}
.trabalho-img{overflow:hidden;border-radius:12px;background:var(--papel);aspect-ratio:16/10}
.trabalho-grande .trabalho-img{aspect-ratio:auto;flex:1;min-height:420px}
.trabalho-img img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.img-campanha{background:#FAF9F6}
.img-campanha img{object-fit:contain;padding:clamp(8px,1.5vw,20px)}
.trabalho:hover .trabalho-img img{transform:scale(1.015)}
.trabalho-meta{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:20px;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--amarelo)}
.trabalho h3{font-family:var(--serif);font-weight:400;font-size:clamp(24px,2.3vw,34px);line-height:1.08;letter-spacing:-.01em;margin:14px 0 10px}
.trabalho p{font-size:15px;color:var(--muted);max-width:620px}
.trabalho-sistema{border:1px solid var(--line);border-radius:12px;padding:28px}
.sistema{display:flex;flex-direction:column;align-items:flex-start;padding:4px 0 8px}
.sistema span{min-width:148px;padding:10px 14px;border:1px solid var(--line-forte);font-size:14px}
.sistema span.ativo{background:var(--amarelo);border-color:var(--amarelo);color:var(--preto);font-weight:700}
.sistema i{width:2px;height:16px;margin-left:24px;background:var(--line-forte)}
.nota-rodape{margin-top:40px;font-size:13px;color:var(--muted)}

/* experiência (seção escura) */
.experiencia-grid{display:grid;grid-template-columns:var(--grade-2);gap:var(--col-gap);align-items:start}
.segmentos{display:flex;flex-wrap:wrap;gap:8px}
.segmentos span{padding:12px 16px;font-size:15px;border:1px solid var(--line-forte)}
.segmentos span:first-child{background:var(--amarelo);border-color:var(--amarelo);color:var(--preto)}

/* quem somos: linguagem da apresentação de identidade (Figma) */
.titulo-sans{font-family:var(--sans);font-weight:700;font-size:clamp(44px,5.6vw,84px);line-height:.95;letter-spacing:-.055em}
.titulo-sans .leve{font-weight:300}
.sobre-grid{display:grid;grid-template-columns:var(--grade-2);gap:var(--col-gap);align-items:start}
.sobre-texto .lead{margin-top:36px;color:var(--ink);max-width:560px}
.sobre-texto>p:not(.lead){margin-top:18px;color:var(--muted);max-width:560px}
.sobre-visual{display:flex;flex-direction:column;gap:40px;padding-top:12px}
.simbolos{width:min(100%,380px);height:auto;align-self:center}
.s-amarelo{fill:var(--amarelo)}.s-preto{fill:var(--preto)}
.versiculo{padding-top:24px;border-top:1px solid var(--line-forte)}
.versiculo blockquote{margin:0;font-weight:300;font-size:clamp(20px,1.9vw,26px);line-height:1.25;letter-spacing:-.02em;max-width:24ch}
.versiculo b{font-weight:500}
.versiculo figcaption{margin-top:18px}
.pill-p{display:inline-block;padding:5px 12px;border:1.5px solid var(--line-forte);border-radius:999px;font-size:13px;line-height:1}
.compromissos{display:grid;grid-template-columns:repeat(3,1fr);margin-top:clamp(56px,7vw,96px);border-top:2px solid var(--line-forte)}
.compromissos li{display:grid;grid-template-columns:44px 1fr;padding:20px 24px 0 0;color:var(--muted)}
.compromissos li+li{padding-left:24px;border-left:1px solid var(--line)}
.compromissos .n{font-size:22px;color:var(--ink)}
.compromissos strong{display:block;color:var(--ink);font-weight:500;margin-bottom:4px}
.trabalhos-rodape{display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap;margin-top:40px}
.trabalhos-rodape .nota-rodape{margin:0}
.link-seta{display:inline-flex;align-items:center;gap:12px;font-size:15px;font-weight:500;color:var(--amarelo);text-decoration:none;border-bottom:1px solid var(--amarelo);padding-bottom:4px}
.link-seta:hover{color:var(--branco);border-color:var(--branco)}

/* 07 faq */
.faq-grid{display:grid;grid-template-columns:var(--grade-2);gap:var(--col-gap)}
.faq-grid .titulo{position:sticky;top:120px;align-self:start}
.faq-lista details{border-top:2px solid var(--preto)}
.faq-lista details:last-child{border-bottom:2px solid var(--preto)}
.faq-lista summary{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:24px 0;font-size:clamp(18px,1.6vw,21px);font-weight:500;line-height:1.3;cursor:pointer;list-style:none}
.faq-lista summary::-webkit-details-marker{display:none}
.faq-lista summary::after{content:"";flex:none;width:14px;height:14px;background:linear-gradient(var(--preto),var(--preto)) center/14px 2px no-repeat,linear-gradient(var(--preto),var(--preto)) center/2px 14px no-repeat;transition:transform .2s}
.faq-lista details[open] summary::after{transform:rotate(45deg)}
.faq-lista details p{padding:0 0 26px;max-width:640px;color:var(--muted)}

/* CTA: fecho dividido escuro + amarelo, caixa com símbolo cortando a borda */
.cta-topo{padding:var(--secao) 0 clamp(64px,8vw,112px)}
.cta-topo .display{max-width:20ch}
.cta-base{padding:clamp(64px,8vw,104px) 0}
.caixa-cta{--s:clamp(56px,6vw,72px);position:relative;display:grid;grid-template-columns:1fr auto;gap:32px;align-items:center;margin-left:calc(var(--s)/2);padding:32px 36px 32px calc(var(--s)/2 + 36px);border:2px solid var(--preto)}
.caixa-simbolo{position:absolute;left:calc(var(--s)/-2);top:50%;transform:translateY(-50%);width:var(--s);height:auto}
.caixa-cta p{font-size:clamp(18px,1.7vw,22px);line-height:1.45;max-width:560px}
.cta-alt{margin:24px 0 0;font-size:15px}
.cta-alt a{text-underline-offset:4px}

/* rodapé */
.rodape{padding:64px 0 32px}
.rodape-topo{display:flex;justify-content:space-between;align-items:center;gap:32px;flex-wrap:wrap;padding-bottom:48px}
.rodape-topo img{height:30px;width:auto}
.rodape-links{display:flex;flex-wrap:wrap;gap:12px 28px;font-size:14px}
.rodape-links a{text-decoration:none;color:#D6D6D6}
.rodape-links a:hover{color:var(--amarelo)}
.rodape-linha{display:grid;grid-template-columns:1fr auto 1fr;gap:16px;padding:10px 0 0;border-top:2px solid var(--papel);font-size:14px;color:#D6D6D6}
.rodape-linha>:nth-child(2){text-align:center}
.rodape-linha>:nth-child(3){text-align:right}



.rodape-legal{margin-top:14px;font-size:12px;line-height:1.5;color:#A7A7A7}
.rodape-legal a{color:inherit;text-underline-offset:3px}

/* ---------- CTAs: tamanho grande, ícone, microcopy ---------- */
.btn-l{min-height:58px;padding:0 28px;font-size:16px}
.ico-btn{width:20px;height:20px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linejoin:round}
.btn-linha-preta{border-color:var(--preto);color:var(--preto);margin-left:16px;min-height:52px}
.btn-linha-preta:hover{background:var(--preto);color:var(--amarelo)}
.microcopy{margin-top:16px;font-size:14px;color:var(--muted);max-width:52ch}
.cta-alt{display:flex;align-items:center;flex-wrap:wrap;gap:8px 0}

/* faixa de prova no hero */
.prova{display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) auto;align-items:start;gap:24px;margin-top:clamp(56px,7vw,96px);padding-top:22px;border-top:2px solid var(--line-forte);text-decoration:none;color:var(--ink)}
.prova-item strong{display:block;white-space:nowrap;font-family:var(--serif);font-weight:400;font-size:clamp(30px,3.2vw,44px);line-height:1;letter-spacing:-.02em;color:var(--amarelo)}
.prova-item small{display:block;margin-top:8px;font-size:14px;color:#D6D6D6;max-width:26ch}
.prova-link{align-self:end;display:inline-flex;align-items:center;gap:10px;font-size:14px;font-weight:500;padding-bottom:4px;border-bottom:1px solid var(--line-forte)}
.prova:hover .prova-link{color:var(--amarelo);border-color:var(--amarelo)}

/* ---------- 02 resultados ---------- */
.kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:0;border-top:2px solid var(--line-forte)}
.kpi{padding:24px 24px 28px 0}
.kpi+.kpi{padding-left:24px;border-left:1px solid var(--line)}
.kpi dt{font-size:14px;color:var(--muted);max-width:24ch;min-height:2.9em}
.kpi dd{margin:14px 0 0;font-family:var(--serif);font-weight:400;font-size:clamp(36px,3.7vw,54px);line-height:1;letter-spacing:-.02em;white-space:nowrap}
.kpi-destaque dd{color:var(--amarelo);font-style:italic}
.kpis-nota{margin-top:6px;font-size:13px;color:var(--muted)}
.grafico{margin:clamp(48px,6vw,80px) 0 0;padding:clamp(20px,3vw,36px);border:1px solid var(--line);border-radius:12px}
.grafico figcaption{display:grid;grid-template-columns:1fr auto;gap:8px 32px;align-items:end;margin-bottom:24px}
.grafico h3{font-weight:500;font-size:20px;line-height:1.2}
.grafico figcaption p{grid-column:1;font-size:14px;color:var(--muted);max-width:62ch}
.legenda{grid-column:2;grid-row:1/span 2;display:flex;gap:20px;font-size:13px;color:#D6D6D6}
.legenda li{display:flex;align-items:center;gap:8px}
.lg-barra{width:12px;height:12px;background:var(--amarelo)}
.lg-linha{width:18px;height:2px;background:var(--papel)}
.grafico-area{position:relative;min-height:260px}
.grafico-area svg{display:block;width:100%;height:auto}
.grafico-area .grade{stroke:#3A3A3A;stroke-width:1}
.grafico-area .eixo{stroke:#A7A7A7;stroke-width:1}
.grafico-area .rot-y,.grafico-area .rot-x{fill:#A7A7A7;font-family:var(--sans);font-size:12px}
.grafico-area .barra{fill:var(--amarelo);opacity:.92}
.grafico-area .barra.ativa{opacity:1;fill:#FFD24A}
.grafico-area .linha{fill:none;stroke:var(--papel);stroke-width:2.5;stroke-linejoin:round}
.grafico-area .rot-linha{fill:var(--papel);font-family:var(--sans);font-size:12px}
.dica{position:absolute;top:0;width:190px;padding:10px 12px;background:var(--papel);color:var(--preto);font-size:13px;line-height:1.45;border-radius:4px;pointer-events:none}
.dica strong{display:block;font-weight:700;margin-bottom:2px}
.dica span{display:block}
.grafico-dados{margin-top:20px;border-top:1px solid var(--line);padding-top:14px}
.grafico-dados summary{cursor:pointer;font-size:14px;font-weight:500;color:#D6D6D6;width:max-content}
.grafico-dados summary:hover{color:var(--amarelo)}
.tabela-rolagem{max-height:320px;overflow:auto;margin-top:12px}
.grafico-dados table{width:100%;border-collapse:collapse;font-size:14px;font-variant-numeric:tabular-nums}
.grafico-dados th,.grafico-dados td{padding:8px 10px;text-align:right;border-bottom:1px solid var(--line)}
.grafico-dados th:first-child{text-align:left}
.grafico-dados thead th{position:sticky;top:0;background:var(--preto);color:var(--muted);font-weight:500}
.casos{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:clamp(40px,5vw,64px)}
.caso{display:flex;flex-direction:column;padding:24px;border:1px solid var(--line);border-radius:12px;background:var(--preto-elev)}
.caso-local{font-weight:500;font-size:17px;line-height:1.3;min-height:2.6em}
.caso-b2b .caso-local{min-height:0}
.caso-periodo{margin-top:4px;font-size:13px;color:var(--muted)}
.caso-numero{margin-top:28px;font-family:var(--serif);font-size:clamp(44px,4.4vw,60px);line-height:1;letter-spacing:-.02em;color:var(--amarelo)}
.caso-legenda{margin-top:6px;font-size:14px;color:#D6D6D6}
.caso dl{margin:24px 0 0;padding-top:14px;border-top:1px solid var(--line);display:grid;gap:8px}
.caso dl div{display:flex;justify-content:space-between;gap:16px;font-size:14px}
.caso dt{color:var(--muted)}
.caso dd{margin:0;font-weight:500;font-variant-numeric:tabular-nums}
.caso-b2b{grid-column:1/-1;display:grid;grid-template-columns:1.2fr auto 1fr;gap:8px 40px;align-items:center;background:transparent;border-style:dashed}
.caso-b2b .caso-numero{margin-top:0;grid-column:2;grid-row:1/span 2}
.caso-b2b .caso-legenda{grid-column:2;grid-row:3;margin-top:0}
.caso-b2b dl{grid-column:3;grid-row:1/span 3;margin:0;padding:0 0 0 32px;border-top:0;border-left:1px solid var(--line)}
.caso-b2b .caso-local,.caso-b2b .caso-periodo{grid-column:1}
.caso-b2b .caso-local{grid-row:1/span 2;align-self:end}
.caso-b2b .caso-periodo{grid-row:3;margin-top:0;align-self:start}
.resultados-rodape{display:grid;grid-template-columns:1fr auto;gap:32px;align-items:center;margin-top:40px;padding-top:28px;border-top:1px solid var(--line)}
.nota-metodo{font-size:13px;line-height:1.6;color:var(--muted);max-width:78ch}
.nota-metodo strong{color:#D6D6D6;font-weight:500}

/* ---------- 05 trabalhos: grade de peças ---------- */
.pecas{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,2.6vw,36px) clamp(16px,2vw,28px)}
.peca-img{display:block;width:100%;padding:0;border:0;background:var(--preto-elev);border-radius:12px;overflow:hidden;aspect-ratio:4/5;cursor:zoom-in}
.peca-img img{width:100%;height:100%;object-fit:cover;object-position:50% 40%;transition:transform .5s ease}
.peca-img:hover img{transform:scale(1.03)}
.peca-quadrada{background:#F5F5F5}
.peca-quadrada img{object-fit:contain;object-position:50% 50%}
.peca-seg{margin-top:16px;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--amarelo)}
.peca h3{margin-top:6px;font-weight:500;font-size:18px;line-height:1.25}
.peca h3+p{margin-top:4px;font-size:14px;color:var(--muted)}
.bastidores .trabalho{border:1px solid var(--line);border-radius:12px;padding:16px 16px 28px}
.bastidores .trabalho>:not(figure){margin-left:12px;margin-right:12px}
.bastidores .trabalho-sistema{padding:28px 16px}
.bastidores .trabalho-img{border-radius:8px}
.peca-destaque{grid-column:1/-1;display:grid;grid-template-columns:subgrid;align-items:center;padding-top:clamp(20px,2.6vw,36px);border-top:1px solid var(--line)}
.peca-destaque .peca-img{grid-column:1}
.peca-destaque-texto{grid-column:2/-1;max-width:560px}
.peca-destaque-texto h3{margin-top:10px;font-family:var(--serif);font-weight:400;font-size:clamp(28px,3vw,44px);line-height:1.05;letter-spacing:-.015em}
.peca-destaque-texto h3+p{margin-top:14px;font-size:16px;color:var(--muted)}
.peca-destaque-texto .link-seta{margin-top:24px}
.bastidores{display:grid;grid-template-columns:var(--grade-2);gap:clamp(24px,3vw,40px);margin-top:clamp(56px,7vw,96px)}

/* lightbox */
.lightbox{padding:0;border:0;background:transparent;max-width:min(92vw,720px);max-height:92vh;overflow:visible}
.lightbox::backdrop{background:rgba(10,10,10,.86)}
.lightbox img{display:block;max-width:100%;max-height:88vh;width:auto;height:auto;border-radius:8px}
.lightbox-fechar{position:absolute;top:-48px;right:0;width:40px;height:40px;border:1px solid var(--papel);border-radius:50%;background:transparent;color:var(--papel);font-size:24px;line-height:1;cursor:pointer}

/* barra fixa de contato (celular) */
.barra-cta{position:fixed;left:0;right:0;bottom:0;z-index:40;display:none;gap:8px;padding:10px var(--gutter) calc(10px + env(safe-area-inset-bottom));background:var(--preto);border-top:1px solid #3A3A3A;transform:translateY(110%);transition:transform .25s ease}
.barra-cta.visivel{transform:none}
.barra-cta .btn{min-height:50px}
.barra-cta .btn-amarelo{flex:1}
.btn-icone{width:50px;padding:0;border-color:var(--papel);color:var(--papel)}

/* entrada suave (só com JS ativo) */
.js .reveal{opacity:0;transform:translateY(18px);transition:opacity .7s ease,transform .7s ease}
.js .reveal.visivel{opacity:1;transform:none}

/* ---------- responsivo ---------- */
@media (max-width:1040px){
  .frentes{grid-template-columns:1fr 1fr}
  .frente:nth-child(3){padding-left:0;border-left:0}
  .frente:nth-child(n+3){border-top:1px solid var(--line)}
  .kpis{grid-template-columns:1fr 1fr}
  .kpi:nth-child(3){padding-left:0;border-left:0}
  .kpi:nth-child(n+3){border-top:1px solid var(--line)}
  .casos{grid-template-columns:1fr 1fr}
  .caso-b2b{grid-template-columns:1fr 1fr}
  .caso-b2b .caso-numero{grid-row:auto}
  .caso-b2b dl{grid-column:1/-1;grid-row:auto;padding:14px 0 0;border-left:0;border-top:1px solid var(--line);margin-top:16px}
}
@media (max-width:900px){
  .menu-button{display:block}
  .nav{display:none;position:absolute;top:76px;left:0;right:0;flex-direction:column;align-items:stretch;gap:0;padding:8px var(--gutter) 24px;background:var(--preto);border-bottom:1px solid #3A3A3A}
  .nav.aberto{display:flex}
  .nav>a:not(.btn){padding:16px 0;border-bottom:1px solid #3A3A3A;font-size:17px}
  .nav .btn{margin-top:20px;min-height:52px}
  .hero-grid,.tese-grid,.titulo-bloco,.metodo-grid,.trabalhos,.experiencia-grid,.sobre-grid,.faq-grid{grid-template-columns:1fr}
  .hero-painel{max-width:460px;justify-self:start}
  .frentes{grid-template-rows:none}
  .frente{grid-row:span 4}
  .metodo-intro,.faq-grid .titulo{position:static}
  .trabalho-grande{grid-row:auto}
  .trabalho-grande .trabalho-img{aspect-ratio:906/748;min-height:0;flex:none}
  .compromissos{grid-template-columns:1fr}
  .compromissos li,.compromissos li+li{padding:18px 0;border-left:0;border-bottom:1px solid var(--line)}
  .simbolos{width:min(70%,300px)}
  .titulo-bloco{gap:20px}
  .prova{grid-template-columns:1fr 1fr 1fr}
  .prova-link{grid-column:1/-1;justify-self:start}
  .pecas{grid-template-columns:1fr 1fr}
  .bastidores{grid-template-columns:1fr}
  .resultados-rodape{grid-template-columns:1fr}
  .grafico figcaption{grid-template-columns:1fr}
  .legenda{grid-column:1;grid-row:auto}
  .barra-cta{display:flex}
  body{padding-bottom:0}
}
@media (max-width:640px){
  body{font-size:16px}
  .header-inner{height:64px}
  .nav{top:64px}
  .hero{padding-top:calc(64px + 20px)}
  .brand img{height:24px}
  .pill,.cabeca-secao{font-size:13px}
  .pill{padding:0 14px}
  .acoes .btn{width:100%}
  .prova{grid-template-columns:1fr;gap:18px}
  .prova-item{display:grid;grid-template-columns:150px 1fr;align-items:baseline;gap:12px}
  .prova-item small{margin-top:0}
  .kpis{grid-template-columns:1fr}
  .kpi,.kpi+.kpi{padding:18px 0 20px;border-left:0}
  .kpi+.kpi{border-top:1px solid var(--line)}
  .casos{grid-template-columns:1fr}
  .caso-local{min-height:0}
  .caso-b2b{display:flex}
  .caso-b2b>*{align-self:stretch}
  .caso-b2b dl{padding:14px 0 0}
  .caso-b2b .caso-numero{margin-top:28px}
  .caso-b2b .caso-legenda{margin-top:6px}
  .pecas{grid-template-columns:1fr 1fr;gap:20px 12px}
  .peca h3{font-size:16px}
  .peca h3+p{font-size:13px}
  .peca-destaque-texto h3{font-size:24px}
  .peca-destaque-texto h3+p{font-size:14px}
  .peca-destaque-texto .link-seta{margin-top:16px}
  .resultados-rodape .btn{width:100%}
  .btn-linha-preta{margin-left:0;width:100%;margin-top:8px}
  .cta-alt{flex-direction:column;align-items:stretch}
  .frentes{grid-template-columns:1fr}
  .frente,.frente+.frente{padding:24px 0 28px;border-left:0}
  .frente+.frente{border-top:1px solid var(--line)}
  .frente-topo{margin-bottom:24px}
  .lista-numerada li{grid-template-columns:52px 1fr}
  .caixa-cta{--s:52px;grid-template-columns:1fr;padding:28px 20px 28px 46px}
  .caixa-cta .btn{width:100%}
  .rodape-linha{grid-template-columns:1fr 1fr;row-gap:8px}
  .rodape-linha>:nth-child(2){grid-column:1/-1;grid-row:2;text-align:left}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .js .reveal{opacity:1;transform:none;transition:none}
  .trabalho-img img,.btn,.menu-button .bar{transition:none}
}
