/* ═════════════════════════════════════════════════════════════════
   GORO PMP — Estilos complementares para páginas internas
   (precos, modulos, demo, trial, sobre-chk, contactos, segmentos,
   industrias, faq, seguranca-e-cloud, legais)
   Reutiliza os tokens/variáveis definidos em style.css
══════════════════════════════════════════════════════════════════ */

/* ═════════ Page hero (banner de topo das páginas internas) ═════════ */
.page-hero{
  background:
    radial-gradient(1100px 480px at 85% -10%, rgba(44,78,143,.14), transparent 60%),
    var(--white);
  padding:44px 0 clamp(40px, 5vw, 64px);
  border-bottom:1px solid var(--line);
}
.breadcrumb{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--muted-2);margin-bottom:22px;flex-wrap:wrap}
.breadcrumb a{color:var(--muted-2)}
.breadcrumb a:hover{color:var(--navy)}
.breadcrumb span.sep{opacity:.6}
.breadcrumb span.cur{color:var(--navy);font-weight:600}
.page-hero h1{font-size:clamp(32px, 4vw, 48px);max-width:820px}
.page-hero .lead{margin-top:16px;max-width:640px}
.page-hero-actions{display:flex;gap:12px;margin-top:28px;flex-wrap:wrap}

/* Dark variant (para páginas institucionais tipo Sobre a CHK) */
.page-hero.dark{background:var(--navy-deep);border-bottom:0}
.page-hero.dark h1{color:#fff}
.page-hero.dark .lead{color:#B9C7E8}
.page-hero.dark .breadcrumb,.page-hero.dark .breadcrumb a{color:#8FA0C8}
.page-hero.dark .breadcrumb span.cur{color:#fff}

/* ═════════ Content blocks genéricos ═════════ */
.content-block{max-width:760px}
.content-block h2{margin-top:44px;margin-bottom:16px}
.content-block h2:first-child{margin-top:0}
.content-block h3{margin-top:28px;margin-bottom:10px;font-size:18px}
.content-block p{margin-top:14px;font-size:15.5px;line-height:1.7;color:var(--ink-2)}
.content-block ul,.content-block ol{margin:14px 0 0;padding-left:22px;color:var(--ink-2);font-size:15px;line-height:1.7}
.content-block li{margin-bottom:6px}
.content-block strong{color:var(--ink)}
.content-block a{color:var(--blue);text-decoration:underline;text-decoration-color:var(--blue-soft)}

/* Legal pages: tighter, numbered */
.legal-updated{font-size:13px;color:var(--muted-2);margin-top:10px}
.legal-toc{background:var(--off);border-radius:var(--radius);padding:20px 24px;margin:28px 0;border:1px solid var(--line)}
.legal-toc h4{font-size:13px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin-bottom:12px}
.legal-toc ol{margin:0;padding-left:20px;font-size:14px;color:var(--blue)}
.legal-toc li{margin-bottom:6px}
.legal-toc a{color:var(--blue)}

/* ═════════ Feature grid (Módulos) ═════════ */
.feature-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;margin-top:20px}
@media (max-width:800px){.feature-grid{grid-template-columns:1fr}}
.feature-card{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);
  padding:30px;
}
.feature-card .cat{
  display:inline-block;font-size:11px;font-weight:600;letter-spacing:.06em;
  padding:3px 8px;border-radius:4px;background:var(--off);color:var(--muted);
  text-transform:uppercase;margin-bottom:14px;
}
.feature-card h3{margin-bottom:10px}
.feature-card ul{list-style:none;margin:16px 0 0;padding:0;display:flex;flex-direction:column;gap:8px}
.feature-card li{font-size:14px;color:var(--ink-2);display:flex;gap:8px;align-items:flex-start}
.feature-card li::before{
  content:"";width:14px;height:14px;flex:0 0 14px;margin-top:4px;
  background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path d='M4 8.5l2.5 2.5L12 5.5' stroke='%232C4E8F' stroke-width='2' fill='none' stroke-linecap='round' stroke-linejoin='round'/></svg>") center/contain no-repeat;
}

/* ═════════ Timeline (Sobre a CHK) ═════════ */
.timeline{margin-top:32px;border-left:2px solid var(--line-2);padding-left:28px;display:flex;flex-direction:column;gap:28px}
.timeline-item{position:relative}
.timeline-item::before{
  content:"";position:absolute;left:-34px;top:2px;width:12px;height:12px;border-radius:50%;
  background:var(--navy);border:3px solid var(--blue-soft);
}
.timeline-item .yr{font-size:13px;font-weight:700;color:var(--blue);letter-spacing:.02em;margin-bottom:4px}
.timeline-item h4{font-size:16px;margin-bottom:4px}
.timeline-item p{font-size:14.5px;color:var(--muted);margin-top:4px}

/* Values grid (Sobre a CHK) */
.values-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:20px}
@media (max-width:800px){.values-grid{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.values-grid{grid-template-columns:1fr}}
.value-card{background:var(--off);border-radius:var(--radius);padding:22px;text-align:center}
.value-card .n{font-weight:700;color:var(--navy);font-size:15px}

/* ═════════ FAQ accordion ═════════ */
.faq-cats{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:32px}
.faq-cat-btn{
  padding:8px 16px;border-radius:999px;font-size:13.5px;font-weight:500;
  background:var(--off);color:var(--ink-2);border:1px solid var(--line);
}
.faq-cat-btn.active{background:var(--navy);color:#fff;border-color:var(--navy)}
.faq-list{display:flex;flex-direction:column;gap:12px;max-width:820px}
.faq-item{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.faq-q{
  width:100%;text-align:left;padding:18px 22px;font-size:15.5px;font-weight:600;color:var(--ink);
  display:flex;align-items:center;justify-content:space-between;gap:12px;
}
.faq-q::after{content:"+";font-size:20px;font-weight:400;color:var(--muted-2);flex:0 0 auto;transition:transform .2s}
.faq-item.open .faq-q::after{transform:rotate(45deg)}
.faq-a{padding:0 22px;max-height:0;overflow:hidden;transition:max-height .25s ease, padding .25s ease}
.faq-a p{font-size:14.5px;color:var(--muted);line-height:1.65;padding:0 0 18px}
.faq-item.open .faq-a{max-height:600px}

/* ═════════ Trust badges (Segurança) ═════════ */
.trust-badges{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:24px}
@media (max-width:900px){.trust-badges{grid-template-columns:repeat(2,1fr)}}
@media (max-width:520px){.trust-badges{grid-template-columns:1fr}}
.trust-badge{background:var(--off);border-radius:var(--radius);padding:22px;text-align:center;border:1px solid var(--line)}
.trust-badge .ic{
  width:40px;height:40px;border-radius:10px;background:var(--navy);color:#fff;
  display:flex;align-items:center;justify-content:center;margin:0 auto 12px;font-size:17px;
}
.trust-badge .t{font-size:14px;font-weight:600;color:var(--ink)}

/* ═════════ Simple 2-col layout (Demo / Trial forms) ═════════ */
.split-grid{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:start}
@media (max-width:900px){.split-grid{grid-template-columns:1fr;gap:36px}}
.split-list{list-style:none;margin:24px 0 0;padding:0;display:flex;flex-direction:column;gap:14px}
.split-list li{display:flex;gap:12px;align-items:flex-start;font-size:15px;color:var(--ink-2)}
.split-list li .n{
  width:26px;height:26px;border-radius:50%;background:var(--navy);color:#fff;font-size:12px;
  font-weight:700;display:flex;align-items:center;justify-content:center;flex:0 0 26px;margin-top:1px;
}

/* Steps mini (demo/trial process) */
.mini-steps{display:flex;flex-direction:column;gap:0;margin-top:24px}
.mini-step{display:flex;gap:16px;padding:16px 0;border-bottom:1px solid var(--line)}
.mini-step:last-child{border-bottom:0}
.mini-step .dot{width:28px;height:28px;border-radius:50%;background:var(--blue-soft);color:var(--navy);font-size:13px;font-weight:700;display:flex;align-items:center;justify-content:center;flex:0 0 28px}
.mini-step h4{font-size:15px;margin-bottom:4px}
.mini-step p{font-size:14px;margin-top:2px}

/* Form card wrapper (used on demo/trial/contactos) */
.form-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);padding:32px;box-shadow:var(--shadow-md)}

/* Success message state on standalone form pages */
.form-success{display:none;text-align:center;padding:40px 20px}
.form-success.show{display:block}
.form-success .ic{
  width:56px;height:56px;border-radius:50%;background:var(--green-soft);color:var(--green);
  display:flex;align-items:center;justify-content:center;margin:0 auto 18px;font-size:26px;
}

.nav a.active{color:var(--navy);font-weight:700}
