/* =============================================================
   PSS Secure Transport — Animations
   Vanilla CSS keyframes + reveal-on-scroll mechanism + hover
   micro-interactions. Loaded between main.css and theme-light.css.
   Respects prefers-reduced-motion.
   ============================================================= */

/* ---------- Keyframes ------------------------------------- */
@keyframes fadeIn {
	from { opacity: 0; }
	to   { opacity: 1; }
}
@keyframes fadeInUp {
	from { opacity: 0; transform: translateY(24px); }
	to   { opacity: 1; transform: none; }
}
@keyframes fadeInDown {
	from { opacity: 0; transform: translateY(-24px); }
	to   { opacity: 1; transform: none; }
}
@keyframes fadeInLeft {
	from { opacity: 0; transform: translateX(-24px); }
	to   { opacity: 1; transform: none; }
}
@keyframes fadeInRight {
	from { opacity: 0; transform: translateX(24px); }
	to   { opacity: 1; transform: none; }
}
@keyframes scaleIn {
	from { opacity: 0; transform: scale(0.96); }
	to   { opacity: 1; transform: none; }
}
@keyframes float {
	0%, 100% { transform: translateY(0); }
	50%      { transform: translateY(-8px); }
}
@keyframes pulse {
	0%, 100% { transform: scale(1); }
	50%      { transform: scale(1.04); }
}
@keyframes shimmer {
	0%   { background-position: -200% 0; }
	100% { background-position: 200% 0; }
}

/* ---------- Reveal-on-scroll mechanism -------------------- */
/* Elements with [data-reveal] start hidden + offset; .is-revealed
   class is added by reveal.js when the element enters the viewport. */
[data-reveal] {
	opacity: 0;
	transition:
		opacity 0.7s ease,
		transform 0.7s cubic-bezier(0.2, 0.7, 0.3, 1);
	will-change: opacity, transform;
}
[data-reveal="up"]    { transform: translateY(24px); }
[data-reveal="down"]  { transform: translateY(-24px); }
[data-reveal="left"]  { transform: translateX(-24px); }
[data-reveal="right"] { transform: translateX(24px); }
[data-reveal="scale"] { transform: scale(0.96); }
[data-reveal="fade"]  { transform: none; }

.is-revealed {
	opacity: 1 !important;
	transform: none !important;
}

/* Stagger via [data-reveal-delay="100".."600"] */
[data-reveal-delay="50"]  { transition-delay: 0.05s; }
[data-reveal-delay="100"] { transition-delay: 0.10s; }
[data-reveal-delay="150"] { transition-delay: 0.15s; }
[data-reveal-delay="200"] { transition-delay: 0.20s; }
[data-reveal-delay="250"] { transition-delay: 0.25s; }
[data-reveal-delay="300"] { transition-delay: 0.30s; }
[data-reveal-delay="350"] { transition-delay: 0.35s; }
[data-reveal-delay="400"] { transition-delay: 0.40s; }
[data-reveal-delay="500"] { transition-delay: 0.50s; }
[data-reveal-delay="600"] { transition-delay: 0.60s; }

/* ---------- Smooth scroll --------------------------------- */
html { scroll-behavior: smooth; }

/* ---------- Hover micro-interactions ---------------------- */

/* Buttons: subtle lift + brand-blue shadow */
.button,
input[type="submit"],
input[type="button"],
button.button {
	transition:
		transform 0.18s cubic-bezier(0.2, 0.7, 0.3, 1),
		box-shadow 0.22s ease,
		background-color 0.2s ease,
		color 0.2s ease !important;
}
.button:hover,
input[type="submit"]:hover,
input[type="button"]:hover,
button.button:hover {
	transform: translateY(-2px);
	box-shadow: 0 10px 22px -10px rgba(76, 92, 150, 0.45);
}
.button:active,
input[type="submit"]:active,
input[type="button"]:active,
button.button:active {
	transform: translateY(0);
}

/* Book Now CTA — preserve theme-light button-bg, add lift */
#header nav a.book-now-btn {
	transition:
		transform 0.18s cubic-bezier(0.2, 0.7, 0.3, 1),
		box-shadow 0.22s ease,
		background-color 0.15s ease !important;
}
#header nav a.book-now-btn:hover {
	transform: translateY(-2px);
	box-shadow: 0 10px 22px -8px rgba(245, 166, 35, 0.55) !important;
}
#header nav a.book-now-btn:active {
	transform: translateY(0);
}

/* Spotlight images: gentle zoom on hover */
.wrapper.spotlight .image img {
	transition: transform 0.6s cubic-bezier(0.2, 0.7, 0.3, 1) !important;
}
.wrapper.spotlight .image:hover img {
	transform: scale(1.04);
}

/* Testimonial cards: lift + deeper shadow */
.testimonials article,
.testimonial-card {
	transition:
		transform 0.28s cubic-bezier(0.2, 0.7, 0.3, 1),
		box-shadow 0.28s ease !important;
}
.testimonials article:hover,
.testimonial-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 14px 32px -12px rgba(26, 26, 26, 0.18);
}

/* Accreditation logos: refined lift */
.accreditations-strip ul.accred-logos img {
	transition:
		opacity 0.2s ease,
		transform 0.28s cubic-bezier(0.2, 0.7, 0.3, 1) !important;
}
.accreditations-strip ul.accred-logos img:hover {
	opacity: 1 !important;
	transform: translateY(-3px) scale(1.03) !important;
}

/* Features grid cards (used in about, services, etc.) */
.features > article {
	transition:
		transform 0.28s cubic-bezier(0.2, 0.7, 0.3, 1),
		box-shadow 0.28s ease;
}
.features > article:hover {
	transform: translateY(-4px);
	box-shadow: 0 14px 30px -14px rgba(76, 92, 150, 0.28);
}

/* Fleet gallery — if a card pattern exists */
.fleet-grid > * {
	transition:
		transform 0.3s cubic-bezier(0.2, 0.7, 0.3, 1),
		box-shadow 0.3s ease;
}
.fleet-grid > *:hover {
	transform: translateY(-3px);
	box-shadow: 0 12px 28px -12px rgba(26, 26, 26, 0.20);
}

/* Inline link hover: subtle underline thickening */
a.link-underline {
	background-image: linear-gradient(currentColor, currentColor);
	background-size: 0% 1px;
	background-repeat: no-repeat;
	background-position: 0 100%;
	transition: background-size 0.25s ease;
	text-decoration: none;
}
a.link-underline:hover {
	background-size: 100% 1px;
}

/* Focus visible — accessibility polish */
a:focus-visible,
button:focus-visible,
.button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
	outline: 2px solid var(--pss-blue, #4c5c96);
	outline-offset: 3px;
	border-radius: 4px;
}

/* Float-in helper (auto-plays once on load if .auto-float applied) */
.auto-float { animation: float 6s ease-in-out infinite; }
.auto-pulse { animation: pulse 2.4s ease-in-out infinite; }

/* GPU acceleration utility */
.gpu-accelerate {
	will-change: transform;
	transform: translateZ(0);
	backface-visibility: hidden;
}

/* ---------- Reduced motion guard -------------------------- */
@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
	[data-reveal] {
		opacity: 1 !important;
		transform: none !important;
	}
	html { scroll-behavior: auto !important; }
	.auto-float, .auto-pulse { animation: none !important; }
}
