/**
 * Ecossistema: estilos do mapa, dos cards e da versão em texto.
 * Tudo sob .ecossistema e com prefixo ecossistema-, para não colidir com Astra,
 * Elementor ou WooCommerce. Cores e fontes vêm de variáveis CSS (página Aparência).
 * Linguagem visual do Design System v1.0: cantos quase retos (3px), DM Sans 700
 * nos controles, Anton nos títulos, foco com contorno de 3px.
 */

.ecossistema {
	--ecossistema-raio: 3px;
	--ecossistema-raio-card: 5px;
	--ecossistema-sombra: 0 20px 60px rgba(6, 0, 21, .16);
	/* Destaque (asterisco e botão Reorganizar): brand-pink com texto branco, por escolha da Casa. */
	--ecossistema-destaque: #FF006F;
	--ecossistema-destaque-texto: #FFFFFF;
	--ecossistema-asterisco: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg%3E%3Crect x='10' y='0' width='4' height='24'/%3E%3Crect x='10' y='0' width='4' height='24' transform='rotate(45 12 12)'/%3E%3Crect x='10' y='0' width='4' height='24' transform='rotate(90 12 12)'/%3E%3Crect x='10' y='0' width='4' height='24' transform='rotate(135 12 12)'/%3E%3C/g%3E%3C/svg%3E");
	position: relative;
	box-sizing: border-box;
	/* O mapa ocupa toda a largura disponível; textos, barra e lista ficam na largura de leitura. */
	width: 100%;
	max-width: none;
	margin: 0;
	padding: 43px 0 42px;
	/* A seção inteira usa o fundo do mapa (Aparência > Fundo do mapa), sem faixas de outra cor. */
	background: var(--ecossistema-fundo);
	color: var(--ecossistema-texto);
	font-family: var(--ecossistema-fonte-texto);
	font-size: 16px;
	line-height: 1.45;
}
.ecossistema *, .ecossistema *::before, .ecossistema *::after { box-sizing: border-box; }
.ecossistema [hidden] { display: none !important; }
.ecossistema > :not(.ecossistema__mapa),
.ecossistema__mapa > :not(.ecossistema__palco) {
	/* Mesma largura e margem do cabeçalho do Identidade (1296px com 32px de respiro). */
	max-width: 1296px;
	margin-left: auto;
	margin-right: auto;
	padding-left: 32px;
	padding-right: 32px;
}
@media (max-width: 680px) {
	.ecossistema > :not(.ecossistema__mapa),
	.ecossistema__mapa > :not(.ecossistema__palco) { padding-left: 20px; padding-right: 20px; }
}

/* Topo */
.ecossistema__topo { margin-bottom: 24px; }
.ecossistema__topo > * { max-width: 760px; }
.ecossistema .ecossistema__titulo {
	margin: 0 0 8px;
	color: var(--ecossistema-texto);
	font-family: var(--ecossistema-fonte-titulo);
	font-size: clamp(40px, 6vw, 86px);
	font-weight: 400;
	line-height: 1.02;
	letter-spacing: -0.02em;
	text-transform: none;
}
.ecossistema .ecossistema__intro { margin: 0; color: var(--ecossistema-suave); font-size: 17px; line-height: 1.35; }
/* Instrução do mapa: caixa alta, preta, com asterisco geométrico de 8 pontas na cor de destaque. */
.ecossistema .ecossistema__intro--mapa {
	color: var(--ecossistema-texto);
	font-size: 20px;
	font-weight: 700;
	letter-spacing: .02em;
	text-transform: uppercase;
}
.ecossistema .ecossistema__intro--mapa::before {
	content: "";
	/* Altura exata das maiúsculas (cap height), apoiado na linha de base do texto. */
	display: inline-block;
	width: .7em;
	height: .7em;
	width: 1cap;
	height: 1cap;
	margin-right: .45em;
	vertical-align: baseline;
	background: var(--ecossistema-destaque);
	-webkit-mask: var(--ecossistema-asterisco) center / contain no-repeat;
	mask: var(--ecossistema-asterisco) center / contain no-repeat;
}
.ecossistema__vazio { color: var(--ecossistema-suave); }
.ecossistema.is-mapa .ecossistema__intro--lista,
.ecossistema:not(.is-mapa) .ecossistema__intro--mapa { display: none; }
.ecossistema .ecossistema-lista__capa { margin: 0 0 12px; color: var(--ecossistema-texto); font-size: 16px; line-height: 1.4; }
.ecossistema .ecossistema-lista__capa-acao { margin: 0 0 12px; }

/* Botões genéricos: zera estilos do tema antes de aplicar os nossos */
/* :where() mantém a especificidade baixa (0,1,0): as regras abaixo (0,2,0) sobrepõem o reset. */
.ecossistema :where(button.ecossistema-chip, button.ecossistema-controle, button.ecossistema-no,
	button.ecossistema-card__fechar, button.ecossistema-card__mais, button.ecossistema-card__conexao) {
	all: unset;
	box-sizing: border-box;
	cursor: pointer;
	font-family: var(--ecossistema-fonte-texto);
	-webkit-tap-highlight-color: transparent;
}
.ecossistema button:focus-visible,
.ecossistema a:focus-visible,
.ecossistema summary:focus-visible {
	outline: 3px solid var(--ecossistema-foco);
	outline-offset: 3px;
}

