.spc {
	--spc-azul: #2b5797;
	--spc-seta: #00a0e3;
	--spc-cols: var(--spc-cols-max, 3);
	--spc-gap: 1.75rem;
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
	box-sizing: border-box;
}

.spc *,
.spc *::before,
.spc *::after {
	box-sizing: border-box;
}

@media (max-width: 960px) {
	.spc { --spc-cols: min(var(--spc-cols-max, 3), 2); }
}

@media (max-width: 600px) {
	.spc { --spc-cols: 1; }
}

/* Filtros: sempre numa só linha (deslizam na horizontal se não couberem) */
.spc-filtros {
	display: flex;
	flex-wrap: nowrap;
	gap: .5rem;
	margin: 0 0 1.25rem;
	padding: .25rem;
	overflow-x: auto;
	scrollbar-width: thin;
}

.spc-filtros::before,
.spc-filtros::after {
	content: "";
	margin: auto;
}

.spc .spc-filtro {
	flex: 0 0 auto;
	appearance: none;
	border: 1px solid #cfe0f1;
	background: #fff;
	color: var(--spc-azul);
	padding: .55rem 1.1rem;
	border-radius: 999px;
	font: inherit;
	font-weight: 600;
	line-height: 1.2;
	white-space: nowrap;
	cursor: pointer;
	transition: background-color .15s, color .15s, border-color .15s;
}

.spc .spc-filtro:hover {
	background: #eef5fc;
}

.spc .spc-filtro.is-active {
	background: var(--spc-azul);
	border-color: var(--spc-azul);
	color: #fff;
}

.spc .spc-filtro:focus-visible {
	outline: 3px solid #7fb7ea;
	outline-offset: 2px;
}

/* Carrossel: uma única linha de cartões, com setas */
.spc-carrossel {
	position: relative;
	padding: 0 2.75rem;
}

.spc-grelha {
	position: relative;
	display: flex;
	flex-wrap: nowrap;
	gap: var(--spc-gap);
	padding: 1rem .5rem 2rem;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scroll-behavior: smooth;
	scrollbar-width: none;
}

.spc-grelha::-webkit-scrollbar { display: none; }

.spc-grelha:focus-visible {
	outline: 3px solid #7fb7ea;
	outline-offset: 2px;
}

.spc .spc-seta {
	position: absolute;
	top: 50%;
	z-index: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 2.25rem;
	height: 2.25rem;
	margin-top: -1.1rem;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: transparent;
	color: var(--spc-seta);
	cursor: pointer;
	transition: opacity .15s, background-color .15s;
}

.spc .spc-seta:hover:not(:disabled) { background: #eaf6fd; }
.spc .spc-seta:focus-visible { outline: 3px solid #7fb7ea; }
.spc .spc-seta:disabled { opacity: .25; cursor: default; }
.spc .spc-seta--prev { left: 0; }
.spc .spc-seta--next { right: 0; }
.spc .spc-seta svg { display: block; }

.spc.spc--sem-scroll .spc-carrossel { padding: 0; }
.spc.spc--sem-scroll .spc-seta { display: none; }
.spc.spc--sem-scroll .spc-grelha { justify-content: center; }

/* Cartão */
.spc .spc-card {
	--spc-cor: #2b5797;
	flex: 0 0 calc((100% - (var(--spc-cols) - 1) * var(--spc-gap)) / var(--spc-cols));
	min-width: 0;
	scroll-snap-align: start;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	background: #fff;
	border-radius: 6px;
	padding: 2rem 1.5rem 1.5rem;
	box-shadow: 0 6px 24px rgba(30, 70, 120, .10);
}

.spc .spc-card[hidden] { display: none; }

.spc .spc-card[data-programa~="prr"]           { --spc-cor: #3cb08a; }
.spc .spc-card[data-programa~="centro-2020"]   { --spc-cor: #f28c00; }
.spc .spc-card[data-programa~="portugal-2020"] { --spc-cor: #d9363e; }
.spc .spc-card[data-programa~="portugal-2030"] { --spc-cor: #5bb6ea; }
.spc .spc-card[data-programa~="2030-lisboa"]   { --spc-cor: #7a4fb5; }

.spc .spc-icon {
	display: block;
	color: var(--spc-cor);
	line-height: 0;
	margin-bottom: 1rem;
}

.spc .spc-programa {
	margin: 0 0 .3rem;
	font-size: .75rem;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: #6b7c93;
}

.spc .spc-title {
	margin: 0 0 1rem;
	font-size: 1.05rem;
	font-style: italic;
	font-weight: 400;
	line-height: 1.35;
	color: #4a5f7a;
}

.spc .spc-codigo {
	margin: -.5rem 0 1rem;
	font-size: .75rem;
	color: #8a98ab;
	word-break: break-all;
}

.spc .spc-btn {
	display: inline-block;
	padding: .5rem .25rem;
	color: var(--spc-azul);
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .02em;
	text-decoration: none;
	border-bottom: 2px solid transparent;
}

.spc .spc-btn:hover,
.spc .spc-btn:focus-visible {
	border-bottom-color: currentColor;
}

.spc .spc-btn--off {
	color: #9aa7b8;
	cursor: default;
}

.spc .spc-btn--off:hover { border-bottom-color: transparent; }

/* Barras de logótipos de cima: discretas, numa só linha, todas à mesma altura */
.spc-barras {
	--g: 1.5rem;
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	justify-content: center;
	gap: var(--g);
	width: 100%;
	max-width: 900px;
	margin: 0 auto 1.5rem;
}

/* --r = proporção largura/altura da imagem: com flex-grow proporcional, todas ficam com a mesma altura */
.spc .spc-barra {
	display: block;
	flex: var(--r, 10) 1 0%;
	min-width: 0;
	max-width: calc(var(--r, 10) * 26px);
	height: auto;
	margin: 0;
	object-fit: contain;
	transition: filter .35s ease, opacity .35s ease;
}

.spc .spc-barra.is-apagada {
	filter: grayscale(1);
	opacity: .4;
}

@media (max-width: 640px) {
	.spc-barras {
		--g: .6rem;
		margin-bottom: 1rem;
	}
}

/* Rodapé do cartão: barra do programa + botão, alinhados em baixo */
.spc .spc-card-pie {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: .75rem;
	width: 100%;
	margin-top: auto;
	padding-top: .5rem;
}

.spc .spc-card-barra {
	display: block;
	width: 100%;
	max-width: 300px;
	height: auto;
	margin: 0;
}

@media (prefers-reduced-motion: reduce) {
	.spc .spc-barra { transition: none; }
}

.spc .screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

@media (prefers-reduced-motion: reduce) {
	.spc-grelha { scroll-behavior: auto; }
}