/* =========================================================================
   solucao.css — MODELO V5 das páginas de SOLUÇÃO (A1 Conta).
   Carregar SEMPRE depois de css/styles.css e css/niche-v4.css.
   Foco: hero estático (sem vídeo), pouco texto, apoio visual em imagens e
   blocos que tiram dúvidas rápido com alto valor percebido.
   Reaproveita o sistema V4 (cores, tipografia, .sec-head, .faq, .svc-acc...).
   ========================================================================= */

/* ===== HERO estático (imagem de fundo, sem vídeo) ===== */
.hero-static{position:relative;min-height:90vh;display:flex;flex-direction:column;
  justify-content:center;padding:128px 0 84px;overflow:hidden;background:var(--black)}
.hero-static .hero-bg{position:absolute;inset:0;z-index:0}
.hero-static .hero-bg img{width:100%;height:100%;object-fit:cover;object-position:center}
.hero-static .hero-overlay{position:absolute;inset:0;z-index:1;pointer-events:none;
  background:
    linear-gradient(100deg,rgba(25,53,77,.95) 0%,rgba(25,53,77,.84) 38%,rgba(25,53,77,.52) 72%,rgba(25,53,77,.62) 100%),
    linear-gradient(180deg,transparent 54%,var(--black) 100%);}
.hero-static .wrap{position:relative;z-index:2;width:100%}
.hero-static .hero-copy{max-width:720px}
.hero-static .eyebrow::before{display:none}
.hero-static .hero-copy p{color:var(--grey);font-size:1.15rem;max-width:560px;margin-bottom:28px}
@media(max-width:880px){.hero-static{min-height:auto;padding:120px 0 64px}}

