/**
 * Homepage editorial -- direcao visual clara/bordeaux validada nos
 * mockups (seccao 18 do documento de especificacao). Paleta definida
 * tambem em style.css (:root), repetida aqui em valores fixos para
 * este ficheiro poder ser lido de forma independente.
 */

.ava-hero {
	position: relative;
	min-height: 480px;
	display: flex;
	align-items: center;
	overflow: hidden;
	background: #12141C;
}

.ava-hero__slide {
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center;
	opacity: 0;
	transition: opacity 1.2s ease;
}

.ava-hero__slide--ativo {
	opacity: 1;
}

.ava-hero__slide--sem-imagem {
	background: linear-gradient(135deg, #12141C 0%, #5C0A1E 100%);
}

.ava-hero::after {
	content: "";
	position: absolute;
	inset: 0;
	/* Tom bordeaux (a mesma familia de cor da marca, #5C0A1E) em vez do
	   tom escuro/amarelado anterior -- pedido do Nuno em 2026-07, bem
	   tenue para nao tapar a cor natural da foto. */
	background: rgba(92, 10, 30, 0.28);
}

.ava-hero__conteudo {
	position: relative;
	z-index: 1;
	max-width: 640px;
	margin: 0 auto;
	text-align: center;
	padding: 40px 24px;
	color: #fff;
}

.ava-hero__etiqueta {
	letter-spacing: 2px;
	font-size: 14px;
	color: #F0C24A;
	font-weight: 600;
	margin-bottom: 12px;
	text-shadow: 0 2px 10px rgba(0, 0, 0, 0.55);
}

.ava-hero__titulo {
	font-size: 36px;
	margin: 0 0 12px;
	/* Cor explicita (nao so herdada) e sombra mais forte -- pedido do
	   Nuno em 2026-07: com fotos claras/sepia no fundo, o branco puro
	   sem sombra suficiente perdia contraste. */
	color: #fff;
	text-shadow: 0 2px 6px rgba(0, 0, 0, 0.85), 0 4px 20px rgba(0, 0, 0, 0.6);
}

.ava-hero__subtitulo {
	font-size: 16px;
	opacity: 0.9;
	margin: 0 0 28px;
	text-shadow: 0 2px 10px rgba(0, 0, 0, 0.5);
}

.ava-hero__pesquisa {
	display: flex;
	gap: 8px;
	background: #fff;
	border-radius: 8px;
	padding: 6px;
}

.ava-hero__pesquisa input {
	flex: 1;
	border: none;
	padding: 12px 14px;
	font-size: 14px;
	border-radius: 6px;
}

.ava-hero__pesquisa button {
	background: #8F0E2C;
	color: #fff;
	border: none;
	padding: 0 22px;
	border-radius: 6px;
	font-weight: 600;
	cursor: pointer;
}

.ava-hero__scroll {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 2;
	overflow: hidden;
	background: rgba(18, 20, 28, 0.55);
	padding: 12px 0;
}

.ava-hero__scroll-faixa {
	display: flex;
	gap: 14px;
	width: max-content;
	animation: ava-hero-scroll 45s linear infinite;
}

.ava-hero__scroll:hover .ava-hero__scroll-faixa {
	animation-play-state: paused;
}

.ava-hero__scroll-item {
	flex-shrink: 0;
	width: 64px;
	height: 84px;
	border-radius: 4px;
	overflow: hidden;
	display: block;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.35);
}

.ava-hero__scroll-item img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

@keyframes ava-hero-scroll {
	from {
		transform: translateX(0);
	}
	to {
		transform: translateX(-50%);
	}
}

@media (prefers-reduced-motion: reduce) {
	.ava-hero__scroll-faixa {
		animation: none;
	}
}

.ava-inspire {
	background: #F4E8EA;
	display: flex;
	align-items: center;
	gap: 16px;
	padding: 20px 40px;
}

.ava-inspire__icone {
	color: #8F0E2C;
	font-size: 22px;
}

.ava-inspire__texto {
	flex: 1;
}

.ava-inspire__etiqueta {
	font-size: 11px;
	letter-spacing: 1.5px;
	color: #8F0E2C;
	font-weight: 600;
}

.ava-inspire__titulo {
	font-size: 15px;
	color: #5C0A1E;
}

.ava-inspire__titulo a {
	color: #8F0E2C;
	font-weight: 600;
}

.ava-inspire__botao {
	white-space: nowrap;
	border: 1px solid #8F0E2C;
	color: #8F0E2C;
	padding: 8px 16px;
	border-radius: 6px;
	font-size: 13px;
}

.ava-inspire__miniatura {
	position: relative;
	flex-shrink: 0;
	display: block;
	width: 72px;
	height: 54px;
	border-radius: 6px;
	overflow: hidden;
	box-shadow: 0 1px 4px rgba(92, 10, 30, 0.25);
}

.ava-inspire__miniatura img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.ava-inspire__play {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	font-size: 16px;
	background: rgba(0, 0, 0, 0.25);
	transition: background 0.15s ease;
}

.ava-inspire__miniatura:hover .ava-inspire__play {
	background: rgba(0, 0, 0, 0.4);
}

.ava-inspire__spotify {
	flex-shrink: 0;
	white-space: nowrap;
	font-size: 12px;
	font-weight: 600;
	color: #fff;
	background: #1DB954;
	padding: 6px 12px;
	border-radius: 999px;
}

.ava-categorias,
.ava-catalogo-tabs,
.ava-compositores {
	max-width: 1100px;
	margin: 0 auto;
	padding: 48px 24px;
}

