/* ══════════════════════════════════════════════════════════════════════
   MÉTRICA — Web & Brand System
   Modernist sobre ground escuro. Ver METRICA-WEB-SKILL.md.

   Este arquivo veste o site inteiro: Home, páginas comerciais, hub e
   artigos do Insights, e o 404. O comportamento vive em metrica.js.
   `styles.css` e `script.js` foram removidos em 19/08/2026.

   Fora do sistema, por decisão: ferramentas/layout-studio.html, um app
   de arquivo único com tokens próprios.

   Regras não negociáveis do sistema:
     · zero border-radius (exceção: a marca do WhatsApp, que é de terceiro)
     · um só acento (--acc). Nunca vermelho. Nunca cor nova.
     · tudo flush-left, inclusive rótulo de botão
     · réguas de 2px, grid técnico de 1px, sem sombra difusa
   ══════════════════════════════════════════════════════════════════════ */

/* ─── 1. tokens ──────────────────────────────────────────────────────── */
:root{
  --acc:#15C1E0;          /* Vibrant Cyan — acento único */
  --brand-cyan:#15C1E0;
  --brand-cyan-hi:#3ED4EE;
  --acc-hi:#3ED4EE;       /* hover do primário */
  --acc-ink:#06121C;      /* texto sobre o acento */
  --navy:#0B2545;         /* Deep Navy — superfícies */
  --slate:#6E7B8A;        /* Pro Gray — apoios */
  --ink:#060D16;          /* ground escuro */
  --rule:#16304C;         /* réguas de 2px */
  --grid:#102539;         /* grid técnico, 1px */

  --t-hi:#F2F7FA;         /* títulos */
  --t-body:#E9F1F6;       /* corpo claro */
  --t-2:#9DB0BF;          /* secundário */
  --t-3:#8794A3;          /* rótulos — AA também sobre navy */
  --t-4:#8794A3;          /* legendas de canvas — AA */

  --sg:"Space Grotesk",ui-monospace,monospace;
  --ar:"Archivo",system-ui,sans-serif;

  --wrap:1560px;
  --pad:clamp(20px,4vw,56px);
  --sec-y:clamp(72px,8vw,124px);
  --ease:cubic-bezier(.2,.7,.2,1);
}

/* ─── 2. base ────────────────────────────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--ink);
  color:var(--t-body);
  font-family:var(--ar);
  font-size:16px;
  line-height:1.62;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
[hidden]{display:none !important;}
img,svg{display:block;max-width:100%;}
button{font:inherit;color:inherit;}
a{color:var(--acc);text-decoration:none;}
a:hover{color:var(--t-body);}

:focus-visible{outline:2px solid var(--acc);outline-offset:3px;}

.skip{
  position:absolute;left:-9999px;top:0;z-index:200;
  background:var(--acc);color:var(--acc-ink);padding:12px 20px;
  font-weight:600;letter-spacing:.03em;
}
.skip:focus{left:0;}

.defs{position:absolute;width:0;height:0;overflow:hidden;}

/* ─── 3. tipografia ──────────────────────────────────────────────────── */
.eyebrow{
  font-family:var(--sg);font-weight:500;font-size:13px;
  letter-spacing:.26em;text-transform:uppercase;color:var(--t-3);
  margin:0;
}
.eyebrow--acc{color:var(--acc);}

.h1{
  font-family:var(--sg);font-weight:300;
  font-size:clamp(42px,6.6vw,92px);line-height:1.02;letter-spacing:-.02em;
  margin:30px 0 0;color:var(--t-hi);text-wrap:pretty;
}
.h2{
  font-family:var(--sg);font-weight:300;
  font-size:clamp(32px,4.4vw,64px);line-height:1.06;letter-spacing:-.015em;
  margin:26px 0 0;color:var(--t-hi);text-wrap:pretty;
}
.h3{
  font-family:var(--sg);font-weight:300;
  font-size:clamp(26px,2.5vw,36px);line-height:1.12;letter-spacing:-.01em;
  margin:22px 0 0;color:var(--t-hi);
}
.acc{color:var(--acc);}

.lede{
  font-size:clamp(15px,1.25vw,19px);line-height:1.62;color:var(--t-2);
  max-width:52ch;margin:32px 0 0;text-wrap:pretty;
}
.p{font-size:clamp(15px,1.2vw,18px);line-height:1.62;color:var(--t-2);margin:0;text-wrap:pretty;}
.p--n{max-width:44ch;}
.p--s{font-size:15px;max-width:34ch;margin:18px 0 0;}

/* ─── 4. botões — flush-left, sem caixa alta, sem raio ───────────────── */
.b{
  display:inline-block;font-family:var(--ar);
  font-size:14.5px;font-weight:600;letter-spacing:.03em;
  padding:17px 26px;border:2px solid transparent;text-align:left;
  cursor:pointer;transition:background .18s var(--ease),border-color .18s var(--ease),color .18s var(--ease);
}
.b--pri{background:var(--acc);border-color:var(--acc);color:var(--acc-ink);}
.b--pri:hover{background:var(--acc-hi);border-color:var(--acc-hi);color:var(--acc-ink);}
.b--sec{background:transparent;border-color:var(--rule);color:var(--t-body);font-weight:500;}
.b--sec:hover{border-color:var(--acc);color:var(--acc);}
.b--sm{font-size:13.5px;padding:13px 20px;}
/* produto ainda não publicado: presente na arquitetura, honesto na promessa */
.b--soon{background:transparent;border-color:var(--rule);color:var(--t-4);font-weight:500;cursor:default;}

.btnrow{display:flex;flex-wrap:wrap;gap:14px;margin-top:44px;}

