/* A centered news-led hero, with red rising from the foot of the video. */
.home-page { --hero-base:var(--color-primary); }
.home-page .site-nav { background:transparent; margin-bottom:calc(-1 * var(--nav-height)); }
.home-hero :focus-visible { outline-color:#ffd18d; }

.home-hero {
  position:relative;
  isolation:isolate;
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:max(720px,85svh);
  padding:calc(var(--nav-height) + 72px) 32px 144px;
  background:var(--hero-base);
  color:#fff;
  text-align:center;
}
/* Keep the dark gradient opaque, and blend the poster/video into it as one
   masked layer. Darkening no longer depends on an overlay above the video. */
.hero-background {
  position:absolute;
  inset:0;
  z-index:0;
  overflow:hidden;
  background:var(--hero-gradient);
  pointer-events:none;
}
.hero-background-media {
  position:absolute;
  inset:0;
  background:url('../images/home/hero-video-poster.webp') center / cover;
  -webkit-mask-image:var(--hero-media-mask);
  mask-image:var(--hero-media-mask);
}
.hero-background-video { position:absolute; inset:0; display:block; width:100%; height:100%; object-fit:cover; object-position:center; opacity:0; transition:opacity .5s ease; }
.hero-background-video.is-playing { opacity:1; }
.hero-content-shell { position:relative; z-index:1; width:100%; max-width:1080px; margin-inline:auto; }
.home-page .hero-intro { font-family:var(--font-primary); font-size:var(--font-size-small); line-height:1.5; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:var(--color-copy-light); margin:0 0 24px; }

/* All slides share one grid cell, reserving space for the longest headline. */
.news-messages { display:grid; max-width:1000px; min-height:260px; margin-inline:auto; }
.news-message { grid-area:1/1; align-self:center; min-width:0; visibility:hidden; opacity:0; transform:translateY(10px); pointer-events:none; transition:opacity .22s ease,transform .22s ease,visibility 0s linear .22s; }
.home-news.is-ready .news-message.is-active { visibility:visible; opacity:1; transform:none; pointer-events:auto; transition-delay:0s; }
.news-message a { display:block; color:inherit; border-radius:6px; }
.home-page .news-title { max-width:18ch; margin:0 auto; font-family:var(--display); font-size:clamp(3.6rem,6.3vw,6.7rem); font-weight:800; line-height:.95; letter-spacing:-.015em; text-transform:uppercase; text-wrap:balance; color:#fff; }
.home-page .news-detail { display:block; max-width:780px; margin:25px auto 0; font-size:var(--font-size-body); font-weight:400; line-height:1.75; text-wrap:balance; color:var(--color-copy-light); }
.news-message a:hover .news-title { color:var(--color-copy-light); }

.hero-actions { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:16px; margin-top:32px; }
.home-page .hero-actions .hero-events { border:1px solid #ffffffcc; color:#fff; background:#ffffff08; }
.home-page .hero-actions .hero-events:hover { background:#ffffff18; border-color:#fff; }
.news-controls { display:flex; align-items:center; justify-content:center; gap:8px; margin-top:32px; }
.news-controls[hidden] { display:none; }
.news-control { display:inline-grid; place-items:center; width:40px; height:40px; border:1px solid transparent; border-radius:50%; background:transparent; color:var(--color-copy-light); font:inherit; font-size:1.2rem; cursor:pointer; }
.news-control:hover { background:#ffffff18; color:#fff; }
.news-count { min-width:60px; color:#f5d3b8; font-size:var(--font-size-small); font-variant-numeric:tabular-nums; }
.news-status { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }

@media (max-width:760px) {
  .home-hero { min-height:85svh; padding:calc(var(--nav-height) + 56px) 20px 100px; }
  .home-page .hero-intro { max-width:300px; margin:0 auto 22px; line-height:1.7; letter-spacing:.1em; text-transform:uppercase; text-wrap:balance; }
  .news-messages { min-height:230px; }
  .home-page .news-title { font-size:clamp(2.7rem,10.5vw,4.7rem); max-width:17ch; line-height:.98; }
  .home-page .news-detail { max-width:480px; line-height:1.75; margin-top:22px; }
  .hero-actions { gap:10px; margin-top:26px; }
  .home-page .hero-actions .action { min-height:50px; padding:13px 14px; gap:12px; }
  .news-controls { margin-top:24px; }
}
@media (max-width:420px) {
  .hero-actions { max-width:350px; margin-inline:auto; }
}
@media (prefers-reduced-motion:reduce) {
  .news-message { transition:none; transform:none; }
  .hero-background-video { transition:none; }
}
