/* Hero "Mergulho: portas": a palavra VOCÊ dourada é partida por um fio de luz e as duas metades abrem
   para cima e para baixo, revelando o vídeo de respingo com leve tom verde.
   Escopado em .hv-mergulho-portas. Sem movimento: pôster + tom + véu + título e botões no lugar. */

.hv-mergulho-portas { background: #07130d; }
.hv-mergulho-portas .hv-mergulho-portas-midia { transform: scale(1.04); }
.hv-mergulho-portas .hv-mergulho-portas-tom { position: absolute; inset: 0; background: #12382a; mix-blend-mode: color; opacity: .55; pointer-events: none; }
.hv-mergulho-portas .hv-mergulho-portas-veu {
  background:
    radial-gradient(ellipse 80% 60% at 50% 50%, rgba(7, 19, 13, .74) 0%, rgba(7, 19, 13, .62) 60%, rgba(7, 19, 13, .9) 100%),
    linear-gradient(180deg, rgba(7, 19, 13, .6) 0%, rgba(7, 19, 13, 0) 20%, rgba(7, 19, 13, 0) 68%, rgba(7, 19, 13, .9) 100%);
}

/* Portas da abertura */
.hv-mergulho-portas .hv-mergulho-portas-porta, .hv-mergulho-portas .hv-mergulho-portas-corte { display: none; }
.hv-mergulho-portas .hv-mergulho-portas-miolo { position: absolute; left: 0; right: 0; height: 200%; display: grid; place-items: center; }
.hv-mergulho-portas .hv-mergulho-portas-cima .hv-mergulho-portas-miolo { top: 0; }
.hv-mergulho-portas .hv-mergulho-portas-baixo .hv-mergulho-portas-miolo { bottom: 0; }
.hv-mergulho-portas .hv-mergulho-portas-palavra {
  display: flex; overflow: hidden; color: var(--primary);
  font-family: var(--font-brand); font-weight: 700; line-height: 1; font-size: min(28vw, 34vh);
}
.hv-mergulho-portas .hv-mergulho-portas-letra { display: inline-block; }

/* Conteúdo centralizado */
.hv-mergulho-portas .hv-mergulho-portas-centro {
  flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center;
  gap: 1.25rem; padding-bottom: 1rem;
}
.hv-mergulho-portas .hv-olho { font-size: .66rem; letter-spacing: .2em; max-width: 30ch; line-height: 1.7; }
.hero.hv.hv-mergulho-portas h1 {
  font-size: clamp(2.8rem, 13.6vw, 5.6rem); line-height: .94; letter-spacing: -.02em;
  text-shadow: 0 4px 40px rgba(7, 19, 13, .7);
}
.hero.hv.hv-mergulho-portas h1 .linha > span { display: block; }
.hero.hv.hv-mergulho-portas h1 em.hv-ouro { font-style: italic; text-shadow: none; font-weight: 400; font-size: 1.24em; line-height: .8; }
.hero.hv.hv-mergulho-portas .hv-mergulho-portas-acoes { flex-direction: column; align-items: stretch; width: 100%; max-width: 26rem; margin-top: .5rem; }
.hero.hv.hv-mergulho-portas .hv-mergulho-portas-acoes .btn { justify-content: center; }
.hv-mergulho-portas .hv-mergulho-portas-barra {
  display: flex; align-items: center; justify-content: center; gap: 1.5rem; padding-top: 1rem;
  border-top: 1px solid rgba(197, 166, 83, .3);
}
.hv-mergulho-portas .hv-mergulho-portas-areas {
  display: none; flex: 1; list-style: none; margin: 0; padding: 0; justify-content: space-between; gap: 1.5rem;
  font-size: .75rem; letter-spacing: .2em; text-transform: uppercase; color: #c9d6cf;
}

@media (min-width: 701px) {
  .hv-mergulho-portas .hv-olho { font-size: .75rem; letter-spacing: .28em; max-width: none; }
  .hero.hv.hv-mergulho-portas h1 em.hv-ouro { font-size: 1em; line-height: inherit; }
  .hero.hv.hv-mergulho-portas h1 { font-size: clamp(3.6rem, min(11vw, 14vh), 8.25rem); line-height: .9; letter-spacing: -.025em; }
  .hv-mergulho-portas .hv-mergulho-portas-centro { gap: 1.6rem; }
  .hero.hv.hv-mergulho-portas .hv-mergulho-portas-acoes { flex-direction: row; justify-content: center; max-width: none; width: auto; }
  .hero.hv.hv-mergulho-portas .hv-mergulho-portas-acoes .btn { min-height: 56px; }
  .hv-mergulho-portas .hv-mergulho-portas-areas { display: flex; }
  .hv-mergulho-portas .hv-mergulho-portas-palavra { font-size: min(22.9vw, 36vh); }
}
@media (min-width: 1100px) {
  .hero.hv.hv-mergulho-portas h1 { font-size: min(9.2vw, 14.2vh, 8.25rem); }
}

@media all {
  @keyframes hv-mergulho-portas-letra { from { transform: translateY(110%); } to { transform: none; } }
  @keyframes hv-mergulho-portas-corte { from { transform: scaleX(0); } to { transform: scaleX(1); } }
  @keyframes hv-mergulho-portas-abre-cima { 0% { transform: none; visibility: visible; } 99% { visibility: visible; } 100% { transform: translateY(-101%); visibility: hidden; } }
  @keyframes hv-mergulho-portas-abre-baixo { 0% { transform: none; visibility: visible; } 99% { visibility: visible; } 100% { transform: translateY(101%); visibility: hidden; } }
  @keyframes hv-mergulho-portas-corte-some { 0%, 70% { opacity: 1; visibility: visible; } 100% { opacity: 0; visibility: hidden; } }
  @keyframes hv-mergulho-portas-sobe { from { transform: translateY(112%); } to { transform: none; } }
  @keyframes hv-mergulho-portas-surge { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
  @keyframes hv-mergulho-portas-varre { from { background-position: 100% 0; } to { background-position: 0 0; } }
  @keyframes hv-mergulho-portas-aproxima { from { transform: scale(1.25); } to { transform: scale(1.04); } }

  .hv-mergulho-portas .hv-mergulho-portas-porta {
    display: block; position: absolute; left: 0; right: 0; height: 50%; z-index: 4; overflow: hidden;
    background: #0d1e16; pointer-events: none;
  }
  .hv-mergulho-portas .hv-mergulho-portas-cima { top: 0; animation: hv-mergulho-portas-abre-cima 1.2s cubic-bezier(.76, 0, .24, 1) 1.9s forwards; }
  .hv-mergulho-portas .hv-mergulho-portas-baixo { bottom: 0; animation: hv-mergulho-portas-abre-baixo 1.2s cubic-bezier(.76, 0, .24, 1) 1.9s forwards; }
  .hv-mergulho-portas .hv-mergulho-portas-letra { animation: hv-mergulho-portas-letra .9s var(--ease-out) backwards; }
  .hv-mergulho-portas .hv-mergulho-portas-l1 { animation-delay: .15s; }
  .hv-mergulho-portas .hv-mergulho-portas-l2 { animation-delay: .23s; }
  .hv-mergulho-portas .hv-mergulho-portas-l3 { animation-delay: .31s; }
  .hv-mergulho-portas .hv-mergulho-portas-l4 { animation-delay: .39s; }
  .hv-mergulho-portas .hv-mergulho-portas-corte {
    display: block; position: absolute; left: 0; right: 0; top: 50%; height: 2px; margin-top: -1px; z-index: 5; pointer-events: none;
    background: linear-gradient(90deg, rgba(230, 200, 117, 0), #f6e7b4 20%, #f6e7b4 80%, rgba(230, 200, 117, 0));
    box-shadow: 0 0 22px 3px rgba(230, 200, 117, .6); transform-origin: 50% 50%;
    animation: hv-mergulho-portas-corte .7s var(--ease-in-out) 1.15s backwards, hv-mergulho-portas-corte-some 1.2s linear 1.9s forwards;
  }
  .hv-mergulho-portas .hv-mergulho-portas-midia { will-change: transform; animation: hv-mergulho-portas-aproxima 3.4s var(--ease-out) 1.9s backwards; }
  .hero.hv.hv-mergulho-portas h1 .linha:nth-child(n) > span { animation: hv-mergulho-portas-sobe 1.1s var(--ease-out) 2.6s backwards; }
  .hero.hv.hv-mergulho-portas h1 .linha.hv-mergulho-portas-h2:nth-child(n) > span { animation-delay: 2.74s; }
  .hero.hv.hv-mergulho-portas h1 em.hv-ouro { animation: hv-mergulho-portas-varre 1.8s cubic-bezier(.22, 1, .36, 1) 3.4s backwards; }
  .hv-mergulho-portas .hv-mergulho-portas-surge { animation: hv-mergulho-portas-surge .8s cubic-bezier(.22, 1, .36, 1) backwards; }
  .hv-mergulho-portas .hv-mergulho-portas-s1 { animation-delay: 3s; }
  .hv-mergulho-portas .hv-mergulho-portas-s2 { animation-delay: 3.15s; }
  .hv-mergulho-portas .hv-mergulho-portas-s3 { animation-delay: 3.35s; }
}