.ava-categorias h2,
.ava-catalogo-tabs h2,
.ava-compositores h2 {
	font-size: 22px;
	margin-bottom: 20px;
}

.ava-categorias__grelha {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
	gap: 10px;
}

.ava-categorias__item {
	border: 1px solid #EEE3DA;
	border-radius: 8px;
	padding: 14px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
}

.ava-categorias__item:hover {
	border-color: #8F0E2C;
	box-shadow: 0 6px 16px rgba(36, 26, 29, 0.1);
	transform: translateY(-2px);
}

.ava-categorias__item small {
	color: #8C7D80;
}

.ava-catalogo-tabs__cabecalho {
	display: flex;
	gap: 8px;
	margin-bottom: 20px;
}

.ava-catalogo-tabs__botao {
	background: none;
	border: 1px solid #E6D9CE;
	border-radius: 20px;
	padding: 8px 18px;
	font-size: 13px;
	cursor: pointer;
}

.ava-catalogo-tabs__botao--ativo {
	background: #8F0E2C;
	color: #fff;
	border-color: #8F0E2C;
}

.ava-catalogo-tabs__painel {
	display: none;
	grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
	gap: 16px;
}

.ava-catalogo-tabs__painel--ativo {
	display: grid;
}

.ava-catalogo-tabs__rodape {
	margin-top: 20px;
	text-align: center;
}

.ava-catalogo-tabs__rodape a {
	color: #8F0E2C;
	font-weight: 600;
}

.ava-compositores__grelha {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
	gap: 16px;
}

.ava-compositores__item {
	text-align: center;
	font-size: 13px;
}

.ava-compositores__foto {
	aspect-ratio: 1;
	border-radius: 50%;
	overflow: hidden;
	background: #F4E8EA;
	margin-bottom: 8px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.ava-compositores__foto img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.ava-compositores__foto-vazia {
	font-size: 32px;
	font-weight: 600;
	color: #8F0E2C;
}

.ava-compositores__rodape,
.ava-categorias__rodape {
	margin-top: 24px;
	text-align: center;
}

.ava-compositores__rodape a,
.ava-categorias__rodape a {
	color: #8F0E2C;
	font-weight: 600;
}

.ava-concertos-home {
	max-width: 1100px;
	margin: 0 auto;
	padding: 48px 24px;
}

.ava-concertos-home h2 {
	font-size: 22px;
	margin-bottom: 20px;
}

.ava-concertos-home__lista {
	list-style: none;
	margin: 0;
	padding: 0;
}

.ava-concertos-home__item {
	display: flex;
	align-items: baseline;
	gap: 20px;
	padding: 14px 0;
	border-bottom: 1px solid #EEE3DA;
}

.ava-concertos-home__item:last-child {
	border-bottom: none;
}

.ava-concertos-home__data {
	flex-shrink: 0;
	width: 110px;
	font-weight: 700;
	color: #8F0E2C;
	font-size: 14px;
}

.ava-concertos-home__detalhe {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 4px 10px;
}

.ava-concertos-home__obra {
	font-weight: 600;
	color: #3A2E30;
	text-decoration: none;
}

.ava-concertos-home__obra:hover {
	text-decoration: underline;
}

.ava-concertos-home__local {
	font-size: 13px;
	color: #8C7D80;
}

/*
 * ava_agenda_nome_compositor_ligado() (inc/agenda.php) devolve sempre
 * a mesma classe "ava-agenda__compositor" nesta seccao e na Agenda
 * completa (archive-ava_concerto.php) -- ali o estilo vem de
 * agenda.css, mas esse ficheiro nao carrega na homepage, por isso o
 * estilo repete-se aqui para a ligação ao compositor nao aparecer sem
 * formatação nenhuma.
 */
.ava-concertos-home__detalhe .ava-agenda__compositor {
	color: #8F0E2C;
	text-decoration: none;
	font-weight: 600;
}

.ava-concertos-home__detalhe .ava-agenda__compositor:hover {
	text-decoration: underline;
}

.ava-concertos-home__detalhe .ava-agenda__compositor::before {
	content: "—";
	margin-right: 8px;
	color: #8C7D80;
	font-weight: 400;
}

.ava-concertos-home__rodape {
	margin-top: 20px;
	text-align: center;
}

.ava-concertos-home__rodape a {
	color: #8F0E2C;
	font-weight: 600;
}

.ava-aluguer-cta {
	background: #8F0E2C;
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	padding: 40px;
	flex-wrap: wrap;
}

.ava-aluguer-cta__texto h2 {
	margin: 0 0 8px;
}

.ava-aluguer-cta__texto p {
	max-width: 520px;
	opacity: 0.9;
	margin: 0;
}

.ava-aluguer-cta__botao {
	background: #fff;
	color: #8F0E2C;
	padding: 12px 22px;
	border-radius: 6px;
	font-weight: 600;
	white-space: nowrap;
}

.ava-newsletter {
	text-align: center;
	padding: 48px 24px;
}

.ava-newsletter__form {
	display: flex;
	gap: 8px;
	max-width: 420px;
	margin: 16px auto 0;
}

.ava-newsletter__form input {
	flex: 1;
	padding: 12px 14px;
	border: 1px solid #E6D9CE;
	border-radius: 6px;
}

.ava-newsletter__form button {
	background: #8F0E2C;
	color: #fff;
	border: none;
	padding: 0 20px;
	border-radius: 6px;
	font-weight: 600;
	cursor: pointer;
}

.ava-newsletter__nota {
	font-size: 12px;
	color: #8C7D80;
	margin-top: 10px;
}