/* ==========================================================================
   Giggle Town — motion ("playful but gentle")
   - Scroll reveals and hero entrance run only when <html> has .has-motion
     (set in header.php when the visitor hasn't asked for reduced motion).
   - Hover effects only apply on devices that can hover.
   ========================================================================== */

:root {
	--ease-bounce: cubic-bezier(.34, 1.45, .64, 1);
	--ease-soft: cubic-bezier(.22, .7, .3, 1);
}

/* Scroll reveal ------------------------------------------------------------ */
.has-motion .reveal {
	opacity: 0;
	translate: 0 28px;
	transition:
		opacity .7s var(--ease-soft) var(--reveal-delay, 0ms),
		translate .8s var(--ease-bounce) var(--reveal-delay, 0ms),
		scale .8s var(--ease-bounce) var(--reveal-delay, 0ms);
}
.has-motion .reveal--pop { scale: .94; }
.has-motion .reveal.is-visible { opacity: 1; translate: 0 0; scale: 1; }

/* Hero entrance ------------------------------------------------------------ */
.has-motion .hero-enter {
	animation: gt-hero-in .9s var(--ease-bounce) both;
	animation-delay: var(--reveal-delay, 0ms);
}
@keyframes gt-hero-in {
	from { opacity: 0; translate: 0 26px; scale: .97; }
	to { opacity: 1; translate: 0 0; scale: 1; }
}

/* Twinkling hero stars & floating mascots ------------------------------------ */
.has-motion .twinkle { animation: gt-twinkle 3.2s ease-in-out infinite; animation-delay: var(--twinkle-delay, 0s); transform-origin: center; }
@keyframes gt-twinkle {
	0%, 100% { scale: 1; rotate: 0deg; opacity: 1; }
	50% { scale: 1.18; rotate: 14deg; opacity: .8; }
}
.has-motion .zones-hero__media,
.has-motion .party-hero__media,
.has-motion .school-hero__media,
.has-motion .passes-hero__decor,
.has-motion .contact-hero__decor { animation: gt-float 6s ease-in-out infinite; }
@keyframes gt-float {
	0%, 100% { translate: 0 0; }
	50% { translate: 0 -10px; }
}

/* Buttons ------------------------------------------------------------------- */
.btn,
.site-header__cta,
.carousel__arrow,
[class*="__btn"],
[class*="__card-btn"] {
	transition: translate .3s var(--ease-bounce), scale .2s ease, box-shadow .3s ease, background-color .25s ease, color .25s ease, filter .25s ease;
}
.btn svg,
[class*="__btn"] svg,
[class*="__card-btn"] svg { transition: translate .3s var(--ease-bounce); }