/* ===== Bloco "imagem + valor" (split): muita imagem, pouco texto ===== */
.split{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.split.rev .split-media{order:2}
.split-media{position:relative;border-radius:16px;overflow:hidden;border:1px solid var(--line);
  box-shadow:0 30px 70px -34px rgba(0,0,0,.7)}
.split-media img{display:block;width:100%;height:100%;min-height:420px;object-fit:cover}
.split-media .float-stat{position:absolute;left:18px;bottom:18px;
  background:rgba(18,38,58,.74);backdrop-filter:blur(12px) saturate(135%);-webkit-backdrop-filter:blur(12px) saturate(135%);
  border:1px solid rgba(197,167,103,.36);border-radius:12px;padding:14px 18px}
.split-media .float-stat strong{display:block;font-family:'Archivo',var(--font);font-weight:800;
  font-size:1.7rem;line-height:1;color:var(--gold-light)}
.split-media .float-stat span{display:block;color:var(--grey);font-size:.8rem;margin-top:5px}
.split-copy .eyebrow{margin-bottom:14px}
.split-copy h2{font-family:'Archivo',var(--font);font-weight:800;letter-spacing:-.02em;color:#fff;
  font-size:clamp(1.6rem,3vw,2.15rem);line-height:1.12;margin:0 0 16px}
.split-copy > p{color:var(--grey);font-size:1rem;line-height:1.65;margin:0 0 26px;max-width:46ch}
.split-feats{list-style:none;display:grid;gap:18px;margin:0;padding:0}
.split-feats li{display:flex;gap:14px;align-items:flex-start}
.split-feats .ic{display:inline-flex;width:42px;height:42px;flex-shrink:0;align-items:center;justify-content:center;
  border-radius:10px;background:var(--gold-soft);color:var(--gold-light)}
.split-feats .ic .icon{width:21px;height:21px}
.split-feats b{display:block;font-family:'Archivo',var(--font);font-weight:700;color:#fff;font-size:1.02rem;
  letter-spacing:-.01em;margin-bottom:3px}
.split-feats span{color:var(--grey);font-size:.92rem;line-height:1.55}
.light .split-copy h2{color:#16314a}
.light .split-copy > p{color:#51616e}
.light .split-feats b{color:#16314a}
.light .split-feats span{color:#51616e}
@media(max-width:880px){
  .split,.split.rev{grid-template-columns:1fr;gap:30px}
  .split.rev .split-media{order:0}
  .split-media img{min-height:280px}
}

/* ===== Comparação "antes × com a A1" (alto valor, pouco texto) ===== */
.vs{display:grid;grid-template-columns:1fr 1fr;gap:22px;max-width:960px;margin:0 auto}
.vs-col{border:1px solid var(--line);border-radius:14px;padding:30px 28px}
.vs-col.bad{background:rgba(255,255,255,.02)}
.vs-col.good{background:linear-gradient(160deg,var(--gold-soft),rgba(255,255,255,0));border-color:var(--gold);
  box-shadow:0 24px 60px -34px rgba(197,167,103,.5)}
.vs-tag{display:inline-block;font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.16em;
  text-transform:uppercase;margin-bottom:6px}
.vs-col.bad .vs-tag{color:var(--grey)}
.vs-col.good .vs-tag{color:var(--gold)}
.vs-col h3{font-family:'Archivo',var(--font);font-weight:800;font-size:1.22rem;letter-spacing:-.01em;
  color:#fff;margin:0 0 20px}
.vs-col ul{list-style:none;display:grid;gap:14px;margin:0;padding:0}
.vs-col li{display:flex;gap:11px;align-items:flex-start;font-size:.95rem;line-height:1.45}
.vs-col li svg{width:19px;height:19px;flex-shrink:0;margin-top:2px}
.vs-col.bad li{color:var(--grey)}
.vs-col.bad li svg{color:#80909c}
.vs-col.good li{color:#e7edf2}
.vs-col.good li svg{color:var(--gold-light)}
.light .vs-col h3{color:#16314a}
.light .vs-col.bad{background:#fff;border-color:#dde3e8}
.light .vs-col.bad li{color:#6b7884}
.light .vs-col.good li{color:#3d4b57}
@media(max-width:680px){.vs{grid-template-columns:1fr}}

/* ===== Grade de ERPs integrados — logos flutuando (sem caixa), fundo branco ===== */
#erp{background-color:#fff}
.erp-wrap{max-width:900px;margin:0 auto}
.erpgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:40px 30px;align-items:center;justify-items:center}
.erpgrid .erp{display:flex;align-items:center;justify-content:center;width:100%;min-height:60px;padding:6px;
  opacity:.92;transition:opacity .2s,transform .2s}
.erpgrid .erp:hover{opacity:1;transform:translateY(-2px)}
.erpgrid .erp img{max-width:170px;max-height:46px;width:auto;height:auto;object-fit:contain;display:block}
.erpgrid .erp.erp-tall img{max-height:66px}
.erpgrid .erp .erp-txt{font-family:'Archivo',var(--font);font-weight:800;font-size:1.15rem;color:#16314a;letter-spacing:-.01em}
.erp-note{text-align:center;color:#6b7884;font-size:.9rem;margin-top:30px}
@media(max-width:720px){.erpgrid{grid-template-columns:repeat(2,1fr);gap:32px 24px}}
@media(max-width:440px){.erpgrid{grid-template-columns:1fr}}

/* ===== Timeline de metodologia (baseada na V16 de o-que-fazemos, sem números) ===== */
.fz16-track{position:relative;display:grid;grid-template-columns:repeat(6,1fr);gap:26px}
.fz16-track::before{content:"";position:absolute;top:27px;left:6%;right:6%;height:2px;
  background:linear-gradient(90deg,rgba(197,167,103,.30),var(--gold),rgba(197,167,103,.30))}
.fz16-step{position:relative;text-align:center}
.fz16-node{position:relative;z-index:2;width:54px;height:54px;margin:0 auto 18px;border-radius:50%;
  background:var(--black-2);border:2px solid var(--gold);display:flex;align-items:center;justify-content:center;
  color:var(--gold-light);box-shadow:0 0 0 6px var(--black)}
.fz16-node .icon{width:24px;height:24px}
.fz16-step h3{font-family:'Archivo',var(--font);font-weight:700;color:#fff;font-size:16px;line-height:1.25;margin:0 0 8px}
.fz16-step p{color:var(--grey);font-size:13.5px;line-height:1.55;margin:0}
@media(max-width:900px){
  .fz16-track{grid-template-columns:repeat(2,1fr);gap:34px 26px}
  .fz16-track::before{display:none}
  .fz16-step{text-align:left;padding-left:70px}
  .fz16-node{position:absolute;left:0;top:0;margin:0;box-shadow:none}
}
@media(max-width:540px){.fz16-track{grid-template-columns:1fr}}

/* ===== Faixa de autoridade compacta (credenciais E-E-A-T, pouco texto) ===== */
.authstrip{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:14px 28px;
  border:1px solid var(--line);border-radius:14px;padding:24px 28px;max-width:940px;margin:0 auto;
  background:linear-gradient(160deg,rgba(255,255,255,.03),rgba(255,255,255,0))}
.authstrip-item,.authstrip .it{display:inline-flex;align-items:center;gap:9px;color:var(--grey);font-size:.9rem}
.authstrip .it svg{width:18px;height:18px;color:var(--gold-light);flex-shrink:0}
.authstrip .it b{color:#fff;font-weight:700}
.light .authstrip,.light .authstrip-wrap .authstrip{background:#fff;border-color:#dde3e8}
.light .authstrip .it{color:#51616e}
.light .authstrip .it b{color:#16314a}
