/*
 * Tema MU Invasion - LAYOUT CLASSICO (classico.php).
 * Estilo de site antigo de MU: fundo escuro, topo com arte, barra de menu cinza clara,
 * menu a esquerda em botoes, caixas brancas com barra de titulo escura e links laranja.
 * Carregado DEPOIS do muinvasion.css: aqui so' o que muda para o fundo claro.
 */

:root {
	--cl-largura: 980px;
	--cl-fundo: #101214;
	--cl-cinza: #8d9399;          /* fundo atras das caixas */
	--cl-borda: #6b7076;
	--cl-barra-1: #5f646a;        /* barra de titulo das caixas */
	--cl-barra-2: #383c41;
	--cl-link: #d35400;           /* links laranja */
	--cl-link-2: #a84300;
	--cl-texto: #222;
	--cl-fonte: Verdana, Tahoma, Arial, sans-serif;
}

html { min-width: 0 !important; }
body.cl-body {
	margin: 0;
	background: radial-gradient(1100px 520px at 50% 0, #232a31, transparent 72%), var(--cl-fundo) !important;
	color: #d8dde2;
	font-family: var(--cl-fonte);
	font-size: 12px;
	line-height: 1.45;
}
body.cl-body a { color: var(--cl-link); }
body.cl-body a:hover, body.cl-body a:focus { color: var(--cl-link-2); }

.cl-previa {
	position: sticky; top: 0; z-index: 2000;
	padding: 5px 10px; text-align: center;
	background: #ffd82c; color: #222; font-size: 12px;
}
.cl-previa a { color: #7a1f00 !important; font-weight: 700; }

/* ---------------- estrutura ---------------- */
.cl-site {
	width: var(--cl-largura); max-width: 100%;
	margin: 0 auto;
	background: var(--cl-cinza);
	box-shadow: 0 0 40px rgba(0, 0, 0, .75);
}
.cl-topo {
	position: relative;
	height: 318px;
	background: #1b2229 no-repeat center center / cover;
}
.cl-topo-link { position: absolute; inset: 0; }
.cl-slogan {
	position: absolute; left: 0; right: 0; bottom: 14px;
	text-align: center; pointer-events: none;
	font-family: Georgia, 'Times New Roman', serif; font-size: 13px; letter-spacing: 2px; text-transform: uppercase;
	color: #e9f1f8; text-shadow: 0 0 6px #000, 0 0 12px #000;
}
.cl-online {
	position: absolute; right: 10px; top: 10px;
	padding: 3px 9px; border-radius: 3px;
	background: rgba(0, 0, 0, .55); color: #fff; font-size: 11px;
	pointer-events: none;
}
.cl-online b { color: #8fe0ff; }

/* barra de menu do topo */
.cl-menu {
	background: linear-gradient(180deg, #f7f7f7 0%, #e1e1e1 55%, #cbcbcb 100%);
	border-top: 1px solid #fff;
	border-bottom: 1px solid #6f6f6f;
}
.cl-menu ul { display: flex; margin: 0; padding: 0; list-style: none; }
.cl-menu li { flex: 1 1 auto; }
.cl-menu li a {
	display: block; padding: 0 6px;
	line-height: 30px; text-align: center; white-space: nowrap;
	font-size: 11px; font-weight: 700; color: #262626 !important; text-decoration: none !important;
	border-left: 1px solid #fbfbfb; border-right: 1px solid #b4b4b4;
}
.cl-menu li:first-child a { border-left: 0; }
.cl-menu li:last-child a { border-right: 0; }
.cl-menu li a:hover, .cl-menu li.ativo a {
	background: linear-gradient(180deg, #ffffff, #ececec);
	color: #000 !important;
}
.cl-menu li.ativo a { box-shadow: inset 0 -2px 0 var(--cl-link); }
.cl-menu-abre { display: none; }

.cl-meio { display: flex; align-items: stretch; gap: 8px; padding: 8px; }
.cl-lateral { flex: 0 0 196px; width: 196px; }
.cl-conteudo { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; }
.cl-conteudo > .cl-rodape-links { margin-top: auto; }

/* ---------------- coluna da esquerda ---------------- */
.cl-botoes { margin: 0 0 6px; padding: 0; list-style: none; }
.cl-botoes li { margin: 0 0 3px; }
.cl-botoes li a {
	position: relative; display: flex; align-items: center; gap: 6px;
	padding: 5px 8px 5px 24px;
	font-size: 11px; font-weight: 700; color: #222 !important; text-decoration: none !important;
	background: linear-gradient(180deg, #ffffff 0%, #ececec 60%, #d6d6d6 100%);
	border: 1px solid #4b4f53;
	box-shadow: inset 0 0 0 1px #fff;
}
.cl-botoes li a::before {
	content: ''; position: absolute; left: 8px; top: 50%;
	width: 9px; height: 9px; margin-top: -5px; border-radius: 50%;
	background: radial-gradient(circle at 35% 35%, #ffffff, #9aa0a6 70%);
	border: 1px solid #7d8287;
}
.cl-botoes li a:hover, .cl-botoes li.ativo a { background: linear-gradient(180deg, #ffffff, #f4f4f4); color: #000 !important; }
.cl-botoes li.ativo a::before { background: radial-gradient(circle at 35% 35%, #ffd9b8, var(--cl-link) 70%); border-color: var(--cl-link-2); }
.cl-botoes li a svg { width: 13px; height: 13px; flex: 0 0 13px; color: #555; }
.cl-s-whatsapp a svg { color: #1a9e4b; }
.cl-s-discord a svg { color: #5865f2; }
.cl-s-instagram a svg { color: #c13584; }
.cl-s-facebook a svg { color: #1877f2; }
.cl-s-youtube a svg { color: #e62117; }

.cl-painel { margin: 0 0 6px; border: 1px solid #1e2226; background: #2b3036; }
.cl-painel-titulo {
	padding: 5px 9px;
	background: linear-gradient(180deg, #fff1dc, #fbdcb2);
	border-bottom: 1px solid #c9965a;
	color: #7a3b00; font-size: 11px; font-weight: 700;
}
.cl-painel-ola { display: flex; align-items: center; gap: 8px; padding: 7px 8px; background: #1f2327; border-bottom: 1px solid #3a4046; }
.cl-painel-foto { flex: 0 0 26px; width: 26px; height: 26px; border-radius: 50%; border: 2px solid #d8dde2; display: inline-flex; align-items: center; justify-content: center; color: #d8dde2; }
.cl-painel-foto svg { width: 15px; height: 15px; }
.cl-painel-nome { flex: 1; min-width: 0; color: #fff; font-size: 11px; line-height: 1.25; }
.cl-painel-nome small { display: block; color: #8a939c; font-size: 10px; }
.cl-painel-sair { color: #d8dde2 !important; font-size: 14px; text-decoration: none !important; }
.cl-painel-sair:hover { color: #ff8a5c !important; }
.cl-painel-saldos { display: flex; flex-wrap: wrap; gap: 3px; padding: 6px 8px; border-bottom: 1px solid #3a4046; }
.cl-painel-saldos span { flex: 1 1 45%; display: flex; justify-content: space-between; gap: 4px; padding: 2px 5px; background: #23272c; border: 1px solid #3a4046; font-size: 10px; color: #c8ced4; }
.cl-painel-saldos i { font-style: normal; }
.cl-painel-saldos b { color: #ffcf7a; }
.cl-painel-menu ul { margin: 0; padding: 0; list-style: none; }
.cl-painel-menu li { display: flex; align-items: center; gap: 6px; padding: 0 8px; border-bottom: 1px solid #3a4046; }
.cl-painel-menu li img { width: 12px; height: 12px; opacity: .75; filter: grayscale(1) brightness(1.8); }
.cl-painel-menu li a { display: block; flex: 1; padding: 5px 0; color: #e6eaee !important; font-size: 11px; text-decoration: none !important; }
.cl-painel-menu li a::before { content: '\203A\00a0'; color: #7d858d; }
.cl-painel-menu li:hover { background: #343a41; }
.cl-painel-menu li:last-child { border-bottom: 0; }

.cl-login { padding: 8px; }
.cl-login input {
	display: block; width: 100%; margin: 0 0 5px; padding: 4px 6px;
	font-size: 11px; color: #222; background: #fff; border: 1px solid #111; border-radius: 0;
}
.cl-login button {
	display: block; width: 100%; padding: 4px;
	font-size: 11px; font-weight: 700; color: #222;
	background: linear-gradient(180deg, #ffffff, #d4d4d4); border: 1px solid #111; cursor: pointer;
}
.cl-login button:hover { background: linear-gradient(180deg, #fff3e6, #f6c89c); }
.cl-login-links { margin-top: 6px; text-align: center; font-size: 10px; color: #6d757c; }
.cl-login-links a { color: #ffcf9a !important; }

.cl-banners a { display: block; margin: 0 0 6px; text-decoration: none !important; }
.cl-banners img { display: block; width: 100%; height: auto; border: 1px solid #1e2226; }
.cl-voto, .cl-web {
	display: flex !important; flex-direction: column; align-items: center; gap: 1px;
	padding: 9px 6px; text-align: center; border: 1px solid #1e2226;
}
.cl-voto { background: linear-gradient(180deg, #3b2c06, #171002); box-shadow: inset 0 0 0 1px #b37b15; }
.cl-voto b { color: #ffd82c; font-size: 12px; letter-spacing: 1px; }
.cl-voto span { color: #fff; font-size: 22px; font-weight: 700; line-height: 1.1; text-shadow: 0 0 8px rgba(255, 216, 44, .7); }
.cl-voto small, .cl-web small { color: #d9c28a; font-size: 10px; }
.cl-web { background: linear-gradient(180deg, #0f3a52, #07182a); box-shadow: inset 0 0 0 1px #3aa0d8; color: #fff !important; }
.cl-web svg { width: 22px; height: 22px; color: #8fe0ff; }
.cl-web b { color: #fff; font-size: 12px; }
.cl-web small { color: #9cc9e0; }

.cl-status { padding: 12px 8px; background: linear-gradient(180deg, #2a2f35, #1c2024); border: 1px solid #111; text-align: center; color: #fff; font-size: 11px; }
.cl-status div { margin: 2px 0; }
.cl-status i { font-style: normal; font-weight: 700; }
.cl-on { color: #3ee06a; }
.cl-off { color: #ff5a5a; }
.cl-cinza { color: #9aa0a6; }
.cl-status-num { color: #b8c0c8; }
.cl-status-num b { color: #8fe0ff; }

/* ---------------- caixas brancas ---------------- */
.cl-caixa { margin: 0 0 8px; background: #fff; border: 1px solid var(--cl-borda); }
.cl-caixa-titulo, .cl-modulo .page-title span {
	position: relative; display: block;
	margin: 0; padding: 6px 10px 6px 26px;
	font-family: var(--cl-fonte); font-size: 11px; font-weight: 700; letter-spacing: 0; text-transform: none; text-align: left;
	color: #fff; text-shadow: none;
	background: linear-gradient(180deg, var(--cl-barra-1), var(--cl-barra-2));
	border: 0; border-bottom: 1px solid #25282b; border-radius: 0; box-shadow: none;
}
.cl-caixa-titulo::before, .cl-modulo .page-title span::before {
	content: ''; position: absolute; left: 10px; top: 50%; right: auto;
	width: 8px; height: 8px; margin-top: -4px; transform: none;
	background: #fff; border: 1px solid #9aa0a6; box-shadow: inset 0 0 0 2px var(--cl-barra-2);
}
.cl-modulo .page-title span::after { display: none; }
.cl-titulo-trofeu::before { background: #ffcc33; border-color: #b8860b; box-shadow: none; border-radius: 2px; }
.cl-caixa-corpo { padding: 10px; }
.cl-modulo .cl-caixa-corpo { padding: 0 10px 12px; }
.cl-modulo .page-title { margin: 0 -10px 12px !important; text-align: left !important; }
.cl-modulo .cl-caixa-corpo > :first-child:not(.page-title) { margin-top: 10px; }
.cl-vazio { margin: 6px 0; text-align: center; color: #666; font-style: italic; }
.cl-mais { display: block; margin-top: 6px; text-align: right; font-size: 10px; }
.cl-aviso { margin: 8px 0 0; padding: 3px; text-align: center; font-size: 10px; color: #333; background: #f1f2f3; border: 1px solid #dcdfe2; }

/* banner grande */
.cl-banner { position: relative; margin: 0 0 8px; background: #000; border: 1px solid var(--cl-borda); }
.cl-banner-item { display: none; }
.cl-banner-item.ativo { display: block; animation: cl-aparece .6s ease; }
.cl-banner-item img { display: block; width: 100%; height: 240px; object-fit: cover; }
.cl-banner-pontos { position: absolute; right: 8px; bottom: 7px; display: flex; gap: 5px; }
.cl-banner-pontos button { width: 10px; height: 10px; padding: 0; border-radius: 50%; border: 1px solid #fff; background: rgba(0, 0, 0, .45); cursor: pointer; }
.cl-banner-pontos button.ativo { background: #fff; }
@keyframes cl-aparece { from { opacity: .2; } to { opacity: 1; } }

/* classificacao (abas + top 5) */
.cl-abas { display: flex; flex-wrap: wrap; justify-content: center; gap: 3px; margin: 0 0 10px; }
.cl-abas button {
	padding: 3px 8px; font-family: var(--cl-fonte); font-size: 10px; color: #666;
	background: #fff; border: 1px solid #c3c7cb; border-radius: 0; cursor: pointer;
}
.cl-abas button:hover { color: var(--cl-link); border-color: #e0a070; }
.cl-abas button.ativo { color: var(--cl-link); border-color: var(--cl-link); background: #fff6ee; font-weight: 700; }
.cl-aba-painel { display: none; }
.cl-aba-painel.ativo { display: block; }
.cl-top5 { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 6px; }
.cl-top5-card { padding: 4px 4px 6px; text-align: center; background: #f3f4f5; border: 1px solid #cfd3d6; }
.cl-top5-nome { padding: 2px 0 5px; font-size: 10.5px; font-weight: 700; color: #333; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cl-top5-nome span { color: var(--cl-link); }
.cl-top5-nome a { color: #333 !important; }
.cl-top5-nome img.mi-fig { max-height: 14px; }
.cl-top5-foto { display: flex; align-items: center; justify-content: center; }
.cl-top5-foto img, .cl-top5-foto canvas, .cl-top5-foto table { width: 86px !important; height: 86px !important; object-fit: cover; border: 1px solid #8d9399; background: #222; image-rendering: auto; }
.cl-top5-valor { margin-top: 4px; font-size: 10px; color: #555; }
.cl-top5-valor b { color: #b3261e; }

/* ultimas noticias */
.cl-noticias-lista { margin: 0; padding: 0; list-style: none; }
.cl-noticias-lista li { margin: 0 0 4px; padding: 7px 8px; background: #fafafa; border: 1px solid #e3e5e7; }
.cl-noticias-lista li a { font-size: 11.5px; text-decoration: underline; }

.cl-campeoes .mi-campeoes { margin: 0; }

/* rodape */
.cl-rodape-links { padding: 16px 0 6px; text-align: center; font-size: 10px; color: #fff; }
.cl-rodape-links a { color: #fff !important; }
.cl-rodape-links a:hover { text-decoration: underline; }
.cl-rodape-links span { margin: 0 6px; opacity: .6; }
.cl-creditos { width: var(--cl-largura); max-width: 100%; margin: 6px auto 30px; padding: 0 4px; font-size: 10px; color: #6e757c; }
.cl-creditos p { margin: 2px 0; }
.cl-creditos time { color: #9aa3ab; }
.cl-sep { margin: 0 6px; opacity: .6; }
.cl-creditos .webengine-powered, .cl-creditos a { color: #6e757c !important; }

/* ---------------- conteudo dos modulos no fundo branco ---------------- */
.cl-caixa-corpo {
	--mi-texto: #222; --mi-texto-2: #666; --mi-borda: #cfd3d6;
	--mi-painel: #f6f7f8; --mi-painel-2: #f3f4f5; --mi-lilas: #333; --mi-neon: #a84300; --mi-rosa: #b3261e;
	--mi-roxo: #d35400; --mi-roxo-rgb: 211, 84, 0; --mi-neon-rgb: 211, 84, 0; --mi-magenta: #e67e22; --mi-magenta-rgb: 230, 126, 34;
	color: var(--cl-texto);
}
.cl-caixa-corpo h1, .cl-caixa-corpo h2:not(.cl-caixa-titulo), .cl-caixa-corpo h3, .cl-caixa-corpo h4, .cl-caixa-corpo h5 { color: #222; }
.cl-caixa-corpo p, .cl-caixa-corpo li, .cl-caixa-corpo td, .cl-caixa-corpo th, .cl-caixa-corpo label { color: inherit; }
.cl-caixa-corpo .form-control { background: #fff !important; border: 1px solid #a9afb5 !important; color: #222 !important; border-radius: 0; box-shadow: inset 0 1px 2px rgba(0, 0, 0, .08); }
.cl-caixa-corpo .form-control:focus { border-color: var(--cl-link) !important; box-shadow: 0 0 0 2px rgba(211, 84, 0, .18) !important; }
.cl-caixa-corpo .form-control::placeholder { color: #999; }
.cl-caixa-corpo select.form-control option { background: #fff; color: #222; }
.cl-caixa-corpo .control-label { color: #333; }
.cl-caixa-corpo .help-block { color: #666; }
.cl-caixa-corpo .panel, .cl-caixa-corpo .well, .cl-caixa-corpo .list-group-item, .cl-caixa-corpo .thumbnail { background: #fafbfb; border: 1px solid #d5d8db; color: #222; }
.cl-caixa-corpo .panel-heading { background: linear-gradient(180deg, var(--cl-barra-1), var(--cl-barra-2)) !important; border-color: #25282b !important; color: #fff !important; }
.cl-caixa-corpo .panel-title { color: #fff; }
.cl-caixa-corpo .panel-footer { background: #f1f2f3; border-color: #d5d8db; color: #555; }
.cl-caixa-corpo .table > thead > tr > th, .cl-caixa-corpo .table > tbody > tr > td, .cl-caixa-corpo .table > tbody > tr > th, .cl-caixa-corpo .table > thead > tr > td { border-color: #dcdfe2 !important; color: #222; }
.cl-caixa-corpo .table-bordered { border-color: #dcdfe2 !important; }
.cl-caixa-corpo .table-striped > tbody > tr:nth-of-type(odd) { background: #f5f6f7; }
.cl-caixa-corpo .table-hover > tbody > tr:hover { background: #fff3e8; }
body.cl-body .btn-primary {
	background: linear-gradient(180deg, #4b5056, #1d2024) !important; border: 1px solid #0e0f11 !important;
	color: #fff !important; font-weight: 700; box-shadow: none; border-radius: 2px;
}
body.cl-body .btn-primary:hover, body.cl-body .btn-primary:focus { background: linear-gradient(180deg, #e67e22, #b34700) !important; border-color: #7a2f00 !important; }
.cl-caixa-corpo .btn-default { background: linear-gradient(180deg, #fff, #e3e3e3); border-color: #a9afb5; color: #222; }
.cl-caixa-corpo .pagination > li > a, .cl-caixa-corpo .pagination > li > span { background: #fff; border-color: #cfd3d6; color: var(--cl-link); }
.cl-caixa-corpo .pagination > .active > a, .cl-caixa-corpo .pagination > .active > span { background: var(--cl-link) !important; border-color: var(--cl-link-2) !important; color: #fff; }
.cl-caixa-corpo .module-requirements { color: #666; }

/* noticias do WebEngine, rankings, secoes (info/vip/eventos/guias) */
.cl-caixa-corpo .mi-noticia { background: #fafafa; border-color: #e3e5e7; border-left-color: var(--cl-link); color: #222 !important; }
.cl-caixa-corpo .mi-noticia:hover { background: #fff6ee; }
.cl-caixa-corpo .mi-quadro { background: #fafbfb; border-color: #d5d8db; box-shadow: none; }
.cl-caixa-corpo .mi-quadro h3 { color: #222; text-shadow: none; font-family: var(--cl-fonte); font-size: 12px; }
.cl-caixa-corpo .mi-tabela th { color: #fff; background: var(--cl-barra-2); border-color: #25282b; }
.cl-caixa-corpo .mi-tabela td { border-color: #e3e5e7; }
.cl-caixa-corpo .rankings_menu a { background: #f6f6f6 !important; border-color: #c3c7cb !important; color: #555 !important; border-radius: 0; }
.cl-caixa-corpo .rankings_menu a.active, .cl-caixa-corpo .rankings_menu a:hover { color: var(--cl-link) !important; border-color: var(--cl-link) !important; background: #fff6ee !important; box-shadow: none; }
.cl-caixa-corpo .rankings-table { width: 100%; }
.cl-caixa-corpo .rankings-table tr:first-child td { color: #fff !important; background: var(--cl-barra-2); border-bottom-color: #25282b !important; font-size: 11px !important; font-weight: 700; }
.cl-caixa-corpo .rankings-table tr td { font-size: 12px !important; border-color: #e3e5e7 !important; color: #222; }
.cl-caixa-corpo .rankings-table tr:nth-child(even) td { background: #f6f7f8; }
.cl-caixa-corpo .mi-rank-titulo { color: #222; text-shadow: none; font-family: var(--cl-fonte); font-size: 15px; }
.cl-caixa-corpo .mi-rank-vazio { background: #f6f7f8; color: #666; }
.cl-caixa-corpo .mi-rank-patente { color: #a84300; }
.cl-caixa-corpo .mi-secao { background: #fff; border: 1px solid #cfd3d6; }
.cl-caixa-corpo .mi-secao h3 { background: linear-gradient(180deg, var(--cl-barra-1), var(--cl-barra-2)); border-bottom-color: #25282b; color: #fff; font-family: var(--cl-fonte); font-size: 11px; }
.cl-caixa-corpo .mi-secao table th { color: #333; background: #eef0f2; }
.cl-caixa-corpo .mi-secao table td { border-color: #e3e5e7; }
.cl-caixa-corpo .mi-secao table td, .cl-caixa-corpo .mi-secao table th { padding: 4px 8px; font-size: 11.5px; }
.cl-caixa-corpo .mi-secao .mi-secao-corpo, .cl-caixa-corpo .mi-intro { font-size: 12px; }
.cl-caixa-corpo .mi-secao table tr:nth-child(even) td { background: #f7f8f9; }
.cl-caixa-corpo .mi-secao table td b { color: #111; }
.cl-caixa-corpo .mi-intro { background: #f7f8f9; border-color: #dcdfe2; border-left-color: var(--cl-link); }
.cl-caixa-corpo .mi-guia-card { background: linear-gradient(180deg, #ffffff, #eef0f2); border-color: #cfd3d6; color: #222 !important; }
.cl-caixa-corpo .mi-guia-card strong { color: #222; font-family: var(--cl-fonte); font-size: 12px; }
.cl-caixa-corpo .mi-guia-card span { color: #666; }
.cl-caixa-corpo .mi-guia-card:hover { border-color: var(--cl-link); box-shadow: none; }
.cl-caixa-corpo .mi-dica { background: #fff6ee; border-color: #e8b07a; }
.cl-caixa-corpo code.mi-cmd, .cl-caixa-corpo .mi-cmd { background: #f1f3f5; border-color: #cfd3d6; color: #a84300; }
.cl-caixa-corpo .mi-tecla { background: linear-gradient(180deg, #fff, #dcdcdc); border-color: #8d9399; color: #222; }
.cl-caixa-corpo .mi-rec-caixa { background: #f7f8f9; border-color: #cfd3d6; color: #222; }
.cl-caixa-corpo .mi-rec-ok { background: #fff8e8; border-color: #e0b14b; }
.cl-caixa-corpo .mi-rec-ok b, .cl-caixa-corpo .mi-rec-conta { color: #a84300; }
.cl-caixa-corpo .mi-rec-ok small, .cl-caixa-corpo .mi-rec-nota { color: #555; }
.cl-caixa-corpo .mi-avatar-card { background: #f7f8f9; border-color: #cfd3d6; }
.cl-caixa-corpo .mi-avatar-dados b { color: #222; }
.cl-caixa-corpo .mi-avatar-regras, .cl-caixa-corpo .mi-carteira-nota { color: #555; }
.cl-caixa-corpo .mi-carteira-extrato th { color: #fff; background: var(--cl-barra-2); }
.cl-caixa-corpo .mi-carteira-extrato td { border-color: #e3e5e7; }

/* Informacoes: tabela "rotulo | valor" com o rotulo a direita (como nos sites classicos) */
.cl-pag-info #servidor table { border: 1px solid #cfd3d6; }
.cl-pag-info #servidor td { padding: 4px 8px; font-size: 11px; }
.cl-pag-info #servidor td:first-child { width: 42%; text-align: right; }

/* downloads em cartoes (como a pagina de downloads dos sites classicos) */
.cl-caixa-corpo .panel-downloads { background: #fff; border: 0; box-shadow: none; }
.cl-caixa-corpo .panel-downloads .panel-body { padding: 0; }
.cl-caixa-corpo .panel-downloads .panel-title {
	margin: 0 0 8px; padding: 7px 10px; font-size: 11px; font-weight: 700; color: #333;
	background: #f3f4f5; border: 1px solid #dcdfe2;
}
.cl-caixa-corpo .panel-downloads table, .cl-caixa-corpo .panel-downloads tbody { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 8px; width: 100%; margin: 0 0 14px; }
.cl-caixa-corpo .panel-downloads tbody { margin: 0; grid-column: 1 / -1; }
.cl-caixa-corpo .panel-downloads tr { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 14px 10px; background: #fafbfb; border: 1px solid #dcdfe2; text-align: center; }
.cl-caixa-corpo .panel-downloads tr:first-child { border: 2px solid #e67e22; background: #fffaf5; }
.cl-caixa-corpo .panel-downloads td { display: block; width: auto !important; padding: 0 !important; border: 0 !important; }
.cl-caixa-corpo .panel-downloads .mi-dl-info { flex-direction: column; gap: 6px; font-weight: 700; font-size: 12px; }
.cl-caixa-corpo .panel-downloads .mi-dl-plat { width: 54px; height: 54px; flex-basis: 54px; }
.cl-caixa-corpo .panel-downloads .mi-dl-plat svg { width: 32px; height: 32px; }
.cl-caixa-corpo .panel-downloads .mi-dl-info > div { line-height: 1.4; }
.cl-caixa-corpo .panel-downloads .mi-dl-tag { display: table; margin: 0 auto 4px; }
.cl-caixa-corpo .panel-downloads .download-description { display: block; margin-top: 3px; font-weight: 400; color: #666; font-size: 11px; line-height: 1.35; }
.cl-caixa-corpo .panel-downloads .mi-dl-btn { padding: 5px 14px; font-size: 11px; }

/* ---------------- celular / tela estreita ---------------- */
@media (max-width: 991px) {
	.cl-topo { height: 32vw; min-height: 150px; }
	.cl-slogan { font-size: 10px; bottom: 6px; }
	.cl-menu-abre {
		display: block; width: 100%; padding: 7px 10px; text-align: left;
		font-size: 12px; font-weight: 700; color: #222; background: transparent; border: 0;
	}
	.cl-menu ul { display: none; flex-direction: column; }
	.cl-menu.aberto ul { display: flex; }
	.cl-menu li a { text-align: left; padding: 0 12px; border: 0; border-top: 1px solid #d0d0d0; }
	.cl-meio { flex-direction: column; }
	.cl-lateral { order: 2; flex-basis: auto; width: 100%; }
	.cl-conteudo { order: 1; width: 100%; }
	.cl-banners { display: grid; grid-template-columns: repeat(2, 1fr); gap: 6px; }
	.cl-banners a { margin: 0; }
	.cl-top5 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.cl-banner-item img { height: 42vw; }
}
@media (max-width: 480px) {
	.cl-top5 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
