/* ==========================================================================
   Fábrica 29 — site institucional
   Estilo único, sem dependências. Usa a mesma família visual do AdvGest
   (azul-marinho + dourado) para o site e o produto parecerem a mesma casa.
   ========================================================================== */

:root{
  --marinho-900:#060e1b;
  --marinho-800:#0b1730;
  --marinho-700:#122340;
  --marinho-600:#1b3155;
  --marinho-500:#2c4a7a;

  --dourado:#c8a24a;
  --dourado-claro:#e3c67d;
  --dourado-fundo:#fbf5e7;

  --papel:#f5f7fa;
  --papel-2:#eceff5;
  --branco:#ffffff;

  --texto:#0f1c2e;
  --texto-suave:#5a6a82;
  --texto-claro:#c3cddd;
  --borda:#dde3ec;
  --borda-escura:#22375c;

  --sombra:0 8px 30px rgba(10,22,42,.08);
  --sombra-forte:0 18px 50px rgba(6,14,27,.28);
  --raio:16px;
  --raio-g:24px;

  --fonte:'Segoe UI',system-ui,-apple-system,'Helvetica Neue',Arial,sans-serif;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;
  font-family:var(--fonte);
  font-size:17px;
  line-height:1.65;
  color:var(--texto);
  background:var(--branco);
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4{margin:0;line-height:1.18;letter-spacing:-.02em;font-weight:700}
p{margin:0}
ul{margin:0;padding:0;list-style:none}
svg{display:block}

/* ---------- estrutura ---------- */
.envolve{width:min(1150px,92vw);margin-inline:auto}
.secao{padding:clamp(54px,7vw,96px) 0}
.secao--papel{background:var(--papel)}
.secao--papel-2{background:var(--papel-2)}
.secao--marca{
  background:
    radial-gradient(900px 420px at 12% 0%,rgba(200,162,74,.16),transparent 62%),
    linear-gradient(165deg,var(--marinho-800),var(--marinho-900));
  color:var(--branco);
}
.secao--marca p{color:var(--texto-claro)}
.secao--topo{border-top:1px solid var(--borda)}

.grade{display:grid;gap:22px}
.grade--2{grid-template-columns:repeat(auto-fit,minmax(330px,1fr))}
.grade--3{grid-template-columns:repeat(auto-fit,minmax(290px,1fr))}
.grade--4{grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}

/* ---------- títulos ---------- */
.olho{
  display:inline-block;
  font-size:.76rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;
  color:var(--dourado);margin-bottom:14px;
}
.titulo{font-size:clamp(1.6rem,3.4vw,2.35rem)}
.titulo em{font-style:normal;color:var(--dourado)}
.sub{color:var(--texto-suave);font-size:1.03rem;max-width:62ch;margin-top:14px}
.secao--marca .sub{color:var(--texto-claro)}
.cabeca{margin-bottom:42px;max-width:76ch}

/* ---------- selos e botões ---------- */
.selo{
  display:inline-flex;align-items:center;gap:9px;
  padding:7px 15px;border-radius:999px;
  background:rgba(200,162,74,.14);border:1px solid rgba(200,162,74,.4);
  color:var(--dourado-claro);font-size:.78rem;font-weight:600;
  letter-spacing:.08em;text-transform:uppercase;
}
.selo--claro{background:var(--dourado-fundo);border-color:#e8d9ae;color:#8a6a19}

.botao{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  padding:14px 26px;border-radius:12px;border:1.5px solid transparent;
  font-family:inherit;font-size:.98rem;font-weight:600;cursor:pointer;
  transition:transform .18s ease,box-shadow .18s ease,background .18s ease,color .18s ease,border-color .18s ease;
}
.botao:hover{transform:translateY(-2px)}
.botao svg{width:19px;height:19px;flex:0 0 auto}
.botao--ouro{background:var(--dourado);color:#1b1405;box-shadow:0 10px 26px rgba(200,162,74,.3)}
.botao--ouro:hover{background:var(--dourado-claro)}
.botao--vazio{border-color:rgba(255,255,255,.32);color:#fff}
.botao--vazio:hover{border-color:var(--dourado);color:var(--dourado-claro)}
.botao--marinho{background:var(--marinho-700);color:#fff}
.botao--marinho:hover{background:var(--marinho-600)}
.botao--linha{border-color:var(--borda);color:var(--marinho-700);background:#fff}
.botao--linha:hover{border-color:var(--dourado);color:#8a6a19}
.botao--g{width:100%}
.botoes{display:flex;flex-wrap:wrap;gap:14px}

/* ---------- cartões ---------- */
.cartao{
  background:#fff;border:1px solid var(--borda);border-radius:var(--raio);
  padding:28px 26px;box-shadow:var(--sombra);
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;
}
.cartao h3{font-size:1.1rem;margin-bottom:9px}
.cartao p{color:var(--texto-suave);font-size:.96rem}
.cartao--sobe:hover{transform:translateY(-4px);box-shadow:0 16px 40px rgba(10,22,42,.13);border-color:#cfd8e6}
.cartao--escuro{background:var(--marinho-800);border-color:var(--borda-escura);color:#fff}
.cartao--escuro p{color:var(--texto-claro)}
.cartao--destaque{border-color:var(--dourado);box-shadow:0 12px 34px rgba(200,162,74,.18)}

.icone{
  width:46px;height:46px;border-radius:13px;display:grid;place-items:center;
  background:var(--dourado-fundo);border:1px solid #eee0bb;color:#8a6a19;
  margin-bottom:16px;
}
.icone svg{width:23px;height:23px}
.cartao--escuro .icone{background:rgba(200,162,74,.14);border-color:rgba(200,162,74,.35);color:var(--dourado-claro)}

/* listas com marca de conferido */
.lista-cheia li{
  position:relative;padding-left:30px;margin-bottom:9px;
  font-size:.95rem;color:var(--texto-suave);
}
.lista-cheia li::before{
  content:"";position:absolute;left:0;top:.42em;
  width:16px;height:9px;border-left:2.4px solid var(--dourado);border-bottom:2.4px solid var(--dourado);
  transform:rotate(-45deg);border-radius:1px;
}
.secao--marca .lista-cheia li,.cartao--escuro .lista-cheia li{color:var(--texto-claro)}

/* ---------- topo / menu ---------- */
.topo{
  position:sticky;top:0;z-index:60;
  background:rgba(9,18,34,.94);
  backdrop-filter:blur(10px);
  border-bottom:1px solid rgba(255,255,255,.08);
  transition:box-shadow .25s ease,background .25s ease;
}
.topo--rolado{box-shadow:0 10px 30px rgba(4,10,20,.35);background:rgba(7,15,28,.98)}
.topo__interno{display:flex;align-items:center;gap:22px;min-height:72px}
.marca{display:flex;align-items:center;gap:12px;color:#fff}
.marca__simbolo{width:36px;height:36px;flex:0 0 auto}
.marca__texto{display:block}
.marca__nome{display:block;font-size:1.12rem;font-weight:700;letter-spacing:-.01em;line-height:1.1}
.marca__nome span{color:var(--dourado)}
.marca__lema{display:block;font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;color:var(--texto-claro);margin-top:4px}

.menu{display:flex;align-items:center;gap:26px;margin-left:auto}
.menu__link{
  color:var(--texto-claro);font-size:.95rem;font-weight:600;padding:6px 0;
  border-bottom:2px solid transparent;transition:color .18s ease,border-color .18s ease;
}
.menu__link:hover{color:#fff}
.menu__link--ativo{color:var(--dourado-claro);border-color:var(--dourado)}
.topo .botao{padding:11px 20px;font-size:.92rem}

.botao-menu{
  display:none;width:44px;height:44px;border-radius:11px;
  border:1px solid rgba(255,255,255,.22);background:transparent;cursor:pointer;
  margin-left:auto;place-items:center;
}
.botao-menu span{display:block;width:20px;height:2px;background:#fff;margin:4px auto;border-radius:2px;transition:transform .2s ease,opacity .2s ease}

/* ---------- capa ---------- */
.capa{
  position:relative;overflow:hidden;color:#fff;
  background:
    radial-gradient(760px 460px at 82% -8%,rgba(200,162,74,.2),transparent 60%),
    radial-gradient(620px 420px at 6% 108%,rgba(44,74,122,.5),transparent 62%),
    linear-gradient(168deg,var(--marinho-800),var(--marinho-900));
}
.capa::before{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.5;
  background-image:
    linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);
  background-size:58px 58px;
  mask-image:radial-gradient(80% 70% at 50% 30%,#000,transparent 85%);
}
.capa__interno{position:relative;display:grid;gap:52px;padding:clamp(60px,8vw,104px) 0}
@media (min-width:1000px){
  .capa--dupla .capa__interno{
    grid-template-columns:minmax(0,1.06fr) minmax(0,.94fr);
    align-items:center;
    gap:58px;
  }
}
.capa__texto{max-width:44rem}
.capa h1{font-size:clamp(2rem,5vw,3.2rem);margin:20px 0 0}
.capa h1 em{font-style:normal;color:var(--dourado)}
.capa__sub{margin-top:20px;font-size:clamp(1rem,1.4vw,1.13rem);color:var(--texto-claro);max-width:56ch}
.capa .botoes{margin-top:32px}
.capa__provas{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:14px 26px;margin-top:40px;padding-top:28px;
  border-top:1px solid rgba(255,255,255,.14);
}
.capa__provas li{display:flex;gap:10px;align-items:flex-start;font-size:.9rem;color:var(--texto-claro)}
.capa__provas svg{width:18px;height:18px;color:var(--dourado);flex:0 0 auto;margin-top:3px}
.capa__vitrine{position:relative}
.capa__legenda{margin-top:14px;font-size:.88rem;color:var(--texto-claro);text-align:center}
.capa--curta .capa__interno{padding:clamp(46px,5vw,68px) 0}

/* ---------- moldura de tela (navegador) ---------- */
.moldura{
  border-radius:14px;overflow:hidden;background:#fff;
  border:1px solid var(--borda);box-shadow:var(--sombra-forte);
}
.moldura__barra{
  display:flex;align-items:center;gap:7px;padding:10px 13px;
  background:#eef1f6;border-bottom:1px solid var(--borda);
}
.moldura__ponto{width:9px;height:9px;border-radius:50%;background:#c9d2e0;display:block}
.moldura__ponto:nth-child(1){background:#e2938a}
.moldura__ponto:nth-child(2){background:#e8c98a}
.moldura__ponto:nth-child(3){background:#9ecfa6}
.moldura__aba{
  margin-left:10px;font-size:.72rem;color:var(--texto-suave);
  background:#fff;border:1px solid var(--borda);border-radius:6px;padding:2px 12px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.moldura img{width:100%;aspect-ratio:16/10;object-fit:cover;object-position:top left}

/* ---------- faixa de destaques ---------- */
.faixa-marca{border-top:1px solid var(--borda);border-bottom:1px solid var(--borda);background:#fff}
.faixa-marca__interno{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(215px,1fr));
  gap:8px;padding:26px 0;
}
.faixa-marca__item{display:flex;gap:11px;align-items:center;font-size:.9rem;font-weight:600;color:var(--marinho-700)}
.faixa-marca__item svg{width:20px;height:20px;color:var(--dourado);flex:0 0 auto}

/* ---------- passos ---------- */
.passos{counter-reset:p;display:grid;gap:22px;grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}
.passo{position:relative;padding-top:26px;border-top:2px solid var(--borda)}
.passo::before{
  counter-increment:p;content:counter(p,decimal-leading-zero);
  position:absolute;top:-16px;left:0;
  font-size:.82rem;font-weight:700;letter-spacing:.08em;
  background:var(--dourado);color:#1b1405;border-radius:8px;padding:4px 11px;
}
.passo h3{font-size:1.05rem;margin:12px 0 8px}
.passo p{color:var(--texto-suave);font-size:.95rem}
.secao--marca .passo{border-color:var(--borda-escura)}
.secao--marca .passo p{color:var(--texto-claro)}

/* ---------- produto em destaque ---------- */
.produto{
  display:grid;gap:44px;align-items:center;
  grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);
}
.produto__texto h2{font-size:clamp(1.5rem,3vw,2.05rem)}
.produto__marca{display:flex;align-items:center;gap:12px;margin-bottom:6px}
.produto__marca svg{width:32px;height:32px;color:var(--dourado)}
.produto__marca b{font-size:1.3rem;letter-spacing:-.01em}
.produto__telas{display:grid;gap:18px}
.produto__telas .moldura:nth-child(2){width:78%;justify-self:end;margin-top:-42px}
@media (max-width:900px){
  .produto{grid-template-columns:1fr}
  .produto__telas .moldura:nth-child(2){width:100%;margin-top:0}
}

/* ---------- funções (grade de telas) ---------- */
.funcao{
  border:1px solid var(--borda);border-radius:var(--raio);overflow:hidden;background:#fff;
  box-shadow:var(--sombra);display:flex;flex-direction:column;
  transition:transform .2s ease,box-shadow .2s ease;
}
.funcao:hover{transform:translateY(-4px);box-shadow:0 18px 44px rgba(10,22,42,.14)}
.funcao__figura{border-bottom:1px solid var(--borda);background:var(--papel-2)}
.funcao__figura img{width:100%;aspect-ratio:16/9;object-fit:cover;object-position:top left}
.funcao__corpo{padding:20px 22px 24px}
.funcao__corpo h3{font-size:1.03rem;margin-bottom:7px}
.funcao__corpo p{font-size:.9rem;color:var(--texto-suave);margin-bottom:12px}
.funcao__corpo ul li{font-size:.87rem;color:var(--texto-suave);padding-left:18px;position:relative;margin-bottom:5px}
.funcao__corpo ul li::before{content:"";position:absolute;left:0;top:.6em;width:7px;height:7px;border-radius:50%;background:var(--dourado)}

/* ---------- planos ---------- */
.planos{display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));align-items:stretch}
.plano{
  position:relative;display:flex;flex-direction:column;gap:14px;
  background:#fff;border:1px solid var(--borda);border-radius:var(--raio);
  padding:26px 24px;box-shadow:var(--sombra);
}
.plano--destaque{border:2px solid var(--dourado);box-shadow:0 16px 40px rgba(200,162,74,.2)}
.plano__nome{font-size:1.16rem;font-weight:700}
.plano__selo{
  position:absolute;top:-13px;left:50%;transform:translateX(-50%);
  background:var(--dourado);color:#1b1405;font-size:.68rem;font-weight:700;
  letter-spacing:.1em;text-transform:uppercase;padding:5px 13px;border-radius:999px;white-space:nowrap;
}
.plano__usuarios{font-size:.82rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--dourado)}
.plano__desc{font-size:.93rem;color:var(--texto-suave);flex:1 1 auto}
.plano__valor{display:flex;align-items:baseline;gap:8px;padding-top:14px;border-top:1px solid var(--borda)}
.plano__valor b{font-size:1.85rem;letter-spacing:-.03em}
.plano__valor span{font-size:.85rem;color:var(--texto-suave)}

/* ---------- perguntas frequentes ---------- */
.perguntas{display:grid;gap:12px;max-width:900px}
.pergunta{border:1px solid var(--borda);border-radius:14px;background:#fff;overflow:hidden}
.pergunta summary{
  cursor:pointer;list-style:none;padding:19px 52px 19px 22px;position:relative;
  font-weight:600;font-size:1rem;
}
.pergunta summary::-webkit-details-marker{display:none}
.pergunta summary::after{
  content:"";position:absolute;right:22px;top:26px;width:11px;height:11px;
  border-right:2.2px solid var(--dourado);border-bottom:2.2px solid var(--dourado);
  transform:rotate(45deg);transition:transform .2s ease;
}
.pergunta[open] summary::after{transform:rotate(-135deg);top:29px}
.pergunta__resposta{padding:0 22px 21px;color:var(--texto-suave);font-size:.96rem}
.pergunta[open] .pergunta__resposta{animation:aparece .25s ease}
@keyframes aparece{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}

/* ---------- contato ---------- */
.contato{display:grid;gap:34px;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr)}
@media (max-width:900px){.contato{grid-template-columns:1fr}}
.dado{
  display:flex;gap:15px;align-items:flex-start;padding:18px 20px;
  border:1px solid var(--borda);border-radius:14px;background:#fff;box-shadow:var(--sombra);
}
.dado svg{width:22px;height:22px;color:var(--dourado);flex:0 0 auto;margin-top:3px}
.dado span{display:block;font-size:.75rem;letter-spacing:.12em;text-transform:uppercase;color:var(--texto-suave);font-weight:700}
.dado b{font-size:1.02rem}
.dado a{color:var(--marinho-700);border-bottom:1px solid rgba(200,162,74,.5)}
.dado a:hover{color:#8a6a19}

.formulario{background:#fff;border:1px solid var(--borda);border-radius:var(--raio-g);padding:30px;box-shadow:var(--sombra)}
.campo{margin-bottom:17px}
.campo label{display:block;font-size:.82rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--texto-suave);margin-bottom:7px}
.campo input,.campo select,.campo textarea{
  width:100%;font-family:inherit;font-size:1rem;color:var(--texto);
  padding:13px 15px;border:1.5px solid var(--borda);border-radius:11px;background:#fdfdff;
  transition:border-color .18s ease,box-shadow .18s ease;
}
.campo textarea{min-height:122px;resize:vertical}
.campo input:focus,.campo select:focus,.campo textarea:focus{
  outline:none;border-color:var(--dourado);box-shadow:0 0 0 4px rgba(200,162,74,.16);
}
.campo--duplo{display:grid;gap:17px;grid-template-columns:1fr 1fr}
@media (max-width:560px){.campo--duplo{grid-template-columns:1fr}}
.formulario__aviso{font-size:.83rem;color:var(--texto-suave);margin-top:14px}

/* ---------- chamada final ---------- */
.chamada-final{
  border-radius:var(--raio-g);padding:clamp(34px,5vw,58px);
  background:
    radial-gradient(600px 300px at 88% 0%,rgba(200,162,74,.22),transparent 60%),
    linear-gradient(150deg,var(--marinho-700),var(--marinho-900));
  color:#fff;display:grid;gap:30px;align-items:center;
  grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);
}
.chamada-final h2{font-size:clamp(1.5rem,3.2vw,2.1rem)}
.chamada-final h2 em{font-style:normal;color:var(--dourado)}
.chamada-final p{color:var(--texto-claro);margin-top:14px}
@media (max-width:860px){.chamada-final{grid-template-columns:1fr}}

/* ---------- rodapé ---------- */
.rodape{background:var(--marinho-900);color:var(--texto-claro);padding:56px 0 26px;font-size:.94rem}
.rodape__grade{display:grid;gap:34px;grid-template-columns:minmax(0,1.3fr) repeat(auto-fit,minmax(180px,1fr))}
.rodape h4{color:#fff;font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;margin-bottom:15px}
.rodape a:hover{color:var(--dourado-claro)}
.rodape li{margin-bottom:9px}
.rodape .marca{margin-bottom:16px}
.rodape__nota{max-width:38ch;color:#93a3bb;font-size:.9rem}
.rodape__base{
  margin-top:40px;padding-top:22px;border-top:1px solid rgba(255,255,255,.1);
  display:flex;flex-wrap:wrap;gap:12px;justify-content:space-between;
  font-size:.85rem;color:#8d9db6;
}

/* ---------- botão flutuante ---------- */
.flutuante{
  position:fixed;right:20px;bottom:20px;z-index:70;
  display:inline-flex;align-items:center;gap:10px;
  background:#1faf54;color:#fff;padding:13px 20px;border-radius:999px;
  font-weight:600;font-size:.94rem;box-shadow:0 14px 34px rgba(31,175,84,.34);
  transition:transform .2s ease;
}
.flutuante:hover{transform:translateY(-3px)}
.flutuante svg{width:21px;height:21px}
@media (max-width:520px){.flutuante span{display:none}.flutuante{padding:15px}}

/* ---------- animação de entrada ---------- */
.animar{opacity:0;transform:translateY(18px);transition:opacity .6s ease,transform .6s ease}
.animar--visivel{opacity:1;transform:none}

/* ---------- ajustes ---------- */
.pular{
  position:absolute;left:-9999px;top:0;background:var(--dourado);color:#1b1405;
  padding:10px 18px;border-radius:0 0 10px 0;z-index:99;font-weight:600;
}
.pular:focus{left:0}
.utilitario{margin-top:28px;display:flex;flex-wrap:wrap;gap:14px;align-items:center}

@media (max-width:900px){
  body{font-size:16px}
  .botao-menu{display:grid}
  .menu{
    position:absolute;top:72px;left:0;right:0;
    flex-direction:column;align-items:stretch;gap:0;margin:0;
    background:var(--marinho-900);border-top:1px solid rgba(255,255,255,.1);
    padding:14px 6vw 26px;display:none;
    box-shadow:0 24px 44px rgba(4,10,20,.45);
  }
  .menu--aberto{display:flex}
  .menu__link{padding:15px 0;border-bottom:1px solid rgba(255,255,255,.08);border-left:0}
  .menu__link--ativo{color:var(--dourado-claro);border-bottom-color:rgba(255,255,255,.08)}
  .menu .botao{margin-top:18px}
}

@media (max-width:640px){
  .capa__provas{grid-template-columns:1fr}
  .cartao{padding:24px 22px}
  .formulario{padding:24px 20px}
  .flutuante{right:14px;bottom:14px}
}

@media (prefers-reduced-motion:reduce){
  *{animation-duration:.001ms!important;transition-duration:.001ms!important}
  html{scroll-behavior:auto}
  .animar{opacity:1;transform:none}
}
