/* ============================================================
   ARQUIVO GERADO. Não edite à mão.
   Fonte: assets/cmj.css · gerado por tools/gerar-chrome-css.mjs

   Contém só o cabeçalho e o rodapé do site do CMJ, com cada regra
   presa a #cmj-topo / #cmj-rodape. Serve para páginas que têm CSS
   próprio e não podem receber o design system inteiro, hoje a do
   Curso de Especialização.
   ============================================================ */

#cmj-topo,
#cmj-rodape{
  /* Paleta CMJ (marca principal) */
  --laranja:#f07e26;
  --rosa:#e6007e;
  --roxo:#7a59fe;
  
  /* Paleta CDF (submarca, só no Conselho do Futuro) */
  --ciano:#09e1cd;
  
  /* Neutros */
  --claro:#f6f2ee;
  --escuro:#0d0d12;
  --texto:#0d0d12;
  --texto2:#3d4250;
  --branco:#ffffff;
  --linha:rgba(13,13,18,.10);
  
  /* Gradiente da marca: laranja -> rosa -> roxo. Nunca sobre texto. */
  --grad:linear-gradient(100deg,var(--laranja),var(--rosa) 52%,var(--roxo));
  --grad-cdf:linear-gradient(100deg,var(--ciano),var(--roxo));
  
  --raio:34px;
  --raio-g:44px;
  --pill:999px;
  --sombra:0 18px 48px -28px rgba(13,13,18,.38);
  --max:1240px;

  font-family:'Montserrat',system-ui,sans-serif;
  color:var(--texto);
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
  text-align:left;
}
#cmj-topo *,
#cmj-rodape *{box-sizing:border-box;margin:0;padding:0}
#cmj-topo a,
#cmj-rodape a{color:inherit;text-decoration:none}
#cmj-topo img,
#cmj-rodape img{max-width:100%;display:block}
#cmj-topo svg,
#cmj-rodape svg{flex:none}
#cmj-rodape p{color:var(--texto2);font-size:14px;line-height:1.62}
#cmj-rodape h4{font-weight:700}

#cmj-topo .wrap,
#cmj-rodape .wrap{max-width:var(--max);margin:0 auto;padding:0 40px}
#cmj-topo .btn,
#cmj-rodape .btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;
  padding:17px 32px;border-radius:var(--pill);border:none;cursor:pointer;
  font-size:15.5px;font-weight:700;line-height:1;
  background:var(--grad);color:#fff;
  box-shadow:0 16px 38px -16px rgba(230,0,126,.62);
  transition:transform .2s ease, box-shadow .2s ease;}
#cmj-topo .btn:hover,
#cmj-rodape .btn:hover{transform:translateY(-3px);box-shadow:0 22px 46px -16px rgba(230,0,126,.7)}
#cmj-topo .btn.cdf,
#cmj-rodape .btn.cdf{background:var(--grad-cdf);color:#06121a;box-shadow:0 16px 38px -16px rgba(122,89,254,.6)}
#cmj-topo .btn.linha,
#cmj-rodape .btn.linha{background:none;color:var(--texto);border:1px solid rgba(13,13,18,.18);box-shadow:none}
#cmj-topo .btn.linha:hover,
#cmj-rodape .btn.linha:hover{background:rgba(13,13,18,.05)}
#cmj-topo .escuro .btn.linha,
#cmj-rodape .escuro .btn.linha{color:#fff;border-color:rgba(255,255,255,.26)}
#cmj-topo .escuro .btn.linha:hover,
#cmj-rodape .escuro .btn.linha:hover{background:rgba(255,255,255,.08)}
#cmj-topo .btn.claro,
#cmj-rodape .btn.claro{background:#fff;color:var(--escuro);box-shadow:0 16px 38px -18px rgba(0,0,0,.5)}
#cmj-topo header.topo,
#cmj-rodape header.topo{position:sticky;top:0;z-index:90;
  background:rgba(246,242,238,.88);backdrop-filter:blur(18px);
  border-bottom:1px solid var(--linha);}
#cmj-topo .faixa,
#cmj-rodape .faixa{border-bottom:1px solid var(--linha)}
#cmj-topo .faixa .wrap,
#cmj-rodape .faixa .wrap{display:flex;justify-content:space-between;align-items:center;
  padding:8px 40px;font-size:11px;letter-spacing:.16em;font-weight:600;color:#6a707d;text-transform:uppercase}
#cmj-topo .faixa a,
#cmj-rodape .faixa a{color:#6a707d;transition:color .2s}
#cmj-topo .faixa a:hover,
#cmj-rodape .faixa a:hover{color:var(--rosa)}
#cmj-topo .social,
#cmj-rodape .social{display:flex;gap:16px;align-items:center}
#cmj-topo .nav,
#cmj-rodape .nav{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:15px 40px}
#cmj-topo .nav nav,
#cmj-rodape .nav nav{display:flex;align-items:center;gap:4px;flex-wrap:wrap}
#cmj-topo .nav nav a,
#cmj-rodape .nav nav a{display:flex;align-items:center;gap:7px;
  padding:10px 13px;border-radius:var(--pill);
  font-size:13.5px;font-weight:600;color:#41464f;transition:background .18s,color .18s;}
