/* ============================================================
   IAstrategy · site institucional (versao cinetica)
   Estilo A6 da casa, adaptado: fundo escuro + blocos creme,
   acento teal da marca. Movimento real, sem gradiente.
   ============================================================ */
:root{
  --preto:#0A0A0C;
  --preto-2:#101014;
  --creme:#E0DACC;
  --creme-2:#EAE6DB;
  --teal:#20918D;      /* a marca dele: menu e botoes */
  --teal-lt:#2FD3CC;
  --teal-dk:#166F6B;
  --roxo:#7C5CFF;      /* acento original do modelo 36 */
  --roxo-lt:#A38FFF;
  --roxo-dk:#5B3FD9;
  --ink:#EDE9DF;
  --ink-mute:#9A968C;
  --grafite:#282725;
  --line:rgba(224,218,204,.14);

  --display:"Space Grotesk", ui-sans-serif, system-ui, sans-serif;
  --body:"DM Sans", ui-sans-serif, system-ui, sans-serif;
  --header-h:130px;
}
@media (max-width:760px){ :root{ --header-h:116px; } }

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth; scroll-padding-top:var(--header-h)}
body{
  background:var(--preto); color:var(--ink); font-family:var(--body);
  font-size:17px; line-height:1.62; overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}
a{color:inherit}
.wrap{width:100%;max-width:1160px;margin:0 auto;padding:0 22px}

/* ---------- camadas de fundo vivas ---------- */
#aurora,#rastro{position:fixed;inset:0;width:100%;height:100%;pointer-events:none}
#aurora{z-index:0;opacity:.5}
#rastro{z-index:1;opacity:.85}
.conteudo{position:relative;z-index:2}

/* ---------- barra de progresso do scroll ---------- */
.progresso{
  position:fixed;top:0;left:0;height:3px;width:0%;
  background:var(--roxo);z-index:200;transition:width .08s linear;
}

