/* Tři experimenty navazují na původní vzhled Black & Gold. */
.hero__light-point,
.hero__particle-field,
.hero__sweep { pointer-events: none; }

.hero__light-point,
.hero__sweep {
  position: absolute;
  z-index: 3;
  opacity: 0;
}

.hero__light-point {
  top: 50%;
  left: 50%;
  width: 5px;
  height: 5px;
  margin: -2.5px;
  border-radius: 50%;
  background: #ffe4a8;
  box-shadow: 0 0 10px 3px #d8a456, 0 0 35px 14px rgba(211, 155, 70, .32);
}

.hero__particle-field {
  position: absolute;
  z-index: 3;
  top: 50%;
  left: 50%;
  width: min(100%, 300px);
  aspect-ratio: 300 / 230;
  transform: translate(-50%, -50%);
  contain: layout paint;
}

.hero__particle {
  position: absolute;
  left: var(--target-x);
  top: var(--target-y);
  width: 3px;
  height: 3px;
  border-radius: 50%;
  background: #e6be79;
  box-shadow: 0 0 6px rgba(238, 195, 116, .8);
  opacity: 0;
}

.hero__sweep {
  top: -25%;
  left: -45%;
  width: 32%;
  height: 150%;
  transform: rotate(19deg);
  background: linear-gradient(90deg, transparent, rgba(255, 235, 181, .02) 17%, rgba(255, 228, 161, .24) 50%, rgba(255, 235, 181, .02) 83%, transparent);
  mix-blend-mode: screen;
}

/* Golden Reveal: úvodní tma, bod světla a kruhové odhalení čísla. */
.animation-reveal.is-playing .greeting__inner::after {
  position: absolute;
  z-index: 2;
  inset: 0;
  background: #090909;
  content: "";
  pointer-events: none;
  animation: dark-opening 1.9s ease-in-out 0s both;
}
.animation-reveal.is-playing .hero__light-point { animation: light-point 2.5s ease-in-out .45s both; }
.animation-reveal.is-playing [data-reveal="number"] { animation: light-reveal 2.4s ease-out 1.45s both; }
.animation-reveal.is-playing .hero__halo { animation: halo-in 2s ease-out 2.8s both; }
.animation-reveal.is-playing .hero__spark { animation: spark-in 1.2s ease-out 3.15s both; }
.animation-reveal.is-playing [data-reveal="intro"] { animation: reveal-up .9s ease-out 3.35s both; }
.animation-reveal.is-playing [data-reveal="salutation"] { animation: reveal-up .9s ease-out 4.05s both; }
.animation-reveal.is-playing [data-reveal="paragraph-1"] { animation: reveal-up .9s ease-out 4.8s both; }
.animation-reveal.is-playing [data-reveal="paragraph-2"] { animation: reveal-up .9s ease-out 5.55s both; }
.animation-reveal.is-playing [data-reveal="paragraph-3"] { animation: reveal-up .9s ease-out 6.3s both; }
.animation-reveal.is-playing [data-reveal="wish"] { animation: reveal-up .9s ease-out 7.1s both; }
.animation-reveal.is-playing [data-reveal="signature"] { animation: reveal-up .9s ease-out 7.95s both; }

/* Golden Particles: nejvýše 76 malých prvků, pak se objeví skutečné číslo. */
.animation-particles.is-playing .hero__particle {
  animation: particle-gather 3.35s cubic-bezier(.17,.67,.28,1) var(--delay) both;
}
.animation-particles.is-playing [data-reveal="number"] { animation: soft-number 1.15s ease-out 3.2s both; }
.animation-particles.is-playing .hero__halo { animation: halo-in 1.8s ease-out 3.4s both; }
.animation-particles.is-playing .hero__spark { animation: spark-in 1.1s ease-out 3.7s both; }
.animation-particles.is-playing [data-reveal="intro"] { animation: reveal-up .8s ease-out 3.6s both; }
.animation-particles.is-playing [data-reveal="salutation"] { animation: reveal-up .9s ease-out 4.35s both; }
.animation-particles.is-playing [data-reveal="paragraph-1"] { animation: reveal-up .9s ease-out 5.05s both; }
.animation-particles.is-playing [data-reveal="paragraph-2"] { animation: reveal-up .9s ease-out 5.8s both; }
.animation-particles.is-playing [data-reveal="paragraph-3"] { animation: reveal-up .9s ease-out 6.55s both; }
.animation-particles.is-playing [data-reveal="wish"] { animation: reveal-up .9s ease-out 7.3s both; }
.animation-particles.is-playing [data-reveal="signature"] { animation: reveal-up .9s ease-out 8.05s both; }

