/* ---------- Entrance motion ----------
   Load: each page's opening section staggers in.
   Scroll: site.js tags blocks below the fold with data-reveal.
   Everything here is skipped for reduced-motion visitors. */
@media (prefers-reduced-motion: no-preference) {
  @keyframes dw-rise { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }

  main > section:first-of-type > * { animation: dw-rise .7s cubic-bezier(.2,.7,.2,1) both; }
  main > section:first-of-type > :nth-child(2) { animation-delay: .1s; }
  main > section:first-of-type > :nth-child(3) { animation-delay: .2s; }
  main > section:first-of-type > :nth-child(4) { animation-delay: .3s; }
  main > section:first-of-type > :nth-child(n+5) { animation-delay: .4s; }

  /* Two-column openers: the text column staggers line by line,
     the second column (photo, art, copy) follows. */
  main > section:first-of-type > div:first-child { animation: none; }
  main > section:first-of-type > div:first-child > * { animation: dw-rise .7s cubic-bezier(.2,.7,.2,1) both; }
  main > section:first-of-type > div:first-child > :nth-child(2) { animation-delay: .08s; }
  main > section:first-of-type > div:first-child > :nth-child(3) { animation-delay: .16s; }
  main > section:first-of-type > div:first-child > :nth-child(4) { animation-delay: .24s; }
  main > section:first-of-type > div:first-child > :nth-child(5) { animation-delay: .32s; }
  main > section:first-of-type > div:first-child > :nth-child(n+6) { animation-delay: .4s; }
  main > section:first-of-type > div:first-child ~ * { animation-delay: .45s; }

  /* Call-to-action buttons come in one at a time */
  main > section:first-of-type .actions,
  main > section:first-of-type .lesson-links { animation: none; }
  main > section:first-of-type .actions > *,
  main > section:first-of-type .lesson-links > * { animation: dw-rise .6s cubic-bezier(.2,.7,.2,1) both; animation-delay: .34s; }
  main > section:first-of-type .actions > :nth-child(2),
  main > section:first-of-type .lesson-links > :nth-child(2) { animation-delay: .42s; }
  main > section:first-of-type .actions > :nth-child(n+3),
  main > section:first-of-type .lesson-links > :nth-child(n+3) { animation-delay: .5s; }

  [data-reveal] {
    opacity: 0;
    transform: translateY(16px);
    transition: opacity .7s cubic-bezier(.2,.7,.2,1), transform .7s cubic-bezier(.2,.7,.2,1);
    transition-delay: var(--reveal-delay, 0s);
  }
  [data-reveal].is-in { opacity: 1; transform: none; }
}

/* ---------- Traveling dot (assets/dot.js) ----------
   The dot replaces the period in each section headline and bounces
   between them on scroll. Seats are the empty spots it lands in. */
.dw-seat { display: inline-block; width: .2em; height: .2em; border-radius: 50%; margin-left: .05em; vertical-align: baseline; }
.dw-seat-serif { width: .15em; height: .15em; margin-left: .03em; }
.dw-dot { position: fixed; left: 0; top: 0; width: 10px; height: 10px; border-radius: 50%; background: var(--rose, #be5f93); z-index: 5; pointer-events: none; will-change: transform; }