@media (max-width:1400px){
  #cmj-topo .nav,
  #cmj-rodape .nav{gap:16px;padding:15px 28px}
  #cmj-topo .nav nav,
  #cmj-rodape .nav nav{gap:2px}
  #cmj-topo .nav nav a,
  #cmj-rodape .nav nav a{padding:9px 10px;font-size:12.8px;gap:6px}
  #cmj-topo .nav > .btn,
  #cmj-rodape .nav > .btn{padding:12px 19px;font-size:14px}
}
#cmj-topo .nav nav a:hover,
#cmj-rodape .nav nav a:hover{background:rgba(13,13,18,.05)}
#cmj-topo .nav nav a.on,
#cmj-rodape .nav nav a.on{color:var(--rosa);background:rgba(230,0,126,.08)}
#cmj-topo .nav nav a.on.cdf,
#cmj-rodape .nav nav a.on.cdf{color:var(--roxo);background:rgba(122,89,254,.08)}
#cmj-topo .dotn,
#cmj-rodape .dotn{width:7px;height:7px;border-radius:50%;flex:none}
#cmj-topo footer.rodape,
#cmj-rodape footer.rodape{border-top:1px solid var(--linha);padding:70px 0 34px;position:relative;z-index:1}
#cmj-topo footer.rodape .cols,
#cmj-rodape footer.rodape .cols{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr 1fr;gap:34px}
#cmj-topo footer.rodape h4,
#cmj-rodape footer.rodape h4{font-size:11.5px;letter-spacing:.18em;text-transform:uppercase;color:#8b909b;margin-bottom:16px;font-weight:700}
#cmj-topo footer.rodape .lista,
#cmj-rodape footer.rodape .lista{display:grid;gap:11px;font-size:14px;color:var(--texto2)}
#cmj-topo footer.rodape .lista a:hover,
#cmj-rodape footer.rodape .lista a:hover{color:var(--rosa)}
#cmj-topo .fim,
#cmj-rodape .fim{margin-top:44px;padding-top:24px;border-top:1px solid var(--linha);
  display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;
  font-size:12.5px;color:#8b909b}
#cmj-topo .fim a:hover,
#cmj-rodape .fim a:hover{color:var(--rosa)}
#cmj-topo .flex,
#cmj-rodape .flex{display:flex;gap:14px;flex-wrap:wrap;align-items:center}
@media (max-width:960px){
  #cmj-topo .wrap,
  #cmj-rodape .wrap{padding:0 22px}
  #cmj-topo .faixa,
  #cmj-rodape .faixa{display:none}
  #cmj-topo .nav,
  #cmj-rodape .nav{padding:12px 18px 10px;gap:10px;
      flex-wrap:wrap;align-items:center;justify-content:space-between;}
  #cmj-topo .nav > a:first-child,
  #cmj-rodape .nav > a:first-child{order:1;flex:0 0 auto}
  #cmj-topo .nav > .btn,
  #cmj-rodape .nav > .btn{order:2;flex:0 0 auto;width:auto !important;
      padding:11px 18px !important;font-size:13px !important;min-height:42px;}
  #cmj-topo .nav nav.movel,
  #cmj-rodape .nav nav.movel{order:3;flex-wrap:nowrap !important}
  #cmj-topo footer.rodape .cols,
  #cmj-rodape footer.rodape .cols{grid-template-columns:1fr 1fr}
  #cmj-topo .nav nav,
  #cmj-rodape .nav nav{display:none}
  #cmj-topo .nav nav.movel,
  #cmj-rodape .nav nav.movel{display:flex;order:3;width:100%;overflow-x:auto;gap:4px;
      -webkit-overflow-scrolling:touch;scrollbar-width:none;padding-bottom:2px;}
  #cmj-topo .nav nav.movel::-webkit-scrollbar,
  #cmj-rodape .nav nav.movel::-webkit-scrollbar{display:none}
  #cmj-topo .nav nav.movel a,
  #cmj-rodape .nav nav.movel a{white-space:nowrap;font-size:13px;padding:9px 13px}
  #cmj-topo .nav > a:first-child img,
  #cmj-rodape .nav > a:first-child img{height:38px !important}
}
@media (max-width:620px){
  #cmj-topo .wrap,
  #cmj-rodape .wrap{padding:0 18px}
  #cmj-topo footer.rodape .cols,
  #cmj-rodape footer.rodape .cols{grid-template-columns:1fr;gap:26px}
  #cmj-topo .btn,
  #cmj-rodape .btn{width:100%;justify-content:center;padding:16px 22px}
  #cmj-topo .flex .btn,
  #cmj-rodape .flex .btn{width:auto;flex:1 1 auto;min-width:190px}
  #cmj-topo .nav .btn,
  #cmj-rodape .nav .btn{width:auto !important;flex:0 0 auto !important;padding:10px 16px !important;font-size:12.5px !important}
  #cmj-topo .flex[style*="nowrap"],
  #cmj-rodape .flex[style*="nowrap"]{gap:13px !important}
  #cmj-topo .flex[style*="nowrap"] p,
  #cmj-rodape .flex[style*="nowrap"] p{font-size:15.5px !important}
}
@media (max-width:960px){
  #cmj-topo .btn,
  #cmj-rodape .btn{min-height:48px}
  #cmj-topo .nav nav a,
  #cmj-rodape .nav nav a{min-height:44px}
  #cmj-topo footer.rodape .lista a,
  #cmj-topo .fim a,
  #cmj-topo .faixa a,
  #cmj-rodape footer.rodape .lista a,
  #cmj-rodape .fim a,
  #cmj-rodape .faixa a{display:inline-flex;align-items:center;min-height:44px}
}
@media (hover:none){
  #cmj-topo .btn:hover,
  #cmj-topo .nav nav a:hover,
  #cmj-rodape .btn:hover,
  #cmj-rodape .nav nav a:hover{transform:none}
}
