/* Skin "Casos de Sucesso" do widget Publicações (Figma 879:13172) */

.elementor-posts.zcs .zcs-card {
	display: flex;
	flex-direction: column;
	gap: 24px;
}

/* ---------- Logotipo (imagem destacada) ---------- */

.elementor-posts.zcs .zcs-card__media {
	display: flex;
	align-items: center;
	justify-content: center;
	aspect-ratio: 411 / 300;
	border-radius: 10px;
	overflow: hidden;
	background: linear-gradient(180deg, rgba(245, 245, 245, .5) 0%, #f5f5f5 100%);
}

/* 337×146 dentro de 411×300 no Figma; contain para logótipos de outras proporções */
.elementor-posts.zcs .zcs-card__logo {
	width: 82%;
	height: 48.7%;
	object-fit: contain;
	transition: transform .4s cubic-bezier(.4, 0, .2, 1);
}

.elementor-posts.zcs .zcs-card:hover .zcs-card__logo {
	transform: scale(1.04);
}

/* ---------- Texto ---------- */

.elementor-posts.zcs .elementor-post__text {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 24px;
	flex-grow: 1;
}

.elementor-posts.zcs .elementor-post__title {
	margin: 0;
	font-family: Calibri, Carlito, sans-serif;
	font-size: 24px;
	font-weight: 700;
	line-height: 32px;
	text-transform: uppercase;
}

.elementor-posts.zcs .elementor-post__title a {
	font: inherit;
	background: var(--Gradiente-Black-to-Grey, linear-gradient(90deg, #111 0%, #676766 100%));
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	-webkit-text-fill-color: transparent;
}

.elementor-posts.zcs .elementor-post__excerpt,
.elementor-posts.zcs .elementor-post__excerpt p {
	margin: 0;
	font-family: Calibri, Carlito, sans-serif;
	font-size: 18px;
	line-height: 26px;
	color: #565655;
}

/* ---------- Ler mais ---------- */

.elementor-posts.zcs .zcs-card__more {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin-top: auto; /* alinha os botões em baixo quando os resumos têm alturas diferentes */
	font-family: Calibri, Carlito, sans-serif;
	font-size: 16px;
	line-height: 1;
	letter-spacing: .4px;
	text-transform: uppercase;
}

.elementor-posts.zcs .zcs-card__more span {
	background: linear-gradient(90deg, #049fb7 0%, #3fd1e6 100%);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	-webkit-text-fill-color: transparent;
}

.elementor-posts.zcs .zcs-card__more img {
	display: block;
	flex-shrink: 0;
	width: 17px;
	height: 17px;
	transition: transform .3s cubic-bezier(.4, 0, .2, 1);
}

.elementor-posts.zcs .zcs-card__more:hover img,
.elementor-posts.zcs .zcs-card__more:focus-visible img {
	transform: translate(3px, -3px);
}

.elementor-posts.zcs .zcs-card__more:focus-visible {
	outline: 3px solid #049fb7;
	outline-offset: 4px;
	border-radius: 2px;
}

/* ---------- Breakpoints do Elementor: 1024 / 767 ---------- */

@media (max-width: 1024px) {
	.elementor-posts.zcs .elementor-post__title {
		font-size: 22px;
		line-height: 30px;
	}
}

@media (max-width: 767px) {
	.elementor-posts.zcs .zcs-card,
	.elementor-posts.zcs .elementor-post__text {
		gap: 16px;
	}

	.elementor-posts.zcs .elementor-post__title {
		font-size: 20px;
		line-height: 28px;
	}

	.elementor-posts.zcs .elementor-post__excerpt,
	.elementor-posts.zcs .elementor-post__excerpt p {
		font-size: 16px;
		line-height: 24px;
	}
}

/* ==========================================================================
   Filtro por setor (Search & Filter, campo "Setor") — Figma 879:13226
   Mesmo aspeto do filtro da Documentação técnica (equipamentos.css).
   O campo leva a classe .zcs-filtro (definida no S&F); a lista abre num
   popup no <body>, que só tem a classe do campo: --id-1 = campo "Setor".
   ========================================================================== */

.search-filter-field.zcs-filtro {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 60px;
	margin: 0 0 40px;
	font-family: Calibri, Carlito, sans-serif;
}

.search-filter-field.zcs-filtro .search-filter-label {
	flex: 0 0 auto;
	width: auto;
	margin: 0;
	padding: 0;
	font-family: inherit;
	font-size: 18px;
	font-weight: 700;
	line-height: 26px;
	background: var(--Gradiente-Grey, linear-gradient(90deg, #565655 0%, #8a8a89 100%));
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
}

/* Botão */
.search-filter-field.zcs-filtro .search-filter-component-combobox-base {
	flex: 0 0 auto;
	width: 230px;
	max-width: 100%;
	margin: 0;
	padding: 0;
	background: #fff;
	border: 1px solid #555;
	border-radius: 10px;
	box-shadow: none;
	color: #555;
	cursor: pointer;
	transition: border-radius .25s ease;
}

.search-filter-field.zcs-filtro .search-filter-component-combobox-base:hover,
.search-filter-field.zcs-filtro .search-filter-component-combobox-base--focused {
	border-color: #555;
}

/* Aberto: cantos de baixo retos, a lista encaixa por baixo */
.search-filter-field.zcs-filtro .search-filter-component-combobox-base--listbox-attached.search-filter-component-combobox-base--listbox-position-bottom {
	border-bottom-color: #555;
	border-radius: 10px 10px 0 0;
}

.search-filter-field.zcs-filtro .search-filter-component-combobox-base--listbox-attached.search-filter-component-combobox-base--listbox-position-top {
	border-top-color: #555;
	border-radius: 0 0 10px 10px;
}

.search-filter-field.zcs-filtro .search-filter-component-combobox__actions .search-filter-component-combobox__selection,
.search-filter-field.zcs-filtro .search-filter-component-combobox__actions input.search-filter-component-combobox__actions-input {
	padding: 10px 0 10px 22px;
	color: #555;
	font-family: inherit;
	font-size: 16px;
	line-height: 1.4;
	cursor: pointer;
}

.search-filter-field.zcs-filtro .search-filter-component-combobox__selection-placeholder,
.search-filter-field.zcs-filtro .search-filter-component-combobox__actions-input::placeholder {
	color: #555;
	opacity: 1;
}

.search-filter-field.zcs-filtro .search-filter-component-combobox__actions input.search-filter-component-combobox__actions-input {
	min-height: 0;
	border: 0;
	background: transparent;
	box-shadow: none;
}

/* Só se escolhe da lista: sem cursor de texto nem contorno/sombra ao clicar */
.search-filter-field.zcs-filtro .search-filter-component-combobox__selection,
.search-filter-field.zcs-filtro .search-filter-component-combobox__actions input.search-filter-component-combobox__actions-input {
	-webkit-appearance: none;
	appearance: none;
	caret-color: transparent;
	user-select: none;
	cursor: pointer;
}

.search-filter-field.zcs-filtro .search-filter-component-combobox-base,
.search-filter-field.zcs-filtro .search-filter-component-combobox-base:focus-within,
.search-filter-field.zcs-filtro .search-filter-component-combobox__selection:focus,
.search-filter-field.zcs-filtro .search-filter-component-combobox__actions input.search-filter-component-combobox__actions-input:focus {
	outline: none;
	box-shadow: none !important;
}

/* "Todos" já limpa o filtro: sem botão X nem divisória */
.search-filter-field.zcs-filtro .search-filter-component-combobox__clear-selection,
.search-filter-field.zcs-filtro .search-filter-component-combobox__input-divider {
	display: none;
}

.search-filter-field.zcs-filtro .search-filter-component-combobox__listbox-toggle::before {
	content: none;
}

/* Seta */
.search-filter-field.zcs-filtro .search-filter-component-combobox__listbox-toggle {
	flex: 0 0 auto;
	padding: 0 22px 0 12px;
}

/* Seta igual à da Documentação técnica (14×8); o ícone do plugin fica escondido */
.search-filter-field.zcs-filtro .search-filter-component-combobox__listbox-toggle .search-filter-icon {
	width: 14px;
	height: 8px;
	padding: 0;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='8' viewBox='0 0 14 8' fill='none'%3E%3Cpath d='M1 1l6 6 6-6' stroke='%23555' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 14px 8px no-repeat;
	transition: transform .25s ease;
}

.search-filter-field.zcs-filtro .search-filter-component-combobox__listbox-toggle .search-filter-icon__svg {
	display: none;
}

.search-filter-field.zcs-filtro .search-filter-component-combobox-base--listbox-visible .search-filter-component-combobox__listbox-toggle .search-filter-icon {
	transform: rotate(180deg);
}

/* Lista (popup no <body>) */
.search-filter-field__popup--id-1.search-filter-component-combobox-base__listbox {
	max-height: 420px;
	padding: 6px 0;
	background: #fff;
	border: 1px solid #555;
	border-radius: 0 0 10px 10px;
	box-shadow: none;
	font-family: Calibri, Carlito, sans-serif;
}

.search-filter-field__popup--id-1.search-filter-component-combobox-base__listbox--attached.search-filter-component-popover--position-bottom {
	border-top: 0;
	border-radius: 0 0 10px 10px;
}

.search-filter-field__popup--id-1.search-filter-component-combobox-base__listbox--attached.search-filter-component-popover--position-top {
	border-bottom: 0;
	border-radius: 10px 10px 0 0;
}

.search-filter-field__popup--id-1 .search-filter-component-combobox-base__listbox-option {
	padding: 10px 22px;
	background: transparent;
	color: #555;
	font-size: 14px;
	line-height: 1.4;
	text-align: left;
	cursor: pointer;
}

.search-filter-field__popup--id-1 .search-filter-component-combobox-base__listbox-option:hover,
.search-filter-field__popup--id-1 .search-filter-component-combobox-base__listbox-option--active,
.search-filter-field__popup--id-1 .search-filter-component-combobox-base__listbox-option--active.search-filter-component-combobox-base__listbox-option--selected {
	background: #f5f5f5;
	color: #555;
}

.search-filter-field__popup--id-1 .search-filter-component-combobox-base__listbox-option--selected,
.search-filter-field__popup--id-1 .search-filter-component-combobox-base__listbox-option--selected:hover {
	color: #05bcd8;
	font-weight: 600;
}

@media (max-width: 767px) {
	.search-filter-field.zcs-filtro {
		flex-direction: column;
		align-items: flex-start;
		gap: 10px;
		margin-bottom: 20px;
	}

	.search-filter-field.zcs-filtro .search-filter-label {
		font-size: 15px;
	}

	.search-filter-field.zcs-filtro .search-filter-component-combobox-base {
		width: 100%;
	}

	.search-filter-field.zcs-filtro .search-filter-component-combobox__actions .search-filter-component-combobox__selection,
	.search-filter-field.zcs-filtro .search-filter-component-combobox__actions input.search-filter-component-combobox__actions-input {
		padding: 8px 0 8px 16px;
	}

	.search-filter-field.zcs-filtro .search-filter-component-combobox__listbox-toggle {
		padding-right: 16px;
	}

	.search-filter-field__popup--id-1 .search-filter-component-combobox-base__listbox-option {
		padding: 10px 16px;
	}
}

/* ==========================================================================
   Paginação (widget Publicações com a skin Casos de Sucesso) — Figma 879:13231
   Números em círculos de 40px com contorno em gradiente azul; página atual
   preenchida. Anterior/Seguinte = setas (texto fica para leitores de ecrã).
   ========================================================================== */

.elementor-widget-posts:has(.zcs) .elementor-pagination {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 30px;
	font-family: Calibri, Carlito, sans-serif;
}

.elementor-widget-posts:has(.zcs) .elementor-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	width: 40px;
	height: 40px;
	margin: 0;
	padding: 0;
	border: 1px solid transparent;
	border-radius: 50%;
	background:
		linear-gradient(#fff, #fff) padding-box,
		linear-gradient(90deg, #049fb7 0%, #3fd1e6 100%) border-box;
	color: #049fb7;
	font-size: 20px;
	font-weight: 300;
	line-height: 1;
	text-decoration: none;
	transition: background .25s ease, color .25s ease;
}

.elementor-widget-posts:has(.zcs) .elementor-pagination a.page-numbers:not(.prev):not(.next):hover,
.elementor-widget-posts:has(.zcs) .elementor-pagination a.page-numbers:not(.prev):not(.next):focus-visible,
.elementor-widget-posts:has(.zcs) .elementor-pagination .page-numbers.current {
	background: linear-gradient(90deg, #049fb7 0%, #3fd1e6 100%) border-box;
	color: #fefefe;
	font-weight: 700;
}

.elementor-widget-posts:has(.zcs) .elementor-pagination .page-numbers:focus-visible {
	outline: 2px solid #049fb7;
	outline-offset: 3px;
}

.elementor-widget-posts:has(.zcs) .elementor-pagination .page-numbers.dots {
	width: auto;
	border: 0;
	background: none;
}

/* Setas */
.elementor-widget-posts:has(.zcs) .elementor-pagination .page-numbers.prev,
.elementor-widget-posts:has(.zcs) .elementor-pagination .page-numbers.next {
	width: 11px;
	height: 40px;
	border: 0;
	border-radius: 0;
	background: url("../../img/casos-sucesso/paginacao-seta.svg") center / 11px 21px no-repeat;
	font-size: 0;
	color: transparent;
	transition: opacity .25s ease, transform .25s ease;
}

.elementor-widget-posts:has(.zcs) .elementor-pagination .page-numbers.prev {
	transform: scaleX(-1);
}

.elementor-widget-posts:has(.zcs) .elementor-pagination a.page-numbers.next:hover {
	transform: translateX(3px);
}

.elementor-widget-posts:has(.zcs) .elementor-pagination a.page-numbers.prev:hover {
	transform: scaleX(-1) translateX(3px);
}

/* Sem página anterior/seguinte: seta apagada */
.elementor-widget-posts:has(.zcs) .elementor-pagination span.page-numbers.prev,
.elementor-widget-posts:has(.zcs) .elementor-pagination span.page-numbers.next {
	opacity: .35;
	filter: grayscale(1);
}

@media (max-width: 767px) {
	.elementor-widget-posts:has(.zcs) .elementor-pagination {
		gap: 16px;
	}
}