/* Motion is an enhancement: the unmodified page remains fully visible. */
@media (min-width: 1200px) and (min-height: 900px) and (prefers-reduced-motion: no-preference) {
  body.live-page.motion-story .home-story-section {
    display: grid;
    grid-template-columns: minmax(190px, 240px) minmax(0, 1fr);
    column-gap: clamp(32px, 5vw, 80px);
    align-items: start;
  }
  body.live-page.motion-story .home-story-section > h2 {
    position: sticky;
    top: 112px;
    align-self: start;
    margin: 0;
  }
  body.live-page.motion-story .home-story-layout {
    min-width: 0;
  }
  body.live-page .motion-progress {
    display: block;
    height: 1px;
    margin-top: 20px;
    background: #c6c9bf;
  }
  body.live-page .motion-progress-fill {
    display: block;
    height: 100%;
    background: #927341;
    transform: scaleX(0);
    transform-origin: left center;
  }
}

@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  body.live-page :is(a, button, summary) {
    transition:
      color var(--control-duration) var(--control-ease),
      text-decoration-color var(--control-duration) var(--control-ease);
  }
  body.live-page
    :is(
      .button,
      .lh-button,
      .review-nav-cta,
      .lr-action-primary,
      .lr-action-secondary,
      .lr-download-link,
      .live-contact-form button
    ) {
    transition:
      transform var(--control-duration) var(--control-ease),
      background-color var(--control-duration) var(--control-ease),
      border-color var(--control-duration) var(--control-ease),
      color var(--control-duration) var(--control-ease);
  }
  body.live-page :is(.text-link, .lh-text-link, .live-resource-action) {
    transition:
      border-color var(--control-duration) var(--control-ease),
      color var(--control-duration) var(--control-ease);
  }
  body.live-page .sp-docket {
    transition: border-color var(--control-duration) var(--control-ease);
  }
  body.live-page .sp-docket:hover {
    border-color: #b99a61;
  }
  body.live-page
    :is(.sp-docket-primary, .text-link, .lh-text-link, .review-nav-cta)
    :is(svg, .lh-arrow) {
    transition: transform var(--control-duration) var(--control-ease);
  }
  body.live-page
    :is(.sp-docket-primary, .text-link, .lh-text-link, .review-nav-cta):hover
    :is(svg, .lh-arrow) {
    transform: translateX(2px);
  }
  body.live-page :is(a, button, summary):focus-visible,
  body.live-page
    :is(
      .sp-docket-primary,
      .text-link,
      .lh-text-link,
      .review-nav-cta
    ):focus-visible
    :is(svg, .lh-arrow) {
    transition: none;
    transform: none;
  }
}
