/*
Theme Name: Zincoliver
Theme URI: https://zincoliver.com
Author: Zincoliver
Description: Tema de bloco (FSE) one-page para Zincoliver, Lda. — tratamento de superfícies metálicas. Totalmente editável no Site Editor pelo cliente.
Version: 2.0.0
Requires at least: 6.5
Tested up to: 6.6
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: zincoliver
*/

/* Fonte do tema carregada via functions.php (preconnect + swap) para nao bloquear o render. */

/* ==========================================================================
   Reset / base
   ========================================================================== */

/* Skip link: escondido ate receber foco via teclado. */
.skip-link.screen-reader-text {
	position: absolute;
	left: -9999px;
	top: auto;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.skip-link.screen-reader-text:focus {
	position: fixed;
	top: 1rem;
	left: 1rem;
	width: auto;
	height: auto;
	padding: 0.75rem 1.25rem;
	background: var(--wp--preset--color--preto-suave, #0f172a);
	color: var(--wp--preset--color--branco, #ffffff);
	font-weight: 600;
	border-radius: 6px;
	z-index: 999999;
	text-decoration: none;
}

/* Layout geral: garantir footer encostado ao fundo.
   O background branco explícito evita que gaps entre elementos
   transparentes (ex: entre header sticky e hero) revelem o canvas
   default do browser, que em iframes/embed pode aparecer preto. */
html, body {
	background: var(--wp--preset--color--branco, #ffffff);
}

body {
	margin: 0;
	padding: 0;
}

.wp-site-blocks {
	min-height: 100vh;
	display: flex;
	flex-direction: column;
}

.wp-site-blocks > main {
	flex: 1 0 auto;
	margin-top: 0 !important;
}

/* Main: permitir secções full-width (hero, etc.) */
.wp-site-blocks > main.wp-block-group {
	max-width: none;
	width: 100%;
}

.wp-site-blocks > main > [data-block].wp-block-pattern {
	margin-bottom: 0;
}

.wp-site-blocks > main > * + * {
	margin-top: 0;
}

/* Forçar comportamento flex nas colunas se o core falhar */
.wp-block-columns {
	display: flex !important;
	flex-wrap: wrap !important;
}

.wp-block-columns.is-not-stacked-on-mobile {
	flex-wrap: nowrap !important;
}

.wp-block-column {
	flex-grow: 1;
	min-width: 0; /* Impede o colapso do flex-item */
	word-break: break-word;
}

/* Scroll suave para âncoras do menu */
html {
	scroll-behavior: smooth;
	scroll-padding-top: 76px;
}

.admin-bar html {
	scroll-padding-top: 108px; /* 76px header + 32px admin bar */
}

/* Acessibilidade: foco visível em links e botões */
a:focus-visible,
button:focus-visible,
.wp-block-button__link:focus-visible {
	outline: 2px solid var(--wp--preset--color--azul-cta, #1A237E);
	outline-offset: 2px;
}

/* Tipografia: headings em IBM Plex Sans (fallback Source Sans 3). */
h1, .wp-block-heading[level="1"],
h2, .wp-block-heading[level="2"],
h3, .wp-block-heading[level="3"],
h4, .wp-block-heading[level="4"] {
	font-family: var(--wp--preset--font-family--display, "IBM Plex Sans", "Source Sans 3", system-ui, sans-serif);
}

/* ==========================================================================
   Layout constraint override
   Remove restrição 1250px do WordPress core, permitindo max 1600px
   (o !important é necessário para vencer o core layout CSS).
   ========================================================================== */
.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
	max-width: 1600px !important;
}

.wp-block-template-part,
.site-header,
.site-footer {
	max-width: none !important;
}

/* Secções: sempre full-width */
.hero-premium-section,
.porque-section,
.servicos-section,
.stats-section,
.antes-depois-section,
.setores-section,
.certificacoes-section,
.clientes-section,
.cta-orcamento-section,
.contactos-section,
.trust-bar {
	width: 100% !important;
	max-width: none !important;
}

/* Padding vertical consistente em todas as secções principais para
   garantir respiro entre conteúdos. Mobile abaixo de 600px reduz. */
.porque-section,
.servicos-section,
.stats-section,
.antes-depois-section,
.setores-section,
.certificacoes-section,
.clientes-section,
.cta-orcamento-section,
.contactos-section {
	padding-top: 3.5rem;
	padding-bottom: 3.5rem;
}

@media (max-width: 600px) {
	.porque-section,
	.servicos-section,
	.stats-section,
	.antes-depois-section,
	.setores-section,
	.certificacoes-section,
	.clientes-section,
	.cta-orcamento-section,
	.contactos-section {
		padding-top: 2.5rem;
		padding-bottom: 2.5rem;
	}
}

/* Containers interiores: 1600px centrados */
.site-header-inner,
.site-footer .alignwide,
.hero-premium-container {
	max-width: 1600px !important;
	margin-left: auto !important;
	margin-right: auto !important;
	padding-left: 2rem !important;
	padding-right: 2rem !important;
	width: 100% !important;
	box-sizing: border-box;
	float: none !important;
}

.alignwide {
	max-width: 1600px;
	margin-left: auto;
	margin-right: auto;
	width: 100%;
}

/* ==========================================================================
   Header
   ========================================================================== */
.site-header {
	position: sticky;
	top: 0;
	z-index: 100;
	background: var(--wp--preset--color--branco, #ffffff);
	color: var(--wp--preset--color--preto-suave, #0f172a);
	border-bottom: 3px solid var(--wp--preset--color--amarelo-zincoliver, #F5C842);
	width: 100%;
	margin-top: 0;
	transition: padding 0.25s ease, box-shadow 0.25s ease;
	will-change: padding;
}

/* O wrapper do template part também precisa de ser sticky para o header funcionar */
.wp-block-template-part:has(.site-header) {
	position: sticky;
	top: 0;
	z-index: 9999;
}

/* Com a barra de admin, o header fica abaixo dela */
.admin-bar .site-header,
.admin-bar .wp-block-template-part:has(.site-header) {
	top: 32px;
}

.site-header .has-text-color {
	color: inherit;
}

body.is-scrolled .site-header {
	box-shadow: 0 2px 12px rgba(15, 23, 42, 0.06);
}

body.is-scrolled .site-header-inner {
	padding-top: 0.35rem;
	padding-bottom: 0.35rem;
}

body.is-scrolled .site-header-logo-inner img {
	transform: scale(0.88);
}

.site-header-inner {
	padding: 0.75rem 1.5rem;
}

.site-header-logo-inner {
	display: flex;
	align-items: center;
	gap: 0.75rem;
}

.site-header-logo-inner img {
	transition: transform 0.25s ease;
}

.site-header-logo-inner .wp-block-site-logo {
	flex-shrink: 0;
	margin: 0;
}

.site-header-logo-inner .wp-block-site-logo img,
.site-header-logo-inner .wp-block-image {
	margin: 0;
}

.site-header-logo-inner .wp-block-site-logo img {
	width: 40px;
	height: 40px;
	object-fit: contain;
	background: transparent !important;
	border-radius: 0 !important;
	display: block;
}

.site-header-logo-inner .wp-block-site-title {
	margin: 0;
}

.site-header-logo-inner .wp-block-site-title,
.site-header-logo-inner .wp-block-site-title a,
.site-header-logo-inner .site-header-logo-text a {
	font-size: 1.25rem;
	font-weight: 700;
	color: var(--wp--preset--color--preto-suave, #0f172a);
	text-decoration: none;
	letter-spacing: -0.02em;
}

.site-header-logo-inner .wp-block-site-title a:hover,
.site-header-logo-inner .site-header-logo-text a:hover {
	color: var(--wp--preset--color--azul-cta, #1A237E);
}

.site-header-nav .wp-block-navigation__container {
	gap: 2rem;
}

.site-header-nav a {
	font-size: 0.875rem;
	font-weight: 500;
	color: #475569;
}

.site-header-nav a:hover {
	color: var(--wp--preset--color--azul-cta, #1A237E);
}

.site-header-cta .wp-block-button__link {
	border: 1px solid var(--wp--preset--color--azul-cta, #1A237E);
	color: var(--wp--preset--color--azul-cta, #1A237E);
	background: transparent;
	font-size: 0.875rem;
	font-weight: 600;
}

.site-header-cta .wp-block-button__link:hover {
	background: var(--wp--preset--color--azul-cta, #1A237E);
	color: var(--wp--preset--color--branco, #ffffff);
}

/* ==========================================================================
   Mobile nav overlay — estilos aplicados à estrutura que o WP gera
   automaticamente para wp:navigation com overlayMenu="mobile". Não
   injectamos HTML custom para que o cliente possa editar os itens de
   menu livremente no editor de blocos.
   ========================================================================== */
.wp-block-navigation__responsive-container.is-menu-open {
	background: linear-gradient(160deg,
		var(--wp--preset--color--preto-suave, #0f172a) 0%,
		var(--wp--preset--color--azul-cta, #1A237E) 100%);
	color: var(--wp--preset--color--branco, #ffffff);
	padding: 5rem 2.5rem 3rem;
	box-shadow: -20px 0 60px rgba(0, 0, 0, 0.25);
}

/* Animação de entrada: slide-in da direita. */
.wp-block-navigation__responsive-container {
	transition: transform 0.32s cubic-bezier(0.22, 0.61, 0.36, 1),
	            opacity 0.25s ease;
	transform: translateX(100%);
	opacity: 0;
	visibility: hidden;
}

.wp-block-navigation__responsive-container.is-menu-open {
	transform: translateX(0);
	opacity: 1;
	visibility: visible;
}

/* Subtle accent line no topo — acompanha o gold accent do header. */
.wp-block-navigation__responsive-container.is-menu-open::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 3px;
	background: var(--wp--preset--color--amarelo-zincoliver, #F5C842);
}

/* Lista dos links — grandes, centrados, com separadores suaves. */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	padding: 0;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	gap: 0;
	margin-top: 1rem;
	width: 100%;
	max-width: 420px;
	margin-inline: auto;
	text-align: left;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item {
	display: block;
	width: 100%;
	border-bottom: 1px solid rgba(255, 255, 255, 0.08);
	animation: zincoliver-nav-reveal 0.42s cubic-bezier(0.22, 0.61, 0.36, 1) both;
}

/* Remover sublinhado default do <a> — o destaque está no hover color + seta. */
.wp-block-navigation__responsive-container.is-menu-open a,
.wp-block-navigation__responsive-container.is-menu-open a:hover,
.wp-block-navigation__responsive-container.is-menu-open a:focus {
	text-decoration: none !important;
}

/* Stagger: cada item aparece ligeiramente depois do anterior. */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item:nth-child(1) { animation-delay: 0.08s; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item:nth-child(2) { animation-delay: 0.14s; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item:nth-child(3) { animation-delay: 0.20s; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item:nth-child(4) { animation-delay: 0.26s; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item:nth-child(5) { animation-delay: 0.32s; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item:nth-child(6) { animation-delay: 0.38s; }

@keyframes zincoliver-nav-reveal {
	from { opacity: 0; transform: translateX(24px); }
	to   { opacity: 1; transform: translateX(0); }
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	padding: 1.15rem 0.25rem;
	color: var(--wp--preset--color--branco, #ffffff) !important;
	font-family: var(--wp--preset--font-family--display, "IBM Plex Sans", sans-serif);
	font-size: 1.45rem;
	font-weight: 600;
	letter-spacing: -0.01em;
	text-decoration: none;
	position: relative;
	transition: color 0.2s ease, padding-left 0.25s ease;
	box-sizing: border-box;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content::after {
	content: '→';
	opacity: 0;
	transform: translateX(-6px);
	color: var(--wp--preset--color--amarelo-zincoliver, #F5C842);
	transition: opacity 0.2s ease, transform 0.25s ease;
	font-weight: 700;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content:hover,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content:focus-visible {
	color: var(--wp--preset--color--amarelo-zincoliver, #F5C842) !important;
	padding-left: 0.75rem;
	outline: none;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content:hover::after,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content:focus-visible::after {
	opacity: 1;
	transform: translateX(0);
}

/* Botão de fechar — maior, com fundo subtil. */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close {
	top: 1.25rem;
	right: 1.25rem;
	width: 44px;
	height: 44px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(255, 255, 255, 0.08);
	color: var(--wp--preset--color--branco, #ffffff);
	border-radius: 50%;
	border: 1px solid rgba(255, 255, 255, 0.12);
	transition: background 0.2s ease, transform 0.2s ease;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close:hover {
	background: rgba(255, 255, 255, 0.15);
	transform: rotate(90deg);
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close svg {
	width: 22px;
	height: 22px;
	fill: currentColor;
}

/* Trava scroll do body enquanto o menu está aberto. */
body.has-modal-open {
	overflow: hidden;
}

/* Respeita prefers-reduced-motion. */
@media (prefers-reduced-motion: reduce) {
	.wp-block-navigation__responsive-container,
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item,
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content,
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close {
		transition: none !important;
		animation: none !important;
	}
}

/* ==========================================================================
   Hero
   ========================================================================== */
.hero-premium-section {
	padding: 2rem 0 4rem;
	background:
		radial-gradient(1100px 460px at 85% -5%, rgba(15, 23, 42, 0.06), transparent 62%),
		linear-gradient(180deg, var(--wp--preset--color--branco, #ffffff) 0%, var(--wp--preset--color--cinza-claro, #f8fafc) 100%);
	position: relative;
	overflow: hidden;
}

.hero-premium-section::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: radial-gradient(circle at top right, rgba(26, 35, 126, 0.03) 0%, transparent 60%);
	pointer-events: none;
}

/* O container foi convertido de grid para block — o <wp-block-columns>
   interno é que gere as 2 colunas (58/42). */
.hero-premium-container {
	display: block !important;
	grid-template-columns: none !important;
	max-width: 1600px;
	margin: 0 auto;
	min-height: 0;
}

.hero-premium-container > .wp-block-columns {
	width: 100% !important;
	flex-wrap: nowrap !important;
}

.hero-premium-container .wp-block-columns > .wp-block-column:first-child {
	flex-basis: 45% !important;
	flex-grow: 0;
	min-width: 0;
}

.hero-premium-container .wp-block-columns > .wp-block-column:last-child {
	flex-basis: 55% !important;
	flex-grow: 0;
	min-width: 0;
}

.hero-eyebrow-badge {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.35rem 0.8rem;
	border-radius: 999px;
	background: var(--wp--preset--color--cinza-claro, #f8fafc);
	border: 1px solid #cbd5e1;
	color: var(--wp--preset--color--cinza-escuro, #334155);
	font-weight: 600;
	font-size: 0.78rem;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	margin-bottom: 1.5rem;
	white-space: nowrap;
}

.hero-eyebrow-badge p {
	margin: 0;
}

.pulse-dot {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 0.55rem;
	height: 0.55rem;
	border-radius: 50%;
	background: var(--wp--preset--color--preto-suave, #0f172a);
	color: transparent;
	margin: 0;
	font-size: 0;
	line-height: 1;
	animation: dot-pulse 2s infinite;
}

@keyframes dot-pulse {
	0% { box-shadow: 0 0 0 0 rgba(245, 200, 66, 0.4); }
	70% { box-shadow: 0 0 0 6px rgba(245, 200, 66, 0); }
	100% { box-shadow: 0 0 0 0 rgba(245, 200, 66, 0); }
}

.hero-premium-title {
	font-size: clamp(2rem, 4vw, 3.5rem);
	line-height: 1.1;
	letter-spacing: -0.03em;
	margin: 1rem 0 0.85rem;
	color: var(--wp--preset--color--preto-suave, #0f172a);
	max-width: 16ch;
	font-weight: 800;
}

.text-gradient-gold {
	background: linear-gradient(135deg, #1e293b 0%, #334155 60%, #475569 100%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text;
	color: transparent;
}

.hero-premium-subtitle {
	max-width: 58ch;
	color: #475569;
	font-size: 1.02rem;
	line-height: 1.75;
	margin: 0 0 2.5rem;
}

.hero-trust-inline {
	color: #1e293b;
	font-weight: 600;
	opacity: 0.9;
	margin-top: 0.3rem;
	margin-bottom: 0.95rem;
}

.hero-features-list {
	display: flex !important;
	flex-direction: column;
	align-items: flex-start;
	gap: 0.5rem;
	margin-top: 0.4rem;
}

.hero-features-list > * {
	margin-left: 0 !important;
	margin-right: 0 !important;
}

.hero-feature {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.5rem 1rem 0.5rem 0.7rem;
	background: var(--wp--preset--color--branco, #ffffff);
	border: 1px solid #dbe3ec;
	border-radius: 0.6rem;
	box-shadow: 0 1px 4px rgba(15, 23, 42, 0.04);
	margin-bottom: 0;
	width: auto;
	max-width: 100%;
}

.hero-feature p,
.hero-feature h4 {
	margin: 0;
}

.hero-feature .wp-block-group {
	display: flex;
	flex-direction: column;
	gap: 0.1rem;
	min-width: 0;
}

.hero-feature-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 1.8rem;
	height: 1.8rem;
	background: var(--wp--preset--color--preto-suave, #0f172a);
	color: var(--wp--preset--color--branco, #ffffff);
	border-radius: 0.45rem;
	margin: 0;
	font-size: 0.82rem;
	font-weight: 700;
	flex-shrink: 0;
}

.hero-feature h4 {
	font-size: 0.88rem;
	font-weight: 700;
	line-height: 1.2;
	color: var(--wp--preset--color--preto-suave, #0f172a);
}

.hero-feature .has-small-font-size {
	font-size: 0.78rem !important;
	line-height: 1.3;
	color: var(--wp--preset--color--cinza-medio, #64748b);
}

.hero-cta-group {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	margin-top: 1.25rem;
}

.hero-cta-group .wp-block-button {
	margin: 0;
}

.cta-btn-text {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	color: var(--wp--preset--color--azul-cta, #1A237E);
	font-weight: 600;
	text-decoration: none;
	font-size: 1rem;
	transition: gap 0.2s, color 0.2s;
}

.cta-btn-text:hover {
	gap: 0.75rem;
	color: #0d1a6e;
}

.cta-btn-text .wp-block-button__link {
	border-radius: 999px;
	border: 1px solid #94a3b8;
	background: var(--wp--preset--color--branco, #ffffff);
	color: var(--wp--preset--color--preto-suave, #0f172a);
	font-weight: 600;
	padding: 0.85rem 1.2rem;
}

.cta-btn-text .wp-block-button__link:hover {
	border-color: var(--wp--preset--color--cinza-escuro, #334155);
	background: #f1f5f9;
}

.hero-premium-visual {
	position: relative;
	width: 100%;
	height: 100%;
}

.hero-main-photo img {
	width: 100%;
	height: auto;
	border-radius: 1.25rem;
	box-shadow: 0 30px 60px -20px rgba(15, 23, 42, 0.3);
	aspect-ratio: 16 / 9;
	object-fit: cover;
}

.hero-glass-card {
	margin-top: -2.1rem;
	margin-left: auto;
	max-width: 290px;
	padding: 0.8rem 1rem;
	border-radius: 0.9rem;
	background: rgba(255, 255, 255, 0.97);
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
	border: 1px solid #dbe3ec;
	box-shadow: 0 10px 22px rgba(15, 23, 42, 0.15);
	display: flex;
	align-items: center;
	gap: 1rem;
	position: relative;
	z-index: 3;
	animation: float 6s ease-in-out infinite;
}

@keyframes float {
	0% { transform: translateY(0) rotate(0deg); }
	50% { transform: translateY(-10px) rotate(-1deg); }
	100% { transform: translateY(0) rotate(0deg); }
}

.glass-card-logo {
	margin: 0;
}

.glass-card-logo img {
	width: 44px;
	height: 44px;
	object-fit: contain;
	background: transparent !important;
	border-radius: 0 !important;
}

.glass-card-text {
	display: flex;
	flex-direction: column;
}

.glass-card-text p {
	margin: 0;
}

.gl-title {
	font-weight: 800;
	color: var(--wp--preset--color--azul-cta, #1A237E);
	font-size: 1.1rem;
}

.gl-desc {
	font-size: 0.8rem;
	color: #475569;
	font-weight: 500;
}

/* ==========================================================================
   Trust bar
   ========================================================================== */
.trust-bar {
	background: var(--wp--preset--color--branco, #ffffff);
	border-bottom: 1px solid var(--wp--preset--color--azul-muito-claro, #e8eaf6);
	padding: 1.5rem 1rem;
	box-shadow: 0 1px 4px rgba(26, 35, 126, 0.06);
}

.trust-bar .trust-bar-columns {
	max-width: 1600px;
	margin: 0 auto;
	display: flex !important;
	justify-content: space-between;
	align-items: stretch;
	gap: 0;
	padding-left: 1rem;
	padding-right: 1rem;
}

.trust-bar .trust-bar-item {
	display: flex !important;
	align-items: center;
	gap: 1rem;
	padding: 0.75rem 1.5rem;
	flex: 1;
	border-right: 1px solid var(--wp--preset--color--azul-muito-claro, #e8eaf6);
}

.trust-bar .trust-bar-item:last-child {
	border-right: none;
}

.trust-bar .trust-bar-item .wp-block-group {
	margin: 0;
}

.trust-bar .trust-bar-text-wrap {
	display: flex;
	flex-direction: column;
	gap: 0.1rem;
}

.trust-bar .trust-bar-label,
.trust-bar .trust-bar-desc {
	margin: 0;
}

.trust-bar .trust-bar-label {
	font-weight: 700;
	font-size: 0.9rem;
	color: var(--wp--preset--color--preto-suave, #0f172a);
	line-height: 1.2;
}

.trust-bar .trust-bar-desc {
	font-size: 0.78rem;
	color: var(--wp--preset--color--cinza-medio, #64748b);
	line-height: 1.3;
}

/* ==========================================================================
   Porque Zincoliver
   ========================================================================== */
.porque-section {
	background-color: var(--wp--preset--color--branco, #ffffff);
}

.porque-section .wp-block-columns {
	max-width: 1600px;
	margin-left: auto;
	margin-right: auto;
	padding-left: 2rem;
	padding-right: 2rem;
	gap: 4rem;
	flex-wrap: nowrap !important;
}

.porque-list {
	padding-left: 1.25rem;
}

.porque-list li {
	margin-bottom: 1.5rem;
	line-height: 1.6;
	color: #475569;
}

.porque-list li strong {
	color: var(--wp--preset--color--preto-suave, #0f172a);
}

.porque-cta-link {
	color: var(--wp--preset--color--azul-cta, #1A237E);
	font-weight: 600;
	text-decoration: none;
	border-bottom: 2px solid var(--wp--preset--color--azul-cta, #1A237E);
	transition: color 0.2s ease, border-color 0.2s ease;
}

.porque-cta-link:hover {
	color: #0d1a6e;
	border-color: #0d1a6e;
}

.porque-image-wrap {
	position: relative;
	border-radius: 1rem;
	overflow: hidden;
	box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
}

.porque-image-wrap .porque-image img {
	width: 100%;
	height: auto;
	display: block;
}

.porque-badge {
	position: absolute;
	bottom: 1.5rem;
	left: 1.5rem;
	background: rgba(255, 255, 255, 0.95);
	backdrop-filter: blur(8px);
	padding: 0.5rem 1rem;
	border-radius: 0.5rem;
	box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
}

.porque-badge p {
	margin: 0;
}

.porque-badge p:last-child {
	margin-top: 0.15rem;
}

/* ==========================================================================
   Stats
   ========================================================================== */
.stats-section {
	background: var(--wp--preset--color--preto-suave, #0f172a);
	color: var(--wp--preset--color--branco, #ffffff);
}

.stats-eyebrow {
	color: var(--wp--preset--color--amarelo-zincoliver, #F5C842);
	font-size: 0.8125rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	margin: 0 0 0.5rem;
}

.stats-title {
	color: var(--wp--preset--color--branco, #ffffff);
	font-size: clamp(1.75rem, 3vw, 2.5rem);
	margin: 0;
}

.stats-grid .stat-item {
	text-align: center;
}

.stat-number {
	font-family: var(--wp--preset--font-family--display, "IBM Plex Sans", sans-serif);
	font-size: clamp(2rem, 4vw, 3rem);
	font-weight: 700;
	letter-spacing: -0.02em;
	color: var(--wp--preset--color--amarelo-zincoliver, #F5C842);
	margin: 0;
	line-height: 1;
	white-space: nowrap;
	font-variant-numeric: tabular-nums;
}

.stat-label {
	color: rgba(255, 255, 255, 0.75);
	font-size: 0.95rem;
	margin: 0.5rem 0 0;
}

/* ==========================================================================
   Serviços
   ========================================================================== */
.servicos-section {
	background: var(--wp--preset--color--cinza-claro, #f8fafc);
}

.servicos-section .alignwide {
	max-width: 1600px;
	margin-left: auto;
	margin-right: auto;
	padding-left: 2rem;
	padding-right: 2rem;
}

/* Cartões "new" — o layout actual. Altura mínima para ficarem visualmente
   alinhados e lista com flex-grow para empurrar o badge "Materiais" para o fundo. */
.new-servico-card {
	background: var(--wp--preset--color--branco, #ffffff);
	border: 1px solid #e2e8f0;
	border-radius: 0.75rem;
	padding: 2.5rem 2rem;
	text-align: left;
	height: 100%;
	min-height: 300px;
	display: flex;
	flex-direction: column;
	transition: border-color 0.2s, box-shadow 0.2s;
}

.new-servico-card:hover {
	border-color: var(--wp--preset--color--azul-cta, #1A237E);
	box-shadow: 0 10px 15px -3px rgba(26, 35, 126, 0.12);
}

.new-servico-card h3 {
	margin-top: 0;
	margin-bottom: 1rem;
	color: var(--wp--preset--color--preto-suave, #0f172a);
}

.new-servico-card > p {
	margin-bottom: 1.5rem;
	flex-grow: 0;
}

.new-servico-card .wp-block-list {
	margin-top: 0;
	margin-bottom: 0.75rem;
	padding-left: 1.1rem;
	flex-grow: 1;
}

.servico-materiais {
	background: var(--wp--preset--color--azul-muito-claro, #e8eaf6);
	color: var(--wp--preset--color--azul-cta, #1A237E);
	font-size: 0.85rem;
	padding: 0.5rem 1rem;
	border-radius: 0.375rem;
	margin-top: auto;
	margin-bottom: 0 !important;
	display: inline-block;
	align-self: flex-start;
	font-weight: 500;
}

/* ==========================================================================
   Antes & Depois
   ========================================================================== */
.antes-depois-section {
	background: var(--wp--preset--color--cinza-claro, #f8fafc);
}

.antes-depois-eyebrow {
	color: var(--wp--preset--color--azul-cta, #1A237E);
	font-size: 0.8125rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	margin: 0 0 0.5rem;
}

.antes-depois-title {
	font-size: clamp(1.75rem, 3vw, 2.25rem);
	margin: 0;
	color: var(--wp--preset--color--preto-suave, #0f172a);
}

.antes-depois-desc {
	color: var(--wp--preset--color--cinza-medio, #64748b);
	max-width: 640px;
	margin: 1rem auto 0;
}

.antes-depois-card {
	border-radius: 1rem;
	overflow: hidden;
	background: var(--wp--preset--color--branco, #ffffff);
	border: 1px solid #e2e8f0;
	display: flex !important;
	flex-direction: column;
	transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.antes-depois-card:hover {
	transform: translateY(-3px);
	box-shadow: 0 20px 40px -12px rgba(15, 23, 42, 0.2);
}

.antes-depois-visual {
	position: relative;
	aspect-ratio: 16 / 10;
	overflow: hidden;
}

.antes-depois-placeholder {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	transition: transform 0.4s ease, filter 0.4s ease;
}

/* Foto real sobre o gradient: se a foto falhar, o gradient continua visível
   e dá o visual correcto. Filtros fortes forçam o look rust / chrome
   independentemente do que a foto mostre. */
.antes-depois-photo {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	z-index: 1;
	transition: transform 0.4s ease, filter 0.4s ease;
}

.antes-depois-placeholder--before ~ .antes-depois-photo {
	filter: sepia(0.9) saturate(1.8) hue-rotate(-15deg) brightness(0.75) contrast(1.05);
	mix-blend-mode: multiply;
}

.antes-depois-placeholder--after ~ .antes-depois-photo {
	filter: saturate(0.45) brightness(1.08) contrast(1.05);
}

.antes-depois-card:hover .antes-depois-placeholder,
.antes-depois-card:hover .antes-depois-photo {
	transform: scale(1.04);
}

/* "Antes" — aparência oxidada/castanho-avermelhado. */
.antes-depois-placeholder--before {
	background:
		radial-gradient(circle at 30% 30%, rgba(120, 50, 20, 0.85), transparent 55%),
		radial-gradient(circle at 70% 65%, rgba(60, 25, 10, 0.8), transparent 55%),
		radial-gradient(circle at 50% 50%, rgba(90, 40, 20, 0.6), transparent 70%),
		linear-gradient(135deg, #6b4423 0%, #3d2414 45%, #2a1608 100%);
}

.antes-depois-placeholder--before::after {
	content: '';
	position: absolute;
	inset: 0;
	background:
		repeating-radial-gradient(
			circle at 20% 30%,
			rgba(140, 70, 30, 0.25) 0px,
			rgba(140, 70, 30, 0.25) 3px,
			transparent 3px,
			transparent 8px
		),
		repeating-radial-gradient(
			circle at 75% 70%,
			rgba(90, 40, 15, 0.3) 0px,
			rgba(90, 40, 15, 0.3) 4px,
			transparent 4px,
			transparent 10px
		);
	mix-blend-mode: multiply;
	opacity: 0.6;
}

/* "Depois" — aparência cromada/polida azulada. */
.antes-depois-placeholder--after {
	background:
		linear-gradient(135deg, #e2e8f0 0%, #cbd5e1 30%, #94a3b8 60%, #e2e8f0 100%),
		linear-gradient(90deg, #f1f5f9, #cbd5e1, #f1f5f9);
	background-blend-mode: overlay;
	position: relative;
}

.antes-depois-placeholder--after::before {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(
		105deg,
		transparent 40%,
		rgba(255, 255, 255, 0.55) 50%,
		transparent 60%
	);
	pointer-events: none;
}

.antes-depois-placeholder--after::after {
	content: '';
	position: absolute;
	inset: 0;
	background: radial-gradient(ellipse at 50% 100%, rgba(26, 35, 126, 0.25), transparent 60%);
}

.antes-depois-body {
	padding: 1.25rem 1.5rem 1.5rem;
}

.antes-depois-caption {
	margin: 0;
	font-size: 1.05rem;
	font-weight: 700;
	color: var(--wp--preset--color--preto-suave, #0f172a);
}

.antes-depois-detail {
	margin: 0.4rem 0 0;
	font-size: 0.9rem;
	color: var(--wp--preset--color--cinza-medio, #64748b);
	line-height: 1.5;
}

.antes-depois-badge {
	position: absolute;
	top: 1rem;
	left: 1rem;
	padding: 0.35rem 0.85rem;
	border-radius: 999px;
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	z-index: 2;
}

.antes-depois-badge--before {
	background: rgba(15, 23, 42, 0.85);
	color: var(--wp--preset--color--branco, #ffffff);
}

.antes-depois-badge--after {
	background: var(--wp--preset--color--amarelo-zincoliver, #F5C842);
	color: var(--wp--preset--color--azul-cta, #1A237E);
}

/* ==========================================================================
   Setores de Atuação
   ========================================================================== */
.setores-section {
	background: var(--wp--preset--color--cinza-claro, #f8fafc);
	border-top: 1px solid #e2e8f0;
	border-bottom: 1px solid #e2e8f0;
}

.setores-section .wp-block-group {
	max-width: 1600px;
	margin-left: auto;
	margin-right: auto;
	padding-left: 2rem;
	padding-right: 2rem;
}

.setor-item {
	text-align: center;
}

.setor-label {
	font-size: 1.125rem;
	font-weight: 700;
	color: var(--wp--preset--color--preto-suave, #0f172a);
	margin: 0 0 0.75rem;
}

.setor-desc {
	font-size: 0.9rem;
	color: var(--wp--preset--color--cinza-medio, #64748b);
	line-height: 1.5;
	margin: 0;
}

/* ==========================================================================
   Certificações
   ========================================================================== */
.certificacoes-section {
	background: var(--wp--preset--color--branco, #ffffff);
}

.certificacoes-eyebrow {
	color: var(--wp--preset--color--azul-cta, #1A237E);
	font-size: 0.8125rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	margin: 0 0 0.5rem;
}

.certificacoes-title {
	font-size: clamp(1.75rem, 3vw, 2.25rem);
	margin: 0;
	color: var(--wp--preset--color--preto-suave, #0f172a);
}

.cert-card {
	background: var(--wp--preset--color--cinza-claro, #f8fafc);
	border: 1px solid #e2e8f0;
	border-radius: 1rem;
	padding: 2rem;
	text-align: center;
	transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.cert-card:hover {
	transform: translateY(-3px);
	box-shadow: 0 16px 32px -12px rgba(26, 35, 126, 0.15);
}

.cert-title {
	font-size: 1.2rem;
	font-weight: 700;
	color: var(--wp--preset--color--preto-suave, #0f172a);
	margin: 0 0 0.5rem;
}

.cert-desc {
	color: var(--wp--preset--color--cinza-medio, #64748b);
	font-size: 0.95rem;
	line-height: 1.55;
	margin: 0;
}

/* ==========================================================================
   Clientes
   ========================================================================== */
.clientes-section {
	background: var(--wp--preset--color--branco, #ffffff);
	border-top: 1px solid #e2e8f0;
	border-bottom: 1px solid #e2e8f0;
}

.clientes-eyebrow {
	color: var(--wp--preset--color--cinza-medio, #64748b);
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.14em;
	margin: 0 0 2rem;
	text-align: center;
}

.clientes-logos {
	gap: 2.5rem !important;
	justify-content: center;
	align-items: center;
}

.cliente-logo-placeholder {
	font-family: var(--wp--preset--font-family--display, "IBM Plex Sans", sans-serif);
	font-weight: 700;
	letter-spacing: 0.08em;
	color: #94a3b8;
	font-size: 1.05rem;
	margin: 0;
	filter: grayscale(1);
	opacity: 0.7;
	transition: opacity 0.25s ease, color 0.25s ease, transform 0.25s ease;
}

.cliente-logo-placeholder:hover {
	opacity: 1;
	color: var(--wp--preset--color--azul-cta, #1A237E);
	transform: scale(1.05);
}

/* ==========================================================================
   CTA Orçamento
   ========================================================================== */
.cta-orcamento-section {
	background: linear-gradient(135deg, var(--wp--preset--color--azul-cta, #1A237E) 0%, #283593 60%, var(--wp--preset--color--azul-cta, #1A237E) 100%);
	padding: 5rem 1.5rem;
	position: relative;
	overflow: hidden;
	border-top: none !important;
}

.cta-orcamento-section::before {
	content: '';
	position: absolute;
	top: -50%;
	right: -10%;
	width: 600px;
	height: 600px;
	background: rgba(245, 200, 66, 0.05);
	border-radius: 50%;
	pointer-events: none;
}

.cta-orcamento-inner {
	max-width: 700px !important;
	margin: 0 auto;
	text-align: center;
	position: relative;
	z-index: 1;
}

.cta-orcamento-badge {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	background: rgba(245, 200, 66, 0.15);
	border: 1px solid rgba(245, 200, 66, 0.3);
	color: var(--wp--preset--color--amarelo-zincoliver, #F5C842);
	font-size: 0.8rem;
	font-weight: 600;
	padding: 0.4rem 1rem;
	border-radius: 999px;
	margin: 0 0 1.5rem;
	letter-spacing: 0.05em;
}

.cta-orcamento-section h2 {
	color: var(--wp--preset--color--branco, #ffffff) !important;
	font-size: 2rem;
	font-weight: 700;
	margin: 0 0 1rem;
	line-height: 1.2;
}

.cta-orcamento-section > .cta-orcamento-inner > p,
.cta-orcamento-inner > p {
	color: rgba(255, 255, 255, 0.8) !important;
	font-size: 1.05rem;
	margin-bottom: 2rem;
}

.cta-orcamento-buttons {
	display: flex;
	flex-wrap: wrap;
	gap: 1rem;
	justify-content: center;
}

.cta-orcamento-buttons .wp-block-button {
	margin: 0;
}

/* Botões CTA: o contentor .wp-block-button nao pode ter fundo/shadow,
   ou fica um "anel" amarelo a volta do <a> que é o botao real. */
.cta-btn-primary,
.cta-btn-secondary {
	background: transparent !important;
	background-color: transparent !important;
	box-shadow: none !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
}

.cta-btn-primary .wp-block-button__link,
.cta-btn-secondary .wp-block-button__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
}

/* Hero: CTA primário escuro/preto (estilo Magic). */
.cta-btn-primary .wp-block-button__link {
	background: var(--wp--preset--color--preto-suave, #0f172a) !important;
	color: var(--wp--preset--color--branco, #ffffff) !important;
	border-radius: 999px;
	padding: 0.82rem 1.3rem;
	font-weight: 700;
	box-shadow: 0 10px 22px rgba(15, 23, 42, 0.2);
	border: 1px solid var(--wp--preset--color--preto-suave, #0f172a);
}

.cta-btn-primary .wp-block-button__link:hover {
	background: #1e293b !important;
}

/* CTA primário dentro da seccao escura (cta-orcamento) — amarelo solido. */
.cta-orcamento-section .cta-btn-primary .wp-block-button__link {
	background: var(--wp--preset--color--amarelo-zincoliver, #F5C842) !important;
	color: var(--wp--preset--color--azul-cta, #1A237E) !important;
	font-weight: 700;
	padding: 0.9rem 2rem !important;
	border-radius: 999px !important;
	box-shadow: 0 4px 14px rgba(15, 23, 42, 0.18) !important;
	border: 0 !important;
}

.cta-orcamento-section .cta-btn-primary .wp-block-button__link:hover {
	background: #ffd54d !important;
	transform: translateY(-1px);
}

/* CTA secundário outline (tel): fundo transparente, borda branca. */
.cta-orcamento-section .cta-btn-secondary .wp-block-button__link {
	background: transparent !important;
	color: var(--wp--preset--color--branco, #ffffff) !important;
	border: 1.5px solid rgba(255, 255, 255, 0.5) !important;
	border-radius: 999px !important;
	padding: 0.9rem 2rem !important;
	font-weight: 600;
}

.cta-orcamento-section .cta-btn-secondary .wp-block-button__link:hover {
	background: rgba(255, 255, 255, 0.08) !important;
	border-color: var(--wp--preset--color--branco, #ffffff) !important;
}

/* ==========================================================================
   Contactos
   ========================================================================== */
.contactos-section {
	background: var(--wp--preset--color--branco, #ffffff);
	padding: 5rem 0 0 !important;
	width: 100% !important;
}

.contactos-alignwide {
	max-width: 1600px;
	margin-left: auto;
	margin-right: auto;
	padding: 0 2rem;
	margin-bottom: 5rem;
}

.contactos-page-title {
	font-size: 2.5rem;
	font-weight: 800;
	color: var(--wp--preset--color--preto-suave, #0f172a);
	margin-bottom: 3.5rem;
	letter-spacing: -0.02em;
}

.contactos-subtitle {
	font-size: 1.5rem;
	font-weight: 700;
	color: var(--wp--preset--color--azul-cta, #1A237E);
	margin-bottom: 2rem;
}

.contactos-columns {
	padding-left: 0 !important;
	padding-right: 0 !important;
	gap: 4rem;
}

.contactos-text-column {
	padding-right: 2rem;
}

/* --- Contacto vCard: nova apresentação dos contactos (ficha de contacto). */
.contacto-vcard {
	position: relative;
	padding: 2.25rem 2rem 2.25rem 2.5rem;
	background: var(--wp--preset--color--branco, #ffffff);
	border: 1px solid rgba(226, 232, 240, 0.9);
	border-radius: 1rem;
	box-shadow: 0 4px 20px rgba(26, 35, 126, 0.06);
}

.contacto-vcard::before {
	content: '';
	position: absolute;
	top: 1.5rem;
	bottom: 1.5rem;
	left: 0;
	width: 4px;
	border-radius: 0 4px 4px 0;
	background: linear-gradient(180deg,
		var(--wp--preset--color--azul-cta, #1A237E) 0%,
		var(--wp--preset--color--amarelo-zincoliver, #F5C842) 100%);
}

.contacto-vcard-eyebrow {
	margin: 0 0 0.5rem;
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.18em;
	color: var(--wp--preset--color--azul-cta, #1A237E);
	text-transform: uppercase;
}

.contacto-vcard-title {
	margin: 0 0 0.75rem;
	font-size: clamp(1.35rem, 1.8vw, 1.65rem);
	font-weight: 700;
	color: var(--wp--preset--color--preto-suave, #0f172a);
	letter-spacing: -0.01em;
}

.contacto-vcard-lead {
	margin: 0 0 1.75rem;
	font-size: 0.95rem;
	line-height: 1.55;
	color: var(--wp--preset--color--cinza-medio, #64748b);
}

.contacto-vcard-row {
	padding: 1rem 0;
	border-top: 1px solid rgba(226, 232, 240, 0.8);
	display: grid;
	grid-template-columns: 1fr;
	gap: 0.35rem;
}

.contacto-vcard-row:first-child {
	border-top: none;
	padding-top: 0;
}

.contacto-vcard-row:last-child {
	padding-bottom: 0;
}

.contacto-vcard-label {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	margin: 0;
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	color: var(--wp--preset--color--cinza-medio, #64748b);
	text-transform: uppercase;
}

.contacto-vcard-label svg {
	color: var(--wp--preset--color--azul-cta, #1A237E);
	flex-shrink: 0;
}

.contacto-vcard-value {
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
	font-size: 1rem;
	line-height: 1.5;
	color: var(--wp--preset--color--cinza-escuro, #334155);
}

.contacto-vcard-value address {
	font-style: normal;
	margin: 0;
}

.contacto-vcard-primary {
	font-weight: 600;
	font-size: 1.05rem;
	color: var(--wp--preset--color--preto-suave, #0f172a);
	text-decoration: none;
	letter-spacing: -0.005em;
	word-break: break-word;
	overflow-wrap: anywhere;
}

.contacto-vcard-primary:hover {
	color: var(--wp--preset--color--azul-cta, #1A237E);
}

.contacto-vcard-secondary {
	font-size: 0.9rem;
	color: var(--wp--preset--color--cinza-medio, #64748b);
	text-decoration: none;
	word-break: break-word;
	overflow-wrap: anywhere;
}

.contacto-vcard-secondary:hover {
	color: var(--wp--preset--color--azul-cta, #1A237E);
}

.contacto-vcard-note {
	font-size: 0.82rem;
	color: var(--wp--preset--color--cinza-medio, #64748b);
}

.contacto-vcard-link {
	margin-top: 0.4rem;
	font-size: 0.85rem;
	font-weight: 600;
	color: var(--wp--preset--color--azul-cta, #1A237E);
	text-decoration: none;
	align-self: flex-start;
	transition: gap 0.2s ease;
}

.contacto-vcard-link:hover {
	text-decoration: underline;
}

@media (max-width: 780px) {
	.contacto-vcard {
		padding: 1.75rem 1.5rem 1.75rem 2rem;
	}
}

.contacto-form-wrap {
	background: var(--wp--preset--color--branco, #ffffff);
	padding: 2.5rem;
	border-radius: 1rem;
	border: 1px solid rgba(226, 232, 240, 0.8);
	box-shadow: 0 4px 20px rgba(26, 35, 126, 0.08);
}

.zincoliver-contact-form {
	display: flex;
	flex-direction: column;
	gap: 1.5rem;
}

.zincoliver-contact-form .form-row,
.form-row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1.5rem;
	margin-bottom: 0;
}

.zincoliver-contact-form .form-group,
.form-group {
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
	margin-bottom: 0;
}

.form-group label,
.zincoliver-contact-form label {
	font-size: 0.9rem;
	font-weight: 600;
	color: var(--wp--preset--color--cinza-escuro, #334155);
}

.form-group input,
.form-group textarea,
.zincoliver-contact-form input[type="text"],
.zincoliver-contact-form input[type="email"],
.zincoliver-contact-form textarea {
	width: 100%;
	padding: 1rem;
	border-radius: 10px;
	border: 1px solid #cbd5e1;
	background: var(--wp--preset--color--cinza-claro, #f8fafc);
	color: var(--wp--preset--color--preto-suave, #0f172a);
	font-family: inherit;
	font-size: 1rem;
	transition: border-color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
	box-sizing: border-box;
}

.form-group input:focus,
.form-group textarea:focus,
.zincoliver-contact-form input[type="text"]:focus,
.zincoliver-contact-form input[type="email"]:focus,
.zincoliver-contact-form textarea:focus {
	outline: none;
	border-color: var(--wp--preset--color--amarelo-zincoliver, #F5C842);
	background: var(--wp--preset--color--branco, #ffffff);
	box-shadow: 0 0 0 4px rgba(245, 200, 66, 0.1);
}

.form-submit {
	margin-top: 1rem;
}

.zincoliver-contact-form .form-submit button {
	width: 100%;
	padding: 1.25rem;
	background: var(--wp--preset--color--azul-cta, #1A237E);
	color: var(--wp--preset--color--branco, #ffffff);
	font-size: 1.1rem;
	font-weight: 700;
	border: none;
	border-radius: 10px;
	cursor: pointer;
	transition: background 0.2s ease, transform 0.2s ease;
}

.zincoliver-contact-form .form-submit button:hover {
	background: #121959;
	transform: translateY(-2px);
}

.form-message {
	margin-top: 1.5rem;
	padding: 1rem;
	border-radius: 8px;
	font-weight: 500;
	text-align: center;
}

.form-message.success {
	background: rgba(34, 197, 94, 0.1);
	color: #166534;
	border: 1px solid #bbf7d0;
}

.form-message.error {
	background: rgba(239, 68, 68, 0.1);
	color: #991b1b;
	border: 1px solid #fecaca;
}

.form-message p {
	margin: 0;
}

/* Mapa full-width */
.contactos-map-wrap-full {
	width: 100% !important;
	max-width: none !important;
	padding: 0 !important;
	margin: 0 !important;
	display: block;
}

.contactos-map-wrap-full .wp-block-embed,
.contactos-map-wrap-full .wp-block-embed__wrapper,
.contactos-map-wrap-full iframe {
	width: 100%;
}

.contactos-map-wrap-full iframe {
	min-height: 500px;
	border: 0;
	display: block;
}

/* ==========================================================================
   Footer
   ========================================================================== */
.site-footer {
	background: #0a0f25;
	color: rgba(255, 255, 255, 0.7);
	padding: 0;
	border-top: 3px solid var(--wp--preset--color--amarelo-zincoliver, #F5C842);
	width: 100% !important;
	max-width: none !important;
}

.site-footer a {
	color: rgba(255, 255, 255, 0.7);
	text-decoration: none;
	transition: color 0.2s ease;
}

.site-footer a:hover {
	color: var(--wp--preset--color--amarelo-zincoliver, #F5C842);
}

.site-footer .footer-top-border {
	border: 0;
	height: 4px;
	background: linear-gradient(90deg, var(--wp--preset--color--amarelo-zincoliver, #F5C842) 0%, #FFD700 50%, #e0a300 100%);
	width: 100%;
	margin: 0;
}

.footer-grid {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	gap: 3rem;
	padding-top: 5rem;
	padding-bottom: 4rem;
}

.footer-heading {
	color: var(--wp--preset--color--branco, #ffffff);
	font-size: 1.1rem;
	font-weight: 600;
	margin-bottom: 1.5rem;
	position: relative;
	display: inline-block;
}

.footer-heading::after {
	content: '';
	position: absolute;
	bottom: -0.5rem;
	left: 0;
	width: 2rem;
	height: 2px;
	background: var(--wp--preset--color--amarelo-zincoliver, #F5C842);
}

.footer-links-list,
.footer-contact-list {
	list-style: none;
	padding: 0;
	margin: 0;
}

.footer-links-list li {
	margin-bottom: 0.75rem;
}

.footer-contact-list {
	display: flex;
	flex-direction: column;
	gap: 1rem;
}

.footer-contact-list li {
	display: list-item;
	color: rgba(255, 255, 255, 0.85);
	line-height: 1.5;
	font-size: 0.95rem;
}

.footer-about-text {
	line-height: 1.7;
	margin-bottom: 2rem;
	font-size: 0.95rem;
}

.site-footer .wp-block-social-links.footer-socials {
	gap: 0.75rem;
}

.site-footer .wp-block-social-links.footer-socials .wp-social-link {
	background: rgba(255, 255, 255, 0.08);
	color: var(--wp--preset--color--branco, #ffffff);
	border-radius: 8px;
	transition: background 0.2s ease, transform 0.2s ease, color 0.2s ease;
}

.site-footer .wp-block-social-links.footer-socials .wp-social-link:hover {
	background: var(--wp--preset--color--amarelo-zincoliver, #F5C842);
	color: var(--wp--preset--color--azul-cta, #1A237E);
	transform: translateY(-2px);
}

/* Logo band na base do footer */
.footer-logo-band {
	border-top: 1px solid rgba(255, 255, 255, 0.08);
	padding: 3rem 0 0;
	margin-top: 2rem;
}

.footer-logo-band-inner {
	display: flex;
	align-items: center;
	gap: 1.5rem;
	justify-content: flex-end;
}

.footer-full-logo {
	margin: 0;
}

.footer-full-logo img {
	width: 80px;
	height: 80px;
	object-fit: contain;
	background: transparent !important;
	border-radius: 0 !important;
}

.footer-logo-wordmark {
	font-size: 3rem;
	font-weight: 900;
	color: rgba(255, 255, 255, 0.15);
	letter-spacing: -0.04em;
	font-style: italic;
	margin: 0;
}

.footer-bottom-bar {
	border-top: 1px solid rgba(245, 200, 66, 0.2);
	padding: 1.5rem 0;
}

.footer-bottom-inner {
	display: flex;
	justify-content: space-between;
	align-items: center;
	font-size: 0.85rem;
}

.footer-bottom-inner p {
	margin: 0;
}

.footer-legal-links {
	display: flex;
	gap: 1rem;
	margin: 0;
}

.footer-legal-links a {
	color: rgba(255, 255, 255, 0.7);
	text-decoration: none;
}

.footer-legal-links a:hover {
	color: var(--wp--preset--color--branco, #ffffff);
}

/* ==========================================================================
   Utilitários / animações
   (os ícones do tema são estilizados na secção .zi-icon* — ver fim do
   ficheiro. Aqui não há mais regras `<svg>` inline porque o tema já não
   usa shortcodes de ícone.)
   ========================================================================== */

/* Reveal-on-scroll (JS adiciona `.is-revealed`). */
.reveal-on-scroll {
	opacity: 0;
	transform: translateY(18px);
	transition: opacity 0.7s ease, transform 0.7s ease;
	transition-delay: var(--reveal-delay, 0ms);
}

.reveal-on-scroll.is-revealed {
	opacity: 1;
	transform: none;
}

@media (prefers-reduced-motion: reduce) {
	.reveal-on-scroll,
	.site-header-logo-inner img,
	.new-servico-card,
	.cert-card,
	.antes-depois-card {
		transition: none !important;
		transform: none !important;
	}

	.reveal-on-scroll {
		opacity: 1 !important;
	}
}

/* ==========================================================================
   Responsivo — media queries consolidadas por breakpoint
   ========================================================================== */

/* --- 420px e abaixo -------------------------------------------------- */
@media (max-width: 420px) {
	.hero-eyebrow-badge {
		white-space: normal;
	}
}

/* --- 480px e abaixo -------------------------------------------------- */
@media (max-width: 480px) {
	.trust-bar .trust-bar-item {
		flex-basis: 100%;
		border-right: none;
	}

	.trust-bar .trust-bar-item:nth-child(odd) {
		border-right: none;
	}
}

/* --- 600px e abaixo -------------------------------------------------- */
@media (max-width: 600px) {
	/* Porque-zincoliver só stack em ecrãs muito estreitos. */
	.porque-section .wp-block-columns {
		flex-direction: column;
		gap: 3rem;
	}

	.porque-section .wp-block-column {
		flex-basis: 100% !important;
	}

	.porque-section .wp-block-column:last-child {
		order: -1;
	}

	.cta-orcamento-section h2 {
		font-size: 1.5rem;
	}

	.cta-orcamento-buttons {
		flex-direction: column;
		align-items: center;
	}

	.cta-btn-primary,
	.cta-btn-secondary {
		width: 100%;
		justify-content: center;
	}

	.hero-premium-title {
		font-size: 2.5rem;
	}

	.hero-cta-group {
		flex-direction: column;
		align-items: stretch;
		gap: 1rem;
	}

	.cta-btn-primary {
		text-align: center;
	}

	.cta-btn-text {
		justify-content: center;
	}

	.footer-grid {
		grid-template-columns: 1fr;
	}

	.footer-bottom-inner {
		flex-direction: column;
		gap: 1rem;
		text-align: center;
	}
}

/* (Hero features estão sempre stacked verticalmente — sem regras
   extra de breakpoint necessárias.) */

/* --- 780px e abaixo (mobile) ---------------------------------------- */
@media (max-width: 780px) {
	/* Contactos: nas telas estreitas, sem padding horizontal. */
	.contacto-form-wrap,
	.contactos-text-column {
		padding-left: 0 !important;
		padding-right: 0 !important;
	}

	/* O grid do WP dentro do bloco "Fale Connosco" fica com 2 colunas de 12rem
	   e esmaga os items. Forçar 1 coluna em mobile. */
	.contactos-text-column .is-layout-grid {
		grid-template-columns: 1fr !important;
	}

	/* Stats grid 2x2 em vez de stack único. */
	.stats-grid {
		display: grid !important;
		grid-template-columns: 1fr 1fr !important;
		gap: 1.5rem !important;
	}

	.stats-grid .wp-block-column {
		flex-basis: auto !important;
	}
}

/* --- 781px e abaixo (breakpoint WP mobile) -------------------------- */
@media (max-width: 781px) {
	/* Header: CTA esconde (o hamburger fica limpo — o CTA está no hero). */
	.site-header-cta {
		display: none !important;
	}

	.site-header-inner {
		padding-inline: 1rem;
		row-gap: 0.75rem;
	}

	/* Trust bar vertical no mobile. */
	.trust-bar .wp-block-columns {
		flex-direction: column;
	}

	/* Porque-zincoliver MANTÉM side-by-side em tablet — só stack em
	   ecrãs muito estreitos (regra movida para o bloco @600px abaixo). */

	/* Serviços stack. */
	.servicos-section .wp-block-columns {
		flex-direction: column;
	}

	.new-servico-card {
		margin-bottom: 1rem;
	}

	/* Setores: 2 colunas em vez de 4 no mobile. */
	.setores-section .wp-block-columns {
		flex-wrap: wrap;
		justify-content: center;
		gap: 1.5rem;
	}

	.setor-item {
		flex-basis: calc(50% - 1rem);
	}

	/* Footer stack. */
	.site-footer {
		padding-left: 1rem !important;
		padding-right: 1rem !important;
		padding-top: 2rem !important;
	}

	/* Barra admin WP mobile (46px em vez de 32px). */
	.admin-bar .site-header,
	.admin-bar .wp-block-template-part:has(.site-header) {
		top: 46px;
	}

	.admin-bar html {
		scroll-padding-top: 122px; /* 76px header + 46px admin bar */
	}

	/* Contactos map em mobile (alignfull full-bleed). */
	.contactos-section .alignfull {
		margin-left: -1.5rem !important;
		margin-right: -1.5rem !important;
		width: 100vw !important;
		max-width: 100vw !important;
	}
}

/* --- 860px e abaixo (hero stack) ------------------------------------ */
@media (max-width: 860px) {
	.hero-premium-container > .wp-block-columns {
		flex-wrap: wrap !important;
		flex-direction: column !important;
	}

	.hero-premium-container .wp-block-columns > .wp-block-column {
		flex-basis: 100% !important;
		width: 100% !important;
	}
}

/* --- 900px e abaixo ------------------------------------------------- */
@media (max-width: 900px) {
	/* Hero visual */
	.hero-premium-section {
		padding-top: 1.5rem;
	}

	.hero-glass-card {
		margin-top: 0.8rem;
		max-width: none;
	}

	.hero-premium-container {
		min-height: auto;
		max-height: none;
	}

	/* Trust bar em 2 colunas. */
	.trust-bar .trust-bar-columns {
		flex-wrap: wrap;
	}

	.trust-bar .trust-bar-item {
		flex-basis: 50%;
		border-right: none;
		border-bottom: 1px solid var(--wp--preset--color--azul-muito-claro, #e8eaf6);
	}

	.trust-bar .trust-bar-item:nth-child(odd) {
		border-right: 1px solid var(--wp--preset--color--azul-muito-claro, #e8eaf6);
	}

	.trust-bar .trust-bar-item:nth-last-child(-n+2) {
		border-bottom: none;
	}

	/* Footer 2 colunas. */
	.footer-grid {
		grid-template-columns: 1fr 1fr !important;
		gap: 3rem !important;
	}

	.footer-brand-col {
		grid-column: 1 / -1;
	}
}

/* --- 780px e abaixo (contactos stack em mobile/tablet pequeno) ------- */
@media (max-width: 780px) {
	.contactos-columns {
		flex-direction: column !important;
	}

	.contactos-columns > .wp-block-column {
		flex-basis: 100% !important;
		width: 100% !important;
		max-width: 100% !important;
	}

	.contactos-text-column {
		margin-bottom: 2rem;
	}

	/* Nome/Email empilhados em mobile para evitar truncamento. */
	.zincoliver-contact-form .form-row,
	.contacto-form-wrap .form-row {
		display: grid !important;
		grid-template-columns: 1fr !important;
	}
}

/* --- 781px e acima (contactos side-by-side: vCard | form) ----------- */
@media (min-width: 781px) {
	.contactos-columns {
		flex-direction: row !important;
		flex-wrap: nowrap !important;
		gap: 2.5rem;
		align-items: flex-start !important;
	}

	.contactos-columns > .contactos-text-column {
		flex-basis: 40% !important;
		max-width: 40% !important;
	}

	.contactos-columns > .wp-block-column:not(.contactos-text-column) {
		flex-basis: 60% !important;
		max-width: 60% !important;
	}
}

@media (min-width: 1100px) {
	.contactos-columns {
		gap: 4rem;
	}
}

/* ==========================================================================
   Novas classes introduzidas quando as parts foram reescritas para
   blocos core (substituem inline typography/spacing que davam block
   validation warnings).
   ========================================================================== */

/* Eyebrows. */
.porque-eyebrow,
.servicos-eyebrow {
	color: var(--wp--preset--color--azul-cta, #1A237E);
	font-size: 0.8125rem;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	margin: 0 0 0.5rem;
}

/* Títulos de secção. */
.porque-title,
.servicos-title,
.setores-title,
.cta-orcamento-title {
	font-size: clamp(1.75rem, 3vw, 2rem);
	font-weight: 700;
	letter-spacing: -0.01em;
	margin: 0 0 1rem;
}

/* Lead paragraphs. */
.servicos-lead,
.cta-orcamento-lead {
	color: var(--wp--preset--color--cinza-medio, #64748b);
	font-size: 1rem;
	line-height: 1.6;
	margin: 0 0 0.5rem;
}

.servicos-capacity {
	font-weight: 600;
	color: var(--wp--preset--color--preto-suave, #0f172a);
	margin: 0.5rem 0 1.5rem;
}

.servicos-inner {
	max-width: 1200px;
	margin-inline: auto;
}

/* Cards de serviço. */
.servico-title {
	font-size: 1.25rem;
	font-weight: 700;
	margin: 0 0 0.75rem;
	color: var(--wp--preset--color--preto-suave, #0f172a);
}

.servico-list {
	color: var(--wp--preset--color--cinza-escuro, #334155);
	font-size: 0.95rem;
	line-height: 1.6;
	margin: 0 0 1rem;
}

.servico-nota {
	color: var(--wp--preset--color--cinza-medio, #64748b);
	font-size: 0.9rem;
	font-style: italic;
	margin: 1rem 0 0;
}

/* Porque — links CTA e badge info. */
.porque-cta {
	margin-top: 1.5rem;
}

.porque-badge-title {
	font-size: 0.9rem;
	font-weight: 700;
	margin: 0;
	color: var(--wp--preset--color--preto-suave, #0f172a);
}

.porque-badge-desc {
	font-size: 0.75rem;
	color: var(--wp--preset--color--cinza-medio, #64748b);
	margin: 0.125rem 0 0;
}

/* Antes/Depois spacing. */
.antes-depois-inner {
	max-width: 1200px;
	margin-inline: auto;
}

.antes-depois-grid {
	margin-top: 3rem;
}

/* Contactos vCard — label-text (texto dentro do label wrap). */
.contacto-vcard-label-text {
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--wp--preset--color--cinza-medio, #64748b);
	margin: 0;
}

.contacto-vcard-cta {
	margin-top: 0.5rem;
}

/* Re-aplica a estrutura visual do vCard agora que deixou de ser <dl>. */
.contacto-vcard-row {
	display: block;
	padding: 1rem 0;
	border-top: 1px solid rgba(226, 232, 240, 0.8);
}

.contacto-vcard-row:first-of-type {
	border-top: none;
	padding-top: 0;
}

.contacto-vcard-row > .wp-block-group:first-child {
	margin-bottom: 0.4rem;
}

/* 404. */
.error-404-title {
	font-size: clamp(2.5rem, 5vw, 3.5rem);
	font-weight: 700;
	letter-spacing: -0.02em;
	margin: 0 0 1rem;
}

.error-404-lead {
	font-size: 1.1rem;
	color: var(--wp--preset--color--cinza-medio, #64748b);
	margin: 0 0 2rem;
}

.error-404-buttons {
	margin-top: 2rem;
}

/* ==========================================================================
   Ícones via CSS mask-image.
   Cada ícone é um ficheiro SVG em assets/icons/. Aplicamos como máscara
   sobre um pseudo-elemento ::before, com background-color = currentColor,
   para permitir colorir via CSS. Zero markup extra no HTML — é só uma
   classe na container do bloco (sem shortcodes, sem wp:html).
   ========================================================================== */

.zi-icon::before {
	content: '';
	display: inline-block;
	flex-shrink: 0;
	width: var(--zi-icon-size, 28px);
	height: var(--zi-icon-size, 28px);
	background-color: currentColor;
	-webkit-mask-image: var(--zi-icon-src);
	mask-image: var(--zi-icon-src);
	-webkit-mask-size: contain;
	mask-size: contain;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
	vertical-align: middle;
}

.zi-icon--medal        { --zi-icon-src: url('assets/icons/medal.svg'); }
.zi-icon--factory      { --zi-icon-src: url('assets/icons/factory.svg'); }
.zi-icon--check-badge  { --zi-icon-src: url('assets/icons/check-badge.svg'); }
.zi-icon--building     { --zi-icon-src: url('assets/icons/building.svg'); }
.zi-icon--car          { --zi-icon-src: url('assets/icons/car.svg'); }
.zi-icon--wrench       { --zi-icon-src: url('assets/icons/wrench.svg'); }
.zi-icon--chip         { --zi-icon-src: url('assets/icons/chip.svg'); }
.zi-icon--cog          { --zi-icon-src: url('assets/icons/cog.svg'); }
.zi-icon--cube         { --zi-icon-src: url('assets/icons/cube.svg'); }
.zi-icon--sparkles     { --zi-icon-src: url('assets/icons/sparkles.svg'); }
.zi-icon--shield-check { --zi-icon-src: url('assets/icons/shield-check.svg'); }
.zi-icon--map-pin      { --zi-icon-src: url('assets/icons/map-pin.svg'); }
.zi-icon--phone        { --zi-icon-src: url('assets/icons/phone.svg'); }
.zi-icon--envelope     { --zi-icon-src: url('assets/icons/envelope.svg'); }

/* Trust bar: ícone pequeno inline, cor azul, 28px. */
.trust-bar-item.zi-icon {
	--zi-icon-size: 28px;
	color: var(--wp--preset--color--azul-cta, #1A237E);
}

/* Setores: ícone em círculo azul-claro, 40px, com padding. */
.setor-item.zi-icon {
	--zi-icon-size: 40px;
	color: var(--wp--preset--color--azul-cta, #1A237E);
}
.setor-item.zi-icon::before {
	background-color: var(--wp--preset--color--azul-cta, #1A237E);
	padding: 1rem;
	border-radius: 50%;
	background-clip: content-box;
}

/* Serviços: ícone num quadrado arredondado azul-claro. */
.new-servico-card.zi-icon {
	--zi-icon-size: 32px;
	color: var(--wp--preset--color--azul-cta, #1A237E);
}

/* Certificações: ícone central grande. */
.cert-card.zi-icon {
	--zi-icon-size: 44px;
	color: var(--wp--preset--color--azul-cta, #1A237E);
}
.cert-card.zi-icon::before {
	display: block;
	margin: 0 auto 1rem;
}

/* Contactos vCard: ícones pequenos ao lado do label. */
.contacto-vcard-label.zi-icon {
	--zi-icon-size: 18px;
	color: var(--wp--preset--color--azul-cta, #1A237E);
}