/* Topo e rodapé do clube: o mesmo arquivo vai no site do FSA Esporte Clube e na FSA Academy (plataforma Legacy),
   para quem passa de um para o outro continuar no mesmo site. Usa as variáveis da página: --cb-verde e --cb-escuro (cores fixas do topo e do rodapé, iguais no tema claro e no escuro),
   --yellow (Vermelho FSA), --accent-text (Ouro), --font-display, --font-body.
   Um topo só: escudo, menu com submenus (Futebol, O clube), um "Entrar" e um botão vermelho. */
.cb-wrap{max-width:1180px;margin:0 auto;padding-inline:20px}

/* Topo do clube (Verde FSA, escudo grande, menu em caixa alta, filete vermelho) */
.cb-topo{position:relative;z-index:30;background:var(--cb-verde,var(--blue));color:#fff;border-bottom:3px solid var(--yellow)}
.cb-topo::after{content:"";position:absolute;right:0;top:0;bottom:0;width:120px;pointer-events:none;background:repeating-linear-gradient(-45deg,rgba(255,255,255,.08) 0 10px,transparent 10px 22px)}
.cb-topo .cb-wrap{position:relative;z-index:1;display:flex;align-items:center;gap:22px;min-height:78px}
.cb-marca{display:flex;align-items:center;gap:12px;color:#fff;text-decoration:none;flex:none;align-self:stretch}
.cb-escudo{width:72px;height:auto;margin-bottom:-26px;align-self:flex-end;filter:drop-shadow(0 6px 10px rgba(0,0,0,.35))}
.cb-nome{display:grid;line-height:1}
.cb-nome strong{font:400 1.7rem/.95 var(--font-display);letter-spacing:.03em;text-transform:uppercase}
.cb-nome small{font:600 .6rem/1.5 var(--font-body);letter-spacing:.2em;text-transform:uppercase;opacity:.85;margin-top:3px}
.cb-menu{display:flex;align-items:center;gap:24px;margin-left:auto;align-self:stretch}
.cb-menu > a,.cb-sub-bt{color:#fff;text-decoration:none;font:800 .74rem/1 var(--font-body);letter-spacing:.14em;text-transform:uppercase;padding:8px 0;border:0;border-bottom:2px solid transparent;opacity:.92;white-space:nowrap;background:none;cursor:pointer;display:inline-flex;align-items:center;gap:6px}
.cb-menu > a:hover,.cb-menu > a[aria-current="page"],.cb-sub-bt:hover,.cb-sub.aberto .cb-sub-bt{opacity:1;border-color:var(--yellow)}
.cb-menu > a[aria-current="page"],.cb-sub-bt[aria-current="page"]{color:var(--accent-text,#E0A526)}
.cb-seta{width:14px;height:14px;transition:transform .15s}
.cb-ext{width:12px;height:12px;margin-left:6px;vertical-align:-1px;opacity:.75}
.cb-sub{position:relative;display:flex;align-items:center;align-self:stretch}
.cb-drop{display:none;position:absolute;top:100%;left:-18px;min-width:230px;background:#fff;border-top:3px solid var(--yellow);box-shadow:0 18px 40px -16px rgba(0,0,0,.45);padding:8px 0;z-index:40}
.cb-drop a{display:block;padding:11px 20px;color:var(--cb-verde,#274C33);text-decoration:none;font:700 .8rem/1.3 var(--font-body);letter-spacing:.04em}
.cb-drop a:hover,.cb-drop a:focus-visible{background:#F1F4F0;color:var(--yellow)}
.cb-sub.aberto .cb-drop{display:block}
.cb-sub.aberto .cb-seta{transform:rotate(180deg)}
@media (hover:hover) and (min-width:901px){.cb-sub:hover .cb-drop{display:block}.cb-sub:hover .cb-seta{transform:rotate(180deg)}}
.cb-entrar{display:inline-flex;align-items:center;gap:8px;color:#fff;text-decoration:none;font:800 .74rem/1 var(--font-body);letter-spacing:.14em;text-transform:uppercase;white-space:nowrap;min-height:44px;padding:0 4px;opacity:.95}
.cb-entrar svg{width:20px;height:20px}
.cb-entrar:hover,.cb-entrar[aria-current="page"]{opacity:1;color:var(--accent-text,#E0A526)}
.cb-cta{display:inline-flex;align-items:center;min-height:44px;padding:0 20px;background:var(--yellow);color:#fff;text-decoration:none;font:800 .76rem/1 var(--font-body);letter-spacing:.14em;text-transform:uppercase;border-radius:2px;white-space:nowrap}
.cb-cta:hover{filter:brightness(1.08)}
.cb-burger{display:none;margin-left:auto;width:46px;height:46px;border:1.5px solid rgba(255,255,255,.35);border-radius:2px;background:none;color:#fff;cursor:pointer;place-items:center}
.cb-burger svg{width:22px;height:22px}
.cb-voltar{display:none;margin-left:auto;color:#fff;text-decoration:none;font:800 .7rem/1 var(--font-body);letter-spacing:.12em;text-transform:uppercase;border:1.5px solid rgba(255,255,255,.4);padding:10px 12px;border-radius:2px;white-space:nowrap}
.cb-painel{position:absolute;left:0;right:0;top:100%;background:var(--cb-escuro,var(--blue-deep));border-top:3px solid var(--yellow);padding:8px 20px 20px;display:grid;box-shadow:0 24px 40px -20px rgba(0,0,0,.6)}
.cb-painel{max-height:calc(100vh - 70px);overflow-y:auto;padding-top:22px}
.cb-painel > a,.cb-pgrupo > a{color:#fff;text-decoration:none;font:800 .86rem/1 var(--font-body);letter-spacing:.12em;text-transform:uppercase;padding:16px 4px;border-bottom:1px solid rgba(255,255,255,.1)}
.cb-pgrupo{display:grid;border-bottom:1px solid rgba(255,255,255,.1);padding-bottom:6px}
.cb-pgrupo > span{font:800 .7rem/1 var(--font-body);letter-spacing:.22em;text-transform:uppercase;color:var(--accent-text,#E0A526);padding:18px 4px 6px}
.cb-pgrupo > a{text-transform:none;letter-spacing:.02em;font-weight:600;font-size:.98rem;padding:11px 4px 11px 14px;border:0}
.cb-painel a[aria-current="page"]{color:var(--accent-text,#E0A526)}
.cb-pacoes{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:16px}
.cb-pacoes a{justify-content:center;min-height:50px;border:1.5px solid rgba(255,255,255,.35);border-radius:2px}
.cb-pacoes a.cb-cta{border-color:transparent}
@media (max-width:1120px){.cb-menu{gap:16px}.cb-entrar span{display:none}}
@media (max-width:900px){.cb-menu,.cb-topo > .cb-wrap > .cb-cta,.cb-topo > .cb-wrap > .cb-entrar{display:none}.cb-burger{display:grid}.cb-escudo{width:58px;margin-bottom:-18px}.cb-nome strong{font-size:1.4rem}.cb-topo .cb-wrap{min-height:68px}.cb-pacoes .cb-entrar span{display:inline}}
@media (max-width:400px){.cb-nome small{display:none}.cb-escudo{width:52px}.cb-topo .cb-wrap{gap:12px}}
/* Topo do clube dentro de uma seção (FSA Academy): o botão vermelho e o "Entrar" ficam na faixa da seção;
   no celular, no lugar do menu, um botão "Site do clube" */
.cb-topo.cb-secao .cb-burger{display:none!important}
@media (max-width:900px){.cb-topo.cb-secao .cb-voltar{display:inline-flex}}
@media (max-width:420px){.cb-topo.cb-secao .cb-voltar{padding:9px 9px;font-size:.62rem;letter-spacing:.08em}.cb-topo.cb-secao .cb-nome strong{font-size:1.2rem}}

/* Rodapé do clube */
.cb-rodape{background:var(--cb-escuro,var(--blue-deep));color:rgba(255,255,255,.82);position:relative;overflow:hidden;font:400 .9rem/1.6 var(--font-body)}
.cb-rodape::before{content:"";position:absolute;left:0;top:0;bottom:0;width:160px;pointer-events:none;background:repeating-linear-gradient(-45deg,rgba(255,255,255,.05) 0 12px,transparent 12px 26px)}
.cb-rodape .cb-wrap{position:relative;padding-block:56px 26px}
.cb-rod-grade{display:grid;grid-template-columns:1.3fr repeat(4,minmax(0,1fr));gap:28px}
@media (max-width:980px){.cb-rod-grade{grid-template-columns:repeat(2,minmax(0,1fr))}.cb-rod-marca{grid-column:1/-1}}
@media (max-width:520px){.cb-rod-grade{grid-template-columns:1fr}}
.cb-rod-marca img{width:92px;height:auto}
.cb-rod-marca p{margin:14px 0 0;max-width:34ch;font-size:.86rem}
.cb-rod-redes{display:flex;gap:8px;margin-top:16px}
.cb-rod-redes a{width:38px;height:38px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.3);color:#fff;border-radius:2px}
.cb-rod-redes svg{width:18px;height:18px}
.cb-rodape h4{margin:0 0 12px;color:#fff;font:400 1.35rem/1 var(--font-display);letter-spacing:.04em;text-transform:uppercase}
.cb-rodape ul{list-style:none;margin:0;padding:0;display:grid;gap:7px}
.cb-rodape a{color:#fff;text-decoration:none;opacity:.85;overflow-wrap:anywhere}
.cb-rodape a:hover{opacity:1;text-decoration:underline}
.cb-rod-base{margin-top:36px;padding-top:18px;border-top:1px solid rgba(255,255,255,.14);display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px 24px;font-size:.78rem}
.cb-rod-base .cb-tags{font:400 1.5rem/1.1 "Kaushan Script",cursive;color:#fff;display:flex;gap:16px;flex-wrap:wrap}
.cb-rod-base a{opacity:.8;text-decoration:underline}
.cb-faixa{height:8px;background:linear-gradient(90deg,#0E8A5C 50%,var(--yellow) 50%)}

/* Faixa corrida com o nome do clube (como nos sites de clube) */
.cb-faixa-corrida{background:var(--yellow);color:#fff;overflow:hidden;white-space:nowrap;padding:12px 0;font:400 1.5rem/1 var(--font-display);letter-spacing:.08em;text-transform:uppercase}
.cb-faixa-corrida .cb-corre{display:inline-flex;gap:28px;padding-right:28px;animation:cb-corre 40s linear infinite}
.cb-faixa-corrida .cb-corre span::after{content:"◆";margin-left:28px;font-size:.7em;vertical-align:middle;opacity:.7}
@keyframes cb-corre{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion: reduce){.cb-faixa-corrida .cb-corre{animation:none}}
