/* ============================================================================
   THE CONDUIT — from section 4 to the alumni band.
   Section 4's four community lines carry on. Two one-off beats
   (js/behaviour/conduit.js), each a quick timed animation: past section 4's
   rest point the names fade and the lines run left, turn down on concentric
   curves into a lane in the left margin and drop to the bottom of the
   screen (reversed, quicker, on the way back up); the lane then runs
   beside the reach map and lands on a small violet bar across the four lines,
   the alumni band's top edge. As the lines' ends come on screen, the bar
   opens the band from the first line: its sides run out to the full width
   while its bottom edge runs down, and the lines darken into it (once, and
   it stays open). Live mode only (>= 980px, motion allowed): elsewhere
   there are no lines and the alumni band is simply open.

   Recorded exception, decided by the client:
   - The conduit (1.1s) and the alumni band's opening (1.3s) run past the
     {motion.slow} cap. Neither holds the scroll: the conduit plays as
     section 4 is left (0.3s in reverse), the band as it comes on screen.
   ========================================================================= */

main {
  /* tier-3: the room the lane needs left of the text column (the figure sections' text,
     the reach map's text). Only binds below ~1380px, where the page's own
     gutter is narrower. layers.css reads it too. */
  --conduit-lane: 112px;
}

.conduit {
  position: fixed; inset: 0; z-index: 45;   /* under the topbar (50) */
  width: 100%; height: 100%;
  overflow: visible;
  pointer-events: none;
}

/* The names go first, quickly; the lines stay (they are the conduit). */
.layers.is-live .community__name { transition: scale var(--motion-medium), opacity var(--motion-fast); }
.layers.is-live .community.is-conduit .community__name { opacity: 0; }
.layers.is-live .community.is-conduit .community__btn { pointer-events: none; }