/* Barra: legenda (filtro por unidade) e controles */
.ecossistema__barra {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	gap: 12px 20px;
	margin-bottom: 12px;
}
.ecossistema__legenda, .ecossistema__controles { display: flex; flex-wrap: wrap; gap: 8px; }

.ecossistema .ecossistema-chip {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 36px;
	padding: 6px 12px;
	border: 1px solid var(--ecossistema-linha);
	border-radius: var(--ecossistema-raio);
	background: var(--ecossistema-painel);
	color: var(--ecossistema-texto);
	font-size: 14px;
	font-weight: 700;
	line-height: 1.2;
	text-decoration: none;
	transition: border-color .15s, background .15s;
}
.ecossistema .ecossistema-chip:hover { border-color: var(--chip-cor, var(--ecossistema-texto)); }
.ecossistema .ecossistema-chip[aria-pressed="true"] { background: var(--chip-cor); border-color: var(--chip-cor); color: #fff; }
.ecossistema .ecossistema-chip[aria-pressed="true"] .ecossistema-chip__marca { background: currentColor; }
.ecossistema-chip__marca { width: 10px; height: 10px; border-radius: 2px; background: var(--chip-cor, var(--ecossistema-linha)); flex: none; }

.ecossistema .ecossistema-controle {
	display: inline-flex;
	align-items: center;
	min-height: 36px;
	padding: 6px 14px;
	border-radius: var(--ecossistema-raio);
	background: var(--ecossistema-texto);
	color: var(--ecossistema-fundo);
	font-size: 13px;
	font-weight: 700;
	transition: opacity .15s;
}
.ecossistema .ecossistema-controle:hover { opacity: .85; }
.ecossistema .ecossistema-controle[data-acao="reorganizar"] { background: var(--ecossistema-destaque); color: var(--ecossistema-destaque-texto); }

/* Palco */
.ecossistema__palco {
	position: relative;
	height: var(--ecossistema-altura, 720px);
	overflow: hidden;
	background-color: var(--ecossistema-fundo);
	touch-action: none;
	user-select: none;
	-webkit-user-select: none;
}
.ecossistema__linhas { position: absolute; inset: 0; display: block; pointer-events: none; }
.ecossistema__nos { position: absolute; inset: 0; }

/* Nós */
.ecossistema .ecossistema-no {
	position: absolute;
	left: 0;
	top: 0;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	max-width: 280px;
	padding: 7px 11px;
	border: 1px solid var(--ecossistema-linha);
	border-radius: var(--ecossistema-raio);
	background: var(--ecossistema-painel);
	color: var(--ecossistema-texto);
	font-size: var(--ecossistema-fonte-p, 12px);
	font-weight: 700;
	line-height: 1.15;
	letter-spacing: -0.01em;
	white-space: nowrap;
	cursor: grab;
	will-change: transform;
	transition: opacity .2s, border-color .15s, box-shadow .15s, background .15s;
	touch-action: none;
}
.ecossistema .ecossistema-no:hover,
.ecossistema .ecossistema-no:focus-visible { border-color: var(--no-cor, var(--ecossistema-texto)); box-shadow: 0 6px 18px rgba(6, 0, 21, .12); z-index: 3; }
.ecossistema .ecossistema-no--m { padding: 9px 13px; font-size: var(--ecossistema-fonte-m, 14px); border-width: 1.5px; border-color: var(--no-cor, var(--ecossistema-linha)); }
.ecossistema .ecossistema-no--g {
	padding: 12px 18px 11px;
	border: 0;
	background: var(--no-cor, var(--ecossistema-texto));
	color: var(--no-cor-texto, var(--ecossistema-fundo));
	font-family: var(--ecossistema-fonte-titulo);
	font-size: var(--ecossistema-fonte-g, 26px);
	font-weight: 400;
	letter-spacing: 0;
	line-height: 1;
	text-transform: uppercase;
	z-index: 2;
}
.ecossistema .ecossistema-no--g .ecossistema-no__marcas { display: none; }
/* Acentos em maiúsculas (ESTÚDIO, CAFÉ) passam da altura da linha: não cortar. */
.ecossistema .ecossistema-no--g .ecossistema-no__rotulo { overflow: visible; line-height: 1.2; padding-top: .08em; }
.ecossistema-no__rotulo { overflow: hidden; text-overflow: ellipsis; }
.ecossistema-no__marcas { display: inline-flex; gap: 3px; flex: none; }
.ecossistema-no__marcas span { display: block; width: 7px; height: 7px; border-radius: 1.5px; }

.ecossistema .ecossistema-no.is-arrastando { cursor: grabbing; box-shadow: 0 14px 30px rgba(6, 0, 21, .22); z-index: 5; }
.ecossistema.is-arrastando, .ecossistema.is-arrastando * { cursor: grabbing; }
.ecossistema.tem-destaque .ecossistema-no:not(.is-ativo) { opacity: .28; }
.ecossistema .ecossistema-no.is-selecionado { box-shadow: 0 0 0 3px var(--ecossistema-fundo), 0 0 0 5px var(--no-cor, var(--ecossistema-texto)); z-index: 4; }

/* Card */
.ecossistema-card {
	position: absolute;
	top: 16px;
	right: 16px;
	z-index: 10;
	width: min(360px, calc(100% - 32px));
	max-height: calc(100% - 32px);
	overflow: auto;
	padding: 22px 22px 20px;
	border-top: 6px solid var(--card-cor, var(--ecossistema-linha));
	border-radius: var(--ecossistema-raio-card);
	background: var(--ecossistema-painel);
	box-shadow: var(--ecossistema-sombra);
	color: var(--ecossistema-texto);
	cursor: auto;
	user-select: text;
	-webkit-user-select: text;
	animation: ecossistema-entrar .2s ease-out;
}
.ecossistema-card:focus { outline: none; }
.ecossistema-card:focus-visible { outline: 3px solid var(--ecossistema-foco); outline-offset: 2px; }
@keyframes ecossistema-entrar { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }

.ecossistema .ecossistema-card__fechar {
	position: absolute;
	top: 10px;
	right: 10px;
	display: grid;
	place-items: center;
	width: 36px;
	height: 36px;
	border-radius: var(--ecossistema-raio);
	color: var(--ecossistema-suave);
	font-size: 26px;
	line-height: 1;
}
.ecossistema .ecossistema-card__fechar:hover { color: var(--ecossistema-texto); background: rgba(6, 0, 21, .06); }

.ecossistema .ecossistema-card__unidades { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 40px 12px 0; }
.ecossistema-card__unidade { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 700; color: var(--ecossistema-suave); text-transform: uppercase; letter-spacing: .04em; }
.ecossistema-card__unidade::before { content: ""; width: 9px; height: 9px; border-radius: 2px; background: var(--chip-cor); }
.ecossistema .ecossistema-card__titulo {
	margin: 0 40px 8px 0;
	color: var(--ecossistema-texto);
	font-family: var(--ecossistema-fonte-titulo);
	font-size: 34px;
	font-weight: 400;
	line-height: 1.05;
	letter-spacing: -0.01em;
	text-transform: none;
}
.ecossistema .ecossistema-card__resumo { margin: 0 0 10px; font-size: 17px; font-weight: 700; line-height: 1.3; }
.ecossistema .ecossistema-card__texto { margin: 0 0 12px; color: var(--ecossistema-texto); font-size: 16px; line-height: 1.45; }
.ecossistema .ecossistema-card__longo { margin: 0 0 12px; font-size: 15px; line-height: 1.5; }
.ecossistema .ecossistema-card__longo > :first-child { margin-top: 0; }
.ecossistema .ecossistema-card__longo p { margin: 0 0 10px; }
.ecossistema .ecossistema-card__mais { margin: 0 0 14px; color: var(--ecossistema-texto); font-size: 14px; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.ecossistema .ecossistema-card__conexoes { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 18px; padding-top: 14px; border-top: 1px solid var(--ecossistema-linha); }
.ecossistema-card__conexoes-rotulo { width: 100%; color: var(--ecossistema-suave); font-size: 13px; }
.ecossistema .ecossistema-card__conexao { padding: 4px 9px; border: 1px solid var(--ecossistema-linha); border-radius: var(--ecossistema-raio); font-size: 13px; font-weight: 700; color: var(--ecossistema-texto); }
.ecossistema .ecossistema-card__conexao:hover { border-color: var(--ecossistema-texto); }

/* Botão (Design System: .cl-button) */
.ecossistema a.ecossistema-botao,
.ecossistema a.ecossistema-botao:visited {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 18px;
	min-height: 46px;
	padding: 12px 22px;
	border: 1px solid transparent;
	border-radius: var(--ecossistema-raio);
	background: var(--ecossistema-botao);
	color: var(--ecossistema-botao-texto);
	font: 700 14px/1.3 var(--ecossistema-fonte-texto);
	text-decoration: none;
	transition: transform .18s, filter .18s;
}
.ecossistema a.ecossistema-botao:hover { color: var(--ecossistema-botao-texto); filter: brightness(.88); transform: translateY(-2px); }
.ecossistema-botao__seta { font-size: 18px; font-weight: 400; }
.lii-icone.ecossistema-botao__seta { font-size: inherit; vertical-align: 0; }
.ecossistema a.ecossistema-botao:has(.lii-icone) { gap: .7em; }

.ecossistema__aviso { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* Enquanto o script do mapa carrega: palco com a altura final, lista recolhida e o apito enchendo. */
.ecossistema.is-carregando .ecossistema__mapa[hidden] { display: block !important; }
.ecossistema.is-carregando .ecossistema__barra { visibility: hidden; }
.ecossistema.is-carregando .ecossistema-lista { display: none; }
.ecossistema.is-carregando .ecossistema-lista__alternar[open] > summary::before { content: "+"; }

/* Apito da Casa (vetor do original, 1 KB) usado como máscara: base translúcida e cor subindo de baixo. */
.ecossistema__apito {
	--apito-cor: var(--ecossistema-texto);
	position: absolute;
	left: 50%;
	top: 50%;
	z-index: 1;
	display: none;
	width: 36px;
	height: 98px;
	margin: -49px 0 0 -18px;
	pointer-events: none;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='255 0 295 799'%3E%3Cpath transform='translate(0 799) scale(.1 -.1)' d='M3122 7953 c-38 -15 -50 -160 -43 -525 2 -72 -56 -68 875 -68 l835 0 15 22 c27 38 23 501 -4 546 l-20 32 -822 -1 c-453 0 -829 -3 -836 -6z M2715 7043 c-93 -24 -90 4 -91 -888 -7 -4218 -7 -4245 24 -4293 36 -55 -30 -52 1304 -51 1309 1 1281 1 1309 39 16 21 30 4567 15 5075 -1 58 -25 101 -62 115 -26 10 -2460 12 -2499 3z m1435 -3344 c154 -75 358 -369 477 -689 19 -52 48 -124 63 -160 28 -64 118 -373 127 -438 6 -41 -11 -76 -44 -91 -33 -15 -1537 -16 -1580 -1 -72 26 -66 164 16 395 16 44 36 103 44 130 29 94 77 228 86 239 5 6 23 46 40 89 74 186 255 421 406 527 81 56 248 56 365 -1z M2909 1432 c-22 -19 -22 -23 -22 -206 0 -247 -14 -231 208 -231 210 0 210 0 210 -136 0 -108 15 -129 92 -129 33 0 50 -6 68 -25 l25 -24 0 -305 c0 -303 0 -305 22 -326 22 -20 29 -21 461 -18 l439 3 25 29 25 29 -2 281 c-1 155 -2 289 -1 298 2 36 38 58 91 58 81 0 100 26 100 133 0 131 1 132 192 132 228 0 218 -11 218 236 0 167 0 170 -25 194 l-24 25 -1039 0 c-997 0 -1041 -1 -1063 -18z'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='255 0 295 799'%3E%3Cpath transform='translate(0 799) scale(.1 -.1)' d='M3122 7953 c-38 -15 -50 -160 -43 -525 2 -72 -56 -68 875 -68 l835 0 15 22 c27 38 23 501 -4 546 l-20 32 -822 -1 c-453 0 -829 -3 -836 -6z M2715 7043 c-93 -24 -90 4 -91 -888 -7 -4218 -7 -4245 24 -4293 36 -55 -30 -52 1304 -51 1309 1 1281 1 1309 39 16 21 30 4567 15 5075 -1 58 -25 101 -62 115 -26 10 -2460 12 -2499 3z m1435 -3344 c154 -75 358 -369 477 -689 19 -52 48 -124 63 -160 28 -64 118 -373 127 -438 6 -41 -11 -76 -44 -91 -33 -15 -1537 -16 -1580 -1 -72 26 -66 164 16 395 16 44 36 103 44 130 29 94 77 228 86 239 5 6 23 46 40 89 74 186 255 421 406 527 81 56 248 56 365 -1z M2909 1432 c-22 -19 -22 -23 -22 -206 0 -247 -14 -231 208 -231 210 0 210 0 210 -136 0 -108 15 -129 92 -129 33 0 50 -6 68 -25 l25 -24 0 -305 c0 -303 0 -305 22 -326 22 -20 29 -21 461 -18 l439 3 25 29 25 29 -2 281 c-1 155 -2 289 -1 298 2 36 38 58 91 58 81 0 100 26 100 133 0 131 1 132 192 132 228 0 218 -11 218 236 0 167 0 170 -25 194 l-24 25 -1039 0 c-997 0 -1041 -1 -1063 -18z'/%3E%3C/svg%3E") center / contain no-repeat;
}
.ecossistema__apito::before,
.ecossistema__apito::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; background: var(--apito-cor); }
.ecossistema__apito::before { top: 0; opacity: .14; }
/* Enchimento só com transform/opacity (escala vertical a partir da base). */
.ecossistema__apito::after { top: 0; transform: scaleY(0); transform-origin: 50% 100%; animation: ecossistema-apito-encher 1.5s cubic-bezier(.45, 0, .25, 1) infinite; }
/* 1.7.0: o apito aparece desde o primeiro quadro (palco reservado) e continua enquanto o mapa carrega. */
.ecossistema.is-espera .ecossistema__apito,
.ecossistema.is-carregando .ecossistema__apito { display: block; }
/* Mapa pronto: o apito termina de encher e sai, e os nós nascem dele. */
.ecossistema.is-apito-saindo .ecossistema__apito { display: block; animation: ecossistema-apito-sair .5s cubic-bezier(.3, 0, .2, 1) forwards; }
.ecossistema.is-apito-saindo .ecossistema__apito::after { transform: none; opacity: 1; animation: none; transition: transform .2s; }
@keyframes ecossistema-apito-surgir { from { opacity: 0; } }
@keyframes ecossistema-apito-encher { 0% { transform: scaleY(0); opacity: 1; } 65%, 85% { transform: scaleY(1); opacity: 1; } 100% { transform: scaleY(1); opacity: 0; } }
@keyframes ecossistema-apito-sair { 40% { opacity: 1; transform: none; } 100% { opacity: 0; transform: scale(1.35); } }

/* Entrada do mapa: nós surgem em ondas (grandes primeiro) enquanto a física os leva às regiões. */
.ecossistema.is-entrando .ecossistema-no { animation: ecossistema-no-surgir .7s cubic-bezier(.2, .8, .2, 1) var(--atraso, 0s) backwards; }
/* 1.11.3: as linhas nascem uma a uma no canvas, depois dos dois nós da ponta (não mais um fade geral). */
.ecossistema.is-entrando .ecossistema__linhas { animation: none; }
.ecossistema.is-entrando .ecossistema__barra { animation: ecossistema-apito-surgir .6s .5s ease-out backwards; }
@keyframes ecossistema-no-surgir { from { opacity: 0; scale: .6; } }
@media (prefers-reduced-motion: reduce) {
	.ecossistema__apito::after { transform: none; animation: none; }
	.ecossistema.is-carregando .ecossistema__apito,
	.ecossistema.is-entrando .ecossistema-no,
	.ecossistema.is-entrando .ecossistema__linhas,
	.ecossistema.is-entrando .ecossistema__barra { animation: none; }
	.ecossistema.is-apito-saindo .ecossistema__apito { display: none; }
}

/* Sob demanda (1.5.0): até o mapa carregar, palco reservado na altura final, parado, com o fundo do mapa. */
.ecossistema.is-espera .ecossistema__mapa[hidden] { display: block !important; }
.ecossistema.is-espera .ecossistema__barra { visibility: hidden; }
.ecossistema.is-espera .ecossistema-lista { display: none; }
.ecossistema.is-espera .ecossistema-lista__alternar[open] > summary::before { content: "+"; }
/* Âncora #ecossistema: sem JavaScript, o cabeçalho fixo não cobre o começo do mapa (carregar.js ajusta a margem). */
.ecossistema__ancora { display: block; height: 0; scroll-margin-top: var(--ecossistema-ancora-margem, 88px); }
.ecossistema__palco:focus { outline: none; }
.ecossistema__palco:focus-visible { outline: 3px solid var(--ecossistema-foco); outline-offset: -3px; }

/* Hero da Início (classe ecossistema-hero nas Colunas): textos alinhados pelo topo e o botão
   "Quero mergulhar" (classe ecossistema-hero__acao) na base da coluna da direita, na linha da base do título. */
.wp-block-columns.ecossistema-hero { align-items: stretch !important; }
.ecossistema-hero > .wp-block-column { align-self: flex-start; }
.ecossistema-hero > .wp-block-column:last-child { display: flex; flex-direction: column; align-self: stretch; }
/* Base do botão na linha de base do título (digitando.css: clamp(40px, 5.6vw, 80px); a base fica ~0,095em acima
   do fim do bloco). Recuo à esquerda igual ao do parágrafo. */
.ecossistema-hero .wp-block-buttons.ecossistema-hero__acao {
	margin: auto 0 calc(clamp(40px, 5.6vw, 80px) * .095) var(--wp--preset--spacing--60);
	padding-top: 16px;
}
.ecossistema-hero .ecossistema-hero__acao .wp-block-button__link {
	display: inline-block;
	border-color: #060015;
	background-color: #060015;
	color: #F3F4F6;
}
/* Hover só com cores da paleta: o fundo continua preto profundo e o texto fica amarelo. */
.ecossistema-hero .ecossistema-hero__acao .wp-block-button__link:hover,
.ecossistema-hero .ecossistema-hero__acao .wp-block-button__link:focus-visible {
	border-color: #060015;
	background-color: #060015;
	color: #FEBC0F;
}
.ecossistema-hero .ecossistema-hero__acao .wp-block-button__link:focus-visible {
	outline: 2px solid #060015;
	outline-offset: 3px;
}
@media (max-width: 781px) {
	.ecossistema-hero .wp-block-buttons.ecossistema-hero__acao { margin-top: 0; margin-bottom: 0; padding-top: 24px; }
}

/* Versão em texto */
.ecossistema-lista__alternar { margin-top: 20px; }
.ecossistema-lista__alternar > summary {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 36px;
	cursor: pointer;
	color: var(--ecossistema-texto);
	font-size: 14px;
	font-weight: 700;
	list-style: none;
}
.ecossistema-lista__alternar > summary::-webkit-details-marker { display: none; }
.ecossistema-lista__alternar > summary::before { content: "+"; display: inline-grid; place-items: center; width: 22px; height: 22px; border: 1px solid var(--ecossistema-linha); border-radius: var(--ecossistema-raio); font-weight: 400; }
.ecossistema-lista__alternar[open] > summary::before { content: "–"; }
.ecossistema-lista { padding-top: 12px; }
.ecossistema .ecossistema-lista__atalhos { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 20px; padding: 0; list-style: none; }
.ecossistema .ecossistema-lista__atalhos li { margin: 0; }
.ecossistema.is-mapa .ecossistema-lista__atalhos { display: none; }
/* Desktop: Escola e Estúdio em cima (2 colunas), Café, Hub e Espaço Cultural embaixo (3 colunas). */
.ecossistema-lista { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 32px 24px; }
.ecossistema-lista__unidade { grid-column: span 2; }
.ecossistema-lista__unidade:nth-of-type(-n+2) { grid-column: span 3; }
@media (max-width: 1100px) {
	.ecossistema-lista { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.ecossistema-lista__unidade, .ecossistema-lista__unidade:nth-of-type(-n+2) { grid-column: auto; }
	/* Número ímpar de unidades: a última ocupa a linha toda, sem metade vazia (1.7.1). */
	.ecossistema-lista__unidade:last-of-type:nth-of-type(odd) { grid-column: 1 / -1; }
}
.ecossistema-lista__atalhos { grid-column: 1 / -1; }
.ecossistema-lista__unidade { scroll-margin-top: 90px; }
.ecossistema .ecossistema-lista__titulo {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0 0 8px;
	padding-bottom: 8px;
	border-bottom: 3px solid var(--unidade-cor);
	color: var(--ecossistema-texto);
	font-family: var(--ecossistema-fonte-titulo);
	font-size: 26px;
	font-weight: 400;
	line-height: 1.1;
	text-transform: uppercase;
}
.ecossistema .ecossistema-lista__itens { margin: 0; padding: 0; list-style: none; }
.ecossistema .ecossistema-lista__item { display: grid; margin: 0; padding: 10px 0; border-bottom: 1px solid var(--ecossistema-linha); color: var(--ecossistema-texto); }
.ecossistema-lista__nome { font-size: 15px; font-weight: 700; line-height: 1.3; }
.ecossistema-lista__item--g .ecossistema-lista__nome { font-size: 17px; }
/* Texto do item: aberto por padrão (sem JavaScript); recolhido pela altura da linha do grid (0fr <-> 1fr). */
.ecossistema .ecossistema-lista__texto { display: grid; grid-template-rows: 1fr; transition: grid-template-rows .25s ease; }
.ecossistema .ecossistema-lista__descricao { min-height: 0; overflow: hidden; margin: 0; padding-top: 2px; color: var(--ecossistema-suave); font-size: 14px; line-height: 1.4; }
.ecossistema.is-lista-js[data-lista-textos="recolhidos"]:not(.is-lista-pronta) .ecossistema-lista__texto,
.ecossistema .ecossistema-lista__item.is-recolhivel:not(.is-aberto) .ecossistema-lista__texto {
	grid-template-rows: 0fr;
	visibility: hidden;
	transition: grid-template-rows .25s ease, visibility 0s linear .25s;
}
.ecossistema a.ecossistema-lista__acao { justify-self: start; margin-top: 4px; font-size: 13px; font-weight: 700; color: var(--ecossistema-texto); text-decoration: none; }
.ecossistema a.ecossistema-lista__acao:hover { text-decoration: underline; text-underline-offset: 3px; }
.ecossistema-lista__oculto { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
/* Título que abre e fecha o texto, com o +/– do "Ver o ecossistema em lista". */
.ecossistema .ecossistema-lista__abrir {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 12px;
	width: 100%;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: none;
	box-shadow: none;
	color: inherit;
	font: inherit;
	letter-spacing: normal;
	text-align: left;
	text-transform: none;
	cursor: pointer;
}
.ecossistema .ecossistema-lista__abrir::after {
	content: "+";
	flex: none;
	display: inline-grid;
	place-items: center;
	width: 22px;
	height: 22px;
	border: 1px solid var(--ecossistema-linha);
	border-radius: var(--ecossistema-raio);
	font-size: 14px;
	font-weight: 400;
	line-height: 1;
}
.ecossistema .ecossistema-lista__abrir[aria-expanded="true"]::after { content: "–"; }
.ecossistema .ecossistema-lista__abrir:hover .ecossistema-lista__nome { text-decoration: underline; text-underline-offset: 3px; }
.ecossistema .ecossistema-lista__abrir:hover,
.ecossistema .ecossistema-lista__abrir:focus { background: none; color: inherit; }
.ecossistema .ecossistema-lista__abrir:focus-visible,
.ecossistema .ecossistema-lista__todos:focus-visible { outline: 2px solid var(--ecossistema-foco); outline-offset: 2px; }
.ecossistema .ecossistema-lista__todos {
	margin: 0 0 8px;
	padding: 4px 0;
	border: 0;
	border-radius: 0;
	background: none;
	box-shadow: none;
	color: var(--ecossistema-suave);
	font: inherit;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: normal;
	text-transform: none;
	text-decoration: underline;
	text-underline-offset: 3px;
	cursor: pointer;
}
.ecossistema .ecossistema-lista__todos:hover,
.ecossistema .ecossistema-lista__todos:focus { background: none; color: var(--ecossistema-texto); }

/* Versão simplificada (a regra de largura é gerada pela página Aparência; esta é a padrão) */
@media (max-width: 680px) {
	.ecossistema { padding: 20px 16px 32px; }
	.ecossistema .ecossistema__intro { font-size: 16px; }
	.ecossistema .ecossistema__intro--mapa { font-size: 17px; }
}
.ecossistema:not(.is-mapa) .ecossistema-lista { grid-template-columns: 1fr; gap: 20px; padding-top: 0; }
.ecossistema:not(.is-mapa) .ecossistema-lista__unidade { grid-column: auto; }
.ecossistema:not(.is-mapa) .ecossistema-lista__alternar { margin-top: 0; }
.ecossistema:not(.is-mapa) .ecossistema-lista__atalhos { position: sticky; top: 0; z-index: 2; margin: 0 -16px 4px; padding: 10px 16px; background: var(--ecossistema-fundo); overflow-x: auto; flex-wrap: nowrap; }
.ecossistema:not(.is-mapa) .ecossistema-lista__unidade { padding: 16px; border-radius: var(--ecossistema-raio-card); background: var(--ecossistema-painel); border: 1px solid var(--ecossistema-linha); border-top: 6px solid var(--unidade-cor); }
.ecossistema:not(.is-mapa) .ecossistema-lista__titulo { border-bottom: 0; padding-bottom: 0; }
.ecossistema:not(.is-mapa) .ecossistema-lista__item:last-child { border-bottom: 0; }
.ecossistema:not(.is-mapa) .ecossistema-lista__item { padding: 12px 0; }
.ecossistema:not(.is-mapa) .ecossistema-lista__abrir { align-items: center; min-height: 44px; }
.ecossistema:not(.is-mapa) a.ecossistema-lista__acao { display: inline-flex; align-items: center; gap: .3em; min-height: 44px; margin-top: 0; color: var(--ecossistema-botao); }

@media (prefers-reduced-motion: reduce) {
	.ecossistema-card { animation: none; }
	.ecossistema .ecossistema-no, .ecossistema a.ecossistema-botao { transition: none; }
	.ecossistema .ecossistema-lista__texto,
	.ecossistema .ecossistema-lista__item.is-recolhivel:not(.is-aberto) .ecossistema-lista__texto { transition: none; }
}

/* Grupos (1.10.0): nó médio com contagem; os filhos brotam ao abrir. Contagem em DM Sans (fonte de texto). */
.ecossistema .ecossistema-no[hidden] { display: none; }
.ecossistema .ecossistema-no--grupo { gap: 7px; }
.ecossistema .ecossistema-no__contagem {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 1.6em;
	padding: 1px 6px;
	border-radius: 999px;
	background: var(--no-cor, var(--ecossistema-linha));
	color: var(--no-cor-texto, #fff);
	font-family: var(--ecossistema-fonte-texto);
	font-size: .8em;
	font-weight: 700;
	line-height: 1.4;
	font-variant-numeric: tabular-nums;
}
.ecossistema .ecossistema-no--grupo::after { content: "+"; font-family: var(--ecossistema-fonte-texto); font-weight: 700; opacity: .65; }
.ecossistema .ecossistema-no--grupo.is-aberto::after { content: "\2212"; }
.ecossistema .ecossistema-no--grupo.is-aberto { box-shadow: 0 0 0 3px color-mix(in srgb, var(--no-cor, #000) 22%, transparent); }
.ecossistema .ecossistema-no.is-brotando { animation: ecossistema-no-surgir .55s cubic-bezier(.2, .8, .2, 1) var(--atraso, 0s) backwards; }
.ecossistema .ecossistema-card__item { text-decoration: none; }
.ecossistema .ecossistema-lista__grupo {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 16px 0 2px;
	color: var(--ecossistema-suave);
	font-family: var(--ecossistema-fonte-texto);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
}
.ecossistema .ecossistema-lista__grupo-n {
	padding: 0 7px;
	border-radius: 999px;
	background: var(--unidade-cor);
	color: var(--unidade-texto, #fff);
	font-family: var(--ecossistema-fonte-texto);
	font-size: 12px;
	letter-spacing: 0;
	font-variant-numeric: tabular-nums;
}
@media (prefers-reduced-motion: reduce) {
	.ecossistema .ecossistema-no.is-brotando { animation: none; }
}
.ecossistema .ecossistema-controle[hidden] { display: none; }

/* Estações (1.11.0): botão +/− no canto do nó grande, no preto profundo do DS (texto #F3F4F6, foco e hover em #FEBC0F). */
.ecossistema .ecossistema-estacao-alternar {
	position: absolute;
	left: 0;
	top: 0;
	z-index: 4;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 2px;
	min-width: 26px;
	height: 26px;
	padding: 0 8px;
	border: 2px solid var(--ecossistema-painel, #fff);
	border-radius: 999px;
	background: #060015;
	color: #F3F4F6;
	font-family: var(--ecossistema-fonte-texto);
	font-size: 13px;
	font-weight: 700;
	line-height: 1;
	font-variant-numeric: tabular-nums;
	cursor: pointer;
	box-shadow: 0 2px 8px rgba(6, 0, 21, .22);
	will-change: transform;
}
.ecossistema .ecossistema-estacao-alternar:hover,
.ecossistema .ecossistema-estacao-alternar:focus-visible { color: #FEBC0F; }
.ecossistema .ecossistema-estacao-alternar:focus-visible { outline: 2px solid #060015; outline-offset: 2px; }
.ecossistema.is-entrando .ecossistema-estacao-alternar { animation: ecossistema-apito-surgir .6s .6s ease-out backwards; }
@media (prefers-reduced-motion: reduce) {
	.ecossistema.is-entrando .ecossistema-estacao-alternar { animation: none; }
}
/* Níveis (1.11.2): botão no extremo fica desabilitado. */
.ecossistema .ecossistema-controle[disabled] { opacity: .45; cursor: default; }
.ecossistema .ecossistema-controle--nivel span { font-family: var(--ecossistema-fonte-texto); font-weight: 700; }

/* 1.11.3: escala/deslocamento da cena (zoom-to-fit e cartão aberto) a partir do canto do palco. */
.ecossistema .ecossistema__nos { transform-origin: 0 0; }

/* 1.11.4: espaço entre o sinal e o texto dos botões de nível ("− Recolher", "+ Expandir"). */
.ecossistema .ecossistema-controle--nivel { gap: .4em; }
/* 1.11.4: botão principal do cartão antes de "Conectado a": respiro até a linha das conexões. */
.ecossistema .ecossistema-card .ecossistema-card__acao + .ecossistema-card__conexoes { margin-top: 18px; }

/* 1.11.5: cartão no lado oposto ao nó clicado (mesma entrada, sem slide). */
.ecossistema .ecossistema-card.ecossistema-card--esquerda { right: auto; left: 16px; }

/* 1.11.6: grupos da lista em texto recolhíveis (<details>/<summary>), com sinal +/−. */
.ecossistema .ecossistema-lista__grupo-det { margin: 0; }
.ecossistema .ecossistema-lista__grupo-det > summary { list-style: none; cursor: pointer; padding: 10px 0; border-bottom: 1px solid var(--ecossistema-linha); }
.ecossistema .ecossistema-lista__grupo-det > summary::-webkit-details-marker { display: none; }
.ecossistema .ecossistema-lista__grupo-det > summary:focus-visible { outline: 2px solid var(--ecossistema-foco, #060015); outline-offset: 2px; }
.ecossistema .ecossistema-lista__grupo-sinal { margin-left: auto; font-family: var(--ecossistema-fonte-texto); font-size: 18px; line-height: 1; color: var(--ecossistema-texto); }
.ecossistema .ecossistema-lista__grupo-sinal::before { content: "+"; }
.ecossistema .ecossistema-lista__grupo-det[open] > summary .ecossistema-lista__grupo-sinal::before { content: "\2212"; }
.ecossistema .ecossistema-lista__grupo-det[open] > summary { border-bottom-color: transparent; }
.ecossistema .ecossistema-lista__itens--grupo { padding-left: 12px; border-left: 2px solid var(--unidade-cor, var(--ecossistema-linha)); }
/* Até carregar.js preparar a lista, grupos já aparecem recolhidos (sem "pulo"); sem JS a classe não existe e tudo fica aberto. */
.ecossistema.is-lista-js:not(.is-lista-pronta)[data-lista-grupos="recolhidos"] .ecossistema-lista__grupo-det:not([data-aberto]) > ul,
.ecossistema.is-lista-js:not(.is-lista-pronta)[data-lista-grupos="recolhidos"] .ecossistema-lista__grupo-det:not([data-aberto]) > .ecossistema-lista__grupo-sobre { display: none; }

/* 1.12.0: texto e botão do grupo manual (ex.: Eventos) dentro do grupo na lista. */
.ecossistema .ecossistema-lista__grupo-sobre { padding: 6px 0 4px 12px; border-left: 2px solid var(--unidade-cor, var(--ecossistema-linha)); }