/* Wanees — shared motion / "juice" layer. Warm and tactile, never arcade. */

/* Scroll-reveal: sections rise + fade as they enter the viewport */
.wn-reveal { opacity: 0; transform: translateY(24px); transition: opacity .6s ease, transform .75s cubic-bezier(.2,.7,.2,1); }
.wn-reveal.wn-seen { opacity: 1; transform: none; }

/* Nav links: underline draws in from the left on hover */
.nav { position: relative; }
.nav::after { content: ""; position: absolute; left: 0; right: 100%; bottom: -2px; height: 1.5px; background: #B0503A; transition: right .28s cubic-bezier(.2,.7,.2,1); }
.nav:hover::after { right: 0; }

/* Ticket buttons: springy hover lift + a real press */
.ticket { transition: transform .16s cubic-bezier(.34,1.56,.64,1), filter .16s ease; }
.ticket:hover { transform: translateY(-2px); filter: drop-shadow(0 11px 13px rgba(46,36,28,.28)); }
.ticket:active { transform: translateY(1px) scale(.992); }

/* Cards: gentle spring-lift on hover (the site's common card radii) */
[style*="border-radius:16px"], [style*="border-radius:14px"], [style*="border-radius:20px"] {
  transition: transform .22s cubic-bezier(.34,1.56,.64,1), box-shadow .24s ease;
}
[style*="border-radius:16px"]:hover, [style*="border-radius:14px"]:hover, [style*="border-radius:20px"]:hover {
  transform: translateY(-5px); box-shadow: 0 16px 36px rgba(46,36,28,.15);
}

/* Icon "stamps" and chips: a small tactile response */
.wn-stamp { transition: transform .2s cubic-bezier(.34,1.56,.64,1); }
.wn-stamp:hover { transform: translateY(-3px) rotate(-3deg); }

/* Pet toggle press */
.pet-btn { transition: transform .12s ease; }
.pet-btn:active { transform: scale(.94); }

/* Scene text pop when it changes */
@keyframes wnPop { 0% { opacity: 0; transform: translateY(7px) scale(.985); } 100% { opacity: 1; transform: none; } }
.wn-pop { animation: wnPop .42s cubic-bezier(.2,.7,.2,1); }

@media (prefers-reduced-motion: reduce) {
  .wn-reveal, .wn-reveal.wn-seen { opacity: 1 !important; transform: none !important; transition: none !important; }
  .ticket, .wn-stamp, .pet-btn, [style*="border-radius:16px"], [style*="border-radius:14px"], [style*="border-radius:20px"] { transition: none !important; }
  .nav::after { display: none; }
  .wn-pop { animation: none !important; }
}

/* ── Keyboard focus (WCAG 2.4.7) ──────────────────────────────────────────
   Nothing in the page styles gave keyboard users a visible focus ring, so
   tabbing through the site was invisible. Ring only on keyboard focus, so
   mouse clicks stay clean. */
:focus-visible {
  outline: 2px solid #8A3A26;
  outline-offset: 3px;
  border-radius: 4px;
}
a:focus-visible, button:focus-visible, .ticket:focus-visible,
input:focus-visible, .qbtn:focus-visible, .pet-btn:focus-visible {
  outline: 2px solid #8A3A26;
  outline-offset: 3px;
}
/* the ticket buttons are dark — lift the ring off the terracotta */
.ticket:focus-visible { outline-color: #2E241C; outline-offset: 4px; }

/* Skip link: first tab stop, hidden until focused. */
.skip-link {
  position: absolute; left: 12px; top: -60px; z-index: 999;
  background: #B0503A; color: #FDF6EE; border: none;
  font: 600 15px/1 Karla, sans-serif; padding: 12px 18px; border-radius: 4px;
  transition: top .18s ease;
}
.skip-link:focus { top: 12px; }