/* Paleta em 3 cores: navy (base), âmbar/laranja (ação) e verde (confirmação
     e WhatsApp). O resto é neutro — nada de quarta cor de destaque. */
  :root {
    --navy: #0e1b30; --navy-2: #16283f; --navy-3: #1d3350;
    --ink: #16233b; --texto-2: #5b6b82;
    --fundo: #f5f7fa; --branco: #fff; --borda: #e4eaf2;
    --ambar: #f59e0b; --ambar-2: #ea8b06; --laranja: #f97316;
    --verde: #1faa59; --verde-2: #178f4a;
  }
  * { box-sizing: border-box; margin: 0; }
  html { scroll-behavior: smooth; }
  body { font-family: -apple-system, 'Segoe UI', Roboto, Arial, sans-serif; color: var(--ink); background: var(--fundo); line-height: 1.6; }
  h1, h2, h3, .marca, .botao, .valor { font-family: 'Sora', -apple-system, 'Segoe UI', Roboto, Arial, sans-serif; }
  h1, h2, .sub-secao { text-wrap: balance; }
  p { text-wrap: pretty; }
  .larg { max-width: 1060px; margin: 0 auto; padding: 0 22px; }
  a { color: var(--verde-2); }

  /* Palavras-chave em negrito no meio do texto */
  strong { font-weight: 700; color: var(--navy); }
  .heroi strong, .suporte-faixa strong { color: #fff; }

  /* ===== Barra fixa ===== */
  .topo { position: sticky; top: 0; z-index: 50; background: rgba(14,27,48,.92); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); border-bottom: 1px solid rgba(255,255,255,.08); }
  .topo-linha { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 12px 0; }
  .marca { display: flex; align-items: center; gap: 10px; font-weight: 700; font-size: 18px; color: #fff; text-decoration: none; }
  .marca .cubo { width: 34px; height: 34px; border-radius: 9px; background: linear-gradient(145deg, var(--ambar), var(--laranja)); display: flex; align-items: center; justify-content: center; flex: none; }
  .marca .cubo svg { width: 19px; height: 19px; color: #fff; }
  .topo nav { display: flex; gap: 22px; }
  .topo nav a { color: #c7d2e2; text-decoration: none; font-size: 14.5px; font-weight: 600; }
  .topo nav a:hover { color: #fff; }
  .topo .botao { padding: 9px 18px; font-size: 14.5px; }

  /* ===== Botões ===== */
  .botao { display: inline-flex; align-items: center; justify-content: center; gap: 9px; padding: 15px 28px; border-radius: 12px; font-size: 16.5px; font-weight: 700; text-decoration: none; transition: transform .15s, box-shadow .15s, background .15s, filter .15s; }
  .botao:hover { transform: translateY(-2px); }
  .botao:active { transform: scale(.98); }
  .botao svg { width: 19px; height: 19px; flex: none; }
  .botao.laranja { background: linear-gradient(145deg, var(--ambar), var(--laranja)); color: #fff; box-shadow: 0 8px 20px rgba(249,115,22,.35); }
  .botao.laranja:hover { filter: brightness(1.06); box-shadow: 0 12px 26px rgba(249,115,22,.42); }
  .botao.zap { background: var(--verde); color: #fff; box-shadow: 0 8px 20px rgba(31,170,89,.28); }
  .botao.zap:hover { background: var(--verde-2); box-shadow: 0 12px 26px rgba(31,170,89,.35); }
  .botao.contorno { background: rgba(255,255,255,.07); color: #fff; border: 1px solid rgba(255,255,255,.3); }
  .botao.contorno:hover { background: rgba(255,255,255,.13); }

  /* ===== Herói ===== */
  header.heroi-fundo { background: radial-gradient(1100px 500px at 75% -10%, #24405f 0%, var(--navy-2) 45%, var(--navy) 100%); color: #fff; padding: 60px 0 0; overflow: hidden; }
  .heroi { display: grid; grid-template-columns: 1.05fr .95fr; gap: 52px; align-items: center; padding-bottom: 56px; }
  .selo { display: inline-flex; align-items: center; gap: 8px; background: rgba(245,158,11,.14); border: 1px solid rgba(245,158,11,.4); color: #fbbf24; font-size: 13px; font-weight: 700; padding: 6px 14px; border-radius: 999px; margin-bottom: 20px; }
  .heroi h1 { font-size: clamp(30px, 4.6vw, 46px); line-height: 1.12; letter-spacing: -.8px; font-weight: 800; }
  .heroi p.sub { font-size: clamp(16px, 2.2vw, 18.5px); color: #b9c6d8; max-width: 540px; margin: 18px 0 0; }
  .cta-linha { display: flex; gap: 14px; flex-wrap: wrap; margin-top: 30px; }
  .heroi .mini { color: #8fa2ba; font-size: 13.5px; margin-top: 16px; }
  .heroi .mini.win7 { margin-top: 8px; }
  .heroi .mini.win7 a { color: #dbe4f0; }

  .janela { border-radius: 14px; overflow: hidden; background: #eef2f7; box-shadow: 0 24px 48px rgba(0,0,0,.45); border: 1px solid rgba(255,255,255,.12); }
  .janela-barra { display: flex; gap: 7px; padding: 10px 14px; background: #eef2f7; }
  .janela-barra span { width: 10px; height: 10px; border-radius: 50%; }
  .janela-barra span:nth-child(1) { background: #fca5a5; }
  .janela-barra span:nth-child(2) { background: #fcd34d; }
  .janela-barra span:nth-child(3) { background: #86efac; }
  .janela-legenda { text-align: center; color: #8fa2ba; font-size: 13.5px; margin-top: 12px; min-height: 44px; }

  /* Carrossel de telas reais */
  .carrossel { position: relative; overflow: hidden; }
  .carr-trilho { display: flex; transition: transform .45s ease; }
  .carr-trilho img { display: block; width: 100%; height: auto; flex: 0 0 100%; }
  .carr-seta { position: absolute; top: 50%; transform: translateY(-50%); width: 38px; height: 38px; border-radius: 50%; border: none; background: rgba(14,27,48,.55); color: #fff; cursor: pointer; display: flex; align-items: center; justify-content: center; padding: 0; transition: background .15s, transform .15s; }
  .carr-seta:hover { background: rgba(14,27,48,.85); transform: translateY(-50%) scale(1.1); }
  .carr-seta svg { width: 20px; height: 20px; }
  .carr-seta.ant { left: 10px; }
  .carr-seta.prox { right: 10px; }
  .carr-pontos { display: flex; gap: 8px; justify-content: center; margin-top: 14px; }
  .carr-ponto { width: 8px; height: 8px; border-radius: 999px; background: rgba(255,255,255,.28); border: none; cursor: pointer; padding: 0; transition: background .2s, width .2s; }
  .carr-ponto:hover { background: rgba(255,255,255,.5); }
  .carr-ponto.ativo { background: var(--ambar); width: 22px; }

  /* Faixa de confiança */
  .confianca-faixa { border-top: 1px solid rgba(255,255,255,.09); background: rgba(0,0,0,.18); }
  .confianca-itens { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; padding: 16px 0; }
  .conf-item { display: flex; align-items: center; gap: 9px; color: #c7d2e2; font-size: 13.5px; font-weight: 600; }
  .conf-item svg { width: 17px; height: 17px; color: var(--ambar); flex: none; }

  /* ===== Seções ===== */
  section { padding: 68px 0; }
  section.branca { background: var(--branco); }
  h2 { font-size: clamp(24px, 3.5vw, 34px); color: var(--navy); text-align: center; letter-spacing: -.5px; font-weight: 800; }
  .sub-secao { text-align: center; color: var(--texto-2); max-width: 640px; margin: 10px auto 40px; font-size: 16.5px; }

  /* Ícones de card (quadradinho verde: cor de confirmação da paleta) */
  .icone { width: 40px; height: 40px; border-radius: 11px; background: rgba(31,170,89,.12); color: var(--verde-2); display: flex; align-items: center; justify-content: center; flex: none; transition: transform .18s ease; }
  .icone svg { width: 21px; height: 21px; }

  /* Como funciona */
  .passos { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; }
  .passo { background: var(--branco); border: 1px solid var(--borda); border-radius: 16px; padding: 24px 20px; box-shadow: 0 8px 24px rgba(15,32,60,.05); transition: transform .18s ease, box-shadow .18s ease; }
  .passo:hover { transform: translateY(-4px); box-shadow: 0 14px 32px rgba(15,32,60,.10); }
  .passo-topo { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
  .passo .num { width: 34px; height: 34px; border-radius: 10px; background: linear-gradient(145deg, var(--ambar), var(--laranja)); color: #fff; font-weight: 800; font-family: 'Sora', sans-serif; display: flex; align-items: center; justify-content: center; font-size: 16px; }
  .passo-topo > svg { width: 24px; height: 24px; color: var(--laranja); opacity: .8; }
  .passo b { display: block; color: var(--navy); margin-bottom: 5px; font-size: 18px; font-family: 'Sora', sans-serif; letter-spacing: -.2px; }
  .passo span { font-size: 14.5px; color: var(--texto-2); }

  /* Recursos */
  .grade { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 14px; }
  .rec { background: var(--fundo); border: 1px solid var(--borda); border-radius: 14px; padding: 18px; font-size: 14.5px; color: var(--texto-2); display: flex; gap: 14px; align-items: flex-start; transition: transform .18s ease, box-shadow .18s ease, background .18s ease; }
  .rec:hover { transform: translateY(-3px); background: var(--branco); box-shadow: 0 10px 24px rgba(15,32,60,.08); }
  .rec:hover .icone { transform: scale(1.12) rotate(-4deg); }
  .rec b { color: var(--navy); display: block; margin-bottom: 3px; font-size: 16.5px; }

  /* Diferenciais */
  .difs { display: grid; grid-template-columns: repeat(auto-fit, minmax(270px, 1fr)); gap: 18px; }
  .dif { background: var(--branco); border: 1px solid var(--borda); border-top: 4px solid var(--verde); border-radius: 16px; padding: 24px; box-shadow: 0 8px 24px rgba(15,32,60,.05); transition: transform .18s ease, box-shadow .18s ease; }
  .dif:hover { transform: translateY(-4px); box-shadow: 0 14px 32px rgba(15,32,60,.10); }
  .dif:hover .icone { transform: scale(1.12) rotate(-4deg); }
  .dif .icone { margin-bottom: 14px; }
  .dif b { color: var(--navy); display: block; margin-bottom: 8px; font-size: 19px; font-family: 'Sora', sans-serif; letter-spacing: -.2px; line-height: 1.3; }
  .dif p { font-size: 14.5px; color: var(--texto-2); }

  /* Instalação e suporte (faixa escura) */
  .suporte-faixa { background: linear-gradient(160deg, var(--navy-2), var(--navy)); color: #fff; }
  .suporte-faixa h2 { color: #fff; }
  .suporte-faixa .sub-secao { color: #9fb0c6; }
  .sup-grade { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 18px; }
  .sup { background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.12); border-radius: 16px; padding: 26px 24px; transition: transform .18s ease, background .18s ease; }
  .sup:hover { transform: translateY(-4px); background: rgba(255,255,255,.09); }
  .sup-topo { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
  .sup .icone { background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.14); color: var(--ambar); }
  .sup .tag { display: inline-block; font-size: 12px; font-weight: 800; letter-spacing: .8px; text-transform: uppercase; padding: 4px 11px; border-radius: 999px; }
  .sup .tag.padrao { background: rgba(31,170,89,.18); color: #7be3a6; border: 1px solid rgba(31,170,89,.45); }
  .sup .tag.extra { background: rgba(245,158,11,.15); color: #fbbf24; border: 1px solid rgba(245,158,11,.4); }
  .sup b { display: block; font-size: 19px; margin-bottom: 8px; font-family: 'Sora', sans-serif; letter-spacing: -.2px; }
  .sup p { font-size: 14.5px; color: #b9c6d8; }
  .sup-nota { text-align: center; margin-top: 34px; color: #b9c6d8; font-size: 15px; }
  .sup-nota .botao { margin-top: 18px; }

  /* Preço */
  .caixa-preco { background: var(--branco); border: 1px solid var(--borda); border-radius: 22px; max-width: 460px; margin: 0 auto; padding: 38px 34px; text-align: center; box-shadow: 0 18px 48px rgba(15,32,60,.12); position: relative; transition: transform .18s ease, box-shadow .18s ease; }
  .caixa-preco:hover { transform: translateY(-4px); box-shadow: 0 24px 56px rgba(15,32,60,.16); }
  .caixa-preco::before { content: ''; position: absolute; inset: 0 0 auto 0; height: 5px; border-radius: 22px 22px 0 0; background: linear-gradient(90deg, var(--ambar), var(--laranja)); }
  .caixa-preco .plano-nome { font-size: 13px; font-weight: 800; letter-spacing: 1px; text-transform: uppercase; color: var(--texto-2); }
  .caixa-preco .valor { font-size: 52px; font-weight: 800; color: var(--navy); letter-spacing: -1.5px; margin-top: 6px; }
  .caixa-preco .valor small { font-size: 17px; font-weight: 600; color: var(--texto-2); letter-spacing: 0; }
  .caixa-preco ul { list-style: none; padding: 0; margin: 24px 0 28px; text-align: left; }
  .caixa-preco li { padding: 8px 0 8px 30px; position: relative; font-size: 15px; color: var(--ink); }
  .caixa-preco li::before { content: '✓'; position: absolute; left: 2px; color: var(--verde-2); font-weight: 800; }
  .preco-nota { text-align: center; color: var(--texto-2); font-size: 13.5px; margin-top: 18px; }

  /* FAQ */
  details { background: var(--branco); border: 1px solid var(--borda); border-radius: 14px; padding: 18px 22px; margin-bottom: 10px; transition: border-color .18s ease, box-shadow .18s ease; }
  details:hover { border-color: #cdd9e6; box-shadow: 0 6px 18px rgba(15,32,60,.07); }
  summary { font-weight: 700; color: var(--navy); cursor: pointer; font-size: 16.5px; list-style: none; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
  summary::-webkit-details-marker { display: none; }
  summary::after { content: ''; width: 9px; height: 9px; border-right: 2.5px solid var(--laranja); border-bottom: 2.5px solid var(--laranja); transform: rotate(45deg); transition: transform .25s ease; flex: none; margin-right: 4px; }
  details[open] summary::after { transform: rotate(225deg); }
  details p { margin-top: 10px; font-size: 14.5px; color: var(--texto-2); }
  details[open] p { animation: surgir .28s ease; }
  @keyframes surgir { from { opacity: 0; transform: translateY(-5px); } to { opacity: 1; transform: none; } }

  /* CTA final */
  .cta-final { text-align: center; }
  .cta-final .cta-linha { justify-content: center; }

  /* Rodapé */
  footer { background: var(--navy); color: #8fa2ba; padding: 44px 0 34px; font-size: 13.5px; }
  .rodape-linha { display: flex; justify-content: space-between; gap: 28px; flex-wrap: wrap; align-items: flex-start; }
  .rodape-linha .marca { font-size: 16.5px; }
  .rodape-contato { text-align: right; line-height: 2; }
  footer a { color: #c7d2e2; }
  .legal { border-top: 1px solid rgba(255,255,255,.09); margin-top: 28px; padding-top: 20px; text-align: center; color: #6d7f97; font-size: 12.5px; }

  /* Botão flutuante do WhatsApp */
  .zap-flutua { position: fixed; right: 18px; bottom: 18px; z-index: 60; width: 56px; height: 56px; border-radius: 50%; background: var(--verde); display: flex; align-items: center; justify-content: center; box-shadow: 0 10px 24px rgba(0,0,0,.3); animation: pulso 2.6s infinite; }
  .zap-flutua svg { width: 30px; height: 30px; color: #fff; }
  .zap-flutua:hover { background: var(--verde-2); }
  @keyframes pulso {
    0% { box-shadow: 0 10px 24px rgba(0,0,0,.3), 0 0 0 0 rgba(31,170,89,.4); }
    70% { box-shadow: 0 10px 24px rgba(0,0,0,.3), 0 0 0 16px rgba(31,170,89,0); }
    100% { box-shadow: 0 10px 24px rgba(0,0,0,.3), 0 0 0 0 rgba(31,170,89,0); }
  }

  @media (prefers-reduced-motion: reduce) {
    .zap-flutua { animation: none; }
    .carr-trilho { transition: none; }
    html { scroll-behavior: auto; }
  }

  @media (max-width: 900px) {
    .topo nav { display: none; } /* só o menu do topo; a trilha (.migalha) continua visível */
    .heroi { grid-template-columns: 1fr; gap: 38px; padding-bottom: 44px; }
    .heroi .lado-mock { max-width: 500px; margin: 0 auto; width: 100%; }
    .confianca-itens { grid-template-columns: repeat(2, 1fr); }
    .rodape-contato { text-align: left; }
  }

  /* ===== Páginas de conteúdo (Windows 7, sem internet, ordem de serviço) ===== */
  .pag-heroi { background: radial-gradient(900px 420px at 78% -20%, #24405f 0%, var(--navy-2) 48%, var(--navy) 100%); color: #fff; padding: 34px 0 52px; }
  .migalha { display: block; font-size: 13px; color: #8fa2ba; margin-bottom: 18px; }
  .migalha a { color: #c7d2e2; text-decoration: none; }
  .migalha a:hover { color: #fff; text-decoration: underline; }
  .pag-heroi h1 { font-size: clamp(27px, 4.1vw, 40px); line-height: 1.15; letter-spacing: -.7px; font-weight: 800; max-width: 780px; }
  .pag-heroi .sub { font-size: clamp(16px, 2.1vw, 18.5px); color: #b9c6d8; max-width: 660px; margin: 16px 0 0; }
  .pag-heroi .cta-linha { margin-top: 26px; }
  .pag-heroi .mini { color: #8fa2ba; font-size: 13.5px; margin-top: 15px; }

  /* Corpo de texto longo */
  .texto { max-width: 780px; margin: 0 auto; }
  .texto > h2 { text-align: left; margin-top: 8px; }
  .texto h3 { font-size: clamp(19px, 2.4vw, 23px); color: var(--navy); font-weight: 700; letter-spacing: -.3px; margin: 34px 0 10px; }
  .texto p { color: var(--texto-2); font-size: 16.5px; margin-bottom: 14px; }
  .texto ul, .texto ol { color: var(--texto-2); font-size: 16.5px; margin: 0 0 16px; padding-left: 22px; }
  .texto li { margin-bottom: 9px; }
  .texto li::marker { color: var(--verde-2); font-weight: 700; }

  /* Aviso honesto (o que o sistema NÃO faz / exige) */
  .nota { background: #fffaf0; border: 1px solid #f5d9a4; border-left: 4px solid var(--ambar); border-radius: 12px; padding: 16px 20px; margin: 22px 0; font-size: 15px; color: #6b5220; }
  .nota b { color: #7a4f06; display: block; margin-bottom: 4px; }

  /* Tabela comparativa / de requisitos */
  .tabela-caixa { overflow-x: auto; margin: 22px 0; -webkit-overflow-scrolling: touch; }
  table.comp { width: 100%; border-collapse: collapse; font-size: 15px; min-width: 460px; background: var(--branco); border: 1px solid var(--borda); border-radius: 12px; overflow: hidden; }
  table.comp th, table.comp td { padding: 12px 15px; text-align: left; border-bottom: 1px solid var(--borda); color: var(--texto-2); vertical-align: top; }
  table.comp th { background: var(--fundo); color: var(--navy); font-weight: 700; font-family: 'Sora', sans-serif; font-size: 14.5px; }
  table.comp td:first-child { color: var(--navy); font-weight: 600; }
  table.comp tr:last-child td { border-bottom: none; }
  table.comp .sim { color: var(--verde-2); font-weight: 700; }
  table.comp .nao { color: #b4472f; font-weight: 700; }

  /* Bloco de links para as outras páginas */
  .proximas { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 14px; margin-top: 10px; }
  .prox-card { display: block; background: var(--branco); border: 1px solid var(--borda); border-radius: 14px; padding: 20px; text-decoration: none; transition: transform .18s ease, box-shadow .18s ease; }
  .prox-card:hover { transform: translateY(-3px); box-shadow: 0 12px 28px rgba(15,32,60,.09); }
  .prox-card b { display: block; color: var(--navy); font-family: 'Sora', sans-serif; font-size: 17px; margin-bottom: 6px; letter-spacing: -.2px; }
  .prox-card span { color: var(--texto-2); font-size: 14.5px; display: block; }

  /* Coluna de links do rodapé */
  .rodape-links { line-height: 2.05; }
  .rodape-links b { display: block; color: #fff; font-family: 'Sora', sans-serif; font-size: 14.5px; margin-bottom: 4px; font-weight: 700; }
  .rodape-links a { display: block; }

  @media (max-width: 900px) {
    .pag-heroi { padding: 26px 0 40px; }
    .rodape-links { line-height: 2.2; }
  }

  /* Nome de arquivo no meio do texto (oficina.db, instalar.bat) */
  .texto code { background: #eef2f7; border: 1px solid var(--borda); border-radius: 6px; padding: 1px 6px; font-family: ui-monospace, 'SF Mono', Menlo, Consolas, monospace; font-size: .9em; color: var(--navy); }