/* =============================================================================
Glossário de Editorias — clone do glossário em produção, no visual novo
-----------------------------------------------------------------------------
A ESTRUTURA é a de lá (faixa de topo, coluna de busca + painel EDITORIAS em
acordeão, coluna de explicativo, caixa do formulário do jornalista). O que
muda é a pele: onde era vinho, agora é o teal da marca; o CTA é o coral;
tipografia Barlow nos títulos e Inter no texto.
============================================================================= */
/* .sr-only mora no skin.css (utilitário compartilhado). */
/* ---- Faixa de topo ------------------------------------------------------- */
.ge-cta{background:var(--teal);color:#fff}
.ge-cta .wrap{display:flex;align-items:center;justify-content:space-between;gap:26px;padding-top:26px;padding-bottom:26px}
.ge-cta h2,.ge-cta .ge-cta-tit{font-family:var(--disp);font-weight:800;font-size:clamp(22px,2.6vw,30px);line-height:1.08;letter-spacing:-.01em;color:#fff}
/* :not(.ge-cta-tit) porque o título da faixa deixou de ser (ele vinha
antes do da página) e virou
— sem isto herdava daqui o margin-top
de 7px e o max-width de 70ch, que como
ele não tinha. */
.ge-cta p:not(.ge-cta-tit){font-size:15px;line-height:1.5;color:#CFE6E5;margin-top:7px;max-width:70ch}
.ge-cta b{color:#fff}
.ge-cta-nota{display:block;font-size:12.5px;color:#9CC7C5;margin-top:4px}
.ge-cta .btn{flex:none}
/* ---- Corpo --------------------------------------------------------------- */
.ge-body{background:var(--surface);padding:26px 0 70px}
.ge-body .breadcrumb{display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-family:var(--disp);font-size:12px;font-weight:700;letter-spacing:.03em;text-transform:uppercase;color:var(--muted);margin-bottom:20px}
.ge-body .breadcrumb a{color:var(--teal)}
.ge-body .breadcrumb a:hover{color:var(--red)}
.ge-body .breadcrumb .sep{color:#9FB0AF}
.ge-body .breadcrumb .cur{color:var(--ink)}
.ge-grid{display:grid;grid-template-columns:352px minmax(0,1fr);gap:38px;align-items:start}
/* ---- Busca --------------------------------------------------------------- */
.ge-busca{display:flex;margin-bottom:14px}
.ge-busca input{flex:1;min-width:0;padding:12px 16px;border:1.5px solid var(--line);border-right:0;border-radius:10px 0 0 10px;font:inherit;font-size:15px;color:var(--ink);background:#fff}
.ge-busca input:focus{outline:none;border-color:var(--teal)}
.ge-busca input::-webkit-search-cancel-button{display:none}
.ge-busca button{flex:none;width:52px;border:0;border-radius:0 10px 10px 0;background:var(--teal);color:#fff;cursor:pointer;transition:background .15s}
.ge-busca button:hover{background:var(--teal-h)}
.ge-busca svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;display:block;margin:0 auto}
.ge-conta{font-size:13px;color:var(--muted);margin:-6px 0 12px 2px}
.ge-conta[hidden]{display:none}
/* ---- Painel EDITORIAS ---------------------------------------------------- */
.ge-painel{background:var(--surface-2);border-radius:12px;overflow:hidden}
.ge-painel-head{background:var(--teal);color:#fff;font-family:var(--disp);font-weight:800;font-size:14px;letter-spacing:.12em;text-transform:uppercase;padding:13px 18px}
.ge-acc{list-style:none}
.ge-acc-item{border-bottom:1px solid #DDE4E3}
.ge-acc-item:last-child{border-bottom:0}
.ge-acc-item[hidden]{display:none}
.ge-acc-head{display:flex;align-items:center;gap:12px;width:100%;text-align:left;background:none;border:0;cursor:pointer;padding:13px 18px;font:inherit;font-family:var(--disp);font-weight:700;font-size:16px;color:var(--ink);transition:color .15s,background .15s}
.ge-acc-head>span{flex:1}
.ge-acc-head:hover{color:var(--teal);background:rgba(0,107,110,.05)}
.ge-seta{flex:none;width:17px;height:17px;fill:none;stroke:var(--teal);stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round;transition:transform .2s}
.ge-acc-head[aria-expanded="true"] .ge-seta{transform:rotate(90deg)}
.ge-acc-painel{padding:0 18px 14px}
.ge-acc-painel[hidden]{display:none}
.ge-grupo-nota{font-size:13px;line-height:1.5;color:var(--muted);margin:0 0 10px}
.ge-lista{list-style:none}
.ge-ed{display:block;width:100%;text-align:left;background:none;border:0;font:inherit;font-size:15px;line-height:1.3;color:var(--teal);padding:5px 0;cursor:pointer;transition:color .12s}
.ge-ed:hover{color:var(--red)}
.ge-ed.ativo{color:var(--red);font-weight:700}
.ge-ed[hidden]{display:none}
.ge-ed mark{background:#FFF0B3;color:inherit;border-radius:3px;padding:0 1px}
.ge-acc-item--nao .ge-acc-head{color:var(--red)}
.ge-acc-item--nao .ge-seta{stroke:var(--red)}
.ge-vazio{padding:16px 18px;font-size:14px;color:var(--muted)}
.ge-vazio[hidden]{display:none}
/* ---- Coluna do explicativo ------------------------------------------------ */
.ge-desc h1{font-family:var(--disp);font-weight:800;font-size:clamp(28px,3.4vw,40px);line-height:1.06;letter-spacing:-.02em;color:var(--ink)}
.ge-lead{font-size:16.5px;line-height:1.6;color:var(--text);margin-top:12px;max-width:74ch}
.ge-num{font-family:var(--disp);font-weight:700;font-size:14px;color:var(--muted);margin-top:16px}
.ge-num b{color:var(--teal)}
.ge-conteudo[hidden]{display:none}
.ge-conteudo-kick{font-family:var(--disp);font-weight:800;font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--red)}
.ge-conteudo h2{font-family:var(--disp);font-weight:800;font-size:clamp(24px,3vw,34px);line-height:1.08;letter-spacing:-.02em;color:var(--ink);margin:6px 0 16px}
.ge-texto p{font-size:16px;line-height:1.68;color:var(--text);margin-bottom:13px}
.ge-texto b{color:var(--ink)}
.ge-texto a{color:var(--teal);text-decoration:underline}
/* ---- Caixa do formulário do jornalista ----------------------------------- */
.ge-form{max-width:420px;margin-top:34px;border-top:1px solid var(--line);padding-top:30px}
.ge-form-head{background:var(--teal);color:#fff;font-family:var(--disp);font-weight:800;font-size:14px;letter-spacing:.1em;text-transform:uppercase;padding:12px 18px;border-radius:10px 10px 0 0}
.ge-form-corpo{background:var(--surface-2);border-radius:0 0 10px 10px;padding:18px}
.ge-form-dek{font-size:15px;color:var(--text);margin-bottom:14px}
.ge-campo{position:relative;margin-bottom:10px}
.ge-campo input{width:100%;padding:13px 14px;border:1.5px solid var(--line);border-radius:9px;font:inherit;font-size:15px;color:var(--ink);background:#fff}
.ge-campo input:focus{outline:none;border-color:var(--teal);box-shadow:0 0 0 3px rgba(0,107,110,.12)}
.ge-campo label{position:absolute;left:11px;top:13px;color:var(--muted);font-size:15px;pointer-events:none;transition:.14s;background:#fff;padding:0 5px}
.ge-campo input:focus+label,.ge-campo input:not(:placeholder-shown)+label{top:-8px;font-size:11.5px;color:var(--teal);font-weight:600}
.ge-campo.invalido input{border-color:var(--red)}
.ge-form-corpo .btn{margin-top:4px}
.ge-form-err{color:var(--red);font-size:13.5px;margin-top:9px;line-height:1.4}
.ge-form-ok{background:#E2EFEE;border:1px solid #CFE3E2;border-radius:9px;padding:14px 16px;font-size:15px;color:var(--teal);line-height:1.5}
.ge-form-ok[hidden]{display:none}
/* ---- Modal (celular) ----------------------------------------------------- */
.ge-modal{position:fixed;inset:0;z-index:210;display:none;align-items:flex-start;justify-content:center;padding:26px 16px;overflow:auto}
.ge-modal.open{display:flex}
.ge-modal-back{position:fixed;inset:0;background:rgba(4,25,26,.72)}
.ge-modal-card{position:relative;z-index:1;width:100%;max-width:560px;margin:auto;background:var(--paper);border-radius:16px;box-shadow:0 30px 80px rgba(0,0,0,.42);padding:30px 26px 26px}
.ge-modal-close{position:absolute;top:12px;right:12px;width:36px;height:36px;border:0;border-radius:50%;background:var(--surface);color:var(--ink);font-size:19px;cursor:pointer}
.ge-modal-close:hover{background:var(--red);color:#fff}
.ge-modal-card h2{font-family:var(--disp);font-weight:800;font-size:25px;line-height:1.1;color:var(--ink);margin:6px 0 14px}
/* ---- Celular ------------------------------------------------------------- */
@media(max-width:900px){
.ge-cta .wrap{flex-direction:column;align-items:flex-start;gap:16px}
.ge-cta .btn{width:100%;justify-content:center}
.ge-grid{grid-template-columns:1fr;gap:26px}
.ge-desc{order:-1} /* apresentação antes da lista */
.ge-form{max-width:none}
}
/* ---------------------------------------------------------------------------
GEO do glossário: cada editoria virou ÂNCORA com endereço próprio (?e=slug)
em vez de botão, e as 194 descrições passaram a vir no HTML.
--------------------------------------------------------------------------- */
a.ge-ed{text-decoration:none}
a.ge-ed:hover{text-decoration:underline}
/* .ativo é posto pelo JavaScript; .ge-ed--ativa vem pronta do servidor quando
a pessoa chega direto em ?e=. As duas pintam a mesma coisa. */
.ge-ed--ativa{color:var(--red);font-weight:700}
/* O bloco de dados existe para ser LIDO por robô e pelo JavaScript, não para
ocupar espaço. O atributo hidden já resolve; a regra é o cinto de segurança
para o caso de alguma outra folha reativar o display. */
.ge-dados[hidden]{display:none!important}
/* Página de uma editoria só */
.ge-ed-grupo{font-size:14px;color:var(--muted);margin:6px 0 18px}
.ge-ed-grupo b{color:var(--ink)}
.ge-volta{margin-top:26px;padding-top:18px;border-top:1px solid var(--line)}
.ge-volta a{font-family:var(--disp);font-weight:700;font-size:15px;color:var(--teal);text-decoration:none}
.ge-volta a:hover{color:var(--red)}
/* Campo-armadilha do formulário do jornalista: escondido de gente (inclusive de
leitor de tela, pelo aria-hidden no HTML) e visível para robô de spam. */
.ge-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
/* Perguntas que levam a Soluções, abaixo do explicativo (painel e modal) */
.ge-ganchos{margin-top:22px;padding:16px 18px;background:var(--surface-2);border-left:3px solid var(--teal);border-radius:10px}
.ge-ganchos-tit{font-family:var(--disp);font-weight:800;font-size:12px;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);margin:0 0 10px}
.ge-ganchos ul{list-style:none;margin:0;padding:0}
.ge-ganchos li+li{margin-top:9px}
.ge-ganchos a{font-family:var(--disp);font-weight:700;font-size:16px;line-height:1.35;color:var(--ink);text-decoration:none}
.ge-ganchos a::after{content:" →";color:var(--teal)}
.ge-ganchos a:hover{color:var(--teal)}