/* ─── 5. estrutura de seção ──────────────────────────────────────────── */
.wrap{max-width:var(--wrap);margin:0 auto;width:100%;}
.sec{position:relative;border-bottom:2px solid var(--rule);padding:var(--sec-y) var(--pad);}
.sec--paper{
  --ink:#ECEFF1;
  --navy:#FFFFFF;
  --rule:#C8D2DA;
  --grid:#DDE3E8;
  --t-hi:#0B2545;
  --t-body:#3A4A5A;
  --t-2:#465768;
  --t-3:#56646F;
  --t-4:#56646F;
  --acc:#0A5D6D;
  background:var(--ink);color:var(--t-body);border-top:2px solid var(--rule);
}
.sec--paper .b--pri{background:var(--brand-cyan);border-color:var(--brand-cyan);color:var(--acc-ink);}
.sec--paper .b--pri:hover{background:var(--brand-cyan-hi);border-color:var(--brand-cyan-hi);color:var(--acc-ink);}
.sec--paper .b--sec{color:var(--t-body);}
.sec--paper .col,.sec--paper .cv,.sec--paper .studio-free,.sec--paper .step,.sec--paper .svc,.sec--paper .card{background:var(--navy);border-color:var(--rule);}
.sec--paper .col{background:var(--navy);}
.sec--paper .wf__big,.sec--paper .wf__c,.sec--paper .wf__row{background:var(--navy);}
.sec--paper [fill="#15C1E0"]{fill:var(--brand-cyan);}
.sec--paper [fill="#E9F1F6"]{fill:var(--t-body);}
.sec--paper [fill="#6E7B8A"]{fill:var(--t-3);}
.sec--paper [stroke="#15C1E0"]{stroke:var(--brand-cyan);}
.sec--paper [stroke="#0B2545"],.sec--paper [stroke="#16304C"],.sec--paper [stroke="#060D16"]{stroke:var(--rule);}
.sec--paper :focus-visible{outline-color:#0A5D6D;}
.sec__in{position:relative;max-width:var(--wrap);margin:0 auto;}
section[id]{scroll-margin-top:92px;}

/* grid técnico e luz — profundidade por camadas, nunca sombra difusa */
.gridlines{
  position:absolute;inset:0;pointer-events:none;
  background-image:repeating-linear-gradient(to right,var(--grid) 0 1px,transparent 1px 12.5%);
  opacity:.85;
}
.gridlines--6{background-image:repeating-linear-gradient(to right,var(--grid) 0 1px,transparent 1px 16.666%);opacity:.7;}
.glow{
  position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(120% 85% at 22% 28%,rgba(21,193,224,.09) 0%,rgba(6,13,22,0) 62%);
}
.glow--c{background:radial-gradient(90% 70% at 50% 45%,rgba(21,193,224,.07) 0%,rgba(6,13,22,0) 65%);}
.cubebg{position:absolute;color:#0E2540;opacity:.5;pointer-events:none;}
.cubebg--hero{right:-6%;top:8%;width:min(52vw,760px);}
.cubebg--cta{left:50%;top:50%;transform:translate(-50%,-50%);width:min(78vw,900px);color:#0D2C48;opacity:.55;}

/* ─── 6. header ──────────────────────────────────────────────────────── */
.hdr{
  position:fixed;top:0;left:0;right:0;z-index:60;
  border-bottom:2px solid transparent;
  transition:background .3s ease,backdrop-filter .3s ease,border-color .3s ease;
}
.hdr__in{
  position:relative;max-width:var(--wrap);margin:0 auto;
  padding:20px var(--pad);
  display:flex;align-items:center;gap:clamp(20px,4vw,56px);
}
.brand{display:flex;align-items:center;gap:13px;flex:none;color:var(--t-body);}
.brand:hover{color:var(--t-body);}
.brand__cube{width:26px;height:28px;flex:none;}
.brand__wm{font-family:var(--sg);font-weight:400;font-size:17px;letter-spacing:.15em;}

.nav{display:flex;align-items:center;gap:10px;margin-left:auto;}
.nav > a:not(.nav__studio){font-size:13.5px;font-weight:500;letter-spacing:.04em;color:var(--t-2);}
.nav > a:not(.nav__studio):hover{color:var(--t-hi);}
.nav__group{position:relative;}
.nav__trigger{
  min-height:44px;padding:0 13px;border:0;background:transparent;color:var(--t-2);
  font:500 13px/1 var(--sg);letter-spacing:.04em;cursor:pointer;
  display:flex;align-items:center;gap:9px;white-space:nowrap;
}
.nav__trigger:hover,.nav__trigger:focus-visible,.nav__group[data-open] .nav__trigger{color:var(--t-hi);}
.nav__trigger span{color:var(--cyan);font-size:17px;font-weight:300;transition:transform .2s var(--ease);}
.nav__group[data-open] .nav__trigger span{transform:rotate(45deg);}
.nav__panel{
  position:absolute;top:calc(100% + 16px);left:0;width:286px;padding:10px;
  background:rgba(6,13,22,.98);border:2px solid var(--rule);
  box-shadow:0 22px 55px rgba(0,0,0,.38);
  opacity:0;visibility:hidden;transform:translateY(-8px);pointer-events:none;
  transition:opacity .18s ease,transform .18s var(--ease),visibility .18s;
}
.nav__panel--pages{left:auto;right:0;}
.nav__group[data-open] .nav__panel{opacity:1;visibility:visible;transform:none;pointer-events:auto;}
.nav__label{
  display:block;padding:9px 11px 10px;color:var(--cyan);
  font:600 10px/1 var(--mono);letter-spacing:.18em;text-transform:uppercase;
  border-bottom:1px solid var(--grid);
}
.nav__panel a{
  display:block;padding:10px 11px;color:var(--t-2);font-size:13px;font-weight:500;
  letter-spacing:.015em;border-left:2px solid transparent;
}
.nav__panel a:hover,.nav__panel a:focus-visible{color:var(--t-hi);background:rgba(21,193,224,.07);border-left-color:var(--cyan);}
.nav > .nav__studio{
  min-height:44px;padding:0 4px 0 16px;border:0;border-left:1px solid var(--rule);
  display:flex;align-items:center;gap:8px;color:var(--t-body);white-space:nowrap;
  background:transparent;transition:color .2s var(--ease),border-color .2s var(--ease);
}
.nav > .nav__studio:hover,.nav > .nav__studio:focus-visible{color:var(--acc);border-left-color:var(--acc);}
.nav__studio > span:first-child{font:500 13.5px/1 var(--sg);letter-spacing:.025em;}
.nav__studio-arrow{color:var(--acc);font:300 17px/1 var(--sg);transition:transform .2s var(--ease);}
.nav__studio:hover .nav__studio-arrow,.nav__studio:focus-visible .nav__studio-arrow{transform:translate(2px,-2px);}
.hdr__cta{display:flex;align-items:center;gap:12px;flex:none;}

/* O menu mobile é a única media query estrutural do arquivo: é requisito
   funcional (a nav não cabe em 360px), não decisão de estilo. */
.burger{
  display:none;width:38px;height:38px;padding:0;margin-left:auto;
  background:transparent;border:2px solid var(--rule);
  flex-direction:column;align-items:center;justify-content:center;gap:5px;cursor:pointer;
}
.burger span{display:block;width:16px;height:2px;background:var(--t-body);transition:transform .2s var(--ease);}
.burger[aria-expanded="true"] span:first-child{transform:translateY(3.5px) rotate(45deg);}
.burger[aria-expanded="true"] span:last-child{transform:translateY(-3.5px) rotate(-45deg);}

@media (min-width:961px) and (max-width:1220px){
  .hdr__in{gap:18px;}
  .nav{gap:4px;}
  .nav > a:not(.nav__studio){font-size:13px;}
  .nav > .nav__studio{padding-left:10px;}
  .hdr__cta .b{padding:11px 13px;}
}
@media (max-width:960px){
  .burger{display:flex;order:3;margin-left:12px;}
  .nav{
    display:none;position:absolute;top:100%;left:0;right:0;
    max-height:calc(100vh - 78px);overflow-y:auto;
    flex-direction:column;align-items:stretch;gap:18px;margin:0;
    background:rgba(6,13,22,.97);border-bottom:2px solid var(--rule);
    padding:22px var(--pad) 28px;
  }
  .nav[data-open]{display:flex;}
  .nav > a:not(.nav__studio){width:100%;padding:13px 0;border-bottom:1px solid var(--grid);font-size:14px;}
  .nav__group{width:100%;}
  .nav__trigger{width:100%;min-height:auto;padding:0 0 11px;color:var(--cyan);pointer-events:none;font:600 10px/1 var(--mono);letter-spacing:.18em;text-transform:uppercase;}
  .nav__trigger span{display:none;}
  .nav__panel,.nav__panel--pages{
    position:static;width:100%;padding:0;border:0;border-top:1px solid var(--rule);
    background:transparent;box-shadow:none;opacity:1;visibility:visible;transform:none;pointer-events:auto;
    display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  }
  .nav__label{display:none;}
  .nav__panel a{padding:13px 10px;border-left:0;border-bottom:1px solid var(--grid);font-size:13px;}
  .nav__panel a:hover,.nav__panel a:focus-visible{border-left-color:transparent;}
  .nav > .nav__studio{width:100%;min-height:48px;padding:13px 0;border-left:0;border-bottom:1px solid var(--grid);justify-content:space-between;}
  .hdr__cta{margin-left:auto;}
  .hdr__cta .b{font-size:13px;padding:11px 15px;}
}
@media (max-width:700px){
  .nav__panel{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (max-width:560px){
  .hdr__cta{display:none;}
  .nav__panel{grid-template-columns:1fr;}
  .burger{margin-left:auto;}   /* sem o botão ao lado, o burger se ancora sozinho */
}

/* ─── 7. hero ────────────────────────────────────────────────────────── */
.hero{
  position:relative;min-height:100vh;display:flex;align-items:center;
  border-bottom:2px solid var(--rule);
  padding:132px var(--pad) 72px;overflow:hidden;
}
.hero__in{
  position:relative;max-width:var(--wrap);margin:0 auto;width:100%;
  display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,430px),1fr));
  gap:clamp(48px,5vw,80px);align-items:center;
}
.hero__in > *{min-width:0;}
.kicker{
  display:flex;align-items:center;flex-wrap:wrap;gap:11px;
  font-family:var(--sg);font-size:13px;font-weight:500;
  letter-spacing:.26em;text-transform:uppercase;color:var(--t-2);
}
.kicker i{color:var(--acc);font-style:normal;}

/* ─── 8. Data Canvas ─────────────────────────────────────────────────── */
/* Toda área de imagem é um Data Canvas. Hoje abstrato e ilustrativo;
   o slot está preparado para receber imagem real (ver .cv__slot). */
.cv{
  position:relative;border:2px solid var(--rule);
  background:linear-gradient(160deg,rgba(11,37,69,.55),rgba(6,13,22,.2));
  padding:clamp(24px,2.6vw,38px);
}
.cv--soft{background:linear-gradient(150deg,rgba(11,37,69,.42),rgba(6,13,22,.15));padding:clamp(22px,2.4vw,34px);}
.cv__hd{
  display:flex;justify-content:space-between;align-items:baseline;gap:16px;
  border-bottom:2px solid var(--rule);padding-bottom:16px;
}
.cv__lb{
  font-family:var(--sg);font-size:13px;font-weight:500;
  letter-spacing:.24em;text-transform:uppercase;color:var(--t-3);
}
.cv__st{font-family:var(--sg);font-size:13px;letter-spacing:.18em;text-transform:uppercase;color:var(--acc);}
.cv__ft{font-family:var(--sg);font-size:13px;letter-spacing:.2em;text-transform:uppercase;color:var(--t-4);margin-top:14px;}
/* quando a imagem real chegar, ela entra aqui e o SVG abstrato sai */
.cv__slot{position:relative;margin-top:26px;}
.cv__slot img{width:100%;height:auto;display:block;}

/* pipeline do Data Canvas 01 */
.pipe{position:relative;margin-top:26px;}
.pipe__spine{
  position:absolute;left:11px;top:14px;bottom:24px;width:2px;
  background:linear-gradient(to bottom,var(--acc),#1B4C74);
  transform-origin:top;transform:scaleY(1);
}
.jsm .pipe__spine{transform:scaleY(0);transition:transform 1.5s cubic-bezier(.3,.8,.2,1) .25s;}
.pipe__row{display:flex;align-items:center;gap:16px;height:56px;}
.pipe__dia{flex:none;width:24px;height:15px;color:var(--acc);}
.pipe__n{font-family:var(--sg);font-size:13.5px;letter-spacing:.16em;color:var(--t-body);}
.pipe__ln{flex:1;height:1px;background:var(--grid);}
.pipe__v{font-size:13px;font-weight:600;color:var(--t-3);letter-spacing:.06em;}
.pipe__row--end .pipe__dia{color:var(--t-body);}
.pipe__row--end .pipe__n{color:var(--acc);}
.pipe__row--end .pipe__v{color:var(--t-body);}

.kpis{display:grid;grid-template-columns:1fr 1fr;margin-top:24px;border-top:2px solid var(--rule);}
.kpi{padding:20px 18px 4px 0;}
.kpi + .kpi{padding:20px 0 4px 18px;border-left:2px solid var(--rule);}
.kpi__l{font-family:var(--sg);font-size:13px;letter-spacing:.2em;text-transform:uppercase;color:var(--t-3);}
.kpi__v{font-family:var(--sg);font-size:30px;font-weight:400;letter-spacing:-.01em;margin-top:8px;color:var(--t-body);}

/* ─── 9. 02 problema ─────────────────────────────────────────────────── */
.split{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));
  gap:clamp(40px,5vw,72px);margin-top:clamp(48px,5vw,76px);align-items:center;
}
.frag{display:flex;align-items:stretch;gap:0;margin-top:24px;}
.frag__col{display:flex;flex-direction:column;flex:none;}
.frag__s{
  height:52px;display:flex;align-items:center;
  font-family:var(--sg);font-size:13px;letter-spacing:.14em;color:var(--t-2);
}
.frag__svg{flex:1;height:260px;min-width:70px;}
.frag__out{display:flex;flex-direction:column;justify-content:center;gap:14px;flex:none;}
.frag__box{
  border:2px solid var(--acc);padding:12px 16px;
  font-family:var(--sg);font-size:13px;letter-spacing:.16em;color:var(--t-body);
}
.frag__q{display:flex;align-items:center;gap:12px;}
.frag__q span:first-child{width:22px;height:2px;background:var(--rule);}
.frag__q span:last-child{font-family:var(--sg);font-size:26px;font-weight:300;color:var(--t-3);}

/* Em vez de um diagrama abstrato, os sintomas aparecem na linguagem que o
   gestor reconhece: dependência manual, conflito de números e atraso. */
.pain-list{border-top:2px solid var(--rule);}
.pain-list__item{
  display:grid;grid-template-columns:42px 1fr;gap:clamp(14px,2vw,24px);
  padding:clamp(18px,2vw,26px) 0;border-bottom:1px solid var(--grid);
}
.pain-list__n{font-family:var(--sg);font-size:13px;letter-spacing:.18em;color:var(--acc);padding-top:3px;}
.pain-list__item p{margin:0;font-size:14.5px;line-height:1.62;color:var(--t-2);}
.pain-list__item strong{display:block;color:var(--t-hi);font-weight:500;margin-bottom:3px;}

/* O problema entra pela voz da operação. Os três sinais têm superfície,
   não moldura: contraste suficiente sem repetir a grade técnica. */
.problem-story{margin-top:clamp(44px,5vw,72px);}
.problem-story__lead{margin:0;font-size:clamp(17px,1.5vw,21px);line-height:1.58;color:var(--t-2);max-width:64ch;}
.problem-signals{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(12px,1.5vw,22px);margin-top:clamp(30px,3.5vw,48px);}
.problem-signal{position:relative;min-height:210px;padding:clamp(24px,2.8vw,38px);background:rgba(11,37,69,.62);overflow:hidden;}
.problem-signal::before{content:"";position:absolute;left:0;top:0;width:100%;height:4px;background:var(--acc);}
.problem-signal:nth-child(2){background:rgba(18,34,50,.82);}
.problem-signal:nth-child(2)::before{background:var(--slate);}
.problem-signal:nth-child(3){background:linear-gradient(145deg,rgba(21,193,224,.12),rgba(11,37,69,.58));}
.problem-signal__k{font-family:var(--sg);font-size:13px;letter-spacing:.22em;text-transform:uppercase;color:var(--acc);}
.problem-signal p{margin:clamp(28px,3vw,42px) 0 0;font-family:var(--sg);font-weight:300;font-size:clamp(18px,1.8vw,25px);line-height:1.38;color:var(--t-hi);}
.problem-answer{display:flex;align-items:center;justify-content:space-between;gap:clamp(24px,4vw,64px);margin-top:clamp(20px,2.4vw,34px);padding:clamp(24px,3vw,38px);background:rgba(21,193,224,.07);}
.problem-answer p{margin:0;font-size:15px;line-height:1.65;color:var(--t-2);max-width:68ch;}
.problem-answer strong{color:var(--t-hi);font-weight:600;}
.problem-answer a{flex:none;font-size:14px;font-weight:600;}
@media (max-width:820px){.problem-signals{grid-template-columns:1fr;}.problem-signal{min-height:0;}.problem-answer{align-items:flex-start;flex-direction:column;}}

/* História da decisão: a linha liga pergunta, busca, espera e resposta. */
.decision-story{margin-top:clamp(46px,5vw,76px);}
.decision-story__intro{margin:0;max-width:62ch;font-size:clamp(17px,1.55vw,22px);line-height:1.58;color:var(--t-2);}
.decision-story__intro strong{color:var(--t-hi);font-weight:600;}
.decision-story__timeline{position:relative;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(20px,3vw,50px);margin-top:clamp(44px,5vw,70px);}
.decision-story__line{position:absolute;left:9px;right:9px;top:9px;height:2px;background:linear-gradient(to right,var(--rule),var(--acc));transform-origin:left;transform:scaleX(1);}
.jsm .decision-story__line{transform:scaleX(0);transition:transform 1.5s cubic-bezier(.3,.8,.2,1) .12s;}
.decision-story__step{position:relative;padding-top:44px;}
.decision-story__node{position:absolute;left:0;top:0;width:20px;height:20px;border-radius:50%;background:var(--slate);border:4px solid var(--ink);box-shadow:0 0 0 2px var(--rule);}
.decision-story__step--answer .decision-story__node{background:var(--acc);box-shadow:0 0 0 2px var(--acc);}
.decision-story__k{font-family:var(--sg);font-size:13px;letter-spacing:.22em;text-transform:uppercase;color:var(--t-3);}
.decision-story__step--answer .decision-story__k{color:var(--acc);}
.decision-story__step h3{font-family:var(--sg);font-size:clamp(18px,1.65vw,24px);font-weight:300;line-height:1.3;color:var(--t-hi);margin:14px 0 0;}
.decision-story__step p{font-size:14px;line-height:1.62;color:var(--t-2);margin:14px 0 0;max-width:29ch;}
.decision-story__step--answer{padding-left:clamp(16px,1.8vw,28px);padding-right:clamp(16px,1.8vw,28px);background:linear-gradient(180deg,rgba(21,193,224,.10),rgba(11,37,69,.32));}
.decision-story__step--answer .decision-story__node{left:clamp(16px,1.8vw,28px);}
.decision-story__end{display:flex;align-items:center;justify-content:space-between;gap:32px;margin-top:clamp(32px,4vw,56px);padding:clamp(24px,3vw,36px);background:rgba(11,37,69,.55);}
.decision-story__end p{font-size:15px;line-height:1.62;color:var(--t-2);max-width:68ch;margin:0;}
.decision-story__end a{flex:none;font-size:14px;font-weight:600;}
.jsm .decision-story__step,.jsm .decision-story__end{opacity:.85;transform:translateY(18px);}
.jsm .decision-story.in .decision-story__step,.jsm .decision-story.in .decision-story__end{opacity:1;transform:none;transition:opacity .55s var(--ease),transform .55s var(--ease);}
.jsm .decision-story.in .decision-story__step:nth-of-type(1){transition-delay:.18s;}
.jsm .decision-story.in .decision-story__step:nth-of-type(2){transition-delay:.36s;}
.jsm .decision-story.in .decision-story__step:nth-of-type(3){transition-delay:.54s;}
.jsm .decision-story.in .decision-story__step:nth-of-type(4){transition-delay:.72s;}
.jsm .decision-story.in .decision-story__end{transition-delay:.9s;}
@media (max-width:860px){
  .decision-story__timeline{grid-template-columns:1fr;gap:32px;}
  .decision-story__line{left:9px;right:auto;top:9px;bottom:9px;width:2px;height:auto;transform-origin:top;background:linear-gradient(to bottom,var(--rule),var(--acc));}
  .jsm .decision-story__line{transform:scaleY(0);}
  .decision-story__step{padding:0 0 0 48px;min-height:100px;}
  .decision-story__step--answer{padding:24px 24px 24px 48px;}
  .decision-story__step--answer .decision-story__node{left:0;top:24px;}
  .decision-story__step p{max-width:52ch;}
  .decision-story__end{align-items:flex-start;flex-direction:column;}
}

/* ─── 10. 03 conectar · entender · agir ──────────────────────────────── */
/* A régua entre colunas é o GAP, não um border-right: assim, quando o
   auto-fit empilha as colunas, a régua vira horizontal sozinha — em vez de
   deixar um traço vertical solto na lateral. Responsivo sem media query. */
.cols3{
  max-width:var(--wrap);margin:0 auto;
  display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));
  gap:clamp(12px,1.4vw,22px);background:transparent;
}
.col{
  position:relative;border:1px solid rgba(22,48,76,.85);
  padding:clamp(34px,3.4vw,52px) clamp(24px,2.6vw,44px) clamp(44px,4vw,64px);
}
.col::before{content:"";position:absolute;left:-1px;right:-1px;top:-1px;height:4px;background:var(--acc);}
.col--data{background:linear-gradient(160deg,rgba(11,37,69,.92),rgba(8,23,37,.96));}
.col--analytics{background:linear-gradient(160deg,rgba(20,37,54,.88),rgba(6,17,28,.98));}
.col--analytics::before{background:var(--slate);}
.col--automation{background:linear-gradient(160deg,rgba(21,193,224,.13),rgba(7,22,34,.98) 54%);}
.col--automation::before{background:linear-gradient(to right,var(--acc),rgba(21,193,224,.28));}
.col__hd{display:flex;align-items:baseline;justify-content:space-between;gap:16px;}
.col__k{font-family:var(--sg);font-size:13px;font-weight:500;letter-spacing:.24em;text-transform:uppercase;color:var(--acc);}
.col__n{font-family:var(--sg);font-size:13px;color:var(--t-3);letter-spacing:.1em;}
.col__svg{width:100%;margin-top:38px;}
.col__lk{display:inline-block;margin-top:20px;font-size:14px;font-weight:600;letter-spacing:.02em;}
.home--service .col{display:flex;flex-direction:column;}
.services-intro{font-size:clamp(15px,1.3vw,18px);line-height:1.65;color:var(--t-2);max-width:68ch;margin:0 0 clamp(44px,5vw,72px);}
.service-list{list-style:none;margin:clamp(28px,3vw,38px) 0 30px;padding:0;display:grid;gap:13px;}
.service-list li{
  position:relative;padding:0 0 0 20px;
  font-size:13.5px;line-height:1.5;color:var(--t-2);
}
.service-list li::before{content:"";position:absolute;left:0;top:.72em;width:8px;height:2px;background:var(--acc);}
.home--service .col__lk{margin-top:auto;align-self:flex-start;}

