/* ═══════════════════════════════════════════════════════════════
   honours.html — page stylesheet
   Was a <style> block in the page. It is a separate file, not part
   of styles.css, because these selectors are page-scoped: moving
   them into the shared sheet would have applied them site-wide.
   (school-news.html styles .news-card, and so does index.html;
    offline.html sets bare *, body, h1 and p rules.)
   ═══════════════════════════════════════════════════════════════ */

@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    .hre-info { position: relative; overflow: hidden; }
    .hre-info::after {
      content: ''; position: absolute; inset: 0; pointer-events: none;
      background: linear-gradient(105deg, transparent 32%, rgba(255,207,1,.32) 50%, transparent 68%);
      transform: translateX(-130%);
      animation: hrGlint linear both;
      animation-timeline: view();
      animation-range: entry 25% entry 90%;
    }
    @keyframes hrGlint { to { transform: translateX(130%); } }
  }
}