/* ═══════════════════════════════════════════════════════════════════════
   HERO (banner de primeira seção) — DESKTOP
   A capa é1600x900 (16:9) com o título/subtítulo PINTADOS na imagem e os
   botões em HTML por cima. Antes o hero tinha altura fixa (720px / 520px):
     • largura menor que1,78x a altura  → cover esticava a foto e o texto
       pintado ficava "grande demais"/cortado (e piorava com zoom do navegador
       ou janela estreita — o caso da cliente);
     • largura maior                    → cortava topo/baixo e os botões HTML
       caíam em cima do texto pintado.
   Com a ALTURA seguindo a LARGURA na proporção da capa, o cover nunca corta
   nada, em nenhuma largura. Os botões descem para o rodapé da capa (abaixo
   do texto). Regra só a partir de769px — o mobile já foi calibrado antes.
   ═══════════════════════════════════════════════════════════════════════ */
@media (min-width: 769px) {
  /* capa sempre inteira (16:9) */
  body .hero,
  body section.hero {
    aspect-ratio: 16 / 9 !important;
    min-height: 0 !important;
    max-height: none !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
    /* conteúdo colado no rodapé => botão abaixo do texto pintado */
    justify-content: flex-end !important;
    padding-bottom: 7% !important;
  }
  /* sem essa margem os botões sobem para o meio do texto */
  body .hero .hero-actions { margin-top: 0 !important; }

  /* ── Home (v2): a capa desktop NÃO tem logo pintado — só o texto
        (46%..63% da altura da foto) e a linha embaixo dele. O logo e os
        botões são HTML e estavam sendo centralizados POR CIMA do texto
        (logo em30%..54% = colisão) e o hero ficava com a altura inteira
        da proporção16:9 (945px numa tela de950).
        Receita: altura = até o FIM do texto pintado (35.5vw) +96px para os
        botões; foto ancorada no topo (corta só o chão); logo colado no topo
        e botões no rodapé => folga constante de23px e nada sobrepõe. ── */
  .ce-puck-scope .hero {
    aspect-ratio: auto !important;
    height: calc(35.5vw + 96px) !important;
    min-height: 0 !important;
    max-height: none !important;
    padding-top: 40px !important;
    padding-bottom: 0 !important;
    justify-content: stretch !important;
    background-position: 50% 0 !important;
  }
  .ce-puck-scope .hero .hero-bg {
    background-position: 50% 0 !important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
  }
  .ce-puck-scope .hero-content {
    flex: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    padding: 0 var(--pad, 20px) 20px !important;
    max-width: none !important;
  }
  .ce-puck-scope .hero .hero-actions { margin-top: 0 !important; }
  /* largura calculada para o logo terminar SEMPRE acima do texto pintado
     (espaço acima dele = 0.25875W − padding40 − folga10; altura do logo =40% da largura) */
  .ce-puck-scope .hero-content img { width: min(520px, calc(64.7vw - 125px)) !important; height: auto !important; }
  .ce-puck-scope .hero-respiro { display: none !important; }
}