/* ─── 11. 04 projetos ────────────────────────────────────────────────── */
.projs{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));
  gap:clamp(24px,2.4vw,34px);
}
.proj{
  border:2px solid var(--rule);
  background:linear-gradient(165deg,rgba(11,37,69,.5),rgba(6,13,22,.2));
  display:flex;flex-direction:column;
}
.proj__hd{padding:clamp(26px,2.6vw,36px) clamp(24px,2.4vw,34px) 0;}
.proj__k{font-family:var(--sg);font-size:13px;font-weight:500;letter-spacing:.24em;text-transform:uppercase;color:var(--acc);}
/* Duas fileiras reservadas: sem isso, o card cujos chips quebram linha empurra
   a régua para baixo e as três réguas dos cards deixam de se alinhar — que é
   justamente o que o sistema Modernist não perdoa. */
.chips{display:flex;flex-wrap:wrap;align-content:flex-start;gap:8px;margin-top:22px;min-height:78px;}
.chip{font-size:13px;font-weight:500;letter-spacing:.06em;color:var(--t-2);border:1px solid var(--rule);padding:7px 12px;}
.proj__cv{
  margin-top:34px;border-top:2px solid var(--rule);
  padding:26px clamp(24px,2.4vw,34px);
  flex:1;display:flex;flex-direction:column;justify-content:flex-end;gap:20px;
  background:rgba(6,13,22,.35);
}
.proj__cv svg{width:100%;}
.proj__lb{font-family:var(--sg);font-size:13px;letter-spacing:.2em;text-transform:uppercase;color:var(--t-4);}
.home--service .chips{min-height:0;}
.proj__body{padding:clamp(28px,3vw,40px) clamp(24px,2.4vw,34px) clamp(30px,3vw,42px);display:flex;flex-direction:column;gap:18px;flex:1;}
.proj__q{margin:0;font-family:var(--sg);font-weight:300;font-size:clamp(19px,1.8vw,25px);line-height:1.3;color:var(--t-hi);}
.proj__d{margin:auto 0 0;padding-top:18px;border-top:1px solid var(--grid);font-size:14px;line-height:1.62;color:var(--t-2);}

/* ─── 12. real data canvas — painel Power BI incorporado ─────────────── */
.real{margin-top:clamp(48px,5vw,72px);border-top:2px solid var(--rule);padding-top:clamp(36px,4vw,56px);}
.real__hd{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:16px;}
.real__t{font-family:var(--sg);font-weight:300;font-size:clamp(22px,2.2vw,30px);color:var(--t-hi);margin:0;}
.real__note{font-size:14px;line-height:1.6;color:var(--t-2);margin:14px 0 0;max-width:60ch;}
.real__note strong{color:var(--t-hi);font-weight:600;}
.embed{
  position:relative;margin:22px 0 18px;border:2px solid var(--rule);
  background:rgba(11,37,69,.35);aspect-ratio:16/9;
}
.embed iframe{width:100%;height:100%;border:0;display:block;transition:opacity .45s var(--ease);}
/* cortina sobre o branco do visualizador do Power BI, até haver relatório.
   Só existe quando o JS a cria — sem JS o iframe aparece direto. */
.embed[data-cortina] iframe{opacity:0;}
.embed__load{
  position:absolute;inset:0;margin:0;z-index:2;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;
  background:var(--ink);text-align:center;padding:0 24px;
  font-family:var(--sg);font-size:13px;letter-spacing:.2em;text-transform:uppercase;color:var(--t-3);
}
.embed__load[data-lento] a{
  font-family:var(--ar);font-size:14.5px;font-weight:600;letter-spacing:.03em;text-transform:none;
  color:var(--acc-ink);background:var(--acc);border:2px solid var(--acc);padding:13px 20px;
}
.embed__load[data-lento] a:hover{background:var(--acc-hi);border-color:var(--acc-hi);}
.embed__foot{
  display:flex;flex-wrap:wrap;align-items:center;gap:14px 20px;
  font-size:13.5px;line-height:1.55;color:var(--t-4);
  margin:0;padding:18px 0 0;border-top:2px solid var(--rule);
}
.embed__foot span{flex:1 1 32ch;}
.embed__foot a{
  flex:none;font-family:var(--ar);font-size:13.5px;font-weight:600;letter-spacing:.03em;
  color:var(--t-body);border:2px solid var(--rule);padding:11px 18px;
}
.embed__foot a:hover{border-color:var(--acc);color:var(--acc);}
@media (max-width:640px){.embed{aspect-ratio:4/5;}}

/* Ponte comercial: explica por que a MÉTRICA não começa pela ferramenta. */
.real--service{
  display:grid;grid-template-columns:minmax(240px,.72fr) minmax(300px,1.28fr);
  gap:18px clamp(36px,5vw,76px);padding:clamp(34px,4vw,54px);
  border:0;background:linear-gradient(110deg,rgba(11,37,69,.62),rgba(21,193,224,.055));
}
.real--service .real__hd{grid-column:1;}
.real--service .real__note{grid-column:1;margin-top:0;}
.real--service .embed__foot{
  grid-column:2;grid-row:1 / span 2;align-self:center;display:block;
  padding:0 0 0 clamp(24px,3vw,42px);border:0;border-left:2px solid var(--acc);
  font-size:clamp(15px,1.3vw,18px);color:var(--t-2);
}
.real--service .embed__foot span{display:block;max-width:48ch;}
.real--service .embed__foot a{display:inline-block;margin-top:24px;}
@media (max-width:760px){
  .real--service{grid-template-columns:1fr;}
  .real--service .real__hd,.real--service .real__note,.real--service .embed__foot{grid-column:1;grid-row:auto;}
}

/* ─── 13. métrica tools ──────────────────────────────────────────────── */
.tool{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,380px),1fr));
  gap:clamp(40px,5vw,80px);align-items:start;
}
.tool + .tool{margin-top:clamp(56px,6vw,88px);padding-top:clamp(56px,6vw,88px);border-top:2px solid var(--rule);}
.tool__cv{order:0;}
.tool--rev .tool__cv{order:-1;}
#tools{--studio-free:var(--brand-cyan);}
#tools .tool{
  grid-template-columns:minmax(0,1.08fr) minmax(390px,.92fr);
  gap:clamp(44px,5vw,76px);
}
#tools .tool__copy{min-width:0;}
#tools .tool__cv{margin-top:0;}
@media (max-width:980px){
  #tools .tool{grid-template-columns:1fr;}
  #tools .tool__cv{order:0;}
  #tools .tool__copy{order:-1;}
}
.method-sec{padding-bottom:clamp(42px,5vw,72px);}
.method-close{
  max-width:78ch;margin-top:clamp(28px,3vw,42px);padding-top:clamp(22px,2.5vw,32px);
  border-top:1px solid var(--rule);font-size:clamp(16px,1.35vw,20px);
}

/* wireframe do resultado do Quiz — Product Canvas, não screenshot */
.wf{display:grid;grid-template-columns:1fr 1fr 1fr;grid-auto-rows:58px;gap:10px;margin-top:26px;}
.wf__kpi{
  grid-column:span 3;border:2px solid var(--acc);background:rgba(21,193,224,.09);
  display:flex;align-items:center;padding:0 16px;
  font-family:var(--sg);font-size:13px;letter-spacing:.18em;text-transform:uppercase;color:var(--acc);
}
.wf__big{grid-column:span 2;grid-row:span 2;border:1px solid var(--rule);background:rgba(11,37,69,.4);display:flex;align-items:flex-end;padding:14px;}
.wf__c{border:1px solid var(--rule);background:rgba(11,37,69,.4);display:flex;align-items:center;justify-content:center;}
.wf__row{
  grid-column:span 3;border:1px solid var(--rule);background:rgba(11,37,69,.4);
  display:flex;align-items:center;padding:0 16px;
  font-size:13px;letter-spacing:.16em;text-transform:uppercase;color:var(--t-4);
}

