/* afz-home-v4 — imagens cinematograficas na homepage (loop + cartoes) e retirada do isometrico do topo.
   Aprovado pelo dono a 17-09-2026. Reversivel: apagar este ficheiro e o bloco afz-home-v4 do functions.php. */

/* 1. O isometrico do topo sai (ficava por cima do loop e desmaiado por mix-blend-mode). */
html body .prem-hero-visual,
html body.home .prem-hero-visual,
html body.page-id-20 .prem-hero-visual { display: none !important; }

/* 2. Cartoes de servico: fotografia a cobrir todo o topo do cartao, sem moldura beje nem padding. */
html body .prem-card .prem-card-illus-wrap {
  background: #1a0a10 !important;
  box-shadow: inset 0 -3px 0 #8b2b31, inset 0 0 0 1px rgba(139, 43, 49, .15) !important;
}
html body .prem-card .prem-card-illus {
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  aspect-ratio: 16 / 10 !important;
  object-fit: cover !important;
  object-position: center !important;
  padding: 0 !important;
  margin: 0 !important;
  background: #1a0a10 !important;
  border-radius: 10px 10px 0 0 !important;
  mix-blend-mode: normal !important;
  filter: saturate(1.04) contrast(1.03) !important;
}
@media (max-width: 689px) {
  html body .ac-carousel-track.prem-cards > * .prem-card-illus {
    max-height: none !important;
    height: auto !important;
    aspect-ratio: 16 / 10 !important;
    object-fit: cover !important;
  }
}

/* 3. Fotografia com a qualidade natural: sai o vidro espelhado, sai o desbotado
      e o tingido vermelho; as linhas do desenho ficam discretas.
      O nome da actividade em letras grandes NAO se toca: fica onde sempre esteve. */
html body .ac-pres-slide.active { opacity: 1 !important; }
html body .ac-pres-slide .img { filter: none !important; }
html body .ac-pres-slide .img::after {
  background: linear-gradient(180deg, rgba(10,6,8,.18) 0%, rgba(10,6,8,.06) 45%, rgba(10,6,8,.34) 100%) !important;
  mix-blend-mode: normal !important;
}
html body .ac-glass-pane { display: none !important; }
html body .ac-planta-bg { opacity: .16 !important; }

/* 5. Texto de apoio mais branco, para se ler sobre a fotografia. */
html body .prem-hero-sub {
  color: rgba(255,255,255,.94) !important;
  text-shadow: 0 2px 10px rgba(0,0,0,.55) !important;
}
html body .prem-hero h1 { text-shadow: 0 3px 14px rgba(0,0,0,.45) !important; }

/* 6. As fotografias do loop ficam definidas aqui, e nao por comportamento depois
      de a pagina montar: assim nunca chega a aparecer a imagem antiga. */
html body .ac-presentation .ac-pres-slide:nth-child(1) .img{background-image:url("/wp-content/uploads/2026/09/afz-home-v4/afz-loop-avac.webp") !important;}
html body .ac-presentation .ac-pres-slide:nth-child(2) .img{background-image:url("/wp-content/uploads/2026/09/afz-home-v4/afz-loop-eletricidade.webp") !important;}
html body .ac-presentation .ac-pres-slide:nth-child(3) .img{background-image:url("/wp-content/uploads/2026/09/afz-home-v4/afz-loop-telecom.webp") !important;}
html body .ac-presentation .ac-pres-slide:nth-child(4) .img{background-image:url("/wp-content/uploads/2026/09/afz-home-v4/afz-loop-scie.webp") !important;}
html body .ac-presentation .ac-pres-slide:nth-child(5) .img{background-image:url("/wp-content/uploads/2026/09/afz-home-v4/afz-loop-fiscalizacao.webp") !important;}
html body .ac-presentation .ac-pres-slide:nth-child(6) .img{background-image:url("/wp-content/uploads/2026/09/afz-home-v4/afz-loop-comissionamento.webp") !important;}
html body .ac-presentation .ac-pres-slide:nth-child(7) .img{background-image:url("/wp-content/uploads/2026/09/afz-home-v4/afz-loop-auditorias.webp") !important;}
html body .ac-presentation .ac-pres-slide:nth-child(8) .img{background-image:url("/wp-content/uploads/2026/09/afz-home-v4/afz-loop-consultoria.webp") !important;}
html body .ac-presentation .ac-pres-slide:nth-child(9) .img{background-image:url("/wp-content/uploads/2026/09/afz-home-v4/afz-loop-aqs.webp") !important;}

/* 7. O nome da actividade fica com metade do tamanho e passa para o canto
      inferior direito, a esquerda do Gabriel, para libertar o texto e os botoes.
      Pedido do dono a 17-09-2026. */
html body .ac-pres-title {
  left: auto !important;
  right: 150px !important;
  bottom: 34px !important;
  top: auto !important;
  text-align: right !important;
  max-width: 56% !important;
  font-size: clamp(16px, 2.75vw, 40px) !important;
  line-height: 1.06 !important;
}
html body .ac-pres-title .kicker { font-size: .62em !important; }
@media (max-width: 689px) {
  html body .ac-pres-title {
    right: 116px !important;
    bottom: 26px !important;
    max-width: 62% !important;
    font-size: clamp(14px, 4.6vw, 24px) !important;
  }
}

/* 8. Arranque sem soluços. O codigo original destroi e reconstroi o topo aos 600
      e aos 1800 ms; nesses intervalos nenhum diapositivo esta activo e aparecia o
      fundo grena. A primeira fotografia passa a ser o fundo do proprio topo, por
      baixo dos diapositivos, e o buraco deixa de existir. */
