/*
Theme Name: Astra Child
Template: astra
Version: 1.0
*/
/* --- Filter Bar Wrapper --- */
/* Make .active have the same styles as hover */
.wp-block-button__link.active {
    background-color: var(--ast-global-color-0);
    color: var(--ast-global-color-4);
    border-color: var(--ast-global-color-0);
}

.mz-filter-bar {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

/* Centraliza conteúdo da página com ID 2 e limita largura */
.page-id-2 .entry-content {
  max-width: 800px;
  margin-left: auto;
  margin-right: auto;
  text-align: center; /* centraliza o texto */
  padding: 0 1rem;    /* pequeno padding lateral para mobile */
  box-sizing: border-box;
}

/* Limita largura do bloco e centraliza */
p.limit-800 {
  max-width: 800px !important; /* força a largura máxima */
  margin-left: auto !important;
  margin-right: auto !important;
  width: 100% !important; /* mantém responsivo */
}



/* ================= HERO CURTAIN FINAL ================= */

/* Remove qualquer background/dim do inner container */
.wp-block-cover.hero-curtain .wp-block-cover__inner-container {
  background: transparent !important;
  box-shadow: none !important;
}

/* Remove o overlay se existir */
.wp-block-cover.hero-curtain .wp-block-cover__background {
  background: none !important;
}

/* Bloco Cover Hero */
.wp-block-cover.hero-curtain {
  position: relative !important;
  height: 100vh !important;
  overflow: hidden !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Imagem de fundo fixa atrás do conteúdo */
.wp-block-cover.hero-curtain .wp-block-cover__image-background {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  object-fit: cover !important;
  object-position: center center !important;
  z-index: 1 !important; /* atrás do conteúdo */
  transition: opacity 0.4s ease-out, transform 0.2s ease-out; /* fade + zoom suave */
	  pointer-events: none !important;
}

/* Remove interferência do inner container */
.wp-block-cover.hero-curtain .wp-block-cover__inner-container {
  background: transparent !important;
  box-shadow: none !important;
  position: relative !important;
  z-index: 2 !important;
  height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  align-items: center !important;
  text-align: center !important;
  padding: 0 2rem !important;
  max-width: 90% !important;
  margin: 0 auto !important;
}

/* Containers internos do Gutenberg */
.wp-block-cover.hero-curtain .wp-block-group {
  max-width: 100% !important;
  width: 100% !important;
}

/* Título principal */
.wp-block-cover.hero-curtain h2.wp-block-heading {
  font-size: 3vw !important; /* desktop responsivo */
  line-height: 1.1 !important;
  max-width: 100% !important;
  white-space: normal !important;
  word-break: break-word !important;
  text-transform: uppercase;
}

/* Botão */
.wp-block-cover.hero-curtain .wp-block-button__link {
  font-size: 1rem !important;
  padding: 0.8rem 2rem !important;
  text-transform: uppercase !important;
}

/* Remove fundo branco automático do bloco seguinte */
.wp-block-cover.hero-curtain + * {
  position: relative !important;
  z-index: 2 !important;
  background: none !important;
}

/* Remove padding/margin do Astra que empurra o topo */
.home .site-content,
.home .ast-container,
.home #primary.content-area {
  padding-top: 0 !important;
  margin-top: 0 !important;
}


/* ================= RESPONSIVO MOBILE ================= */
@media (max-width: 1024px) {
  .wp-block-cover.hero-curtain h2.wp-block-heading {
    font-size: 7vw !important; /* maior para tablet */
    max-width: 90% !important;
  }

  .wp-block-cover.hero-curtain .wp-block-cover__inner-container {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 1.5rem !important;
  }

  .wp-block-cover.hero-curtain .wp-block-button__link {
    font-size: 1rem !important;
    padding: 0.8rem 2rem !important;
  }
}

@media (max-width: 480px) {
  .wp-block-cover.hero-curtain h2.wp-block-heading {
    font-size: 8vw !important; /* smartphones */
  }

  .wp-block-cover.hero-curtain .wp-block-button__link {
    font-size: 0.9rem !important;
    padding: 0.6rem 1.5rem !important;
  }
}




.wp-block-cover.hero-curtain .wp-block-cover__image-background {
  opacity: 0;
  transition: opacity 1.2s cubic-bezier(0.4, 0, 0.2, 1);
  will-change: opacity;
}

.wp-block-cover.hero-curtain.loaded .wp-block-cover__image-background {
  opacity: 1;
}

/* ========== Fade-in suave do conteúdo do hero com atraso ========== */
.wp-block-cover.hero-curtain .wp-block-cover__inner-container {
  opacity: 0;
  transform: translateY(10px);
  transition: opacity 1s ease-out 0.3s, transform 1.2s ease-out 0.3s;
  /* 0.3s = atraso após a imagem começar a aparecer */
}

.wp-block-cover.hero-curtain.loaded .wp-block-cover__inner-container {
  opacity: 1;
  transform: translateY(0);
}

.wp-block-cover.hero-curtain .wp-block-cover__image-background {
  opacity: 0;
  transition: opacity 2s cubic-bezier(0.4, 0, 0.2, 1), transform 0.2s ease-out;
  will-change: opacity;
}

/* Adiciona esta (nova) regra para o fade durante o scroll */
.wp-block-cover.hero-curtain.scrolling .wp-block-cover__image-background {
  transition: opacity 0.1s ease-out; /* fade suave e rápido ao scroll */
}


/*
 * triggered fade in
 * 
 */

/* Estado inicial — invisível e ligeiramente deslocado */
/* Estado inicial: invisível e ligeiramente deslocado */
.scroll-triggered {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}

/* Quando entra na viewport */
.fade-in-visible {
  opacity: 1;
  transform: translateY(0);
}


/* Para o video...*/
.video-section {
    width: 100%;
    height: 75vh;
    overflow: hidden;
    position: relative;
}

.video-section video {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

@media (max-width: 768px) {
    .video-section {
        height: 30vh;
    }
}