/* O gratuito é o produto de entrada, não uma linha tímida na tabela. */
.tag{
  flex:none;font-family:var(--sg);font-size:13px;font-weight:500;
  letter-spacing:.2em;text-transform:uppercase;padding:6px 11px;border:1px solid;
}
.tag--free{color:var(--t-2);border-color:var(--rule);}
.tag--pro{color:var(--acc);border-color:var(--acc);}
.studio-free{margin-top:clamp(42px,5vw,68px);border-top:2px solid var(--studio-free);background:rgba(67,197,158,.025);}
.studio-quick{display:flex;align-items:center;gap:16px;margin-top:26px;}
.studio-quick span{font-size:13px;line-height:1.45;color:var(--t-4);}
.studio-free__head{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 0;}
.studio-free__head .tag--free{color:#06120F;background:var(--studio-free);border-color:var(--studio-free);}
.studio-free__head strong{font-family:var(--sg);font-size:14px;font-weight:400;color:var(--t-hi);text-align:right;}
.studio-free__grid{display:grid;grid-template-columns:repeat(3,1fr);list-style:none;margin:0;padding:0;border-top:1px solid var(--grid);}
.studio-free__grid li{position:relative;padding:22px 24px 23px 42px;border-right:1px solid var(--grid);border-bottom:1px solid var(--grid);}
.studio-free__grid li:nth-child(3n){border-right:0;}
.studio-free__grid li::before{content:"";position:absolute;left:22px;top:30px;width:8px;height:2px;background:var(--studio-free);}
.studio-free__grid b{display:block;font-family:var(--sg);font-size:13px;font-weight:500;letter-spacing:.03em;color:var(--t-body);}
.studio-free__grid span{display:block;margin-top:6px;font-size:13px;line-height:1.48;color:var(--t-3);}
.soon{
  display:inline-block;margin-left:14px;vertical-align:middle;
  font-family:var(--ar);font-size:13px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;
  color:var(--t-4);border:1px solid var(--rule);padding:5px 10px;
}
@media (max-width:620px){
  .studio-quick,.studio-free__head{align-items:flex-start;flex-direction:column;}
  .studio-free__head strong{text-align:left;}
  .studio-free__grid{grid-template-columns:1fr;}
  .studio-free__grid li,.studio-free__grid li:nth-child(3n){border-right:0;}
}
@media (min-width:621px) and (max-width:980px){
  .studio-free__grid{grid-template-columns:1fr 1fr;}
  .studio-free__grid li:nth-child(3n){border-right:1px solid var(--grid);}
  .studio-free__grid li:nth-child(even){border-right:0;}
}

/* ─── 14. 06 diagnóstico ─────────────────────────────────────────────── */
.diag{background:linear-gradient(180deg,#08182C,var(--ink));overflow:hidden;}
.diag__grid{
  display:grid;grid-template-columns:minmax(260px,.72fr) minmax(360px,1.28fr);
  gap:clamp(40px,4vw,72px);align-items:center;
}
.score{position:relative;display:flex;align-items:center;justify-content:center;padding:clamp(20px,3vw,44px) 0;}
.score__cube{position:absolute;width:min(84%,340px);color:#123A5C;}
.score__in{position:relative;text-align:center;}
.score__n{font-family:var(--sg);font-weight:300;font-size:clamp(76px,10vw,132px);line-height:1;letter-spacing:-.03em;color:var(--t-hi);}
.score__d{font-family:var(--sg);font-size:15px;letter-spacing:.24em;color:var(--acc);margin-top:10px;}
.score__l{font-size:13px;letter-spacing:.18em;text-transform:uppercase;color:var(--t-3);margin:20px auto 0;max-width:22ch;}
.score__start{
  display:inline-flex;align-items:center;gap:9px;margin-top:20px;padding:10px 0;border:0;border-bottom:2px solid var(--acc);
  background:none;color:var(--t-body);font-family:var(--sg);font-size:13px;font-weight:500;letter-spacing:.13em;text-transform:uppercase;cursor:pointer;
}
.score__start:hover{color:var(--acc);}
.score__start span{transition:transform .2s var(--ease);}
.score__start:hover span{transform:translateX(4px);}
.score[data-calibrating] .score__n{color:var(--acc);text-shadow:0 0 36px rgba(21,193,224,.28);}
.score__n{transition:color .3s var(--ease),text-shadow .3s var(--ease);}

/* avaliação de maturidade: uma pergunta por vez, sem tirar o CTA de vista */
.mat{min-width:0;background:rgba(6,13,22,.5);border:1px solid rgba(22,48,76,.8);padding:clamp(24px,3vw,40px);}
.mat__head{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:18px;margin-bottom:clamp(28px,3vw,38px);}
.mat__progress{font-family:var(--sg);font-size:13px;letter-spacing:.18em;text-transform:uppercase;color:var(--acc);white-space:nowrap;}
.mat__track{height:2px;background:var(--grid);overflow:hidden;}
.mat__track span{display:block;width:12.5%;height:100%;background:var(--acc);transition:width .28s var(--ease);}
.mat__step{border:0;margin:0;padding:0;min-width:0;}
.mat__step legend{font-family:var(--sg);font-size:clamp(21px,2.1vw,30px);font-weight:300;line-height:1.25;color:var(--t-hi);padding:0;max-width:27ch;}
.mat__help{margin:12px 0 0;font-size:14px;color:var(--t-2);max-width:52ch;}
.mat__choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:clamp(24px,2.6vw,34px);}
.mat__step[data-mat-step="0"] .mat__choices{grid-template-columns:repeat(2,minmax(0,1fr));}
.mat__choice{
  min-height:52px;padding:12px 14px;border:1px solid var(--rule);background:rgba(11,37,69,.28);
  color:var(--t-2);font-size:13.5px;line-height:1.35;text-align:left;cursor:pointer;
  transition:border-color .18s var(--ease),background .18s var(--ease),color .18s var(--ease);
}
.mat__choice:hover{border-color:var(--acc);color:var(--t-hi);}
.mat__choice[aria-pressed="true"]{border-color:var(--acc);background:rgba(21,193,224,.13);color:var(--t-hi);}
.mat__nav{display:flex;flex-wrap:wrap;gap:10px;margin-top:clamp(26px,3vw,38px);}
.mat__nav .b:disabled{opacity:.35;cursor:not-allowed;}
.mat__result-k{font-family:var(--sg);font-size:13px;letter-spacing:.2em;text-transform:uppercase;color:var(--acc);margin:0;}
.mat__result h3{font-family:var(--sg);font-weight:300;font-size:clamp(25px,2.8vw,38px);line-height:1.16;color:var(--t-hi);margin:12px 0;}
.mat__result p{font-size:15px;line-height:1.62;color:var(--t-2);max-width:52ch;margin:0 0 24px;}
.mat__gaps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;margin:28px 0;background:var(--rule);border:1px solid var(--rule);}
.mat__gap{min-height:112px;padding:18px;background:#071321;}
.mat__gap span{display:block;font-family:var(--sg);font-size:13px;letter-spacing:.16em;text-transform:uppercase;color:#D7A642;}
.mat__gap strong{display:block;margin-top:10px;font-family:var(--sg);font-size:13px;font-weight:500;line-height:1.45;color:var(--t-body);}
.mat__lead{margin:34px calc(clamp(24px,3vw,40px) * -1) 0;padding:clamp(24px,3vw,36px);border-top:2px solid #43C59E;background:linear-gradient(135deg,rgba(67,197,158,.09),rgba(6,13,22,.3));}
.mat__lead-copy>span{font-family:var(--sg);font-size:13px;letter-spacing:.18em;text-transform:uppercase;color:#43C59E;}
.mat__lead-copy h4{margin:10px 0 8px;font-family:var(--sg);font-size:clamp(19px,2vw,25px);font-weight:400;color:var(--t-hi);}
.mat__lead-copy p{margin:0;max-width:58ch;font-size:13.5px;}
.mat__form{margin-top:24px;}
.mat__fields{display:grid;grid-template-columns:.8fr 1.25fr 1fr;gap:10px;}
.mat__fields label{display:grid;gap:8px;font-family:var(--sg);font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--t-3);}
.mat__fields input{width:100%;min-width:0;height:47px;padding:0 13px;border:1px solid var(--rule);border-radius:0;background:rgba(4,12,20,.72);color:var(--t-hi);font:14px var(--ar);outline:none;}
.mat__fields input:focus{border-color:#43C59E;box-shadow:0 0 0 2px rgba(67,197,158,.1);}
.mat__fields input:invalid:not(:placeholder-shown){border-color:#D36B6B;}
.mat__form>.b{margin-top:14px;background:#43C59E;color:#06120F;}
.mat__form>.b:hover{background:#6ED6B6;}
.mat__privacy{margin:12px 0 0!important;font-size:13px!important;line-height:1.5!important;color:var(--t-4)!important;}
.mat__privacy a{color:var(--t-3);text-decoration:underline;text-underline-offset:2px;}
.mat__status{min-height:20px;margin:10px 0 0!important;font-size:13px!important;color:#43C59E!important;}
.mat__result-actions{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:22px;}
.mat__diagnosis-link{font-family:var(--sg);font-size:13px;letter-spacing:.06em;color:var(--t-2);border-bottom:1px solid var(--rule);padding:8px 0;}
.mat__diagnosis-link:hover{color:var(--acc);border-color:var(--acc);}
.mat__cta{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-top:clamp(28px,3vw,40px);padding-top:24px;border-top:1px solid var(--rule);}
.mat__cta p{font-size:13.5px;line-height:1.55;color:var(--t-3);max-width:42ch;margin:0;}
.mat__trust{font-family:var(--sg);font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--t-4);}
@media (max-width:900px){.diag__grid{grid-template-columns:1fr;}.score{min-height:300px;}}
@media (max-width:620px){
  .mat__choices,.mat__step[data-mat-step="0"] .mat__choices{grid-template-columns:1fr;}
  .mat__gaps,.mat__fields{grid-template-columns:1fr;}
  .mat__result-actions,.mat__cta{align-items:flex-start;flex-direction:column;}
}

.bar{display:flex;align-items:center;gap:20px;padding:20px 0;border-top:2px solid var(--rule);}
.bar:last-of-type{border-bottom:2px solid var(--rule);}
.bar__l{flex:none;width:clamp(96px,9vw,140px);font-size:13px;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:var(--t-2);}
.bar__tr{flex:1;height:8px;background:rgba(21,193,224,.1);display:block;}
.bar__f{display:block;height:8px;background:var(--acc);width:var(--w,0%);}
.jsm .bar__f{width:0;transition:width 1.2s cubic-bezier(.3,.8,.2,1);}
.bar__n{flex:none;font-family:var(--sg);font-size:14px;color:var(--t-body);width:34px;text-align:right;}

/* ─── 15. 07 método ──────────────────────────────────────────────────── */
.mth{position:relative;margin-top:clamp(48px,5vw,72px);}
.mth__ln{
  position:absolute;left:0;right:0;top:11px;height:2px;
  background:linear-gradient(to right,var(--acc),#1B4C74);
  transform-origin:left;transform:scaleX(1);
}
.jsm .mth__ln{transform:scaleX(0);transition:transform 1.6s cubic-bezier(.3,.8,.2,1) .2s;}
.mth__in{
  position:relative;display:grid;
  grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr));
  gap:clamp(24px,3vw,48px);
}
.mth__d{display:block;width:20px;height:20px;border-radius:50%;background:var(--acc);border:4px solid var(--ink);box-shadow:0 0 0 2px var(--acc);}
.mth__i:last-child .mth__d{background:var(--t-body);box-shadow:0 0 0 2px var(--t-body);}
.mth__n{font-family:var(--sg);font-size:13px;letter-spacing:.2em;color:var(--t-3);margin-top:26px;}
.mth__t{font-family:var(--sg);font-size:clamp(20px,2vw,28px);font-weight:300;letter-spacing:.02em;margin-top:10px;color:var(--t-hi);}
.mth__dsc{font-size:13.5px;line-height:1.62;color:var(--t-2);margin:14px 0 0;max-width:26ch;}
.jsm .mth__i{opacity:.85;transform:translateY(16px);}
.jsm .mth.in .mth__i{opacity:1;transform:none;transition:opacity .55s var(--ease),transform .55s var(--ease);}
.jsm .mth.in .mth__i:nth-child(1){transition-delay:.18s;}
.jsm .mth.in .mth__i:nth-child(2){transition-delay:.38s;}
.jsm .mth.in .mth__i:nth-child(3){transition-delay:.58s;}
.jsm .mth.in .mth__i:nth-child(4){transition-delay:.78s;}
@media (max-width:760px){
  .mth__ln{left:11px;right:auto;top:0;bottom:0;width:2px;height:auto;background:linear-gradient(to bottom,var(--acc),#1B4C74);transform-origin:top;}
  .jsm .mth__ln{transform:scaleY(0);}
  .mth__in{grid-template-columns:1fr;gap:34px;}
  .mth__i{position:relative;padding-left:52px;}
  .mth__d{position:absolute;left:1px;top:1px;}
  .mth__n{margin-top:0;}
  .mth__dsc{max-width:42ch;}
}

/* ─── 16. 09 CTA final + formulário ──────────────────────────────────── */
.final{position:relative;overflow:hidden;padding:clamp(88px,10vw,168px) var(--pad);}
.final__grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,400px),1fr));
  gap:clamp(48px,5vw,88px);align-items:start;margin-top:clamp(48px,5vw,72px);
}
.contacts{display:flex;flex-direction:column;gap:12px;margin-top:36px;padding-top:26px;border-top:2px solid var(--rule);}
.contacts a{font-family:var(--sg);font-size:15px;letter-spacing:.04em;color:var(--t-2);}
.contacts a:hover{color:var(--acc);}

.form{display:grid;gap:20px;}
.field{display:grid;gap:8px;}
.field label{font-family:var(--sg);font-size:13px;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--t-3);}
.field input,.field textarea{
  font-family:var(--ar);font-size:16px;color:var(--t-body);
  background:rgba(11,37,69,.35);border:2px solid var(--rule);
  padding:14px 16px;width:100%;
}
.field textarea{resize:vertical;min-height:112px;}
.field input:hover,.field textarea:hover{border-color:#1E4368;}
.field input:focus,.field textarea:focus{border-color:var(--acc);outline:none;}
/* Estado de erro sem vermelho: o sistema tem um só acento e proíbe cor nova.
   O erro se anuncia por três sinais que não dependem de cor — texto claro,
   peso maior e uma barra à esquerda —, o que também é o que a acessibilidade
   pede: nunca sinalizar só pela cor. */
.field[data-invalid="true"] input,.field[data-invalid="true"] textarea{border-color:var(--acc);}
.err{
  margin:0;font-size:13.5px;font-weight:600;color:var(--t-hi);
  padding-left:14px;border-left:2px solid var(--acc);
}
.err:empty{display:none;}
.form .b{justify-self:start;}
.form__privacy{margin:-3px 0 0;max-width:52ch;font-size:13px;line-height:1.55;color:var(--t-4);}
.form__privacy a{color:var(--t-2);text-decoration-color:var(--acc);text-underline-offset:3px;}
.form__privacy a:hover{color:var(--acc);}
.form__note{margin:0;font-family:var(--sg);font-size:14px;line-height:1.55;color:var(--acc);}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden;}

/* ─── 17. rodapé ─────────────────────────────────────────────────────── */
.ft{padding:clamp(56px,6vw,88px) var(--pad) 40px;}
.ft__cols{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,190px),1fr));
  gap:clamp(32px,4vw,56px);
}
.ft__tag{font-family:var(--sg);font-size:13px;letter-spacing:.2em;text-transform:uppercase;color:var(--t-3);margin:16px 0 0;}
.ft__h{font-size:13px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--t-3);}
.ft__l{display:flex;flex-direction:column;gap:12px;margin-top:20px;font-size:14px;}
.ft__l a{color:var(--t-2);}
.ft__l a:hover{color:var(--acc);}
.ft__bot{
  display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px;
  margin-top:clamp(48px,5vw,72px);padding-top:24px;border-top:2px solid var(--rule);
  font-size:13px;color:var(--t-4);
}
.ft__bot a{color:var(--t-4);}
.ft__bot a:hover{color:var(--t-2);}
.ft__bot div{display:flex;gap:24px;flex-wrap:wrap;}

/* ─── 18. WhatsApp ───────────────────────────────────────────────────── */
/* Marca de terceiro: o círculo verde é exigência de uso correto da marca,
   e por isso é a única exceção ao raio zero do sistema. */
.wa{
  position:fixed;right:24px;bottom:24px;z-index:90;width:60px;height:60px;
  transition:transform .18s var(--ease);
}
.wa svg{width:100%;height:100%;display:block;border-radius:50%;}
.wa:hover{transform:scale(1.06);}
.wa:focus-visible{outline:3px solid var(--acc);outline-offset:4px;}
@media (max-width:620px){
  .wa{right:16px;bottom:84px;width:54px;height:54px;}
  #aplicacoes,.final,.cta{padding-bottom:calc(var(--sec-y) + 72px);}
  .nav > a,.brand,.crumb a,.ft__l a,.ft__bot a,.contacts a,.cta__contacts a,.col__lk,.case__link,.post__l,.mat__diagnosis-link,.score__start,.decision-story__end a,.problem-answer a,.consent-settings,.consent__copy a{
    min-height:44px;display:flex;align-items:center;padding-top:10px;padding-bottom:10px;
  }
  .art a,.sec__intro a,.form__privacy a,.mat__privacy a{min-height:44px;display:inline-flex;align-items:center;padding-top:10px;padding-bottom:10px;}
  .burger{width:44px;height:44px;}
}
@media print{.wa{display:none;}}

/* ─── 19. movimento ──────────────────────────────────────────────────── */
/* O estado oculto só existe depois que o JS monta (.jsm no <html>).
   Sem JavaScript a página aparece completa — exigência da skill e do
   checklist do SEO.md §12. */
.jsm [data-reveal]{opacity:.85;transform:translateY(22px);}
.jsm [data-reveal].in{
  opacity:1;transform:none;
  transition:opacity .75s var(--ease),transform .75s var(--ease);
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  .jsm [data-reveal]{opacity:1 !important;transform:none !important;}
  .jsm .pipe__spine,.jsm .mth__ln{transform:none !important;transition:none !important;}
  .jsm .bar__f{width:var(--w,0%) !important;transition:none !important;}
  .b,.wa{transition:none !important;}
  .jsm .mth__i{opacity:1 !important;transform:none !important;transition:none !important;}
  .jsm .decision-story__line{transform:none !important;transition:none !important;}
  .jsm .decision-story__step,.jsm .decision-story__end{opacity:1 !important;transform:none !important;transition:none !important;}
}

/* ══════════════════════════════════════════════════════════════════════
   PÁGINAS INTERNAS
   Mesmo sistema, componentes próprios. Os nomes de classe são os que já
   existiam em styles.css — as páginas internas não tiveram o markup
   reescrito, só a pele trocada. É o que manteve a migração barata e
   reversível: conteúdo, headings, links e SEO ficaram intactos.
   ══════════════════════════════════════════════════════════════════════ */

/* ─── superfícies de seção ───────────────────────────────────────────── */
.sec--alt{background:rgba(11,37,69,.26);}
.sec--dark{background:linear-gradient(180deg,#08182C,var(--ink));}
.sec--tex,.sec--tramas{position:relative;background:linear-gradient(180deg,#08182C,var(--ink));}
.sec--tex::before,.sec--tramas::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background-image:repeating-linear-gradient(to right,var(--grid) 0 1px,transparent 1px 16.666%);
  opacity:.7;
}
.sec--tex > *,.sec--tramas > *{position:relative;}

.sec__hd{max-width:46rem;margin-bottom:clamp(40px,5vw,64px);}
.sec__hd .h1,.sec__hd .h2{margin-top:18px;}
.sec__intro{font-size:clamp(15px,1.2vw,18px);line-height:1.62;color:var(--t-2);margin:22px 0 0;max-width:44em;}

/* ─── trilha de navegação ────────────────────────────────────────────── */
.crumb{
  display:flex;flex-wrap:wrap;align-items:center;gap:10px;
  font-family:var(--sg);font-size:13px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--t-4);margin-bottom:clamp(32px,4vw,52px);
}
.crumb a{color:var(--t-3);}
.crumb a:hover{color:var(--acc);}
.crumb [aria-current]{color:var(--t-2);}

/* ─── hero de página interna ─────────────────────────────────────────── */
.pghero{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));
  gap:clamp(32px,5vw,64px);align-items:center;
}
.pghero__copy{max-width:46rem;}
.pghero .h1{margin-top:0;}

/* diagramas de apoio das páginas internas */
.loop,.flow{
  margin:0;border:2px solid var(--rule);
  background:linear-gradient(150deg,rgba(11,37,69,.45),rgba(6,13,22,.15));
  padding:clamp(22px,2.4vw,34px);
}
.loop svg,.flow svg{width:100%;height:auto;max-width:460px;margin:0 auto;}
.loop figcaption,.flow figcaption{
  font-family:var(--sg);font-size:13px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--t-4);margin-top:18px;
}

