/*
Theme Name: Agência GP Child
Template: generatepress
Description: Framework de temas da agência, construído sobre o GeneratePress.
Author: Agência
Version: 1.0.0
Text Domain: agencia-gp-child
*/

/* ==========================================================================
   Responsividade Mobile
   ========================================================================== */

@media (max-width: 768px) {
	/* Cabeçalho centralizado: deixa o menu mobile nativo do GeneratePress assumir */
	body.header-centralizado .main-navigation {
		width: auto;
		text-align: left;
	}

	body.header-centralizado .main-navigation .inside-navigation {
		display: block;
	}

	body.header-centralizado .main-navigation ul.menu {
		display: block;
		float: none;
	}

	body.header-centralizado .inside-header {
		flex-direction: row;
		align-items: center;
		text-align: left;
	}

	/* Rodapé: sempre empilhado em telas pequenas, mesmo no layout "padrão" */
	.agencia-footer-identidade {
		flex-direction: column;
		text-align: center;
		gap: 1rem;
	}

	.agencia-footer-logo-img {
		max-height: 48px;
	}
}

.agencia-destaques-carrossel {
	position: relative;
	overflow: hidden;
	max-width: 100%;
}

.agencia-destaques-seta {
	display: none;
	position: absolute;
	top: 50%;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	margin: 0;
	padding: 0;
	transform: translateY(-50%);
	appearance: none;
	-webkit-appearance: none;
	border: none;
	outline: none;
	border-radius: 50%;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);
	color: #fff;
	font-size: 1.4rem;
	line-height: 1;
	cursor: pointer;
	z-index: 2;
	opacity: 0.9;
	transition: opacity 0.2s ease, transform 0.2s ease;
}

.agencia-destaques-seta:hover,
.agencia-destaques-seta:focus-visible {
	opacity: 1;
	transform: translateY(-50%) scale(1.06);
}

.agencia-destaques-seta::-moz-focus-inner {
	border: 0;
}

.agencia-destaques-seta--anterior {
	left: 0.75rem;
}

.agencia-destaques-seta--proxima {
	right: 0.75rem;
}

@media (max-width: 600px) {
	.agencia-destaques-grade {
		display: flex !important;
		grid-template-columns: none !important;
		gap: 0;
		margin-bottom: 0;
	}

	.agencia-destaque-card {
		flex: 0 0 100% !important;
		width: 100%;
		border-radius: 0;
	}

	.agencia-destaques-seta {
		display: flex;
	}

	.agencia-destaque-linha {
		grid-template-columns: 1fr;
	}
}