/* Progressive enhancement for the existing static, multi-page site.
   No intercepted navigation, scroll loop, animation dependency or inline style. */
:root {
  --om-motion-fast: 180ms;
  --om-motion-page: 240ms;
  --om-motion-medium: 320ms;
  --om-motion-enter: 640ms;
  --om-ease: cubic-bezier(.22, 1, .36, 1);
}

.om-header a, .om-footer a,
.md-typeset :is(.om-button, .om-text-link, .om-departments > a, .om-work-row) {
  transition: color var(--om-motion-fast) ease,
    background-color var(--om-motion-fast) ease,
    border-color var(--om-motion-fast) ease,
    transform var(--om-motion-fast) var(--om-ease);
}
.md-typeset details > summary::after {
  transition: transform var(--om-motion-fast) var(--om-ease);
}

@media (prefers-reduced-motion: no-preference) {
  html { scroll-behavior: smooth; }

  /* Same-document content stays readable in browsers without this feature. */
  @view-transition { navigation: auto; }
  :root { view-transition-name: none; }
  /* Keep the mobile drawer outside the transition's stacking context. */
  .md-content { view-transition-name: lbc-content; }
  ::view-transition-group(lbc-content) {
    animation-duration: var(--om-motion-page);
    animation-timing-function: var(--om-ease);
  }
  ::view-transition-old(lbc-content) { animation: om-page-out 120ms ease-out both; }
  ::view-transition-new(lbc-content) { animation: om-page-in var(--om-motion-page) var(--om-ease) both; }
  @keyframes om-page-out { to { opacity: 0; } }
  @keyframes om-page-in { from { opacity: 0; transform: translateY(4px); } }

  .om-hero-copy > :is(.om-eyebrow, h1, .om-motto, .om-intro, .om-actions),
  .om-hero-mark { animation: om-enter 760ms var(--om-ease) both; }
  .om-hero-copy > h1 { animation-delay: 40ms; }
  .om-hero-copy > .om-motto { animation-delay: 80ms; }
  .om-hero-copy > .om-intro { animation-delay: 120ms; }
  .om-hero-copy > .om-actions, .om-hero-mark { animation-delay: 160ms; }
  @keyframes om-enter { from { opacity: 0; transform: translateY(12px); } }

  /* Content is visible by default. JS opts in only after observing targets. */
  .om-motion .om-reveal {
    opacity: 0;
    transform: translateY(14px);
    transition: opacity var(--om-motion-enter) var(--om-ease),
      transform var(--om-motion-enter) var(--om-ease);
  }
  .om-motion .om-reveal.is-revealed { opacity: 1; transform: none; }
  .om-motion :is(.om-news-grid, .om-departments, .om-document-grid) > .om-reveal:nth-child(2) { transition-delay: 60ms; }
  .om-motion :is(.om-news-grid, .om-departments, .om-document-grid) > .om-reveal:nth-child(n+3) { transition-delay: 120ms; }
  .om-motion .om-reveal:focus-within { opacity: 1; transform: none; transition-delay: 0ms; }

  @supports (interpolate-size: allow-keywords) and selector(details::details-content) {
    .md-typeset details:is(.lbc-role, .lbc-disclosure, .lbc-faq, .om-guide) {
      interpolate-size: allow-keywords;
    }
    .md-typeset details:is(.lbc-role, .lbc-disclosure, .lbc-faq, .om-guide)::details-content {
      display: flow-root;
      block-size: 0;
      opacity: 0;
      overflow: clip;
      transition: block-size var(--om-motion-medium) var(--om-ease),
        opacity var(--om-motion-fast) ease,
        content-visibility var(--om-motion-medium) allow-discrete;
    }
    .md-typeset details:is(.lbc-role, .lbc-disclosure, .lbc-faq, .om-guide)[open]::details-content {
      block-size: auto;
      opacity: 1;
    }
  }

  @media (max-width: 76.234375em) {
    .md-sidebar--primary, .md-overlay {
      transition-duration: var(--om-motion-page);
      transition-timing-function: var(--om-ease);
    }
  }
}

@media (prefers-reduced-motion: reduce) {
  @view-transition { navigation: none; }
  html { scroll-behavior: auto; }
  .om-reveal { opacity: 1 !important; transform: none !important; }
}
@media print {
  .om-reveal { opacity: 1 !important; transform: none !important; }
}