/* Cleps — nova capa: fontes, cabeçalho, menu lateral e rodapé. Usado na página inicial e em todas as páginas internas.
   Segue o Manual de Marca: preto #0A0A0A, papel #F4F5F1, verde #2EE6A6 só sobre preto, verde escuro #05704F no claro. */
@font-face{font-family:'Bricolage Grotesque';font-style:normal;font-display:swap;font-weight:200 800;font-stretch:75% 100%;src:url(fontes/bricolage.woff2) format('woff2-variations'),url(fontes/bricolage.woff2) format('woff2')}
@font-face{font-family:'Figtree';font-style:normal;font-display:swap;font-weight:300 900;src:url(fontes/figtree.woff2) format('woff2-variations'),url(fontes/figtree.woff2) format('woff2')}
:root{
  --cx-preto:#0a0a0a; --cx-preto-2:#131514; --cx-linha:#2b302e; --cx-branco:#fff; --cx-verde:#2ee6a6; --cx-nevoa:#b7bfbb;
  --cx-tit:'Bricolage Grotesque','Helvetica Neue',Arial,sans-serif; --cx-txt:'Figtree','Helvetica Neue',Arial,sans-serif;
  --cx-e:max(20px,env(safe-area-inset-left,0px)); --cx-d:max(20px,env(safe-area-inset-right,0px));
}
.cx-miolo{max-width:1240px;margin:0 auto;padding-left:var(--cx-e);padding-right:var(--cx-d)}

/* ---------- cabeçalho: logo, atalhos, lista de espera e menu ---------- */
.cx-topo{position:sticky;top:0;z-index:50;background:rgba(10,10,10,.86);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-bottom:1px solid rgba(255,255,255,.07);color:var(--cx-branco);font-family:var(--cx-txt)}
.cx-topo--sobre{position:fixed;left:0;right:0}
.cx-topo .cx-miolo{display:flex;align-items:center;gap:22px;min-height:72px}
.cx-marca{display:flex;align-items:center;min-height:44px;text-decoration:none;flex:none}
.cx-marca img{display:block;height:30px;width:auto;aspect-ratio:300/111}
.cx-nav{margin-left:auto;display:flex;gap:4px}
.cx-nav a{color:var(--cx-branco);text-decoration:none;font-weight:600;font-size:15px;padding:10px 12px;border-radius:10px;white-space:nowrap}
.cx-nav a:hover{background:rgba(255,255,255,.08)}
.cx-nav a[aria-current=page]{color:var(--cx-verde)}
.cx-cta{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 20px;border-radius:999px;background:var(--cx-verde);color:var(--cx-preto)!important;font-family:var(--cx-txt);font-weight:700;font-size:15px;text-decoration:none;white-space:nowrap;flex:none}
.cx-menu-botao{display:inline-grid;place-items:center;width:46px;height:46px;border-radius:999px;border:1.5px solid rgba(255,255,255,.3);background:transparent;color:var(--cx-branco);cursor:pointer;flex:none;padding:0}
.cx-topo :focus-visible,.cx-gaveta :focus-visible,.cx-rodape :focus-visible{outline:3px solid var(--cx-verde);outline-offset:3px}
@media (max-width:900px){.cx-nav{display:none}.cx-cta{margin-left:auto}}
@media (max-width:420px){.cx-cta{padding:0 14px;font-size:14px}.cx-topo .cx-miolo{gap:10px}}

/* ---------- menu lateral (gaveta) ---------- */
.cx-gaveta{position:fixed;inset:0;z-index:90;font-family:var(--cx-txt);color:var(--cx-branco)}
.cx-gaveta__fundo{position:absolute;inset:0;background:rgba(0,0,0,.6);opacity:0;transition:opacity .2s}
.cx-gaveta__painel{position:absolute;top:0;right:0;bottom:0;width:min(400px,88vw);background:var(--cx-preto-2);border-left:1px solid var(--cx-linha);padding:18px 24px calc(24px + env(safe-area-inset-bottom,0px));display:flex;flex-direction:column;gap:20px;overflow-y:auto;transform:translateX(100%);transition:transform .22s ease}
.cx-gaveta.aberta .cx-gaveta__fundo{opacity:1}.cx-gaveta.aberta .cx-gaveta__painel{transform:none}
.cx-gaveta__topo{display:flex;justify-content:space-between;align-items:center}
.cx-gaveta__topo img{height:28px;width:auto;aspect-ratio:300/111}
.cx-gaveta nav{display:flex;flex-direction:column;border-top:1px solid var(--cx-linha)}
.cx-gaveta nav a{display:flex;align-items:center;justify-content:space-between;min-height:56px;border-bottom:1px solid var(--cx-linha);font-family:var(--cx-tit);font-weight:700;font-size:20px;text-decoration:none;color:var(--cx-branco)}
.cx-gaveta nav a::after{content:"›";color:var(--cx-verde);font-size:24px;font-family:var(--cx-txt)}
.cx-gaveta nav a[aria-current=page]{color:var(--cx-verde)}
.cx-gaveta .cx-cta{min-height:54px;font-size:16px}
.cx-gaveta .cx-redes{margin-top:auto}
@media (prefers-reduced-motion:reduce){.cx-gaveta__painel,.cx-gaveta__fundo{transition:none}}

