/* guia.css — estilo dos guias publicos de /guias/. Carregado por guia_partes.php.
   Uma pele so pros dois guias: o segundo nasceu copiando este bloco inteiro. */
  :root{
    --verde:#16A34A; --verde-claro:#E7F5EC; --tinta:#16211B; --suave:#5D6D64;
    --linha:#DDE4DE; --fundo:#F6F8F5; --branco:#FFFFFF; --ambar:#B45309; --ambar-claro:#FDF3E3;
  }
  *{box-sizing:border-box}
  body{margin:0;background:var(--fundo);color:var(--tinta);
       font:17px/1.62 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
       -webkit-font-smoothing:antialiased}
  .wrap{max-width:820px;margin:0 auto;padding:44px 20px 80px}
  h1{margin:0;font-size:clamp(29px,5vw,40px);line-height:1.1;letter-spacing:-.02em;text-wrap:balance}
  h2{margin:0;font-size:23px;line-height:1.25;letter-spacing:-.01em}
  p{margin:0}
  .selo{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--verde);
        font-weight:700;margin-bottom:12px}
  header{border-bottom:1px solid var(--linha);padding-bottom:30px;margin-bottom:40px}
  header .intro{margin-top:14px;color:var(--suave);font-size:18px;max-width:62ch}
  section.caminho{margin-bottom:58px}
  .topo{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
  .quando{font-size:12.5px;color:var(--suave);border:1px solid var(--linha);
          border-radius:999px;padding:3px 11px;background:var(--branco)}
  .sub{color:var(--suave);margin:8px 0 26px}
  ol{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:26px}
  ol li{display:grid;grid-template-columns:30px 1fr;gap:15px;align-items:start}
  .n{width:28px;height:28px;border-radius:50%;background:var(--verde-claro);color:var(--verde);
     display:grid;place-items:center;font-weight:700;font-size:14px;margin-top:2px}
  .txt p{max-width:62ch}
  figure{margin:12px 0 0;border:1px solid var(--linha);border-radius:10px;overflow:hidden;
         background:var(--branco);box-shadow:0 1px 2px rgba(22,33,27,.06),0 8px 26px rgba(22,33,27,.07)}
  figure img{display:block;width:100%;height:auto}
  figcaption{border-top:1px solid var(--linha);padding:8px 13px;font-size:12.5px;color:var(--suave)}
  .nota{border-left:3px solid var(--ambar);background:var(--ambar-claro);
        padding:13px 17px;border-radius:0 8px 8px 0;margin-top:24px}
  .nota b{color:var(--ambar)}
  .depois{border-top:1px solid var(--linha);padding-top:30px}
  .trilha{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:14px;
          font-size:13.5px;color:var(--suave)}
  .trilha span{border:1px solid var(--linha);border-radius:6px;padding:4px 10px;background:var(--branco)}
  code{background:var(--verde-claro);padding:2px 6px;border-radius:5px;font-size:.9em}
  footer{margin-top:56px;border-top:1px solid var(--linha);padding-top:18px;
         color:var(--suave);font-size:13.5px;display:flex;gap:14px;flex-wrap:wrap;
         justify-content:space-between}
  footer a{color:var(--verde);font-weight:600;text-decoration:none}
  footer a:hover,footer a:focus-visible{text-decoration:underline}
  a:focus-visible{outline:2px solid var(--verde);outline-offset:3px;border-radius:4px}
  @media (max-width:600px){ body{font-size:16px} .wrap{padding:32px 16px 64px} }

/* Guia de critérios (escolher-sistema): destaca o "No Gestão Clean" de cada ponto */
.gc{display:inline-block;margin-top:6px;font-weight:700;color:var(--verde)}