/* ─── três frentes (serviços) ────────────────────────────────────────── */
.svcs{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));
  gap:2px;background:var(--rule);border:2px solid var(--rule);
}
.svc{position:relative;background:var(--ink);padding:clamp(30px,3vw,44px) clamp(22px,2.4vw,34px) clamp(36px,3.4vw,48px);}
.sec--alt .svc{background:#08151F;}
.svc::before{content:"";position:absolute;top:0;left:0;right:0;height:6px;}
.svc--navy::before{background:var(--slate);}
.svc--cyan::before{background:var(--acc);}
.svc--gray::before{background:var(--rule);}
.svc__ax{
  font-family:var(--sg);font-size:13px;font-weight:500;letter-spacing:.24em;
  text-transform:uppercase;color:var(--t-3);margin:0 0 20px;
}
.svc__t{font-family:var(--sg);font-weight:300;font-size:clamp(22px,2.2vw,30px);line-height:1.14;letter-spacing:-.01em;margin:0 0 16px;color:var(--t-hi);}
.svc__d{font-size:15px;line-height:1.62;margin:0 0 22px;color:var(--t-2);}
.svc__l{list-style:none;margin:0;padding:0;border-top:2px solid var(--rule);}
.svc__l li{position:relative;padding:13px 0 13px 20px;border-bottom:1px solid var(--grid);font-size:14.5px;color:var(--t-2);}
.svc__l li::before{content:"";position:absolute;left:0;top:22px;width:8px;height:2px;background:var(--acc);}
.svc:target{outline:2px solid var(--acc);outline-offset:-2px;}

/* ─── etapas numeradas (método / 404) ────────────────────────────────── */
.steps{
  list-style:none;margin:0;padding:0;
  display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));
  gap:2px;background:var(--rule);border-top:2px solid var(--rule);border-bottom:2px solid var(--rule);
}
.step{background:var(--ink);padding:clamp(26px,2.6vw,38px) clamp(20px,2vw,30px) clamp(32px,3vw,44px);}
.sec--alt .step,.sec--tramas .step{background:#08151F;}
.step__n{font-family:var(--sg);font-size:13px;letter-spacing:.2em;color:var(--acc);}
.step__t{font-family:var(--sg);font-weight:300;font-size:clamp(19px,1.9vw,25px);letter-spacing:-.01em;margin:14px 0 12px;color:var(--t-hi);}
.step__t a{color:inherit;border-bottom:1px solid var(--rule);}
.step__t a:hover{color:var(--acc);border-bottom-color:var(--acc);}
.step__d{font-size:14.5px;line-height:1.62;margin:0;color:var(--t-2);}

/* ─── aplicações / perguntas por área ────────────────────────────────── */
.cases{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));
  gap:2px;background:var(--rule);border-top:2px solid var(--rule);border-bottom:2px solid var(--rule);
}
.case{background:var(--ink);padding:clamp(28px,2.8vw,40px) clamp(22px,2.2vw,32px) clamp(34px,3.2vw,46px);}
.sec--dark .case,.sec--tex .case{background:#081726;}
.case__who{
  font-family:var(--sg);font-size:13px;font-weight:500;letter-spacing:.24em;
  text-transform:uppercase;color:var(--acc);margin:0 0 20px;
}
.case__q{font-family:var(--sg);font-weight:300;font-size:clamp(18px,1.7vw,23px);line-height:1.3;letter-spacing:-.01em;color:var(--t-hi);margin:0 0 16px;}
.case__d{font-size:14.5px;line-height:1.62;margin:0;color:var(--t-2);}
.case__viz{width:100%;margin-top:26px;}
.case--cta{background:rgba(21,193,224,.06);}
.case__link{
  display:inline-block;margin-top:22px;font-size:14.5px;font-weight:600;
  color:var(--acc);border-bottom:2px solid var(--rule);padding-bottom:4px;
}
.case__link:hover{border-bottom-color:var(--acc);color:var(--acc);}

/* ─── cartões de navegação entre páginas ─────────────────────────────── */
.cards{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));
  gap:2px;background:var(--rule);border:2px solid var(--rule);
}
.card{background:var(--ink);}
.sec--alt .card{background:#08151F;}
.card a{
  display:flex;flex-direction:column;gap:12px;height:100%;
  padding:clamp(26px,2.6vw,36px) clamp(22px,2.2vw,30px);color:inherit;
}
.card a:hover{background:rgba(21,193,224,.06);color:inherit;}
.card__k{font-family:var(--sg);font-size:13px;font-weight:500;letter-spacing:.24em;text-transform:uppercase;color:var(--acc);}
.card__t{font-family:var(--sg);font-weight:300;font-size:clamp(19px,1.8vw,24px);line-height:1.2;letter-spacing:-.01em;color:var(--t-hi);}
.card__d{font-size:14.5px;line-height:1.6;color:var(--t-2);}
.card a::after{content:"→";font-family:var(--sg);color:var(--acc);margin-top:auto;padding-top:12px;}

/* ─── faixa de imagem ────────────────────────────────────────────────── */
/* A foto é editorial e documental, não stock corporativo. Sobre o ground
   escuro ela entra rebaixada, com o grid técnico por cima, para não brigar
   com o vocabulário abstrato dos Data Canvas. */
.band{position:relative;margin:0;border-top:2px solid var(--rule);border-bottom:2px solid var(--rule);}
.band img{width:100%;height:clamp(240px,38vw,460px);object-fit:cover;filter:saturate(.75) brightness(.62);}
.band::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:
    linear-gradient(180deg,rgba(6,13,22,.5),rgba(6,13,22,.86)),
    repeating-linear-gradient(to right,var(--grid) 0 1px,transparent 1px 12.5%);
}
.band figcaption{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:clamp(24px,3vw,48px) var(--pad);}
.band__t{
  display:block;max-width:var(--wrap);margin:0 auto;
  font-family:var(--sg);font-weight:300;font-size:clamp(20px,2.6vw,38px);
  line-height:1.16;letter-spacing:-.015em;color:var(--t-hi);
}
.band__t b{color:var(--acc);font-weight:300;}

