/* =========================================================
   ANIMATIONS.CSS — Smart Restaurant Light
   Ken Burns + fade-in body + fade-in sections
   NON modificare per personalizzazioni cliente.
   ========================================================= */

/* Fade-in body ─────────────────────────────────────────── */
body {
  opacity: 0;
  transition: opacity 0.3s ease;
}
body.is-ready {
  opacity: 1;
}
/* Fallback: se JS non parte, il body diventa visibile dopo 1s */
@keyframes body-fallback {
  to { opacity: 1; }
}
body {
  animation: body-fallback 0s 1s forwards;
}

/* Ken Burns hero ────────────────────────────────────────── */
@keyframes ken-burns {
  0%   { transform: scale(1); }
  100% { transform: scale(1.08); }
}
.hero__bg-img {
  animation: ken-burns 25s ease-in-out infinite alternate;
  will-change: transform;
}

/* Freccia scroll bounce ─────────────────────────────────── */
@keyframes bounce {
  0%, 100% { transform: translateY(0); }
  50%       { transform: translateY(8px); }
}
.hero__scroll-arrow {
  animation: bounce 1.8s ease-in-out infinite;
}

/* Fade-in sezioni (IntersectionObserver) ───────────────── */
.fade-in {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}
.fade-in.is-visible {
  opacity: 1;
  transform: translateY(0);
}
/* Fallback: se JS non parte, tutto visibile */
.no-js .fade-in {
  opacity: 1;
  transform: none;
}

/* Hamburger → X ─────────────────────────────────────────── */
.nav__hamburger span {
  display: block;
  width: 24px;
  height: 2px;
  background: currentColor;
  transition: transform 0.3s ease, opacity 0.3s ease;
  transform-origin: center;
}
.nav__hamburger span:nth-child(2) {
  margin: 5px 0;
}
.nav--open .nav__hamburger span:nth-child(1) {
  transform: translateY(7px) rotate(45deg);
}
.nav--open .nav__hamburger span:nth-child(2) {
  opacity: 0;
  transform: scaleX(0);
}
.nav--open .nav__hamburger span:nth-child(3) {
  transform: translateY(-7px) rotate(-45deg);
}

/* CTA Mobile Floating ───────────────────────────────────── */
.cta-mobile {
  transform: translateY(100%);
  transition: transform 0.4s ease;
}
.cta-mobile.is-visible {
  transform: translateY(0);
}
.cta-mobile.is-hidden {
  transform: translateY(100%);
}

/* Smart-hide header ─────────────────────────────────────── */
.site-header {
  transition: transform 0.35s ease, background 0.35s ease, box-shadow 0.35s ease;
}
.site-header.is-hidden {
  transform: translateY(-100%);
}

/* FAQ accordion ─────────────────────────────────────────── */
.faq__answer {
  max-height: 0;
  overflow: hidden;
  opacity: 0;
  transition: max-height 0.4s ease, opacity 0.3s ease, padding 0.3s ease;
}
.faq__item.is-open .faq__answer {
  max-height: 400px;
  opacity: 1;
}

/* Map overlay ───────────────────────────────────────────── */
.map__iframe {
  opacity: 0;
  transition: opacity 0.5s ease;
}
.map__iframe.is-loaded {
  opacity: 1;
}