html body .ac-presentation {
  background-image: url("/wp-content/uploads/2026/09/afz-home-v4/afz-loop-avac.webp") !important;
  background-size: cover !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-color: #17151a !important;
}

/* 9. A linha horizontal que atravessava as fotografias era a sombra do cabecalho
      (transparente, mas com box-shadow de 20 px). Sai, so na pagina inicial. */
html body header.ct-header,
html body #header.ct-header,
html body #header .ct-header { box-shadow: none !important; }

/* 10. O indicador «SCROLL» sai: estava em ingles, quase invisivel, e hoje ninguem
       precisa que lhe digam para deslizar. Decisao do dono a 17-09-2026. */
html body .prem-scroll { display: none !important; }

/* 11. A linha horizontal que restava era a grelha tecnica que o desenho original
       sobrepoe ao topo (.prem-hero::after, riscas de 1 px) e o tom radial por
       cima (.prem-hero::before). Com fotografia por baixo, o limite dessas duas
       camadas lia-se como um risco. Saem as duas, so na pagina inicial. */
html body .prem-hero::after,
html body .prem-hero::before { display: none !important; content: none !important; }

/* 12. O assistente afasta-se um pouco mais para a direita, a pedido do dono. */
html body .filipa-chat-fab { right: 24px !important; }
@media (min-width: 1200px) {
  /* nos ecras largos fica a meio caminho entre a legenda amarela e os botoes da
     margem direita, a pedido do dono */
  html body .filipa-chat-fab { right: 104px !important; }
}

/* 13. Arranque sem soluços, parte 2. O codigo original apaga e reconstroi o topo
       aos 600 e aos 1800 ms. Entre apagar e o relogio voltar a marcar o primeiro
       diapositivo passavam-se 200 ms em que nenhum estava activo: via-se o fundo
       grena e a legenda desaparecia e voltava.
       a) o ecra por baixo passa a ter a mesma primeira fotografia;
       b) o primeiro diapositivo esta sempre visivel, com a sua legenda, e serve
          de base; os seguintes tapam-no quando entram. */
html body .ac-screen-fill {
  background-image: url("/wp-content/uploads/2026/09/afz-home-v4/afz-loop-avac.webp") !important;
  background-size: cover !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
}
html body .ac-presentation .ac-pres-slide:first-child { opacity: 1 !important; }
html body .ac-presentation .ac-pres-slide:first-child .ac-pres-title { opacity: 1 !important; transform: none !important; }

/* 14. A linha que restava vinha do desenho tecnico animado por tras (.ac-planta-bg,
       linhas de 1 px com pontos a correr) e da linha decorativa do topo. Com
       fotografia por baixo lia-se como um risco. Saem os dois, so na pagina inicial.
       Para voltar atras, apagar este bloco. */
html body .ac-planta-bg,
html body .hero-deco-line { display: none !important; }
/* o letreiro a correr (.ac-marquee) fica: e o mesmo que a pagina Sectores tem */

/* 15. A legenda da especialidade afasta-se mais do assistente nos ecras largos:
       ele ja esta encostado a margem e nao pode ir mais para a direita. */
@media (min-width: 1200px) {
  html body .ac-pres-title { right: 200px !important; }
}

/* 16. Em ingles os botoes tem rotulos mais compridos («Request Consultancy») e,
       em ecras entre 900 e 1300 px, passavam para duas linhas. Isso aumentava o
       bloco de texto e a primeira linha do titulo ficava cortada em cima.
       Os botoes ficam na mesma linha, com menos espacamento interior. */
@media (min-width: 900px) and (max-width: 1340px) {
  html body .prem-hero .prem-hero-actions {
    flex-wrap: nowrap !important;
    gap: 12px !important;
  }
  html body .prem-hero .prem-hero-actions .prem-btn {
    padding-left: 20px !important;
    padding-right: 20px !important;
    font-size: .92rem !important;
    white-space: nowrap !important;
  }
}

/* 17. Em ecras estreitos de computador (900 a 1200 px) o titulo ingles ocupa
       quatro linhas e a primeira ficava escondida atras do cabecalho. Reduz-se
       um pouco o corpo da letra para o bloco caber. */
@media (min-width: 900px) and (max-width: 1200px) {
  html body .prem-hero h1 {
    font-size: clamp(1.7rem, 3.2vw, 2.45rem) !important;
    line-height: 1.08 !important;
  }
}

/* 19. A frase «ENGENHARIA MEP · PORTUGAL» aparecia a 12 px, num tom pessego a
       70 %, sobre fotografia: existia mas nao se lia. Passa ao amarelo da marca,
       um pouco maior, mais encorpada e com sombra, para se ler sobre qualquer
       imagem. (Se um dia nao servir, apaga-se este bloco e a linha do HTML.) */
html body .prem-eyebrow {
  color: #f5c13c !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: .18em !important;
  text-shadow: 0 2px 10px rgba(0,0,0,.85), 0 0 3px rgba(0,0,0,.7) !important;
  opacity: 1 !important;
}
html body .prem-eyebrow::before {
  opacity: 1 !important;
  background: linear-gradient(90deg, #f5c13c, rgba(245,193,60,0)) !important;
}

/* 20. O titulo crescia com a largura do ecra (3,2 % da largura) e num ecra grande
       chegava aos 80 px: o bloco ficava tao alto que empurrava a frase
       «Engenharia MEP · Portugal» para fora da moldura, em PT e em EN. Passa a
       ter tecto, e as linhas ficam mais juntas. */
@media (min-width: 900px) {
  html body .prem-hero h1 {
    font-size: clamp(1.9rem, 2.5vw, 2.7rem) !important;
    line-height: 1.12 !important;
  }
}