/* ─── citação de fonte externa ───────────────────────────────────────── */
.quote{margin:clamp(28px,3vw,40px) 0;padding-left:clamp(20px,2vw,28px);border-left:2px solid var(--acc);}
.quote blockquote{
  margin:0;font-family:var(--sg);font-weight:300;
  font-size:clamp(18px,1.8vw,25px);line-height:1.34;letter-spacing:-.01em;color:var(--t-hi);
}
.quote figcaption{margin-top:16px;font-size:13.5px;color:var(--t-3);}
.quote cite{font-style:normal;}

/* ─── lista de links ─────────────────────────────────────────────────── */
.linklist{list-style:none;margin:0;padding:0;border-top:2px solid var(--rule);}
.linklist li{border-bottom:1px solid var(--grid);}
.linklist a{
  display:block;position:relative;padding:18px 0 18px 22px;
  font-size:15.5px;color:var(--t-2);transition:padding .18s var(--ease);
}
.linklist a::before{content:"";position:absolute;left:0;top:27px;width:10px;height:2px;background:var(--acc);}
.linklist a:hover{color:var(--t-hi);padding-left:32px;}

/* ─── hub do Insights ────────────────────────────────────────────────── */
.posts{
  list-style:none;margin:0;padding:0;
  display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));
  gap:clamp(20px,2.2vw,30px);
}
.post{margin:0;}
.post a{
  display:flex;flex-direction:column;height:100%;
  border:2px solid var(--rule);
  background:linear-gradient(165deg,rgba(11,37,69,.5),rgba(6,13,22,.2));
  color:inherit;transition:border-color .18s var(--ease);
}
.post a:hover{border-color:var(--acc);color:inherit;}
.post__capa{display:block;border-bottom:2px solid var(--rule);overflow:hidden;}
.post__capa img{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;display:block;filter:saturate(.8) brightness(.78);transition:filter .3s var(--ease);}
.post a:hover .post__capa img{filter:saturate(1) brightness(.92);}
.post__corpo{display:flex;flex-direction:column;gap:12px;padding:clamp(22px,2.4vw,30px);height:100%;}
.post__k{font-family:var(--sg);font-size:13px;font-weight:500;letter-spacing:.22em;text-transform:uppercase;color:var(--t-3);}
.post__t{font-family:var(--sg);font-weight:300;font-size:clamp(19px,1.8vw,24px);line-height:1.22;letter-spacing:-.01em;color:var(--t-hi);}
.post__d{font-size:14.5px;line-height:1.6;color:var(--t-2);}
.post__l{margin-top:auto;padding-top:14px;font-size:13.5px;font-weight:600;color:var(--acc);}
.post__l::after{content:" →";}
.posts__ft{font-size:14px;color:var(--t-4);margin-top:clamp(28px,3vw,40px);max-width:46em;}

/* ─── corpo de artigo ────────────────────────────────────────────────── */
.art__hd{max-width:38em;margin-bottom:clamp(32px,4vw,48px);}
/* a assinatura vem depois do lede, e precisa respirar longe dele */
.art__meta{
  font-family:var(--sg);font-size:13px;letter-spacing:.22em;text-transform:uppercase;
  color:var(--t-3);margin:26px 0 0;padding-top:20px;border-top:2px solid var(--rule);
}
.art__meta b{color:var(--t-2);font-weight:500;}
.art__capa{margin:0 0 clamp(36px,4vw,56px);max-width:1000px;border:2px solid var(--rule);}
.art__capa img{width:100%;height:auto;display:block;filter:saturate(.82) brightness(.8);}
.art__capa figcaption{
  font-family:var(--sg);font-size:13px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--t-4);padding:14px clamp(16px,2vw,22px);border-top:2px solid var(--rule);
}
.art{max-width:36em;}
.art p{font-size:17px;line-height:1.72;margin:0 0 24px;color:var(--t-2);}
.art h2{font-family:var(--sg);font-weight:300;font-size:clamp(24px,2.4vw,34px);line-height:1.16;letter-spacing:-.015em;color:var(--t-hi);margin:clamp(40px,4vw,56px) 0 20px;}
.art b,.art strong{font-weight:600;color:var(--t-hi);}
.art a{border-bottom:1px solid var(--rule);}
.art a:hover{border-bottom-color:var(--acc);}
.art .quote{margin:clamp(32px,3.4vw,44px) 0;max-width:none;}
.art__l{margin:0 0 24px;padding-left:22px;}
.art__l li{font-size:17px;line-height:1.66;margin-bottom:14px;color:var(--t-2);}
.art__l li::marker{color:var(--acc);}
.art__cta{border-left:2px solid var(--acc);padding:6px 0 6px 20px;margin:clamp(32px,3.4vw,44px) 0 0;}
.art__hr{border:0;border-top:2px solid var(--rule);margin:clamp(40px,4vw,56px) 0 24px;}
.art__fonte{font-size:13.5px !important;line-height:1.62;color:var(--t-4) !important;}

/* ─── CTA de página interna ──────────────────────────────────────────── */
.cta{position:relative;background:linear-gradient(180deg,#08182C,var(--ink));border-top:2px solid var(--rule);padding:var(--sec-y) var(--pad);}
.cta__in{
  max-width:var(--wrap);margin:0 auto;
  display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,380px),1fr));
  gap:clamp(40px,5vw,80px);align-items:start;
}
.cta__d{font-size:clamp(15px,1.2vw,18px);line-height:1.62;color:var(--t-2);max-width:40em;margin:24px 0 30px;}
.cta__contacts{display:flex;flex-direction:column;gap:12px;padding-top:26px;border-top:2px solid var(--rule);}
.cta__contacts a{font-family:var(--sg);font-size:15px;letter-spacing:.04em;color:var(--t-2);}
.cta__contacts a:hover{color:var(--acc);}

/* ─── botões herdados do markup antigo ───────────────────────────────── */
/* As páginas internas ainda escrevem .btn/.btn--navy/.btn--cyan. Em vez de
   reescrever seis arquivos, o sistema absorve esses nomes — mesma aparência
   dos .b da Home: flush-left, sem caixa alta, sem raio. */
.btn{
  display:inline-flex;align-items:center;gap:10px;
  font-family:var(--ar);font-size:14.5px;font-weight:600;letter-spacing:.03em;
  padding:17px 26px;border:2px solid transparent;text-align:left;text-transform:none;
  cursor:pointer;transition:background .18s var(--ease),border-color .18s var(--ease),color .18s var(--ease);
}
.btn--navy,.btn--cyan{background:var(--acc);border-color:var(--acc);color:var(--acc-ink);}
.btn--navy:hover,.btn--cyan:hover{background:var(--acc-hi);border-color:var(--acc-hi);color:var(--acc-ink);}
.btn--ghost{background:transparent;border-color:var(--rule);color:var(--t-body);font-weight:500;}
.btn--ghost:hover{border-color:var(--acc);color:var(--acc);}
.btn--sm{font-size:13.5px;padding:13px 20px;}
.wa-inline{margin-bottom:26px;}
.wa-inline svg{width:19px;height:19px;fill:currentColor;flex:none;}

/* ─── páginas internas: espaço para o cabeçalho fixo ──────────────────── */
/* A Home reserva esse espaço no padding do hero. As internas começam
   direto numa .sec, então precisam do respiro aqui. */
body[data-interna] main{padding-top:clamp(64px,7vw,88px);}

/* O H1 de página interna não é o hero da Home: escala menor mantém a
   hierarquia entre a Home e o resto do site. */
body[data-interna] .h1{font-size:clamp(34px,4.6vw,62px);}

/* variação de eyebrow sobre superfície escura, e a coluna de copy do CTA */
.eyebrow--cy{color:var(--acc);}
.cta__copy{max-width:44rem;}

/* ─── carrossel de modelos do Layout Studio ──────────────────────────── */
/* Rolagem nativa com scroll-snap: funciona sem JavaScript, por gesto ou
   barra. Os botões abaixo são acréscimo, não requisito. */
.car{margin-top:26px;}
.car__win{
  position:relative;display:block;aspect-ratio:16/9;margin:0;padding:0;list-style:none;overflow:hidden;
  border:2px solid var(--rule);background:rgba(6,13,22,.5);
}
.car__item{
  position:absolute;inset:0;opacity:0;visibility:hidden;pointer-events:none;
  transition:opacity .32s var(--ease),visibility .32s;
}
.car__item[aria-current="true"]{opacity:1;visibility:visible;pointer-events:auto;z-index:1;}
.car__item img{width:100%;height:100%;object-fit:contain;display:block;}

.car__bar{display:flex;align-items:stretch;gap:10px;margin-top:12px;}
.car__arrow{
  flex:none;width:42px;background:transparent;border:2px solid var(--rule);
  color:var(--t-2);font-family:var(--sg);font-size:15px;line-height:1;cursor:pointer;
  transition:border-color .18s var(--ease),color .18s var(--ease);
}
.car__arrow:hover{border-color:var(--acc);color:var(--acc);}

/* As abas quebram linha em vez de rolar escondidas: aba cortada é aba que
   ninguém descobre. Com gap sobre o fundo, a quebra vira grade. */
.car__tabs{
  display:flex;flex:1;flex-wrap:wrap;gap:2px;min-width:0;
  background:var(--rule);border:2px solid var(--rule);
}
.car__tab{
  flex:1 1 auto;padding:9px 10px;background:var(--ink);border:0;cursor:pointer;white-space:nowrap;
  font-family:var(--ar);font-size:13px;font-weight:500;letter-spacing:.02em;color:var(--t-3);
  transition:background .16s var(--ease),color .16s var(--ease);
}
.car__tab:hover{color:var(--t-body);}
.car__tab[aria-current]{background:var(--acc);color:var(--acc-ink);font-weight:600;}

@media (prefers-reduced-motion:reduce){
  .car__arrow,.car__tab,.car__item{transition:none;}
}

/* botão de pausa da troca automática */
.car__play{
  flex:none;width:42px;background:transparent;border:2px solid var(--rule);
  color:var(--t-2);cursor:pointer;display:flex;align-items:center;justify-content:center;
  transition:border-color .18s var(--ease),color .18s var(--ease);
}
.car__play:hover{border-color:var(--acc);color:var(--acc);}
.car__play svg{width:12px;height:12px;display:block;}
.car__play .car__iplay{display:none;}
.car__play[aria-pressed="true"] .car__ipause{display:none;}
.car__play[aria-pressed="true"] .car__iplay{display:block;}

/* Em movimento reduzido a troca continua sem deslizamento; o controle de
   pausa permanece disponível para conteúdo que se atualiza sozinho. */

/* ─── Dashboard Quiz ─────────────────────────────────────────────────── */
.quiz{max-width:1100px;}
.quiz [hidden]{display:none !important;}
.quiz__etapa .lede{max-width:56ch;}

