/* Unified motion language for the trilingual homepage. */

body[data-current="home"] {
  /* 125 BPM pulse: 480ms per beat. */
  --motion-fast: 120ms;
  --motion-note: 240ms;
  --motion-phrase: 480ms;
  --motion-section: 720ms;
  --motion-stage: 960ms;
  --motion-score-breath: 7680ms;
  --motion-stage-breath: 11520ms;

  --motion-ease-attack: cubic-bezier(0.16, 1, 0.3, 1);
  --motion-ease-legato: cubic-bezier(0.22, 0.61, 0.36, 1);
  --motion-ease-phrase: cubic-bezier(0.22, 1, 0.36, 1);
  --motion-ease-stage: cubic-bezier(0.16, 0.84, 0.24, 1);

  --motion-distance-fast: 2px;
  --motion-distance-note: 8px;
  --motion-distance-phrase: 16px;
  --motion-distance-section: 28px;
  --motion-distance-stage: 48px;
  --motion-scale-phrase: 1.025;
}

/* Header: short controls, longer structural compression. */
body[data-current="home"] .site-header {
  transition-duration: var(--motion-phrase);
  transition-timing-function: var(--motion-ease-phrase);
}

body[data-current="home"] .site-header .utility-inner,
body[data-current="home"] .site-header .brand-row,
body[data-current="home"] .site-header .nav-row,
body[data-current="home"] .site-header .mega-menu {
  transition-duration: var(--motion-phrase);
  transition-timing-function: var(--motion-ease-phrase);
}

body[data-current="home"] .site-header .mobile-menu-toggle,
body[data-current="home"] .site-header .mobile-menu-toggle span,
body[data-current="home"] .site-header .nav-link,
body[data-current="home"] .site-header .submenu-toggle,
body[data-current="home"] .site-header .utility-links a,
body[data-current="home"] .site-header .language-switcher a {
  transition-duration: var(--motion-fast);
  transition-timing-function: var(--motion-ease-attack);
}

body[data-current="home"] .site-header a {
  transition-duration: var(--motion-fast);
  transition-timing-function: var(--motion-ease-attack);
}

/* Hero: pointer response, notes, phrases and the whole stage use separate scales. */
body[data-current="home"] .zh-hero-r5-backdrop,
body[data-current="home"] .headline-stage-slides {
  transition-duration: var(--motion-note);
  transition-timing-function: var(--motion-ease-legato);
}

body[data-current="home"] .stage-light {
  transition-duration: var(--motion-fast), var(--motion-fast), var(--motion-note);
  transition-timing-function: var(--motion-ease-legato), linear, var(--motion-ease-attack);
}

body[data-current="home"] .stage-ambient {
  animation-duration: var(--motion-stage-breath);
  animation-timing-function: ease-in-out;
  transition-duration: var(--motion-stage);
  transition-timing-function: var(--motion-ease-stage);
}

body[data-current="home"] .stage-vignette {
  transition-duration: var(--motion-stage);
  transition-timing-function: var(--motion-ease-stage);
}

body[data-current="home"] .headline-stage-slide.is-active {
  animation-duration: var(--motion-section);
  animation-timing-function: var(--motion-ease-phrase);
}

body[data-current="home"] .stage-media {
  transition-duration: var(--motion-phrase);
  transition-timing-function: var(--motion-ease-phrase);
}

body[data-current="home"] .stage-copy {
  transition-duration: var(--motion-section), var(--motion-stage), var(--motion-stage);
  transition-timing-function: var(--motion-ease-stage), var(--motion-ease-phrase), var(--motion-ease-phrase);
}

body[data-current="home"] .living-score-lines {
  animation-duration: var(--motion-score-breath);
  animation-timing-function: ease-in-out;
}

body[data-current="home"] .score-note,
body[data-current="home"] .score-note span,
body[data-current="home"] .score-progress-node,
body[data-current="home"] .score-playhead {
  transition-duration: var(--motion-note);
  transition-timing-function: var(--motion-ease-attack);
}

body[data-current="home"] .score-experience,
body[data-current="home"] .sound-experience,
body[data-current="home"] .stage-step,
body[data-current="home"] .stage-pause {
  transition-duration: var(--motion-note);
  transition-timing-function: var(--motion-ease-attack);
}

/* Shared CTA cadence. */
body[data-current="home"] .button,
body[data-current="home"] .text-link,
body[data-current="home"] .directory-item,
body[data-current="home"] .back-to-top {
  transition-duration: var(--motion-note);
  transition-timing-function: var(--motion-ease-attack);
}

body[data-current="home"] .button:hover,
body[data-current="home"] .button:focus-visible,
body[data-current="home"] .back-to-top:hover,
body[data-current="home"] .back-to-top:focus-visible {
  transform: translateY(calc(-1 * var(--motion-distance-fast)));
}

/* News: feature depth is a phrase, index feedback is a fast note. */
body[data-current="home"] .college-news-access a::after,
body[data-current="home"] .college-news-index li::before,
body[data-current="home"] .college-news-index strong,
body[data-current="home"] .college-news-index li > a > span:last-child {
  transition-duration: var(--motion-fast);
  transition-timing-function: var(--motion-ease-attack);
}

