/* ============================================================
   ENGSOLAR — Tela de entrada (splash → home), modelo Skyline
   ============================================================ */
html, body { height: 100%; }
body.enter-page { overflow: hidden; }

.enter {
  position: fixed;
  inset: 0;
  display: grid;
  place-items: center;
  text-align: center;
  background: var(--bg-deep);
  overflow: hidden;
  transform-origin: center;
}

/* ---- Fundo: vídeo cinematográfico ---- */
.enter__bg { position: absolute; inset: 0; z-index: 0; background: var(--bg-deep); }
.enter__video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.enter__overlay {
  position: absolute; inset: 0;
  background:
    radial-gradient(120% 85% at 50% 40%, rgba(10,17,36,.48) 0%, rgba(10,17,36,.84) 100%),
    linear-gradient(180deg, rgba(10,17,36,.62) 0%, rgba(10,17,36,.40) 42%, var(--bg-deep) 100%);
}

/* ---- Conteúdo ---- */
.enter__inner { position: relative; z-index: 2; padding: 2rem; }

/* Logo NEO SOL (lockup) */
.enter__logo {
  width: clamp(240px, 42vw, 440px);
  height: auto; margin: 0 auto 1.4rem; display: block;
  opacity: 0;
  animation: logoIn 1s var(--ease-spring) .15s forwards, logoGlow 3.8s var(--ease) 1.2s infinite;
}
@keyframes logoIn { from { opacity: 0; transform: scale(.82) translateY(12px); } to { opacity: 1; transform: none; } }
@keyframes logoGlow { 0%,100% { filter: drop-shadow(0 0 16px rgba(245,166,35,.22)); } 50% { filter: drop-shadow(0 0 40px rgba(245,166,35,.5)); } }

.enter__mark {
  width: clamp(62px, 9vw, 92px);
  height: auto; display: block;
  margin: 0 auto 1.1rem;
  opacity: 0;
  animation: markIn 1s var(--ease-spring) .1s both, markGlow 3.6s var(--ease) 1.2s infinite;
}
@keyframes markIn { from { opacity: 0; transform: scale(.7) translateY(8px); } to { opacity: 1; transform: none; } }
@keyframes markGlow { 0%,100% { filter: drop-shadow(0 0 16px rgba(245,166,35,.45)); } 50% { filter: drop-shadow(0 0 36px rgba(245,166,35,.85)); } }

/* anel que expande do logo */
.enter__ring {
  position: absolute; top: 0; left: 50%; width: clamp(78px,12vw,120px); height: clamp(78px,12vw,120px);
  transform: translateX(-50%);
  border: 1px solid rgba(245,166,35,.5); border-radius: 50%;
  opacity: 0; animation: ringExpand 1.6s var(--ease-out) .6s 2;
}
@keyframes ringExpand { 0% { transform: translateX(-50%) scale(.5); opacity: .7; } 100% { transform: translateX(-50%) scale(2.4); opacity: 0; } }

.enter__word {
  font-family: 'Orbitron', var(--font-display);
  font-weight: 800;
  font-size: clamp(2rem, 7.6vw, 4.6rem);
  letter-spacing: .06em;
  line-height: 1;
  color: var(--text-high);
  margin-bottom: 1.1rem;
  text-shadow: 0 2px 26px rgba(0, 0, 0, .45);
}
/* Animação de letras estilo Skyline (fade-up + stagger via --ld, fill both) */
.enter__word span {
  display: inline-block;
  opacity: 0;
  transform: translateY(2rem);
  animation: letterUp 1s var(--ease-out) both;
  animation-delay: var(--ld, 0s);
}
.enter__word .sp { width: .42em; }
.enter__word .gold { color: var(--primary); }
@keyframes letterUp { from { opacity: 0; transform: translateY(2rem); } to { opacity: 1; transform: translateY(0); } }

.enter__divider {
  width: 0; height: 2px; margin: 0 auto 1.2rem;
  background: var(--grad-solar);
  border-radius: 2px;
  animation: dividerGrow .8s var(--ease-out) 1s forwards;
}
@keyframes dividerGrow { to { width: 120px; } }

.enter__tag {
  font-family: var(--font-display);
  font-size: clamp(.95rem, 2.2vw, 1.3rem);
  color: var(--text-mid);
  letter-spacing: .02em;
  opacity: 0;
  animation: riseUp .8s var(--ease-out) 1.15s forwards;
}
.enter__sub {
  font-size: .82rem; letter-spacing: .28em; text-transform: uppercase;
  color: var(--text-low); margin-top: .8rem;
  opacity: 0; animation: riseUp .8s var(--ease-out) 1.3s forwards;
}
@keyframes riseUp { from { opacity: 0; transform: translateY(22px); } to { opacity: 1; transform: translateY(0); } }

.enter__actions {
  margin-top: 2.6rem;
  opacity: 0; animation: riseUp .8s var(--ease-out) 1.55s forwards;
}
.enter__hint { display: block; margin-top: 1rem; font-size: .8rem; color: var(--text-low); }
.enter__hint kbd {
  font-family: var(--font-display); font-size: .72rem;
  background: var(--glass-bg); border: 1px solid var(--border-glass);
  border-radius: 6px; padding: .15rem .45rem; color: var(--text-mid);
}

.enter__badge {
  position: absolute; top: 26px; left: 50%; transform: translateX(-50%);
  opacity: 0; animation: riseUp .8s var(--ease-out) 1.7s forwards;
}

/* ---- Barra de carregamento sutil ---- */
/* barra = contagem regressiva até a entrada automática (5s) */
.enter__loader { position: absolute; left: 0; bottom: 0; height: 3px; width: 0; background: var(--grad-solar); box-shadow: 0 0 12px rgba(245,166,35,.6); animation: loaderFill 5s linear .15s forwards; }
@keyframes loaderFill { to { width: 100%; } }

/* ---- Saída (ao entrar na home) ---- */
body.is-leaving .enter { animation: enterOut .7s var(--ease) forwards; }
@keyframes enterOut { to { opacity: 0; transform: scale(1.14); filter: blur(8px); } }

/* ---- Acessibilidade / motion ---- */
@media (prefers-reduced-motion: reduce) {
  .enter__logo, .enter__mark, .enter__word span, .enter__divider, .enter__tag, .enter__sub, .enter__actions, .enter__badge {
    opacity: 1 !important; transform: none !important; animation: none !important;
  }
  .enter__divider { width: 120px; }
  .enter__sun, .enter__loader, .enter__ring { animation: none; }
}