@media (hover: hover) {
	.btn:hover,
	.site-header__cta:hover,
	[class*="__btn"]:hover,
	[class*="__card-btn"]:hover {
		translate: 0 -3px;
		box-shadow: 0 14px 26px rgba(255, 196, 0, 0.45);
		filter: brightness(1.04);
	}
	.btn--blue:hover,
	.contact-message__btn:hover { box-shadow: 0 14px 26px rgba(12, 66, 154, 0.38); }
	.btn--ghost:hover,
	.post-body__card-btn:hover { box-shadow: 0 10px 22px rgba(10, 42, 110, 0.18); background-color: rgba(255, 255, 255, 0.12); }
	.post-body__card-btn:hover { background-color: #F3F7FF; }
	.btn:hover svg,
	[class*="__btn"]:hover svg,
	[class*="__card-btn"]:hover svg { translate: 4px 0; }

	.carousel__arrow:not(:disabled):hover { translate: 0 -3px; scale: 1.06; box-shadow: 0 10px 22px rgba(12, 66, 154, 0.4); }
}
.btn:active,
.site-header__cta:active,
[class*="__btn"]:active,
[class*="__card-btn"]:active,
.carousel__arrow:not(:disabled):active { translate: 0 1px; scale: .97; }

/* Cards --------------------------------------------------------------------- */
.home-zones__card, .home-learn__card, .home-passes__card, .home-reviews__card, .home-celebrate__card,
.zones-list__card, .zones-more__card, .passes-plans__card, .passes-before__card, .party-packages__card,
.party-extras__card, .school-why__card, .school-enquire__card, .contact-find__card, .blog-featured__card, .blog-more__card {
	transition: translate .35s var(--ease-bounce), box-shadow .35s ease, border-color .3s ease;
}
.home-zones__card-img, .zones-list__card-img, .home-celebrate__card-img, .blog-more__card-img,
.blog-featured__card-img, .home-passes__card-avatar, .passes-plans__card-avatar, .party-packages__card-avatar {
	transition: scale .6s var(--ease-soft), rotate .4s var(--ease-bounce);
}
.home-learn__card-icon, .school-why__card-icon, .passes-before__card-icon, .contact-find__card-icon,
.home-journey__icon, .party-extras__card-icon, .school-enquire__card-icon {
	transition: rotate .4s var(--ease-bounce), scale .4s var(--ease-bounce);
}

@media (hover: hover) {
	.home-zones__card:hover { translate: 0 -5px; box-shadow: 0 18px 34px rgba(10, 42, 110, 0.16); }
	.home-learn__card:hover, .home-passes__card:hover, .home-celebrate__card:hover, .zones-list__card:hover,
	.zones-more__card:hover, .passes-plans__card:hover, .passes-before__card:hover, .party-packages__card:hover,
	.school-why__card:hover, .school-enquire__card:hover, .contact-find__card:hover, .blog-featured__card:hover,
	.blog-more__card:hover {
		translate: 0 -6px;
		box-shadow: 0 22px 40px rgba(10, 42, 110, 0.16);
	}
	.home-reviews__card:hover { translate: 0 -6px; box-shadow: 0 20px 36px rgba(10, 42, 110, 0.18); }
	.party-extras__card:hover { translate: 0 -3px; box-shadow: 0 12px 24px rgba(10, 42, 110, 0.12); }

	.home-zones__card:hover .home-zones__card-img,
	.zones-list__card:hover .zones-list__card-img,
	.home-celebrate__card:hover .home-celebrate__card-img,
	.blog-more__card:hover .blog-more__card-img,
	.blog-featured__card:hover .blog-featured__card-img { scale: 1.05; }

	.home-passes__card:hover .home-passes__card-avatar,
	.passes-plans__card:hover .passes-plans__card-avatar,
	.party-packages__card:hover .party-packages__card-avatar { rotate: -8deg; scale: 1.06; }

	.home-learn__card:hover .home-learn__card-icon,
	.school-why__card:hover .school-why__card-icon,
	.passes-before__card:hover .passes-before__card-icon,
	.contact-find__card:hover .contact-find__card-icon,
	.school-enquire__card:hover .school-enquire__card-icon { rotate: -10deg; scale: 1.1; }

	.home-journey__item:hover .home-journey__icon { scale: 1.1; rotate: 6deg; }

	/* Little pills wobble */
	.party-themes__badge { transition: scale .3s var(--ease-bounce), rotate .3s var(--ease-bounce); }
	.party-themes__badge:hover { scale: 1.08; rotate: -3deg; }

	/* Gallery photos */
	.photo-gallery__item { transition: translate .35s var(--ease-bounce), box-shadow .35s ease; }
	.photo-gallery__item:hover { translate: 0 -4px; box-shadow: 0 16px 30px rgba(10, 42, 110, 0.16); }
	.photo-gallery__item .placeholder-img { transition: scale .6s var(--ease-soft); }
	.photo-gallery__item:hover .placeholder-img { scale: 1.05; }
}

/* Image frames clip their zooming photos */
.home-celebrate__card-img, .blog-featured__card-img { will-change: auto; }
.blog-featured__card-link, .blog-more__card-link { display: block; overflow: hidden; }

/* FAQ answers ----------------------------------------------------------------- */
.faq[open] > summary ~ * { animation: gt-faq-open .4s var(--ease-soft) both; }
@keyframes gt-faq-open {
	from { opacity: 0; translate: 0 -6px; }
	to { opacity: 1; translate: 0 0; }
}

/* Reviews rotator: cards glide when they swap places */
.home-reviews__card { transition: translate .35s var(--ease-bounce), box-shadow .35s ease, order 0s; }

/* Reduced motion ---------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
	.has-motion .reveal { opacity: 1; translate: none; scale: none; }
}
