/* -------------------------------------------------------------------------
 * Transições de página (View Transitions API)
 *
 * Navegação MPA normal: o browser faz a transição entre o snapshot da
 * página antiga e a nova, sem flash branco. Em browsers sem suporte
 * (Firefox) tudo isto é ignorado e a navegação fica como sempre foi.
 * ------------------------------------------------------------------------- */

@view-transition {
	navigation: auto;
}

/* Os headers transitam à parte do resto da página: como existem em todas
 * as páginas com o mesmo nome, ficam visualmente imóveis na navegação. */
#main-header {
	view-transition-name: mmp-header;
}

#sticky-header {
	view-transition-name: mmp-sticky-header;
}

/* Conteúdo: a página antiga desvanece depressa; a nova entra com fade e
 * uma subida curta, a compor com as animações de hero do GSAP. */
::view-transition-old(root) {
	animation: mmp-vt-sair 0.18s ease both;
}

::view-transition-new(root) {
	animation: mmp-vt-entrar 0.4s cubic-bezier(0.22, 1, 0.36, 1) both;
}

@keyframes mmp-vt-sair {
	to { opacity: 0; }
}

@keyframes mmp-vt-entrar {
	from {
		opacity: 0;
		transform: translateY(14px);
	}
}

/* Sem animação para quem prefere movimento reduzido: troca instantânea */
@media (prefers-reduced-motion: reduce) {
	::view-transition-group(*),
	::view-transition-old(*),
	::view-transition-new(*) {
		animation: none !important;
	}
}