body[data-current="home"] .college-news-lead-media,
body[data-current="home"] .college-news-lead-media img,
body[data-current="home"] .college-news-lead-copy,
body[data-current="home"] .college-news-story-media img {
  transition-duration: var(--motion-phrase);
  transition-timing-function: var(--motion-ease-phrase);
}

body[data-current="home"] .college-news-story-media::after {
  transition-duration: var(--motion-note);
  transition-timing-function: var(--motion-ease-attack);
}

body[data-current="home"] .college-news-lead:hover .college-news-lead-media,
body[data-current="home"] .college-news-lead:focus-within .college-news-lead-media {
  transform: translate3d(calc(-1 * var(--motion-distance-note)), calc(-0.5 * var(--motion-distance-note)), 20px);
}

body[data-current="home"] .college-news-lead:hover .college-news-lead-copy,
body[data-current="home"] .college-news-lead:focus-within .college-news-lead-copy {
  transform: translate3d(var(--motion-distance-note), calc(-1 * var(--motion-distance-note)), 82px);
}

body[data-current="home"] .college-news-index li:hover strong,
body[data-current="home"] .college-news-index li:focus-within strong {
  transform: translateX(var(--motion-distance-note));
}

body[data-current="home"] .college-news-index li:hover a > span:last-child,
body[data-current="home"] .college-news-index li:focus-within a > span:last-child {
  transform: translateX(var(--motion-distance-fast));
}

/* Performance and Media: controls stay quick, images move as full phrases or stages. */
body[data-current="home"] .programme-desk a {
  transition-duration: var(--motion-note);
  transition-timing-function: var(--motion-ease-attack);
}

body[data-current="home"] .media-story-image {
  transition-duration: var(--motion-stage);
  transition-timing-function: var(--motion-ease-stage);
}

body[data-current="home"] .media-story-depth {
  animation-timing-function: linear;
}

/* Section entrances share one legato release. */
body[data-current="home"] .reveal,
body[data-current="home"] .reveal-mask,
body[data-current="home"] .reveal-media {
  transition-duration: var(--motion-section);
  transition-timing-function: var(--motion-ease-phrase);
}

body[data-current="home"] .reveal-date {
  transition-duration: var(--motion-phrase);
  transition-timing-function: var(--motion-ease-phrase);
}

body[data-current="home"] .reveal-mask:not(.is-visible) {
  transform: translateY(var(--motion-distance-phrase));
}

body[data-current="home"] .reveal-media:not(.is-visible) {
  scale: var(--motion-scale-phrase);
}

body[data-current="home"] .reveal-date:not(.is-visible) {
  transform: translateX(calc(-1 * var(--motion-distance-phrase)));
}

/* Hero specificity pass: normalize legacy spatial and score feedback. */
body[data-current="home"] .zh-hero-r5 .headline-stage-slide .stage-media {
  transition-duration: var(--motion-phrase);
  transition-timing-function: var(--motion-ease-phrase);
}

body[data-current="home"] .zh-hero-r5 .headline-stage-slide.is-active .stage-media {
  transition-duration: var(--motion-phrase);
  transition-timing-function: var(--motion-ease-phrase);
}

body[data-current="home"] .zh-hero-r5 .headline-stage-slide .stage-copy {
  transition-duration: var(--motion-fast), var(--motion-note);
  transition-timing-function: var(--motion-ease-legato), var(--motion-ease-phrase);
}

body[data-current="home"] .zh-hero-r5 .zh-hero-r5-foreground,
body[data-current="home"] .zh-hero-r5 .stage-foreground-r4 {
  transition-duration: var(--motion-fast), var(--motion-note);
  transition-timing-function: var(--motion-ease-legato), var(--motion-ease-phrase);
}

body[data-current="home"] .zh-hero-r5 .living-score {
  transition-duration: var(--motion-note);
  transition-timing-function: var(--motion-ease-legato);
}

body[data-current="home"] .zh-hero-r5 .living-score-lines {
  transition-duration: var(--motion-phrase), var(--motion-phrase), var(--motion-note);
  transition-timing-function: var(--motion-ease-phrase), var(--motion-ease-phrase), var(--motion-ease-stage);
}

body[data-current="home"] .zh-hero-r5 .living-score-lines path {
  transition-duration: var(--motion-phrase), var(--motion-section);
  transition-timing-function: var(--motion-ease-phrase), var(--motion-ease-phrase);
}

body[data-current="home"] .zh-hero-r5 .score-progress-node span {
  transition-duration: var(--motion-note);
  transition-timing-function: var(--motion-ease-attack);
}

@media (prefers-reduced-motion: reduce) {
  body[data-current="home"] *,
  body[data-current="home"] *::before,
  body[data-current="home"] *::after {
    scroll-behavior: auto;
  }

  body[data-current="home"] .stage-ambient,
  body[data-current="home"] .living-score-lines,
  body[data-current="home"] .headline-stage-slide.is-active {
    animation-duration: 1ms;
    animation-iteration-count: 1;
  }

  body[data-current="home"] .reveal,
  body[data-current="home"] .reveal-mask,
  body[data-current="home"] .reveal-media,
  body[data-current="home"] .reveal-date {
    transition-duration: 1ms;
  }
}