/* Progressive enhancement: content stays readable if JS is unavailable. */
:root { --motion-ease: cubic-bezier(.22, 1, .36, 1); }
.reveal { opacity: 1; transform: none; transition: none; }
.motion-item { transition: opacity 620ms var(--motion-ease), transform 620ms var(--motion-ease); transition-delay: var(--reveal-delay, 0ms); }
.motion-item.motion-pending { opacity: 0; transform: translateY(10px); }
.motion-item:focus-within { opacity: 1; transform: none; transition-delay: 0ms; }

/* Only the fixed header changes size; page content never shifts. */
.nav-shell { backdrop-filter: none; -webkit-backdrop-filter: none; transition: padding 260ms var(--motion-ease), min-height 260ms var(--motion-ease), box-shadow 260ms ease, background-color 260ms ease; }
.site-header.is-scrolled .nav-shell { min-height: 62px; padding-block: 10px; background: rgba(255,255,255,.94); box-shadow: 0 8px 24px rgba(5,28,59,.07); }
@media (min-width: 761px) and (pointer: fine) {
  @supports (backdrop-filter: blur(8px)) {
    .site-header.is-scrolled .nav-shell { backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
  }
}

.button, .nav-cta, .hero-demo-link, .plain-link, .usecase-card button, .process-controls button, .role-tab, .assistant-toggle { transition: transform 220ms var(--motion-ease), background-color 220ms ease, box-shadow 220ms ease, border-color 220ms ease; }
.button .site-icon, .plain-link .site-icon, .usecase-card button .site-icon, .demo-bottom a .site-icon { transition: transform 240ms var(--motion-ease); }
.artifact-card { transition: transform 260ms var(--motion-ease), border-color 260ms ease, box-shadow 260ms ease; }
.motion-item { transition-property: opacity, transform, border-color, box-shadow; transition-duration: 620ms, 620ms, 260ms, 260ms; }
@media (hover: hover) and (pointer: fine) {
  .button:hover, .nav-cta:hover { transform: translateY(-2px); box-shadow: 0 7px 16px rgba(5,28,59,.12); }
  .button:hover .site-icon, .plain-link:hover .site-icon, .usecase-card button:hover .site-icon, .demo-bottom a:hover .site-icon { transform: translateX(2px); }
  .artifact-card:hover { transform: translateY(-3px); border-color: #b6c9d7; box-shadow: 0 10px 24px rgba(5,28,59,.055); }
}
.button:active, .nav-cta:active, .hero-demo-link:active, .plain-link:active, .usecase-card button:active, .process-controls button:active, .role-tab:active, .assistant-toggle:active { transform: translateY(0) scale(.985); transition-duration: 90ms; }
.artifact-card:active { transform: translateY(0); }

/* Both captions share a grid cell: the hero row keeps the same height. */
.hero-task .hero-task-status { display: grid; }
.hero-task .hero-task-status > span { grid-area: 1 / 1; display: block; margin: 0; font: inherit; color: inherit; transition: opacity 380ms ease, transform 380ms var(--motion-ease); }
.hero-task .hero-task-busy { opacity: 0; transform: translateY(-3px); }
.hero-task.is-processing .hero-task-busy { opacity: 1; transform: none; }
.hero-task.is-processing .hero-task-ready { opacity: 0; transform: translateY(3px); }
.hero-task.is-processing .work-state { color: #8595a6; }
.hero-task.is-complete .work-state svg { animation: hero-check-in 480ms var(--motion-ease) both; }
@keyframes hero-check-in { from { opacity: 0; transform: scale(.8); } to { opacity: 1; transform: scale(1); } }

@media (max-width: 760px), (pointer: coarse) {
  .motion-item { transition-duration: 380ms; transition-delay: 0ms; }
  .motion-item.motion-pending { transform: translateY(6px); }
  .site-header.is-scrolled .nav-shell { min-height: 54px; padding-block: 9px; background: #fff; backdrop-filter: none; }
  .button:hover { transform: none; }
}
@media (prefers-reduced-motion: reduce) {
  .motion-item, .motion-item.motion-pending { opacity: 1; transform: none; transition: none; }
  .nav-shell, .button, .nav-cta, .artifact-card, .site-icon, .hero-task-status > span { transition: none !important; }
  .hero-task.is-complete .work-state svg { animation: none; }
  .button:hover, .nav-cta:hover, .artifact-card:hover, .button:active, .nav-cta:active { transform: none; }
}