/* Cinematic Gold: klidný nájezd kamery a jediný měkký odlesk. */
.animation-cinematic.is-playing .hero { animation: cinematic-scene 3.1s cubic-bezier(.19,.78,.24,1) .2s both; }
.animation-cinematic.is-playing [data-reveal="number"] { animation: cinematic-number 2.9s cubic-bezier(.2,.8,.2,1) .6s both; }
.animation-cinematic.is-playing .hero__sweep { animation: cinematic-sweep 1.8s ease-in-out 2.65s both; }
.animation-cinematic.is-playing .hero__halo { animation: halo-in 2.1s ease-out 2.6s both; }
.animation-cinematic.is-playing .hero__spark { animation: spark-in 1.1s ease-out 3.2s both; }
.animation-cinematic.is-playing [data-reveal="intro"] { animation: reveal-up .85s ease-out 3.55s both; }
.animation-cinematic.is-playing [data-reveal="salutation"] { animation: reveal-up .9s ease-out 4.2s both; }
.animation-cinematic.is-playing [data-reveal="paragraph-1"] { animation: reveal-up .9s ease-out 4.95s both; }
.animation-cinematic.is-playing [data-reveal="paragraph-2"] { animation: reveal-up .9s ease-out 5.7s both; }
.animation-cinematic.is-playing [data-reveal="paragraph-3"] { animation: reveal-up .9s ease-out 6.45s both; }
.animation-cinematic.is-playing [data-reveal="wish"] { animation: reveal-up .9s ease-out 7.2s both; }
.animation-cinematic.is-playing [data-reveal="signature"] { animation: reveal-up .9s ease-out 8s both; }

@keyframes dark-opening {
  0%, 52% { opacity: 1; }
  100% { opacity: 0; }
}
@keyframes light-point {
  0% { opacity: 0; transform: scale(.2); }
  25%, 58% { opacity: 1; transform: scale(1); }
  100% { opacity: 0; transform: scale(4); }
}
@keyframes light-reveal {
  0% { opacity: 0; clip-path: circle(0% at 50% 50%); filter: blur(5px); }
  20% { opacity: 1; }
  100% { opacity: 1; clip-path: circle(75% at 50% 50%); filter: drop-shadow(0 0 22px var(--halo)); }
}
@keyframes particle-gather {
  0% { opacity: 0; transform: translate(var(--drift-x), var(--drift-y)) scale(.4); }
  14% { opacity: .8; }
  78% { opacity: .95; transform: translate(0, 0) scale(1); }
  100% { opacity: 0; transform: translate(0, 0) scale(.5); }
}
@keyframes soft-number {
  from { opacity: 0; transform: scale(.97); filter: blur(4px); }
  to { opacity: 1; transform: scale(1); filter: drop-shadow(0 0 22px var(--halo)); }
}
@keyframes cinematic-scene {
  from { opacity: .55; transform: scale(1.045); }
  to { opacity: 1; transform: scale(1); }
}
@keyframes cinematic-number {
  from { opacity: 0; transform: scale(1.22); filter: blur(8px); }
  to { opacity: 1; transform: scale(1); filter: drop-shadow(0 0 22px var(--halo)); }
}
@keyframes cinematic-sweep {
  0% { opacity: 0; left: -45%; }
  18%, 75% { opacity: 1; }
  100% { opacity: 0; left: 115%; }
}

@media (prefers-reduced-motion: reduce) {
  .hero__light-point,
  .hero__particle,
  .hero__sweep { display: none; }
  .animation-reveal.is-playing .greeting__inner::after { display: none; }
}