.quiz__topo{display:flex;align-items:center;gap:20px;margin-bottom:clamp(36px,4vw,56px);}
.quiz__passo{
  flex:none;font-family:var(--sg);font-size:13px;font-weight:500;
  letter-spacing:.24em;text-transform:uppercase;color:var(--t-hi);
}
.quiz__passo span{color:var(--t-4);}
.quiz__trilha{flex:1;height:2px;background:var(--rule);display:block;}
.quiz__trilha i{display:block;height:2px;width:0;background:var(--acc);transition:width .4s var(--ease);}

.quiz__q{border:0;margin:0;padding:0;min-width:0;}
.quiz__q legend{
  font-family:var(--sg);font-weight:300;
  font-size:clamp(26px,3.4vw,44px);line-height:1.12;letter-spacing:-.015em;
  color:var(--t-hi);padding:0;margin-bottom:clamp(28px,3vw,40px);max-width:22ch;
}
.opt{
  display:flex;align-items:center;gap:16px;cursor:pointer;
  border:2px solid var(--rule);padding:18px 20px;margin-bottom:10px;
  transition:border-color .16s var(--ease),background .16s var(--ease);
}
.opt:hover{border-color:var(--acc);background:rgba(21,193,224,.05);}
.opt input{
  appearance:none;-webkit-appearance:none;flex:none;
  width:16px;height:16px;margin:0;border:2px solid var(--rule);background:transparent;
}
.opt input:checked{border-color:var(--acc);background:var(--acc);box-shadow:inset 0 0 0 3px var(--ink);}
.opt input:focus-visible{outline:2px solid var(--acc);outline-offset:3px;}
.opt span{font-size:clamp(15px,1.2vw,17px);color:var(--t-body);}
.opt:has(input:checked){border-color:var(--acc);background:rgba(21,193,224,.07);}

.quiz__nav{display:flex;flex-wrap:wrap;gap:12px;margin-top:clamp(28px,3vw,40px);}
.quiz__nav .b[disabled]{opacity:.4;cursor:not-allowed;}
.quiz__nav .b[disabled]:hover{border-color:var(--rule);color:var(--t-body);}
.quiz__erro{
  margin:16px 0 0;font-size:13.5px;font-weight:600;color:var(--t-hi);
  padding-left:14px;border-left:2px solid var(--acc);
}
.quiz__erro:empty{display:none;}
.quiz__nojs{
  margin-top:32px;padding:20px;border:2px solid var(--rule);
  font-size:15px;color:var(--t-2);
}

/* resultado */
.rs{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));
  gap:clamp(32px,4vw,64px);align-items:start;margin-top:clamp(40px,4vw,60px);
}
.rs__canvas{
  border:2px solid var(--rule);
  background:linear-gradient(160deg,rgba(11,37,69,.55),rgba(6,13,22,.2));
  padding:clamp(22px,2.4vw,34px);
}
.rs__specs{margin:0;display:grid;grid-template-columns:auto 1fr;gap:0;border-top:2px solid var(--rule);}
.rs__specs dt{
  font-family:var(--sg);font-size:13px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--t-3);padding:15px 24px 15px 0;border-bottom:1px solid var(--grid);
}
.rs__specs dd{
  margin:0;font-size:15px;color:var(--t-body);text-align:right;
  padding:15px 0;border-bottom:1px solid var(--grid);
}
.rs__nota{font-size:13.5px;line-height:1.6;color:var(--t-4);margin:22px 0 0;max-width:44ch;}

/* ─── Data Canvas sem moldura ────────────────────────────────────────── */
/* Brand e Process Canvas não moram dentro de retângulos: têm apenas uma
   régua de cabeçalho, e o desenho respira contra o grid da própria página.
   `overflow:visible` deixa as linhas encostarem para fora do quadro. */
.bc,.pc{margin:0;position:relative;}
.bc__hd,.pc__hd{
  display:flex;justify-content:space-between;align-items:baseline;gap:16px;
  padding-bottom:14px;border-bottom:2px solid var(--rule);
  margin-bottom:clamp(26px,3vw,44px);
}
.bc__svg,.pc__svg{width:100%;height:auto;display:block;overflow:visible;}

/* microanimação: o nó central respira. Um pulso, não um letreiro. */
@keyframes bcPulso{0%,100%{opacity:.5}50%{opacity:1}}
.bc__pulso{animation:bcPulso 3.4s var(--ease) infinite;transform-origin:center;}
@media (prefers-reduced-motion:reduce){.bc__pulso{animation:none;opacity:1;}}

/* o cubo ganha um respiro de luz atrás, sem sombra difusa */
.bc::before{
  content:"";position:absolute;left:38%;top:22%;width:46%;height:56%;
  background:radial-gradient(closest-side,rgba(21,193,224,.10),rgba(6,13,22,0));
  pointer-events:none;
}

/* ─── fluxo numerado (Quiz → recomendação → Studio) ──────────────────── */
.fluxo{list-style:none;margin:28px 0 0;padding:0;border-top:2px solid var(--rule);}
.fluxo li{
  display:flex;align-items:center;gap:18px;padding:15px 0;
  border-bottom:1px solid var(--grid);font-size:15px;color:var(--t-2);
}
.fluxo__n{
  flex:none;font-family:var(--sg);font-size:13px;font-weight:500;
  letter-spacing:.2em;color:var(--acc);
}

/* agrupador do cubo dentro do canvas, e colunas do resultado do quiz */
.bc__cubo{transform-origin:center;}
.quiz__form{margin:0;}
.rs__lado{min-width:0;}

/* Mover o foco para o título ao trocar de etapa é padrão de acessibilidade,
   mas o alvo não é um controle — o anel de foco ali só confunde. */
[tabindex="-1"]:focus{outline:none;}

/* ─── Hub de integrações do hero ───────────────────────────────────── */
.ihub{
  position:relative;margin:0;min-width:0;width:100%;max-width:650px;justify-self:end;
}
.ihub__stage{position:relative;height:clamp(390px,34vw,460px);min-height:390px;isolation:isolate;}
.ihub__stage::after{
  content:"";position:absolute;left:50%;top:50%;width:52%;aspect-ratio:1;z-index:-1;
  transform:translate(-50%,-50%);pointer-events:none;
  background:radial-gradient(circle,rgba(21,193,224,.14),rgba(11,37,69,.06) 44%,transparent 72%);
}
.ihub__wires{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;}
.ihub__orbit{fill:none;stroke:var(--grid);stroke-width:1.2;stroke-dasharray:2 7;opacity:.75;}
.ihub__line{
  fill:none;stroke:var(--rule);stroke-width:1.4;
  vector-effect:non-scaling-stroke;transition:stroke .24s var(--ease),opacity .24s var(--ease),stroke-width .24s var(--ease);
}
.ihub__flow{
  fill:none;stroke:var(--acc);stroke-width:4;stroke-linecap:round;stroke-dasharray:1 23;opacity:.7;
  vector-effect:non-scaling-stroke;animation:ihub-flow 1.35s linear infinite;
  transition:stroke-width .24s var(--ease),opacity .24s var(--ease);
}
.ihub__line.is-active{stroke:var(--acc);stroke-width:2;opacity:1;}
.ihub__flow.is-active{stroke-width:5.5;opacity:1;}
.ihub__brand{
  position:absolute;z-index:3;width:clamp(104px,9vw,124px);height:clamp(54px,5vw,64px);
  display:flex;align-items:center;justify-content:center;padding:11px 14px;border:1px solid #C9D6DF;
  border-radius:14px;background:#F2F7FA;cursor:pointer;transform:translate(-50%,-50%);
  transition:border-color .22s var(--ease),transform .22s var(--ease),opacity .22s var(--ease),background .22s var(--ease);
}
.ihub__brand img{display:block;width:auto;max-width:100%;height:auto;max-height:31px;object-fit:contain;}
.ihub__brand--totvs{left:12%;top:16%;}
.ihub__brand--sankhya{left:36%;top:7%;}
.ihub__brand--meta{left:64%;top:7%;}
.ihub__brand--sap{left:88%;top:16%;}
.ihub__brand--senior{left:6%;top:49%;}
.ihub__brand--omie{left:94%;top:49%;}
.ihub__brand--analytics{left:12%;top:82%;}
.ihub__brand--conta{left:36%;top:91%;}
.ihub__brand--salesforce{left:64%;top:91%;}
.ihub__brand--oracle{left:88%;top:82%;}
.ihub__brand--totvs{background:#F2F7FA;border-color:#C9D6DF;}
.ihub__brand--totvs img{filter:brightness(0);}
.ihub__brand--totvs:hover,.ihub__brand--totvs:focus-visible,.ihub__brand--totvs.is-active{background:#fff;}
.ihub__brand--meta img{filter:invert(35%) sepia(93%) saturate(3590%) hue-rotate(211deg) brightness(99%) contrast(105%);}
.ihub__brand--analytics img{filter:invert(46%) sepia(98%) saturate(1713%) hue-rotate(6deg) brightness(96%) contrast(101%);}
.ihub__brand--sap img{max-height:36px;}
.ihub__brand--salesforce img{max-height:37px;}
.ihub__brand:hover,.ihub__brand:focus-visible,.ihub__brand.is-active{
  border-color:var(--acc);background:#fff;transform:translate(-50%,-50%) translateY(-3px);
}
.ihub__brand:focus-visible{outline:2px solid var(--acc);outline-offset:4px;}
.ihub__stage[data-has-active] .ihub__brand:not(.is-active){opacity:.48;}
.ihub__center{
  position:absolute;left:50%;top:50%;z-index:2;width:clamp(142px,13vw,168px);height:52px;
  transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;justify-content:center;
  padding:0;text-align:center;
}
.ihub__cube{width:52px;height:auto;margin:0;filter:drop-shadow(0 0 12px rgba(21,193,224,.16));}
.ihub__source{
  position:absolute;top:calc(100% + 8px);width:220px;
  font-family:var(--sg);font-size:13px;font-weight:500;letter-spacing:.18em;text-transform:uppercase;color:var(--acc);
}
.ihub__title{position:absolute;top:calc(100% + 27px);width:220px;font-family:var(--sg);font-size:clamp(16px,1.4vw,20px);font-weight:400;line-height:1.12;color:var(--t-hi);}
.ihub__route{position:absolute;top:calc(100% + 55px);width:190px;font-size:13px;line-height:1.4;color:var(--t-3);}
.ihub__note{
  margin:2px auto 0;max-width:58ch;padding:0 12px;text-align:center;
  font-family:var(--sg);font-size:13px;line-height:1.45;letter-spacing:.08em;color:var(--t-4);
}
@keyframes ihub-flow{to{stroke-dashoffset:-48;}}
@keyframes ihub-draw{from{stroke-dasharray:420;stroke-dashoffset:420;opacity:0;}to{stroke-dasharray:420;stroke-dashoffset:0;opacity:1;}}
.jsm [data-reveal].in .ihub__line{animation:ihub-draw .85s var(--ease) both;}
@media (max-width:700px){
  .ihub{width:calc(100vw - 40px);max-width:calc(100vw - 40px);overflow:hidden;justify-self:start;}
  .ihub__stage{height:auto;min-height:0;padding:16px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;}
  .ihub__stage::after{width:100%;}
  .ihub__wires{display:none;}
  .ihub__center{
    position:relative;left:auto;top:auto;grid-column:1/-1;grid-row:1;width:100%;height:auto;min-height:145px;
    transform:none;margin-bottom:4px;
  }
  .ihub__cube{margin-bottom:9px;}
  .ihub__source,.ihub__title,.ihub__route{position:static;width:auto;}
  .ihub__title{margin-top:6px;}
  .ihub__route{margin-top:8px;}
  .ihub__brand,.ihub__brand:hover,.ihub__brand:focus-visible,.ihub__brand.is-active{
    position:relative;left:auto;top:auto;width:100%;height:60px;transform:none;padding:10px;border-radius:12px;
  }
  .ihub__stage[data-has-active] .ihub__brand:not(.is-active){opacity:.58;}
  .ihub__brand img{max-height:32px;}
}
@media (prefers-reduced-motion:reduce){
  .jsm [data-reveal].in .ihub__line{animation:none;}
  .ihub__flow{animation:none;stroke-dasharray:1 16;}
  .ihub__brand,.ihub__line,.ihub__flow{transition:none;}
}

/* ─── Painel real em perspectiva ─────────────────────────────────────── */
/* A composição em camadas é a referência de mercado; o acabamento é
   MÉTRICA: canto vivo, régua de 2px e profundidade por camada de gradiente
   e fio de luz na aresta — nunca a sombra difusa que o sistema proíbe. */
.pilha{
  position:relative;margin:0;
  perspective:2400px;perspective-origin:64% 44%;
  /* Ocupa toda a coluna sem ultrapassar o limite do site. A perspectiva
     preserva a profundidade da composição sem cortar a imagem. */
  width:100%;max-width:100%;min-width:0;
}
.pilha__cena{position:relative;transform-style:preserve-3d;}

/* plano de fundo: uma placa recuada que dá o que a sombra daria */
/* placa recuada: dá o volume que a sombra daria, sem borrão e sem virar
   um retângulo solto — por isso só gradiente, sem borda fechada */
.pilha__plano{
  position:absolute;left:3%;top:5%;right:3%;bottom:-6%;
  border-left:2px solid rgba(22,48,76,.9);
  border-top:2px solid rgba(22,48,76,.9);
  background:linear-gradient(150deg,rgba(11,37,69,.5),rgba(6,13,22,0) 68%);
  transform:rotateY(-15deg) rotateX(4deg) translateZ(-70px);
  pointer-events:none;
}

.pilha__tela{
  position:relative;
  border:2px solid var(--rule);
  background:var(--navy);
  transform:rotateY(-14deg) rotateX(4deg) rotateZ(-.5deg);
  will-change:transform;
}
.pilha__tela img{width:100%;height:auto;display:block;}

/* fio de luz na aresta de cima — separa a tela do fundo sem borrão */
.pilha__tela::before{
  content:"";position:absolute;left:0;right:0;top:0;height:2px;z-index:2;
  background:linear-gradient(to right,rgba(21,193,224,.7),rgba(21,193,224,0) 58%);
}
/* véu levíssimo: assenta o print no ground escuro da página */
.pilha__tela::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(205deg,rgba(6,13,22,0) 40%,rgba(6,13,22,.30));
}

.pilha__lb{
  display:flex;flex-wrap:wrap;align-items:center;gap:14px;
  margin-top:30px;
  font-family:var(--sg);font-size:13px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--t-4);
}
/* o aviso não é rodapé jurídico: é regra de marca (§14) e fica legível */
.pilha__fic{color:var(--t-3);border:1px solid var(--rule);padding:5px 10px;}

