/* Shared motion vocabulary. Unsupported browsers retain the complete still layout. */
.studio-multipage { --rhythm-duration: .65s; --rhythm-ease: cubic-bezier(.2,.7,.1,1); --rhythm-x: -48px; --rhythm-rise: 48px; --rhythm-copy-rise: 64px; }
.rhythm-active [data-rhythm=""] { position: relative; }
.rhythm-active [data-rhythm=""]::before { content: ""; position: absolute; top: 0; left: var(--gutter); right: var(--gutter); height: 2px; background: currentColor; opacity: .28; transform-origin: left; pointer-events: none; animation: rhythm-line linear both; animation-timeline: view(); animation-range: entry 0% cover 65%; }
.rhythm-active .project[data-rhythm]::before { left: 0; right: 0; }
.rhythm-active [data-rhythm]:nth-child(even) { --rhythm-x: 48px; }
.rhythm-active .rhythm-title { animation: rhythm-heading linear both; animation-timeline: view(); animation-range: entry 0% cover 40%; }
.rhythm-active .rhythm-copy { animation: rhythm-copy linear both; animation-timeline: view(); animation-range: entry 0% cover 35%; }
.rhythm-active .rhythm-detail { animation: rhythm-detail linear both; animation-timeline: view(); animation-range: entry 0% cover 25%; }
.rhythm-active .rhythm-media { transform-origin: center; animation: rhythm-media linear both; animation-timeline: view(); animation-range: entry 0% exit 100%; }
.rhythm-active .rhythm-entry { animation: rhythm-arrive var(--rhythm-duration) var(--rhythm-ease) both; }
.rhythm-active .rhythm-entry--copy { animation-delay: .08s; }
@keyframes rhythm-line { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@keyframes rhythm-heading { from { transform: translate(var(--rhythm-x),var(--rhythm-rise)); } to { transform: none; } }
@keyframes rhythm-copy { from { transform: translateY(var(--rhythm-copy-rise)); } to { transform: none; } }
@keyframes rhythm-detail { from { transform: translateY(24px); } to { transform: none; } }
@keyframes rhythm-media { from { transform: translateY(18px) scale(.92); } to { transform: translateY(-12px) scale(1); } }
@keyframes rhythm-arrive { from { transform: translateY(20px); } to { transform: none; } }
.rhythm-active .page-invite[data-rhythm]::before { opacity: .5; }
/* Browsers without scroll timelines (older Safari, Firefox): the same moves, played once on entry. */
.rhythm-fallback [data-rhythm=""] { position: relative; }
.rhythm-fallback [data-rhythm=""]::before { content: ""; position: absolute; top: 0; left: var(--gutter); right: var(--gutter); height: 2px; background: currentColor; opacity: .28; transform-origin: left; pointer-events: none; transition: transform 1.1s var(--rhythm-ease); }
.rhythm-fallback .project[data-rhythm]::before { left: 0; right: 0; }
.rhythm-fallback .page-invite[data-rhythm]::before { opacity: .5; }
.rhythm-fallback [data-rhythm]:nth-child(even) { --rhythm-x: 48px; }
.rhythm-fallback [data-rhythm=""]:not(.rhythm-in)::before { transform: scaleX(0); }
.rhythm-fallback .rhythm-title, .rhythm-fallback .rhythm-copy, .rhythm-fallback .rhythm-detail, .rhythm-fallback .rhythm-media { transition: transform .8s var(--rhythm-ease); }
.rhythm-fallback .rhythm-copy { transition-delay: .08s; }
.rhythm-fallback .rhythm-title:not(.rhythm-in) { transform: translate(var(--rhythm-x),var(--rhythm-rise)); }
.rhythm-fallback .rhythm-copy:not(.rhythm-in) { transform: translateY(var(--rhythm-copy-rise)); }
.rhythm-fallback .rhythm-detail:not(.rhythm-in) { transform: translateY(24px); }
.rhythm-fallback .rhythm-media:not(.rhythm-in) { transform: translateY(18px) scale(.92); }
.rhythm-fallback .rhythm-entry { animation: rhythm-arrive var(--rhythm-duration) var(--rhythm-ease) both; }
.rhythm-fallback .rhythm-entry--copy { animation-delay: .08s; }
@media (min-width: 861px) {
  .page-home .project[data-rhythm] { padding-top: 40px; }
  .page-home .project[data-rhythm] .project__card { align-items: center; }
  .page-home .page-summary[data-rhythm] > div:last-child { align-self: center; }
}
@media (max-width: 860px) {
  .studio-multipage { --rhythm-rise: 24px; --rhythm-copy-rise: 32px; }
  .rhythm-active [data-rhythm] { --rhythm-x: 0px !important; }
}
/* Focus and reading alternatives always take precedence over decorative movement. */
.rhythm-active [data-rhythm]:focus-within .rhythm-title,
.rhythm-active [data-rhythm]:focus-within .rhythm-copy,
.rhythm-active [data-rhythm]:focus-within .rhythm-media,
.rhythm-active [data-rhythm]:focus-within .rhythm-detail { animation: none; }
.rhythm-fallback [data-rhythm]:focus-within .rhythm-title,
.rhythm-fallback [data-rhythm]:focus-within .rhythm-copy,
.rhythm-fallback [data-rhythm]:focus-within .rhythm-media,
.rhythm-fallback [data-rhythm]:focus-within .rhythm-detail { transform: none; }
.force-reduced [class*="rhythm-"], .force-reduced [data-rhythm]::before { animation: none !important; }
@media (prefers-reduced-motion: reduce) {
  [class*="rhythm-"], [data-rhythm]::before { animation: none !important; }
  .rhythm-fallback [class*="rhythm-"], .rhythm-fallback [data-rhythm]::before { transition: none !important; transform: none !important; }
}