/*
Theme Name: Nautika Child
Theme URI: https://nautikacoberturas.com.br/
Description: Tema filho de Hello Elementor. Guarda as customizacoes da Nautika (WhatsApp flutuante, motor de animacao, CSS/SEO) para que atualizacoes do tema pai nao as apaguem.
Author: Nautika Coberturas
Template: hello-elementor
Version: 1.0.0
Text Domain: hello-elementor-child
*/

/* ==========================================================================
   ITEM 5 - LCP / opacity: 0
   --------------------------------------------------------------------------
   O Chrome nao elege um elemento como LCP enquanto ele estiver com
   opacity: 0. Os elementos do hero de /armazenagem/ e /eventos/ nascem com
   opacity: 0 e so recebem a classe .na-in depois de document.fonts.ready
   (263 @font-face na pagina, ultima fonte em ~2.1s) + 120ms + delay proprio.
   Resultado medido: LCP 848ms (armazenagem) e 864ms (eventos) acima do FCP.

   Correcao: o hero acima da dobra nasce visivel (opacity: 1) e a entrada
   passa a ser feita apenas por transform, via keyframes, que comeca no
   momento em que o CSS e lido - sem depender do JS nem das fontes.
   O estado final e identico ao de hoje (transform: none), portanto nada
   muda de posicao.

   Escopo: apenas os widgets do hero das paginas 3447 e 3566. As demais
   ocorrencias de .ntk-hero__text / .ntk-hero__btn mais abaixo nessas
   paginas continuam com a animacao por scroll intacta.
   Rollback: apagar este bloco.
   ========================================================================== */

@keyframes ntkHeroIn  { from { transform: translate3d(0, 18px, 0) } to { transform: none } }
@keyframes ntkHeroInW { from { transform: translate3d(0, .3em, 0) } to { transform: none } }
@keyframes ntkHeroBar { from { transform: scaleX(0) }               to { transform: none } }

/* ---------- /armazenagem/ (3447) ---------- */

html.na-on body.page-id-3447 .ntk-hero__crumb {
	opacity: 1;
	animation: ntkHeroIn 520ms cubic-bezier(.22, .61, .36, 1) 0ms both;
}
html.na-on body.page-id-3447 .ntk-hero__sub {
	opacity: 1;
	animation: ntkHeroIn 600ms cubic-bezier(.22, .61, .36, 1) 120ms both;
}
html.na-on body.page-id-3447 .ntk-hero__text {
	opacity: 1;
	animation: ntkHeroIn 600ms cubic-bezier(.22, .61, .36, 1) 180ms both;
}
html.na-on body.page-id-3447 .ntk-hero__cta {
	opacity: 1;
	animation: ntkHeroIn 600ms cubic-bezier(.22, .61, .36, 1) 260ms both;
}
html.na-on body.page-id-3447 .ntk-hero__title {
	opacity: 1;
}
html.na-on body.page-id-3447 .ntk-hero__title .na-w {
	opacity: 1;
	animation: ntkHeroInW 400ms cubic-bezier(.22, .61, .36, 1) 0ms both;
}
html.na-on body.page-id-3447 .ntk-hero__title .elementor-heading-title::after {
	animation: ntkHeroBar 820ms cubic-bezier(.22, .61, .36, 1) 200ms both;
}

@media (max-width: 1023px) {
	html.na-on body.page-id-3447 .ntk-hero .ntk-hero__title > .elementor-widget-container::after {
		animation: ntkHeroBar 820ms cubic-bezier(.22, .61, .36, 1) 200ms both;
	}
}

/* ---------- /eventos/ (3566) ----------
   Nesta pagina .ntk-hero__text e .ntk-hero__btn tambem sao usados em secoes
   mais abaixo, entao o alvo aqui e o ID Elementor de cada widget do hero. */

html.na-on body.page-id-3566 .elementor-element-5cc54c4.ntk-hero__text {
	opacity: 1;
	animation: ntkHeroIn 600ms cubic-bezier(.22, .61, .36, 1) 120ms both;
}
html.na-on body.page-id-3566 .elementor-element-0f23d14.ntk-hero__text {
	opacity: 1;
	animation: ntkHeroIn 600ms cubic-bezier(.22, .61, .36, 1) 180ms both;
}
html.na-on body.page-id-3566 .ntk-hv.ntk-hero__btn {
	opacity: 1;
	animation: ntkHeroIn 600ms cubic-bezier(.22, .61, .36, 1) 260ms both;
}
html.na-on body.page-id-3566 .elementor-element-effdffc.ntk-hero__title {
	opacity: 1;
}
html.na-on body.page-id-3566 .elementor-element-effdffc.ntk-hero__title .na-w {
	opacity: 1;
	animation: ntkHeroInW 400ms cubic-bezier(.22, .61, .36, 1) 0ms both;
}
html.na-on body.page-id-3566 .elementor-element-effdffc.ntk-hero__title .elementor-heading-title::after {
	animation: ntkHeroBar 820ms cubic-bezier(.22, .61, .36, 1) 200ms both;
}

/* ---------- acessibilidade / impressao ---------- */

@media (prefers-reduced-motion: reduce) {
	html.na-on body.page-id-3447 .ntk-hero__crumb,
	html.na-on body.page-id-3447 .ntk-hero__sub,
	html.na-on body.page-id-3447 .ntk-hero__text,
	html.na-on body.page-id-3447 .ntk-hero__cta,
	html.na-on body.page-id-3447 .ntk-hero__title,
	html.na-on body.page-id-3447 .ntk-hero__title .na-w,
	html.na-on body.page-id-3447 .ntk-hero__title .elementor-heading-title::after,
	html.na-on body.page-id-3566 .elementor-element-5cc54c4.ntk-hero__text,
	html.na-on body.page-id-3566 .elementor-element-0f23d14.ntk-hero__text,
	html.na-on body.page-id-3566 .ntk-hv.ntk-hero__btn,
	html.na-on body.page-id-3566 .elementor-element-effdffc.ntk-hero__title,
	html.na-on body.page-id-3566 .elementor-element-effdffc.ntk-hero__title .na-w,
	html.na-on body.page-id-3566 .elementor-element-effdffc.ntk-hero__title .elementor-heading-title::after {
		animation: none !important;
		opacity: 1 !important;
		transform: none !important;
	}
}

@media print {
	html.na-on body.page-id-3447 .ntk-hero__crumb,
	html.na-on body.page-id-3447 .ntk-hero__sub,
	html.na-on body.page-id-3447 .ntk-hero__text,
	html.na-on body.page-id-3447 .ntk-hero__cta,
	html.na-on body.page-id-3447 .ntk-hero__title,
	html.na-on body.page-id-3447 .ntk-hero__title .na-w,
	html.na-on body.page-id-3566 .elementor-element-5cc54c4.ntk-hero__text,
	html.na-on body.page-id-3566 .elementor-element-0f23d14.ntk-hero__text,
	html.na-on body.page-id-3566 .ntk-hv.ntk-hero__btn,
	html.na-on body.page-id-3566 .elementor-element-effdffc.ntk-hero__title,
	html.na-on body.page-id-3566 .elementor-element-effdffc.ntk-hero__title .na-w {
		animation: none !important;
		opacity: 1 !important;
		transform: none !important;
	}
}
