/* motion.css — scroll reveals, hero entrance, touch/reduced-motion overrides.
   loaded last so its overrides win. */

/* scroll reveals — reveal.js adds .is-in when a [data-reveal] enters the viewport;
   data-reveal value picks a direction, --reveal-delay staggers */
[data-reveal] {
	opacity: 0;
	transform: translateY(26px);
	transition: opacity var(--dur-reveal) var(--ease-out),
	            transform var(--dur-reveal) var(--ease-out);
	transition-delay: var(--reveal-delay, 0s);
}
[data-reveal="left"]  { transform: translateX(-32px); }
[data-reveal="right"] { transform: translateX(32px); }
[data-reveal="zoom"]  { transform: scale(.94); }
[data-reveal].is-in {
	opacity: 1;
	transform: none;
}
/* a revealed button must still zoom on hover — .is-in{transform:none} would win
   (equal specificity, later). higher specificity restores the scale and swaps the
   slow reveal transition for the button's quick one */
[data-reveal].is-in.btn {
	transition: opacity .5s var(--ease-out),
	            transform .5s var(--ease-out),
	            background .5s var(--ease-out),
	            color .5s var(--ease-out);
}
[data-reveal].is-in.btn:hover,
[data-reveal].is-in.btn:focus-visible { transform: scale(1.06); }
[data-reveal].is-in.btn:active { transform: scale(1.02); }

/* same for revealed cards: the reveal transition has no box-shadow, so re-declare
   it here (higher specificity) to animate the hover ring smoothly. keep the
   per-card stagger (--reveal-delay) on opacity+transform; hover stays instant */
[data-reveal].style-card,
[data-reveal].card {
	transition: opacity var(--dur-reveal) var(--ease-out) var(--reveal-delay, 0s),
	            transform .5s var(--ease-out) var(--reveal-delay, 0s),
	            border-color .5s var(--ease-out),
	            box-shadow .5s var(--ease-out);
}

/* hero entrance stagger on load (slideshow zoom lives in pages.css) */
.hero h1, .hero p, .hero__actions {
	animation: aht-rise .9s var(--ease-out) both;
}
.hero h1          { animation-delay: .15s; }
.hero p           { animation-delay: .3s; }
.hero__actions    { animation-delay: .45s; }
@keyframes aht-rise {
	from { opacity: 0; transform: translateY(24px); }
	to   { opacity: 1; transform: none; }
}

/* scroll-hint bob */
.hero__hint { animation: aht-bob 2.2s ease-in-out infinite; }
@keyframes aht-bob {
	0%, 100% { transform: translateY(0); opacity: .85; }
	50%      { transform: translateY(8px); opacity: .45; }
}

/* touch devices — no hover. a tap fires :hover and leaves it stuck, so reset to
   resting values. (hover:none) matches touch-primary only; desktop is unaffected.
   :focus-visible is left alone so keyboard focus still works. */
@media (hover: none) {
	/* kill every hover movement (scale / lift / image zoom) */
	.btn:hover,
	.nav a:not(.btn):hover,
	.card:hover,
	.style-card:hover, .style-card:hover img,
	.branch-mini:hover,
	.masonry-item:hover, .masonry-item a:hover img,
	.socials a:hover {
		transform: none !important;
	}

	/* no gold ring / border flare on tap */
	.card:hover {
		border-color: var(--line) !important;
		box-shadow: 0 0 0 0 var(--gold), 0 0 0 0 transparent !important;
	}
	.style-card:hover,
	.branch-mini:hover { border-color: var(--line) !important; }
	.style-card:hover { box-shadow: none !important; }

	/* links / pills hold their resting colour */
	.nav a:not(.btn):hover { color: var(--cream) !important; }
	.pill:hover { color: var(--sand) !important; border-color: var(--line) !important; }
	.contact-list a:hover,
	.site-footer a:hover,
	.footer-bar a:hover,
	.rev-arrow:hover { color: var(--cream) !important; }
	.socials a:hover {
		color: var(--cream) !important;
		background: transparent !important;
		border-color: var(--line) !important;
	}

	/* buttons keep their resting fill; the underline stays drawn */
	.btn--primary:hover { background: var(--yellow) !important; }
	.btn--gold:hover { background: var(--gold) !important; }
	.btn--ghost:hover { color: var(--cream) !important; }
	.btn--ghost:hover::after {
		transform: scaleX(1) !important;
		background: var(--gold) !important;
	}
}

/* reduced motion — kill everything */
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after {
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .01ms !important;
		scroll-behavior: auto !important;
	}
	[data-reveal] { opacity: 1; transform: none; }
	.hero__hint { animation: none; }
}