/* /research — page-specific rules layered over research.css (the hub) and
   deck-wireframe.css (the evidence deck), which the page loads as separate <link>s
   before this sheet (see the stylesheets list in research.njk front matter —
   flat links avoid the sequential @import request chain). */

/* Match the homepage's crisp snapping. deck-wireframe.css already sets
   html { scroll-snap-type: y mandatory } and makes every .dw-slide a snap
   target in this same query (deck-wireframe.js adds a bottom-edge stop to
   any area a short window makes oversized — .snap-end-sentinel); we
   additionally make the hub a full-height snap target so the page rests on
   the hub at the top instead of jumping to the first slide. */
@media (min-width: 861px) and (min-height: 641px) {
  .page-container {
    min-height: calc(100svh - var(--banner-h));
    scroll-snap-align: start;
    scroll-snap-stop: always;
  }
}

/* On phones the hub is taller than the viewport. Keeping it a snap area
   (with the bottom-edge stop deck-wireframe.js appends to oversized areas)
   means no rest position falls awkwardly between the hub's end and the first
   slide under the phones' restored mandatory snapping (deck-wireframe.css). */
@media (max-width: 860px) and (min-height: 600px) {
  .page-container { scroll-snap-align: start; }
}

/* Cue under the hub grid pointing at the findings deck below the fold. */
.page-content .rs-more { text-align: center; margin: 0.2rem 0 0; }
.page-content .rs-more a {
  display: inline-block;
  font-family: "Roboto Mono", monospace;
  font-size: 0.72rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  text-decoration: none;
  color: var(--link-color);
}
/* Same subtle bob as the homepage hero chevron (keyframes in landing.css). */
@media (prefers-reduced-motion: no-preference) {
  .page-content .rs-more a { animation: cue-bob 2s ease-in-out infinite; }
}
/* On laptop heights the cue lands right at the fold; pull it up a touch so
   the bounce never dips it out of view. */
@media (min-width: 901px) and (max-width: 1700px) {
  .rs-grid { margin-bottom: 0.3rem; }
  .page-content .rs-more { margin-top: 0; }
}