/* =========================================================
   First Aid Kerry - Animation Styles
   File: assets/css/animations.css
   ========================================================= */

/* Navigation underline slide-in from left */
.nav-link::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -0.2rem;
  width: 100%;
  height: 2px;
  background: var(--color-red);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform var(--ease);
}

.nav-link:hover::after,
.nav-link:focus-visible::after {
  transform: scaleX(1);
}

/* CTA hover states */
.btn-primary:hover,
.btn-primary:focus-visible {
  background: var(--color-red-dark);
  transform: scale(1.03);
  box-shadow: var(--shadow-md);
}

.btn-outline:hover,
.btn-outline:focus-visible {
  background: var(--color-white);
  color: var(--color-red);
  border-color: var(--color-white);
  transform: translateY(-1px);
}

.btn-dark:hover,
.btn-dark:focus-visible {
  transform: translateY(-2px);
  box-shadow: var(--shadow-md);
}

/* Course card interactions */
.course-card {
  transition: transform var(--ease), box-shadow var(--ease), border-color var(--ease);
}

.course-card:hover,
.course-card:focus-within {
  transform: translateY(-8px);
  box-shadow: var(--shadow-md);
  border-top-color: #306233;
}

.course-card .card-media img {
  transition: transform var(--ease);
}

.course-card:hover .card-media img,
.course-card:focus-within .card-media img {
  transform: scale(1.05);
}

/* Blog card interactions */
.blog-card {
  transition: transform var(--ease), box-shadow var(--ease);
}

.blog-card:hover,
.blog-card:focus-within {
  transform: translateY(-6px);
  box-shadow: var(--shadow-md);
}

.blog-card .card-media img {
  transition: transform var(--ease);
}

.blog-card:hover .card-media img,
.blog-card:focus-within .card-media img {
  transform: scale(1.05);
}

/* Trust badge subtle pulse */
@keyframes badgePulse {
  0% {
    transform: scale(1);
    box-shadow: 0 0 0 0 rgba(39, 54, 122, 0.5);
  }
  70% {
    transform: scale(1.02);
    box-shadow: 0 0 0 9px rgba(39, 54, 122, 0);
  }
  100% {
    transform: scale(1);
    box-shadow: 0 0 0 0 rgba(39, 54, 122, 0);
  }
}

.trust-badge:hover,
.trust-badge:focus-visible {
  animation: badgePulse 1.2s ease;
}

/* Social icons */
.social-link {
  transition: transform var(--ease), background-color var(--ease), border-color var(--ease), color var(--ease);
}

.social-link:hover,
.social-link:focus-visible {
  transform: scale(1.08);
  border-color: var(--color-red);
  color: var(--color-red);
  background: rgba(39, 54, 122, 0.08);
}

/* Coverage links arrow slide in */
.coverage-link {
  transition: color var(--ease), border-color var(--ease), background-color var(--ease);
}

.coverage-link:hover,
.coverage-link:focus-visible {
  color: #ffffff;
  border-color: #1e285c;
  background: #1e285c;
}

.coverage-link:hover .arrow,
.coverage-link:focus-visible .arrow {
  opacity: 1;
  transform: translateX(3px);
}

/* Footer links */
.footer-links a,
.site-footer a {
  transition: color var(--ease);
}

.footer-links a:hover,
.footer-links a:focus-visible,
.site-footer a:hover,
.site-footer a:focus-visible {
  color: var(--color-red);
}

/* Process icon rotation */
.process-step:hover .step-icon,
.process-step:focus-within .step-icon {
  transform: rotate(360deg);
}

/* Back to top */
.back-to-top {
  transition: transform var(--ease), opacity var(--ease), visibility var(--ease), background-color var(--ease);
}

.back-to-top:hover,
.back-to-top:focus-visible {
  transform: translateY(-4px);
  background: var(--color-red-dark);
}

/* Cookie bar */
.cookie-bar {
  animation: cookieSlideUp 360ms cubic-bezier(0.22, 1, 0.36, 1);
}

@keyframes cookieSlideUp {
  from {
    opacity: 0;
    transform: translateY(25px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Generic reveal classes for no-JS fallback */
.reveal-fade-up {
  opacity: 0;
  transform: translateY(16px);
  transition: opacity 520ms ease, transform 520ms ease;
}

.reveal-fade-up.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.reveal-zoom {
  opacity: 0;
  transform: scale(0.97);
  transition: opacity 520ms ease, transform 520ms ease;
}

.reveal-zoom.is-visible {
  opacity: 1;
  transform: scale(1);
}

/* Reduce hover-heavy motion on touch screens */
@media (hover: none) and (pointer: coarse) {
  .course-card:hover,
  .course-card:focus-within,
  .blog-card:hover,
  .blog-card:focus-within {
    transform: none;
  }

  .course-card:hover .card-media img,
  .course-card:focus-within .card-media img,
  .blog-card:hover .card-media img,
  .blog-card:focus-within .card-media img {
    transform: none;
  }
}

/* Page transition support */
body {
  will-change: opacity;
}