/* Nozyx — conteúdo das páginas internas (POP, Pay, CRM). Base clara, sem fundos escuros.
   Tudo fica dentro de .cz para não interferir no header, menu, rodapé e CSS compartilhado. */
.cz{
  --cz-ink:#101828; --cz-text:#344054; --cz-muted:#667085; --cz-line:#E4E7EC;
  --cz-bg:#FFFFFF; --cz-soft:#F7F9FC; --cz-soft2:#F2F5F9;
  --cz-acc:#1D6BFF; --cz-acc-soft:#EAF1FF; --cz-acc-ink:#1450DC; --cz-on-acc:#FFFFFF;
  --cz-ok:#12B76A; --cz-ok-soft:#E8F8F0; --cz-warn:#B54708; --cz-warn-soft:#FFF6E5;
  --cz-r:20px;
  background:var(--cz-bg); color:var(--cz-text);
  font-family:Inter,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  font-size:17px; line-height:1.6; -webkit-font-smoothing:antialiased;
}
.cz--pop{--cz-acc:#FF5A1F; --cz-acc-soft:#FFF1EB; --cz-acc-ink:#C2410C; --cz-on-acc:#FFFFFF}
.cz--pay{--cz-acc:#B6F36A; --cz-acc-soft:#F3FCE6; --cz-acc-ink:#3F6212; --cz-on-acc:#14210A}
.cz--crm{--cz-acc:#12B76A; --cz-acc-soft:#E8F8F0; --cz-acc-ink:#067647; --cz-on-acc:#FFFFFF}
.cz *,.cz *:before,.cz *:after{box-sizing:border-box}
.cz-sec{padding:clamp(56px,8vw,104px) 0; background:var(--cz-bg)}
.cz-sec.cz-alt{background:var(--cz-soft)}
.cz-wrap{width:min(1160px,100% - 32px); margin-inline:auto}
.cz-narrow{max-width:760px}
.cz-eb{display:inline-flex; align-items:center; gap:8px; margin:0 0 14px; font:600 13px/1.2 Inter,system-ui,sans-serif; letter-spacing:.08em; text-transform:uppercase; color:var(--cz-acc-ink)}
.cz--pay .cz-eb{color:#3F6212}
.cz-eb:before{content:""; width:18px; height:3px; border-radius:3px; background:var(--cz-acc)}
.cz h2,.cz h3,.cz h4{font-family:Sora,Inter,system-ui,sans-serif; color:var(--cz-ink); margin:0; letter-spacing:-.02em}
.cz h2{font-size:clamp(30px,4.4vw,52px); line-height:1.08; font-weight:700; max-width:22ch}
.cz h3{font-size:clamp(19px,2vw,22px); line-height:1.25; font-weight:650}
.cz h4{font-size:17px; line-height:1.3; font-weight:650}
.cz p{margin:0}
.cz-lead{margin-top:18px!important; font-size:clamp(18px,1.6vw,21px); line-height:1.55; color:var(--cz-text); max-width:62ch}
.cz-head{margin-bottom:clamp(32px,5vw,56px)}
.cz-prose p+p{margin-top:14px}
.cz-prose strong{color:var(--cz-ink)}
.cz a{color:var(--cz-acc-ink)}
.cz--pay a{color:#3F6212}

/* Passo a passo */
.cz-steps{list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:16px; counter-reset:cz}
.cz-steps li{position:relative; background:var(--cz-bg); border:1px solid var(--cz-line); border-radius:var(--cz-r); padding:26px 24px 24px; counter-increment:cz}
.cz-alt .cz-steps li{background:#fff}
.cz-steps li:before{content:counter(cz,decimal-leading-zero); display:inline-grid; place-items:center; width:40px; height:40px; border-radius:12px; margin-bottom:16px; background:var(--cz-acc-soft); color:var(--cz-acc-ink); font:700 15px/1 Sora,Inter,sans-serif}
.cz-steps p{margin-top:8px; color:var(--cz-text); font-size:16px}

/* Cartões de recurso */
.cz-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:16px}
.cz-card{background:#fff; border:1px solid var(--cz-line); border-radius:var(--cz-r); padding:26px; display:flex; flex-direction:column; gap:10px; text-decoration:none; color:inherit; transition:border-color .2s, transform .2s, box-shadow .2s}
a.cz-card:hover{border-color:var(--cz-acc); transform:translateY(-2px); box-shadow:0 12px 32px -18px rgba(16,24,40,.25)}
.cz-card p{font-size:16px}
.cz-ic{width:46px; height:46px; border-radius:14px; display:grid; place-items:center; background:var(--cz-acc-soft); color:var(--cz-acc-ink)}
.cz-ic svg{width:24px; height:24px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round}
.cz-go{margin-top:auto; padding-top:6px; font-weight:600; font-size:15px; color:var(--cz-acc-ink)}
.cz--pay .cz-go{color:#3F6212}
.cz-tag{align-self:flex-start; font:600 12px/1 Inter,sans-serif; padding:6px 10px; border-radius:999px; background:var(--cz-soft2); color:var(--cz-text)}
.cz-tag.on{background:var(--cz-acc-soft); color:var(--cz-acc-ink)}
.cz-tag.wait{background:var(--cz-warn-soft); color:var(--cz-warn)}

/* Fluxo (infográfico) */
.cz-flow{display:grid; grid-template-columns:repeat(var(--n,4),minmax(0,1fr)); gap:0; align-items:stretch; position:relative}
.cz-node{position:relative; text-align:center; padding:0 10px}
.cz-node .cz-dot{width:72px; height:72px; margin:0 auto 16px; border-radius:22px; display:grid; place-items:center; background:#fff; border:1.5px solid var(--cz-line); color:var(--cz-acc-ink); box-shadow:0 10px 30px -20px rgba(16,24,40,.35); position:relative; z-index:1}
.cz-node.hi .cz-dot{background:var(--cz-acc); border-color:var(--cz-acc); color:var(--cz-on-acc)}
.cz-node .cz-dot svg{width:30px; height:30px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round}
.cz-node:not(:last-child):after{content:""; position:absolute; top:36px; left:calc(50% + 40px); right:calc(-50% + 40px); height:2px; background:repeating-linear-gradient(90deg,var(--cz-acc) 0 8px,transparent 8px 14px); opacity:.7}
.cz-node h4{font-size:16px}
.cz-node p{font-size:14.5px; color:var(--cz-muted); margin-top:6px; line-height:1.45}
.cz-flow-box{background:#fff; border:1px solid var(--cz-line); border-radius:28px; padding:clamp(28px,4vw,48px) clamp(16px,3vw,40px)}
.cz-cap{margin-top:18px!important; font-size:14px; color:var(--cz-muted); text-align:center}
@media (max-width:760px){
  .cz-flow{grid-template-columns:1fr; gap:22px}
  .cz-node{display:grid; grid-template-columns:64px 1fr; gap:14px; text-align:left; align-items:start; padding:0}
  .cz-node .cz-dot{width:56px; height:56px; margin:0; border-radius:18px}
  .cz-node:not(:last-child):after{top:60px; bottom:-20px; left:27px; right:auto; width:2px; height:auto; background:repeating-linear-gradient(180deg,var(--cz-acc) 0 6px,transparent 6px 11px)}
}

/* Comparativo antes/depois */
.cz-vs{display:grid; grid-template-columns:1fr 1fr; gap:16px}
.cz-vs > div{border-radius:var(--cz-r); padding:28px; border:1px solid var(--cz-line); background:#fff}
.cz-vs .cz-good{border-color:var(--cz-acc); box-shadow:0 0 0 3px var(--cz-acc-soft)}
.cz-vs ul{list-style:none; margin:16px 0 0; padding:0; display:grid; gap:12px}
.cz-vs li{display:grid; grid-template-columns:22px 1fr; gap:10px; font-size:16px}
.cz-vs li:before{content:"–"; font-weight:700; color:var(--cz-muted); text-align:center}
.cz-vs .cz-good li:before{content:"✓"; color:var(--cz-acc-ink)}
.cz--pay .cz-vs .cz-good li:before{color:#3F6212}
@media (max-width:760px){.cz-vs{grid-template-columns:1fr}}

/* Tabela */
.cz-table-wrap{overflow-x:auto; border:1px solid var(--cz-line); border-radius:var(--cz-r); background:#fff}
.cz-table{width:100%; border-collapse:collapse; font-size:15.5px; min-width:560px}
.cz-table th,.cz-table td{padding:14px 18px; text-align:left; border-bottom:1px solid var(--cz-line); vertical-align:top}
.cz-table thead th{background:var(--cz-soft); font:650 14px/1.3 Inter,sans-serif; color:var(--cz-ink)}
.cz-table tbody tr:last-child td{border-bottom:0}
.cz-table td:first-child{color:var(--cz-ink); font-weight:500}
.cz-yes{color:var(--cz-acc-ink); font-weight:600}
.cz--pay .cz-yes{color:#3F6212}
.cz-no{color:var(--cz-muted)}

/* Barras / medidor */
.cz-bars{display:grid; gap:18px}
.cz-bar{display:grid; grid-template-columns:minmax(120px,190px) 1fr auto; gap:14px; align-items:center; font-size:15px}
.cz-bar .cz-track{height:14px; border-radius:99px; background:var(--cz-soft2); overflow:hidden}
.cz-bar .cz-fill{display:block; height:100%; border-radius:99px; background:var(--cz-acc)}
.cz-bar b{color:var(--cz-ink); font-weight:650; white-space:nowrap}
@media (max-width:560px){.cz-bar{grid-template-columns:1fr auto}.cz-bar .cz-track{grid-column:1 / -1; grid-row:2}}

/* Linha do tempo */
.cz-tl{list-style:none; margin:0; padding:0; position:relative; display:grid; gap:4px}
.cz-tl:before{content:""; position:absolute; left:58px; top:8px; bottom:8px; width:2px; background:var(--cz-line)}
.cz-tl li{display:grid; grid-template-columns:48px 22px 1fr; gap:10px; align-items:start; padding:12px 0}
.cz-tl time{font:650 14px/1.6 Sora,Inter,sans-serif; color:var(--cz-ink); text-align:right}
.cz-tl i{width:14px; height:14px; margin:5px 0 0 3px; border-radius:50%; background:#fff; border:3px solid var(--cz-acc); position:relative; z-index:1}
.cz-tl p{font-size:16px}
.cz-tl strong{color:var(--cz-ink)}

/* Divisão texto + figura */
.cz-split{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(28px,5vw,72px); align-items:center}
@media (max-width:900px){.cz-split{grid-template-columns:1fr}}
.cz-fig{background:#fff; border:1px solid var(--cz-line); border-radius:28px; padding:clamp(20px,3vw,32px)}
.cz-fig svg{display:block; width:100%; height:auto}

/* Avisos honestos */
.cz-note{display:grid; grid-template-columns:24px 1fr; gap:12px; padding:18px 20px; border-radius:16px; background:var(--cz-warn-soft); color:#7A2E0E; font-size:15.5px; line-height:1.55; margin-top:24px}
.cz-note:before{content:"i"; display:grid; place-items:center; width:24px; height:24px; border-radius:50%; background:#fff; color:var(--cz-warn); font:700 14px/1 Sora,sans-serif}
.cz-note.ok{background:var(--cz-acc-soft); color:var(--cz-ink)}
.cz-note.ok:before{content:"✓"; color:var(--cz-acc-ink)}

/* Perguntas */
.cz-faq{display:grid; gap:10px}
.cz-faq details{background:#fff; border:1px solid var(--cz-line); border-radius:16px; padding:0 22px}
.cz-faq summary{cursor:pointer; list-style:none; padding:20px 30px 20px 0; position:relative; font:600 17px/1.4 Inter,sans-serif; color:var(--cz-ink)}
.cz-faq summary::-webkit-details-marker{display:none}
.cz-faq summary:after{content:"+"; position:absolute; right:0; top:16px; font:400 26px/1 Inter,sans-serif; color:var(--cz-acc-ink); transition:transform .2s}
.cz-faq details[open] summary:after{transform:rotate(45deg)}
.cz-faq details p{padding:0 0 20px; font-size:16px}

/* Chamada final */
.cz-cta{display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:24px; padding:clamp(28px,4vw,48px); border-radius:28px; background:linear-gradient(135deg,var(--cz-acc-soft),#fff 70%); border:1px solid var(--cz-line)}
.cz-cta h2{font-size:clamp(26px,3.4vw,40px)}
.cz-cta p{margin-top:10px; color:var(--cz-text)}
.cz-row{display:flex; flex-wrap:wrap; gap:12px; align-items:center}
.cz-btn{display:inline-flex; align-items:center; gap:10px; min-height:50px; padding:14px 24px; border-radius:999px; font:650 16px/1.2 Inter,sans-serif; text-decoration:none; border:1.5px solid transparent; transition:transform .2s, box-shadow .2s}
.cz .cz-btn-main{background:var(--cz-acc); color:var(--cz-on-acc); box-shadow:0 10px 24px -14px var(--cz-acc)}
.cz .cz-btn-line{background:#fff; color:var(--cz-ink); border-color:var(--cz-line)}
.cz-btn:hover{transform:translateY(-2px)}
.cz-btn:focus-visible,.cz-card:focus-visible,.cz-faq summary:focus-visible{outline:3px solid var(--cz-acc); outline-offset:3px}

/* Números de destaque (somente fatos do produto, nunca resultados) */
.cz-facts{display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:16px}
.cz-fact{background:#fff; border:1px solid var(--cz-line); border-radius:var(--cz-r); padding:24px}
.cz-fact b{display:block; font:700 clamp(28px,3.4vw,40px)/1.05 Sora,Inter,sans-serif; color:var(--cz-ink); letter-spacing:-.03em}
.cz-fact span{display:block; margin-top:8px; font-size:15px; color:var(--cz-muted)}

@media (prefers-reduced-motion:reduce){.cz *{transition:none!important}}
.cz a.cz-card,.cz a.cz-card p{color:var(--cz-text)}
.cz a.cz-card h3{color:var(--cz-ink)}
.cz-grid{grid-template-columns:repeat(auto-fill,minmax(240px,1fr))}