/* al2-view-transitions.css (2026-06-22)
   크로스도큐먼트 View Transitions — MPA 장기 표준.
   섹션 내 페이지 전환(전문가↔제조사, 솔루션 랭킹↔비교↔사례↔가이드) 시
   탑바·좌측 레일을 '지속(persistent) 셸'로 두고 본문만 부드럽게 교체 → 새로고침 플래시 제거.
   (조달정보의 '좌측 고정 + 본문 스왑' 체감을 별도 페이지를 유지한 채 구현)
   미지원 브라우저(Firefox 등)는 일반 내비게이션으로 graceful fallback. SEO·딥링크 영향 없음. */

@view-transition { navigation: auto; }

/* 셸 요소를 각자 transition group으로 분리(=root 전환에서 제외) → 위치 유지·부드러운 morph.
   topbar는 동일 컴포넌트라 사실상 고정. 좌측 레일은 박스 유지 + 내부(필터)만 부드럽게 교체.
   이름은 한 스냅샷에 1개 요소만 매칭되어야 하므로, 페이지당 단일 인스턴스인 요소에만 부여. */
#al2-topbar-mount { view-transition-name: al2-shell-topbar; }
.al2-sidebar      { view-transition-name: al2-shell-rail; }

/* 본문(=root, 셸 제외 나머지) 전환만 살짝 빠르게 */
::view-transition-old(root),
::view-transition-new(root) { animation-duration: .22s; }

/* 모션 최소화 선호 시 전환 제거 */
@media (prefers-reduced-motion: reduce) {
  ::view-transition-group(*),
  ::view-transition-old(*),
  ::view-transition-new(*) { animation: none !important; }
}