/* ---------- rodapé ---------- */
/* a página termina no rodapé: sem o "elástico" do iPhone e do Mac, que mostrava uma área branca depois do CNPJ */
html{background:var(--cx-preto);overscroll-behavior-y:none}
.cx-rodape{background:var(--cx-preto);color:var(--cx-branco);border-top:1px solid var(--cx-linha);padding-block:72px calc(32px + env(safe-area-inset-bottom,0px));font-family:var(--cx-txt);font-size:16px;line-height:1.6}
.cx-rodape__cols{display:grid;grid-template-columns:1.2fr 1.6fr 1fr 1fr;gap:40px 48px}
.cx-rodape__cols>div{display:flex;flex-direction:column;align-items:flex-start;gap:2px;min-width:0}
.cx-assinatura{gap:6px!important}
.cx-assinatura img{display:block;height:54px;width:auto;aspect-ratio:300/111}
.cx-assinatura span{font-family:var(--cx-txt);font-weight:600;font-size:17px;line-height:1;color:var(--cx-verde)}
.cx-rodape h2{margin:0 0 10px;font-family:var(--cx-txt);font-size:14px;font-weight:700;color:#8f9894;letter-spacing:0}
.cx-rodape__cols a,.cx-rodape__cols button{color:var(--cx-branco);text-decoration:none;min-height:40px;display:inline-flex;align-items:center;font:inherit;font-size:16px;background:none;border:0;padding:0;cursor:pointer;text-align:left}
.cx-rodape__cols a:hover,.cx-rodape__cols button:hover{color:var(--cx-verde)}
.cx-rodape__base{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;margin-top:48px;padding-top:24px;border-top:1px solid var(--cx-linha);font-size:14px;color:#8f9894}
.cx-redes{display:grid;grid-template-columns:repeat(4,46px);gap:10px;margin:0;padding:0;list-style:none}
.cx-redes a{display:inline-grid!important;place-items:center;width:46px;height:46px;min-height:0!important;border-radius:999px;border:1.5px solid var(--cx-linha);color:var(--cx-branco)!important;text-decoration:none;transition:border-color .15s,color .15s,background-color .15s}
.cx-redes a:hover{border-color:var(--cx-verde);color:var(--cx-verde)!important;background:rgba(46,230,166,.08)}
.cx-redes svg{width:20px;height:20px}
@media (max-width:1000px){.cx-rodape__cols{grid-template-columns:1fr 1fr}}
@media (max-width:640px){.cx-rodape__cols{grid-template-columns:1fr}}
/* a última linha (CNPJ e aviso) não fica embaixo do botão do chat */
.cx-rodape__base{padding-right:min(190px,30vw)}
@media (max-width:640px){.cx-rodape__base{padding-right:72px}}

/* aviso de cookies: o botão do chat sobe para não cobrir Recusar, Personalizar e Aceitar */
.chat-botao{transition:bottom .2s ease}
html.cx-com-cookies .chat-botao{bottom:calc(var(--cx-cookies,0px) + 14px)!important}
/* no celular, o aviso de cookies ocupa o pé da tela: o botão do chat volta assim que a pessoa escolhe */
@media (max-width:640px){html.cx-com-cookies .chat-botao{display:none!important}}

/* chat: o campo sempre cabe ao lado do botão de enviar. Letra de 16px evita o zoom automático do iPhone,
   que alargava a tela e empurrava o botão para fora. */
.chat-painel .chat-form textarea{min-width:0;width:100%;font-size:16px;line-height:1.35}
/* chat e janelas são claros mesmo na página inicial escura: sem isso, os botões de sugestão ficavam com letra branca no fundo branco */
.chat-painel,dialog.aviso-modal{color-scheme:light}
.chat-painel .chat-sugestoes button{color:#0a0a0a;background:#fff}
.chat-painel .chat-sugestoes button:hover{background:#f1f5f3}
.chat-painel .chat-form textarea{color:#0a0a0a;background:#fff}
.chat-painel .chat-form textarea::placeholder{color:#6b736f}
.chat-painel .chat-enviar{flex:0 0 44px;width:44px;height:44px}
/* celular: nenhum campo com letra menor que 16px, pelo mesmo motivo */
@media (max-width:900px){.controle__num,.controle select,.compartilhar-painel textarea,.form-sugestao textarea{font-size:16px}}

/* compartilhar no WhatsApp: a mensagem aparece como um balão de conversa, curta e fácil de conferir */
.compartilhar-painel h2{font-size:24px!important}
.compartilhar-painel .sc-sub{margin:0 0 12px!important;font-size:15px!important}
.sc-conversa{position:relative;background:#efeae2;border-radius:18px;padding:14px 16px 14px 14px;margin:0 0 6px}
.sc-conversa::after{content:"";position:absolute;right:8px;top:14px;border:8px solid transparent;border-top-color:#d9fdd3;border-left-color:#d9fdd3}
.compartilhar-painel .sc-conversa textarea{display:block;width:100%;margin:0;border:0;border-radius:12px 0 12px 12px;padding:10px 12px;background:#d9fdd3;color:#111b21;font-size:16px;line-height:1.4;resize:none;overflow-y:auto;max-height:42vh;box-shadow:0 1px 1px rgba(11,20,26,.13)}
.compartilhar-painel .sc-conversa textarea:focus-visible{outline:3px solid #05704f;outline-offset:2px}
.sc-dica{margin:0 0 10px!important;font-size:13px!important;color:#5b6360!important}
.compartilhar-painel .sc-opcao{display:flex;gap:10px;align-items:center;min-height:44px;margin:0 0 14px;font-size:15px;cursor:pointer}
.sc-opcao input{width:20px;height:20px;accent-color:#05704f;flex:none}