/* El contador participa en el flujo del hero y nunca cubre el título. */
.hero { padding-top: 110px !important; }
.hero > .countdown-section { position: static !important; top: auto !important; right: auto !important; bottom: auto !important; left: auto !important; transform: none !important; z-index: auto !important; display: block !important; width: max-content !important; max-width: calc(100% - 24px) !important; margin: 0 auto 34px !important; padding: 0 !important; }
.hero > .countdown-section + .container { position: relative; }
.hero > .countdown-section .timer-container { position: static !important; transform: none !important; margin: 0 !important; }

.hero-main-logo-static { position: relative !important; z-index: 8; grid-column: 2; grid-row: 2; align-self: center; justify-self: center; width: min(500px, 100%) !important; margin: 0 0 34px !important; transform: translateY(18px); opacity: 0; animation: ngiwa-logo-reveal .95s cubic-bezier(.2,.8,.2,1) .18s forwards; }
.hero-main-logo-static img { display: block; width: 100%; height: 155px; object-fit: contain; object-position: center; filter: drop-shadow(0 14px 24px rgba(13,68,52,.2)); animation: ngiwa-logo-float 5.5s ease-in-out 1.2s infinite; }
.hero-main-logo-static::after { content: ""; position: absolute; inset: 22% 7%; z-index: -1; border-radius: 50%; background: radial-gradient(ellipse, rgba(85,214,0,.16), transparent 68%); opacity: 0; animation: ngiwa-logo-glow 1.3s ease-out .45s forwards; }
.hero .word-of-day { grid-row: 3 / 8 !important; }
.hero-characters { grid-row: 3 / 8 !important; }

@keyframes ngiwa-logo-reveal {
  0% { opacity: 0; transform: translateY(42px) scale(.92); filter: blur(8px); }
  65% { opacity: 1; filter: blur(0); }
  100% { opacity: 1; transform: translateY(18px) scale(1); filter: blur(0); }
}
@keyframes ngiwa-logo-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-7px); } }
@keyframes ngiwa-logo-glow { 0% { opacity: 0; transform: scale(.75); } 100% { opacity: 1; transform: scale(1); } }

@media (max-width: 900px) {
  .hero-main-logo-static { grid-column: 1; grid-row: auto; justify-self: center; width: min(390px, 88%) !important; margin: 4px auto 30px !important; }
  .hero-main-logo-static img { height: auto; max-height: 145px; }
  .hero .word-of-day, .hero-characters { grid-row: auto !important; }
}
@media (max-width: 760px) {
  .hero { padding-top: 92px !important; }
  .hero > .countdown-section { margin-bottom: 24px !important; }
}
@media (prefers-reduced-motion: reduce) {
  .hero-main-logo-static { opacity: 1; animation: none; transform: translateY(18px); }
  .hero-main-logo-static img, .hero-main-logo-static::after { animation: none; }
}