/* =========================================================
   ANIMAÇÕES — estados iniciais para GSAP animar a partir daqui.
   Sem JS (ou com reduced-motion), tudo fica visível por defeito.
   ========================================================= */

[data-reveal] {
  opacity: 0;
  transform: translateY(36px);
}
[data-reveal="fade"] { transform: none; }
[data-reveal="scale"] { transform: scale(0.94); }
[data-reveal="left"] { transform: translateX(-40px); }
[data-reveal="right"] { transform: translateX(40px); }

.js-ready [data-reveal] {
  transition: none; /* GSAP assume o controlo; isto é só um fallback visual */
}

.no-js [data-reveal],
html:not(.js) [data-reveal] {
  opacity: 1;
  transform: none;
}

@media (prefers-reduced-motion: reduce) {
  [data-reveal] { opacity: 1 !important; transform: none !important; }
}

/* Loader inicial simples enquanto fontes/GSAP preparam a entrada do Hero */
.page-veil {
  position: fixed;
  inset: 0;
  z-index: 500;
  background: var(--color-crust);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: opacity 0.7s var(--ease-silk), visibility 0s linear 0.7s;
}
.page-veil.is-hidden { opacity: 0; visibility: hidden; }
.page-veil__mark {
  font-family: var(--font-display);
  font-style: italic;
  color: var(--color-custard);
  font-size: var(--fs-lg);
  opacity: 0;
  animation: veilPulse 1.4s var(--ease-silk) infinite;
}
@keyframes veilPulse {
  0%, 100% { opacity: 0.35; }
  50% { opacity: 1; }
}

/* Iluminação suave ao passar o rato (aplicada via custom property por JS) */
.glow-on-hover {
  position: relative;
}
.glow-on-hover::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(220px circle at var(--mx, 50%) var(--my, 50%), rgba(239,203,126,0.18), transparent 70%);
  opacity: 0;
  transition: opacity 0.3s var(--ease-silk);
  pointer-events: none;
  z-index: 1;
}
.glow-on-hover:hover::before { opacity: 1; }