/* ══════════════════════════════════════════════════════════════
   MVSD — Liveness pass (subtle interactions)
   ══════════════════════════════════════════════════════════════
   Conservative animations + transitions that make the site feel
   alive without being distracting. Everything gated behind
   prefers-reduced-motion so accessibility-sensitive users get
   zero animation. Tuned for 150–400ms durations.
   ══════════════════════════════════════════════════════════════ */

@media (prefers-reduced-motion: no-preference) {

  /* ── Primary news cards — hover lift + image zoom ─────────── */
  .news-card--primary {
    transition: transform 0.25s ease, box-shadow 0.25s ease;
    will-change: transform;
  }
  .news-card--primary:hover {
    transform: translateY(-2px);
  }
  .news-card--primary .news-card-cover {
    overflow: hidden;
  }
  .news-card--primary .news-card-cover img {
    transition: transform 0.5s cubic-bezier(0.2, 0.8, 0.2, 1);
    will-change: transform;
  }
  .news-card--primary:hover .news-card-cover img {
    transform: scale(1.04);
  }

  /* ── All card title links — underline slide-in on hover ─── */
  .news-card--primary .news-card-title a,
  .news-card--teaser .news-card-title a,
  .news-card--feature .news-card-title a,
  .news-card--from-dept .news-card-title a,
  .news-article h3 a,
  .news-highlight h3 a,
  .newsletter-row__title a,
  .dept-staff__card a {
    background-image: linear-gradient(currentColor, currentColor);
    background-size: 0 1px;
    background-repeat: no-repeat;
    background-position: left bottom;
    transition: background-size 0.22s ease, color 0.15s ease;
    text-decoration: none;
  }
  .news-card--primary .news-card-title a:hover,
  .news-card--teaser .news-card-title a:hover,
  .news-card--feature .news-card-title a:hover,
  .news-card--from-dept .news-card-title a:hover,
  .news-article h3 a:hover,
  .news-highlight h3 a:hover,
  .newsletter-row__title a:hover,
  .dept-staff__card a:hover {
    background-size: 100% 1px;
  }

  /* ── Section-primary featured card — subtle shine ──────── */
  [id$="-parent-section-primary"] .news-card--primary,
  [id$="-student-section-primary"] .news-card--primary {
    transition: transform 0.25s ease, box-shadow 0.25s ease;
  }
  [id$="-parent-section-primary"] .news-card--primary:hover,
  [id$="-student-section-primary"] .news-card--primary:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.10);
  }

  /* ── Dept staff cards — hover raise ───────────────────── */
  .dept-staff__card {
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
  }
  .dept-staff__card:hover {
    transform: translateY(-2px);
  }

  /* ── Newsletter rows — subtle slide on hover ───────────── */
  .newsletter-row {
    transition: background 0.18s ease, padding-left 0.18s ease;
  }
  .newsletter-row:hover {
    padding-left: 1.25rem;
  }

  /* ── Hero — slow Ken Burns on the poster image ─────────── */
  .hero-zone .hero-poster {
    animation: mvsd-hero-kenburns 30s ease-in-out infinite alternate;
    transform-origin: center center;
    will-change: transform;
  }
  @keyframes mvsd-hero-kenburns {
    from { transform: scale(1.00); }
    to   { transform: scale(1.06); }
  }

  /* ── Primary nav — underline grow from left ─────────────── */
  .site-nav a,
  nav.mobile-nav a,
  nav.dept-nav a {
    position: relative;
  }
  .site-nav > ul > li > a::after,
  nav.dept-nav .dept-nav__list a::after {
    /* Only desktop-style horizontal nav gets this; mobile is vertical */
    position: absolute;
    left: 0;
    bottom: 0;
    height: 2px;
    width: 100%;
    background: currentColor;
    transform: scaleX(0);
    transform-origin: left center;
    transition: transform 0.22s ease;
  }
  @media (min-width: 801px) {
    .site-nav > ul > li > a::after,
    nav.dept-nav .dept-nav__list a::after {
      content: '';
    }
    .site-nav > ul > li > a:hover::after,
    nav.dept-nav .dept-nav__list a:hover::after {
      transform: scaleX(1);
    }
  }

  /* ── Drawer + dept CTAs — soft press ────────────────────── */
  .btn-cta,
  .split-panel__cta,
  .dept-nav__toggle {
    transition: filter 0.15s ease, transform 0.08s ease, box-shadow 0.15s ease;
    will-change: transform;
  }
  .btn-cta:active,
  .split-panel__cta:active,
  .dept-nav__toggle:active {
    transform: scale(0.98);
  }

  /* ── Mission panel images — gentle breathing ────────────── */
  .mission-panel__image,
  .evergreen-images img {
    transition: transform 0.4s ease, box-shadow 0.4s ease;
    will-change: transform;
  }
  .mission-panel__image:hover,
  .evergreen-images img:hover {
    transform: translateY(-3px) scale(1.02);
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.12);
  }

  /* ── Secondary sidebar panel — fade in on initial page load ── */
  .news-secondary-panel,
  .news-zone > .zone-inner > div > .views-element-container:nth-child(2) {
    animation: mvsd-fade-up 0.5s ease-out 0.1s both;
  }
  @keyframes mvsd-fade-up {
    from { opacity: 0; transform: translateY(8px); }
    to   { opacity: 1; transform: translateY(0); }
  }

  /* ── Dept sidebar cards — staggered fade-in ─────────────── */
  .dept-staff__card {
    animation: mvsd-fade-up 0.4s ease-out both;
  }
  .dept-staff__card:nth-child(1) { animation-delay: 0.05s; }
  .dept-staff__card:nth-child(2) { animation-delay: 0.12s; }
  .dept-staff__card:nth-child(3) { animation-delay: 0.19s; }
  .dept-staff__card:nth-child(4) { animation-delay: 0.26s; }
  .dept-staff__card:nth-child(5) { animation-delay: 0.33s; }
  .dept-staff__card:nth-child(n+6) { animation-delay: 0.4s; }
}
