/* Ajuste visual pontual: fotografia de capa e encerramento como fundos.
   Carregado após os estilos existentes para preservar conteúdo e responsividade. */
.hero {
  display: flex;
  position: relative;
  isolation: isolate;
  align-items: center;
  min-height: min(900px, 100svh);
  height: auto;
  padding: 130px max(var(--pad), calc((100vw - var(--max))/2)) 155px;
  overflow: hidden;
  background: #090d09;
}

.hero-media {
  position: absolute;
  z-index: 0;
  inset: 0 0 0 25%;
  width: 75%;
  height: 100%;
  max-height: none;
  aspect-ratio: auto;
  overflow: visible;
  border: 0;
  box-shadow: none;
}

.hero .hero-image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 35% 43%;
  filter: brightness(.96);
  opacity: 1;
  transform: translate3d(0, 0, 0);
  animation: hero-photo-drift 12s ease-in-out infinite alternate;
}

.hero-shade {
  display: block;
  position: absolute;
  z-index: 1;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(90deg, #101510 0%, rgba(12, 17, 12, .94) 18%, rgba(7, 12, 8, .67) 31%, rgba(4, 7, 4, .20) 51%, rgba(4, 7, 4, 0) 75%), linear-gradient(0deg, rgba(4, 7, 4, .62), transparent 24%);
}

.hero-grid { z-index: 1; pointer-events: none; }
.hero-content { position: relative; z-index: 2; width: min(530px, 44vw); max-width: none; margin-left: 0; }
.hero-quote { position: static; width: auto; margin: 0 0 20px; }
.hero-pillars {
  z-index: 3;
  left: 0;
  bottom: 0;
  transform: none;
  width: 100%;
  max-width: none;
  padding-inline: max(var(--pad), calc((100vw - var(--max)) / 2));
  background: rgba(8, 12, 8, .52);
}

@keyframes hero-photo-drift {
  from { transform: translate3d(0, 0, 0); }
  to { transform: translate3d(0, -7px, 0); }
}

.closing {
  display: flex;
  position: relative;
  isolation: isolate;
  justify-content: flex-start;
  align-items: center;
  min-height: 760px;
  overflow: hidden;
  background: #090d09;
}

.closing > img {
  position: absolute;
  z-index: 1;
  inset: 0 0 0 25%;
  width: 75%;
  height: 100%;
  object-fit: cover;
  object-position: 45% center;
  filter: brightness(.98);
  transform: none;
}

.closing-shade {
  display: block;
  position: absolute;
  z-index: 2;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(90deg, rgba(4, 7, 4, .94) 0%, rgba(4, 7, 4, .70) 32%, rgba(4, 7, 4, .22) 55%, rgba(4, 7, 4, 0) 78%), linear-gradient(0deg, rgba(4, 7, 4, .58), transparent 26%);
}

.closing-copy {
  position: relative;
  z-index: 3;
  width: min(600px, 50vw);
  margin-left: 0;
  padding: 80px max(var(--pad), calc((100vw - var(--max))/2));
  background: transparent;
}

.brand-mark { display: block; flex: none; width: 39px; height: 39px; object-fit: contain; border-radius: 7px; }
.method-photo::before { left: 0; }
.video-player { position: relative; }
.video-poster { position: relative; display: block; width: 100%; height: 100%; background: #080b08; }
.video-poster img { width: 100%; height: 100%; object-fit: cover; object-position: center; }
.video-play { position: absolute; inset: 50% auto auto 50%; display: grid; width: 76px; height: 76px; place-items: center; transform: translate(-50%, -50%); border: 2px solid var(--yellow); border-radius: 50%; background: rgba(4, 7, 4, .72); color: var(--yellow); }
.video-play svg { width: 32px; height: 32px; fill: currentColor; }

@media (max-width: 760px) {
  .hero { flex-direction: column; align-items: stretch; justify-content: flex-end; min-height: 820px; padding: 310px 20px 155px; }
  .hero-media { inset: 0; width: 100%; }
  .hero .hero-image { object-position: 39% 28%; transform: none; animation: none; }
  .hero-shade { background: linear-gradient(0deg, rgba(4, 7, 4, .99) 4%, rgba(4, 7, 4, .85) 35%, rgba(4, 7, 4, .28) 66%, rgba(4, 7, 4, 0) 86%); }
  .hero-content { order: 1; width: 100%; max-width: 600px; margin-left: 0; }
  .hero-quote { position: absolute; width: 220px; margin: 0; }
  .hero-pillars { position: relative; order: 2; left: auto; bottom: auto; transform: none; width: 100%; margin-top: 28px; }
  .closing { flex-direction: column; min-height: 790px; align-items: flex-end; padding: 360px 20px 65px; }
  .closing > img { inset: 64px 0 auto; width: 100%; height: 520px; object-fit: contain; object-position: center top; transform: none; }
  .closing-shade { background: linear-gradient(0deg, rgba(4, 7, 4, .99) 4%, rgba(4, 7, 4, .78) 35%, rgba(4, 7, 4, .10) 67%, rgba(4, 7, 4, 0) 87%); }
  .closing-copy { width: 100%; align-self: auto; max-width: 600px; margin-left: 0; padding: 0; background: transparent; }
  .brand-mark { width: 34px; height: 34px; }
  .video-play { width: 64px; height: 64px; }
}

@media (prefers-reduced-motion: reduce) {
  .hero .hero-image { animation: none; transform: none; }
}

/* A capa permanece estática para preservar o enquadramento aprovado. */
.hero .hero-image { animation: none; transform: none; }

/* A apresentação móvel já está aprovada; estes ajustes atuam só no desktop. */
@media (min-width: 981px) {
  /* Recorte desktop mais fechado, inspirado na referência anterior. */
  .hero-media {
    left: 30%;
    width: 70%;
    overflow: hidden;
  }

  /* O corte dá presença ao rosto e aos brevês sem alterar a capa no celular. */
  .hero .hero-image {
    filter: none;
    height: calc(100% + 48px);
    margin-top: -18px;
    object-position: 35% 45%;
    transform: scale(1.07);
    transform-origin: 40% 45%;
  }

  /* Mantém a leitura do texto na faixa esquerda sem escurecer os detalhes da foto. */
  .hero-shade {
    background: linear-gradient(90deg, #101510 0%, rgba(12, 17, 12, .95) 23%, rgba(7, 12, 8, .76) 39%, rgba(4, 7, 4, .35) 61%, rgba(4, 7, 4, 0) 82%), linear-gradient(0deg, rgba(4, 7, 4, .62), transparent 24%);
  }

  /* A foto vertical recebe mais área; a fogueira volta ao tamanho natural. */
  .career-card:last-child .career-photos img.career-fire-photo {
    flex-basis: 42%;
    width: 42% !important;
    object-position: center 61% !important;
    transform: none;
  }

  .career-card:last-child .career-photos img.career-black-photo {
    flex-basis: 58%;
    width: 58% !important;
    object-position: center 38% !important;
  }

  .career-card:last-child .career-photos:hover .career-fire-photo {
    transform: none;
  }
}

/* Leitura de apoio em telas menores, sem alterar a escala dos títulos. */
@media (max-width: 650px) {
  .eyebrow { font-size: 12px; }
  .hero-slogan { font-size: 15px; }
  .plan-delivery,
  .plan-details p,
  .sales-note,
  .content-note { font-size: 13px; }
}

@media (min-width: 651px) and (max-width: 980px) {
  .plan-delivery,
  .plan-details p,
  .sales-note { font-size: 13px; }
}