/* ---------- header ---------- */
.topbar{position:sticky;top:0;z-index:80;background:rgba(10,10,12,.86);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.topbar-in{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 22px;max-width:1160px;margin:0 auto}
.brand img{height:32px;width:auto}
@media (max-width:760px){ .brand img{height:25px} }
.btn-topo{
  flex:none;font-family:var(--display);font-weight:700;font-size:14px;
  background:var(--teal);color:#fff;border:0;padding:11px 18px;border-radius:100px;
  text-decoration:none;white-space:nowrap;transition:background .16s ease, transform .16s ease;
}
.btn-topo:hover{background:var(--teal-lt);color:var(--preto)}

.navserv{border-top:1px solid var(--line);overflow-x:auto;scrollbar-width:none;background:rgba(16,16,20,.6)}
.navserv::-webkit-scrollbar{display:none}
.navserv ul{display:flex;gap:7px;list-style:none;padding:10px 22px;max-width:1160px;margin:0 auto;width:max-content;min-width:100%}
.navserv a{
  display:block;white-space:nowrap;text-decoration:none;
  font-family:var(--display);font-weight:600;font-size:13px;
  padding:8px 15px;border:1px solid var(--line);border-radius:100px;color:var(--ink-mute);
  transition:color .16s ease,border-color .16s ease,background .16s ease;
}
.navserv a:hover{color:var(--ink);border-color:var(--teal)}
.navserv a.ativo{background:var(--teal);color:#fff;border-color:var(--teal)}

/* ---------- hero ---------- */
.hero{padding:88px 0 76px;position:relative}
.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:56px;align-items:center}
@media (max-width:940px){ .hero-grid{grid-template-columns:1fr;gap:38px} }

.eyebrow{
  display:inline-flex;align-items:center;gap:9px;font-family:var(--display);
  font-weight:600;font-size:12px;letter-spacing:.17em;text-transform:uppercase;
  color:var(--roxo-lt);margin-bottom:22px;
}
.eyebrow::before{content:"";width:26px;height:1px;background:var(--roxo-lt)}
h1{
  font-family:var(--display);font-weight:700;
  font-size:clamp(38px,6.6vw,70px);line-height:1.02;letter-spacing:-.025em;margin-bottom:22px;
}
h1 em{font-style:normal;color:var(--roxo-lt)}
.sub{font-size:clamp(17px,2.1vw,20px);color:var(--ink-mute);max-width:52ch;margin-bottom:34px}
.cta-linha{display:flex;flex-wrap:wrap;gap:14px}

.btn{
  display:inline-flex;align-items:center;gap:10px;
  font-family:var(--display);font-weight:700;font-size:16.5px;
  padding:16px 28px;border-radius:100px;text-decoration:none;
  background:var(--teal);color:#fff;border:1px solid var(--teal);
  transition:background .18s ease,color .18s ease;
  will-change:transform;
}
.btn:hover{background:var(--teal-lt);color:var(--preto);border-color:var(--teal-lt)}
.btn svg{width:19px;height:19px;fill:currentColor}
.btn.vazado{background:transparent;color:var(--ink);border-color:var(--line)}
.btn.vazado:hover{border-color:var(--ink);background:transparent;color:var(--ink)}

.hero-foto{position:relative}
.hero-foto img{
  width:100%;border-radius:20px;border:1px solid var(--line);
  filter:saturate(1.02) contrast(1.03);
}
.selo{
  position:absolute;left:-14px;bottom:26px;background:var(--creme);color:var(--grafite);
  padding:13px 18px;border-radius:14px;max-width:230px;
}
.selo b{display:block;font-family:var(--display);font-size:15px;line-height:1.2;margin-bottom:3px}
.selo span{font-size:12.5px;color:#5C584F;line-height:1.35;display:block}

/* ---------- numeros ---------- */
.numeros{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:46px 0}
.num-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:26px;text-align:center}
@media (max-width:820px){ .num-grid{grid-template-columns:repeat(2,1fr);gap:34px} }
.num b{display:block;font-family:var(--display);font-weight:700;font-size:clamp(34px,5vw,52px);color:var(--roxo-lt);line-height:1}
.num span{display:block;font-size:14px;color:var(--ink-mute);margin-top:8px}

/* ---------- servicos ---------- */
.serv{padding:82px 0;border-bottom:1px solid var(--line)}
.serv.claro{background:var(--creme);color:var(--grafite);border-bottom-color:rgba(40,39,37,.12)}
.serv.claro .dor{color:#6B675F}
.serv.claro .lista li{color:var(--grafite)}
.serv.claro .painel{background:rgba(40,39,37,.05);border-color:rgba(40,39,37,.14)}
.serv.claro .painel b{color:var(--roxo-dk)}
.serv.claro h2 em{color:var(--roxo-dk)}

.serv-num{font-family:var(--display);font-weight:700;font-size:12.5px;letter-spacing:.19em;color:var(--roxo);margin-bottom:14px}
.serv-grid{display:grid;grid-template-columns:1.08fr .92fr;gap:52px;align-items:start}
@media (max-width:900px){ .serv-grid{grid-template-columns:1fr;gap:32px} }
.serv h2{font-family:var(--display);font-weight:700;font-size:clamp(29px,4.3vw,44px);line-height:1.08;letter-spacing:-.018em;margin-bottom:18px}
.serv h2 em{font-style:normal;color:var(--roxo-lt)}

/* o bloco de dor: a frase que faz doer */
.dor{
  font-size:clamp(18px,2.3vw,21px);line-height:1.5;color:var(--ink);
  border-left:2px solid var(--roxo);padding-left:18px;margin-bottom:22px;
}
.serv.claro .dor{border-left-color:var(--roxo-dk);color:var(--grafite)}
.dor b{color:var(--roxo-lt);font-weight:700}
.serv.claro .dor b{color:var(--roxo-dk)}

.lista{list-style:none;display:flex;flex-direction:column;gap:13px;margin-top:22px}
.lista li{display:flex;gap:12px;align-items:flex-start;font-size:16.5px;color:var(--ink)}
.lista svg{width:19px;height:19px;flex:none;margin-top:3px;stroke:var(--roxo-lt);fill:none;stroke-width:2.2}
.serv.claro .lista svg{stroke:var(--roxo-dk)}

.painel{
  background:rgba(237,233,223,.04);border:1px solid var(--line);border-radius:18px;padding:28px;
  transform-style:preserve-3d;will-change:transform;transition:border-color .2s ease;
}
.painel:hover{border-color:var(--roxo)}
.painel h3{font-family:var(--display);font-weight:700;font-size:13px;letter-spacing:.15em;text-transform:uppercase;color:var(--ink-mute);margin-bottom:18px}
.painel .item{padding:13px 0;border-bottom:1px solid var(--line);display:flex;gap:13px;align-items:baseline}
.painel .item:last-child{border-bottom:0;padding-bottom:0}
.painel b{font-family:var(--display);font-size:21px;color:var(--roxo-lt);flex:none;line-height:1.2}
.painel span{font-size:15px;color:var(--ink-mute);line-height:1.45}
.serv.claro .painel span{color:#6B675F}

/* ---------- CEO ---------- */
.ceo{padding:92px 0;background:var(--preto-2);border-bottom:1px solid var(--line)}
.ceo-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:52px;align-items:center}
@media (max-width:900px){ .ceo-grid{grid-template-columns:1fr;gap:34px} }
.ceo-foto img{width:100%;border-radius:20px;border:1px solid var(--line)}
.ceo h2{font-family:var(--display);font-weight:700;font-size:clamp(30px,4.4vw,46px);line-height:1.06;letter-spacing:-.02em;margin-bottom:8px}
.ceo .cargo{font-family:var(--display);font-size:13px;letter-spacing:.16em;text-transform:uppercase;color:var(--roxo-lt);margin-bottom:22px}
.ceo p{color:var(--ink-mute);font-size:17.5px;margin-bottom:18px;max-width:56ch}
.trilha{list-style:none;margin-top:26px;display:flex;flex-direction:column;gap:0}
.trilha li{display:flex;gap:18px;padding:15px 0;border-bottom:1px solid var(--line)}
.trilha li:last-child{border-bottom:0}
.trilha .ano{font-family:var(--display);font-weight:700;font-size:14px;color:var(--roxo-lt);flex:none;width:88px;padding-top:2px}
.trilha .oq b{display:block;font-family:var(--display);font-size:16.5px;margin-bottom:2px}
.trilha .oq span{font-size:14.5px;color:var(--ink-mute)}

/* ---------- fechamento ---------- */
.fim{padding:98px 0;text-align:center;background:var(--creme);color:var(--grafite)}
.fim h2{font-family:var(--display);font-weight:700;font-size:clamp(31px,5.2vw,54px);line-height:1.05;letter-spacing:-.025em;margin-bottom:18px}
.fim p{color:#5C584F;font-size:18.5px;max-width:52ch;margin:0 auto 34px}
.fim .btn{background:var(--grafite);border-color:var(--grafite);color:var(--creme)}
.fim .btn:hover{background:var(--teal-dk);border-color:var(--teal-dk);color:#fff}

footer{padding:40px 0;border-top:1px solid var(--line)}
.foot-in{display:flex;flex-wrap:wrap;gap:18px;justify-content:space-between;align-items:center;font-size:14.5px;color:var(--ink-mute)}
footer img{height:23px;width:auto;opacity:.9}
.foot-in a{color:var(--ink-mute);text-decoration:none;transition:color .16s ease}
.foot-in a:hover{color:var(--teal-lt)}

/* ---------- reveal ---------- */
.rev{opacity:0;transform:translateY(26px);filter:blur(6px);
     transition:opacity .72s cubic-bezier(.22,1,.36,1),transform .72s cubic-bezier(.22,1,.36,1),filter .72s ease}
.rev.on{opacity:1;transform:none;filter:none}
.rev.d1{transition-delay:.09s} .rev.d2{transition-delay:.18s} .rev.d3{transition-delay:.27s}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .rev{opacity:1;transform:none;filter:none;transition:none}
  #aurora,#rastro{display:none}
  .btn,.painel,.navserv a{transition:none}
}

/* competencias do CEO */
.dominio{margin-top:28px;padding:24px;border:1px solid var(--line);border-radius:16px;background:rgba(237,233,223,.03)}
.dominio h3{font-family:var(--display);font-weight:700;font-size:12.5px;letter-spacing:.15em;text-transform:uppercase;color:var(--ink-mute);margin-bottom:16px}
.dominio ul{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:11px 20px}
@media (max-width:560px){ .dominio ul{grid-template-columns:1fr} }
.dominio li{position:relative;padding-left:19px;font-size:15.5px;color:var(--ink)}
.dominio li::before{content:"";position:absolute;left:0;top:9px;width:7px;height:7px;border-radius:50%;background:var(--roxo-lt)}