/* entrada: a tela assenta, não voa */
.jsm .pilha__tela{opacity:.85;transform:rotateY(-14deg) rotateX(4deg) translateY(26px);}
.jsm .pilha__tela.in,
.jsm [data-reveal].in .pilha__tela{
  opacity:1;transform:rotateY(-14deg) rotateX(4deg) rotateZ(-.5deg);
  transition:opacity .8s var(--ease),transform 1s var(--ease);
}

/* Abaixo de 900px a perspectiva rouba área e o painel fica ilegível:
   a tela volta a ser reta, que é o que serve para ler dado em celular. */
@media (max-width:900px){
  .pilha{perspective:none;width:100%;}
  .pilha__tela{transform:none;}
  .pilha__plano{display:none;}
  .jsm .pilha__tela{transform:translateY(20px);}
  .jsm .pilha__tela.in,
  .jsm [data-reveal].in .pilha__tela{transform:none;}
}
@media (prefers-reduced-motion:reduce){
  .jsm .pilha__tela{opacity:1;transition:none;}
}

/* ─── Consentimento e preferências de privacidade ──────────────────── */
.consent[hidden],.consent-modal[hidden]{display:none!important;}
.consent{
  position:fixed;z-index:1200;left:18px;right:18px;bottom:18px;
  display:grid;grid-template-columns:minmax(280px,1fr) auto;align-items:center;gap:26px;
  max-width:1180px;margin:auto;padding:19px 20px;
  border:1px solid #214261;border-top:2px solid var(--acc);background:rgba(6,13,22,.97);
  box-shadow:0 16px 46px rgba(0,0,0,.34);backdrop-filter:blur(18px);
}
.consent__copy strong{font-family:var(--sg);font-size:15px;font-weight:500;color:var(--t-hi);}
.consent__copy p{margin:5px 0 0;max-width:64ch;font-size:13px;line-height:1.5;color:var(--t-3);}
.consent__copy a{color:var(--t-2);text-decoration:underline;text-underline-offset:2px;}
.consent__copy a:hover{color:var(--acc);}
.consent__actions,.consent-modal__actions{display:flex;align-items:center;gap:8px;}
.consent__btn{min-height:44px;padding:0 15px;border:1px solid transparent;font-family:var(--sg);font-size:13px;font-weight:500;letter-spacing:.07em;cursor:pointer;transition:background .18s var(--ease),border-color .18s var(--ease),color .18s var(--ease);}
.consent__btn--quiet{background:transparent;border-color:var(--rule);color:var(--t-2);}
.consent__btn--quiet:hover{border-color:var(--t-3);color:var(--t-hi);}
.consent__btn--outline{background:rgba(11,37,69,.38);border-color:#28547B;color:var(--t-body);}
.consent__btn--outline:hover{border-color:var(--acc);color:var(--acc);}
.consent__btn--accept{background:var(--brand-cyan);border-color:var(--brand-cyan);color:var(--acc-ink);}
.consent__btn--accept:hover{background:var(--brand-cyan-hi);border-color:var(--brand-cyan-hi);}
.consent__btn:focus-visible,.consent-modal__close:focus-visible,.consent-settings:focus-visible{outline:2px solid var(--acc);outline-offset:3px;}

.consent-modal{position:fixed;z-index:1250;inset:0;display:grid;place-items:center;padding:20px;}
.consent-modal__backdrop{position:absolute;inset:0;background:rgba(2,7,12,.78);backdrop-filter:blur(8px);}
.consent-modal__panel{position:relative;width:min(620px,100%);max-height:min(760px,calc(100vh - 40px));overflow:auto;padding:clamp(26px,4vw,42px);border:1px solid #28547B;border-top:3px solid var(--acc);background:#071321;outline:none;}
.consent-modal__close{position:absolute;right:18px;top:16px;width:44px;height:44px;border:1px solid var(--rule);background:transparent;color:var(--t-2);font-size:24px;cursor:pointer;}
.consent-modal__eyebrow{font-family:var(--sg);font-size:13px;letter-spacing:.18em;text-transform:uppercase;color:var(--acc);}
.consent-modal h2{margin:12px 52px 8px 0;font-family:var(--sg);font-size:clamp(24px,3vw,34px);font-weight:300;line-height:1.18;color:var(--t-hi);}
.consent-modal__intro{margin:0 0 26px;font-size:13.5px;line-height:1.55;color:var(--t-3);}
.consent-option{position:relative;display:grid;grid-template-columns:1fr auto;align-items:center;gap:22px;padding:20px 0;border-top:1px solid var(--rule);cursor:pointer;}
.consent-option strong{display:block;font-family:var(--sg);font-size:13px;font-weight:500;color:var(--t-body);}
.consent-option p{margin:6px 0 0;max-width:48ch;font-size:13px;line-height:1.5;color:var(--t-3);}
.consent-option__fixed{font-family:var(--sg);font-size:13px;letter-spacing:.13em;text-transform:uppercase;color:#43C59E;white-space:nowrap;}
.consent-option input{position:absolute;opacity:0;pointer-events:none;}
.consent-switch{position:relative;width:46px;height:25px;border:1px solid #31506B;background:#0A1B2B;transition:.2s var(--ease);}
.consent-switch::after{content:"";position:absolute;left:4px;top:4px;width:15px;height:15px;background:var(--t-3);transition:.2s var(--ease);}
.consent-option input:checked+.consent-switch{border-color:#43C59E;background:rgba(67,197,158,.15);}
.consent-option input:checked+.consent-switch::after{transform:translateX(21px);background:#43C59E;}
.consent-option input:focus-visible+.consent-switch{outline:2px solid var(--acc);outline-offset:3px;}
.consent-modal__actions{justify-content:flex-end;margin-top:24px;padding-top:22px;border-top:1px solid var(--rule);}
.consent-modal__privacy{display:inline-block;margin-top:22px;font-size:13px;color:var(--t-3);border-bottom:1px solid var(--rule);}
body[data-consent-open]{overflow:hidden;}
.consent-settings{display:block;padding:0;border:0;background:none;color:var(--t-3);font:inherit;text-align:left;cursor:pointer;}
.consent-settings:hover{color:var(--acc);}

.embed iframe[data-consent-src]{display:none;}
.embed[data-external-loaded] iframe[data-consent-src]{display:block;}
.embed__consent{position:absolute;z-index:1;inset:0;isolation:isolate;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;padding:clamp(24px,5vw,64px);background:transparent;text-align:center;}
.embed[data-external-loaded] .embed__consent{display:none;}
.embed__preview{position:absolute;inset:0;z-index:-2;overflow:hidden;}
.embed__preview img{width:100%;height:100%;object-fit:cover;opacity:.72;}
.embed__consent::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(6,13,22,.16),rgba(6,13,22,.94) 76%);}
.embed__actions{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;}
.embed__actions .b{min-height:52px;display:inline-flex;align-items:center;}
.embed__consent-k{font-family:var(--sg);font-size:13px;letter-spacing:.18em;text-transform:uppercase;color:var(--acc);}
.embed__consent strong{margin-top:14px;font-family:var(--sg);font-size:clamp(20px,2.5vw,32px);font-weight:300;color:var(--t-hi);}
.embed__consent p{max-width:54ch;margin:12px 0 22px;font-size:13px;line-height:1.55;color:var(--t-3);}

@media (max-width:900px){
  .consent{grid-template-columns:1fr;gap:16px;}
  .consent__actions{grid-column:1;flex-wrap:wrap;}
}
@media (max-width:620px){
  .consent{left:10px;right:10px;bottom:10px;gap:13px;padding-top:15px;padding-bottom:15px;}
  .consent__actions{display:grid;grid-template-columns:1fr 1fr;width:100%;}
  .consent__btn{width:100%;padding:0 10px;}
  .consent__btn--accept{grid-column:1/-1;grid-row:1;}
  .consent-modal{padding:10px;place-items:end center;}
  .consent-modal__panel{max-height:calc(100vh - 20px);padding:26px 20px;}
  .consent-option{gap:14px;}
  .consent-modal__actions{display:grid;grid-template-columns:1fr;}
  .embed__consent p{margin-bottom:16px;}
  .embed__actions{display:grid;grid-template-columns:1fr;width:100%;}
  .embed__actions .b{width:100%;justify-content:center;text-align:center;}
}
@media (prefers-reduced-motion:reduce){
  .consent__btn,.consent-switch,.consent-switch::after{transition:none;}
}

/* Auditoria 2026-09: paridade visual e de interação entre fundos. */
.sec--paper .col,.sec--paper .cv,.sec--paper .studio-free,.sec--paper .svc,.sec--paper .step,.sec--paper .case,.sec--paper .card{
  background:var(--navy);border-color:var(--rule);
}
.sec--paper .studio-free__head .tag--free{background:var(--brand-cyan);border-color:var(--brand-cyan);color:var(--acc-ink);}
.sec--paper .studio-free{background:var(--navy);}
.sec--paper .mth__d{border-color:var(--ink);}
.sec--paper .gridlines{opacity:.58;}
.sec--paper :is(a,button,input,textarea):focus-visible{outline:3px solid #0A5D6D;outline-offset:3px;}

.mat__nav .b:disabled{opacity:.38;cursor:not-allowed;filter:grayscale(1);}
.mat__nav .b[aria-disabled="true"]{pointer-events:none;}
.form__note a,.mat__status a{color:var(--t-body);text-decoration:underline;text-underline-offset:3px;}

@media (max-width:620px){
  .embed{aspect-ratio:auto;min-height:520px;}
  .embed__consent{padding:18px;}
  .embed__consent strong{font-size:20px;}
  .embed__consent p{display:none;}
  .embed__actions .b{min-height:44px;padding:11px 14px;}
}

.about-grid,.about-details{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(36px,6vw,96px);align-items:center;}
.about-photo{min-height:360px;margin:0;border:2px solid var(--rule);display:grid;place-items:center;align-content:center;color:var(--t-3);background:var(--navy);}
.about-photo figcaption{margin-top:18px;font-size:13px;}
.placeholder-copy,.company-data dd{border-left:2px solid var(--acc);padding-left:18px;}
.company-data{margin:28px 0 0;display:grid;gap:16px;}
.company-data div{display:grid;grid-template-columns:140px 1fr;gap:18px;padding:16px 0;border-top:1px solid var(--rule);}
.company-data dt{font-family:var(--sg);font-size:13px;text-transform:uppercase;letter-spacing:.12em;color:var(--t-3);}
.company-data dd{margin:0;color:var(--t-body);}
@media (max-width:760px){.about-grid,.about-details{grid-template-columns:1fr;}.about-photo{min-height:260px;}.company-data div{grid-template-columns:1fr;}}