/* Keep the added film out of tablet and desktop layout. */
.hero-film { display:none; }
@media (max-width:699px) {
  .masthead .header-inner { min-height:44px; align-items:center; gap:6px; }
  .masthead .brand { align-self:center; gap:5px; }
  .masthead .brand-tile { height:28px; }
  .masthead .brand-name { font-size:clamp(17px,4.7vw,19px); }
  .masthead .signin-link { font-size:10px; letter-spacing:.04em; }
  .masthead .header-action { padding:8px 9px!important; font-size:11px!important; }
  .hero-media { aspect-ratio:16/9; background:#1d1d1f; cursor:auto; }
  .hero-media > picture, .hero-media > .hero-anim, .hero-media > .hm-anim { display:none!important; }
  .hero-film { display:block; position:absolute; inset:0; overflow:hidden; border-radius:16px; background:#1d1d1f; }
  .hero-media .hero-film-poster, .hero-media .hero-film video { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; object-position:center; }
  .hero-media .hero-film video { z-index:1; visibility:hidden; }
  .hero-media .hero-film.is-playing video { visibility:visible; }
  .hero-film-play, .hero-film-sound { position:absolute; z-index:2; border:1.5px solid #fff; border-radius:99px; background:#1d1d1fe8; color:#fff; font:700 12px/1.2 var(--font); cursor:pointer; }
  .hero-film-play { display:none; left:50%; top:50%; transform:translate(-50%,-50%); min-height:44px; padding:10px 18px; white-space:nowrap; }
  .hero-film.needs-play .hero-film-play { display:block; }
  .hero-film-sound { display:none; top:10px; right:10px; min-height:36px; padding:7px 11px; }
  .hero-film.is-playing.is-muted .hero-film-sound { display:block; }
  .hero-description { order:3!important; }
  .hero-invite { order:4!important; margin:0 16px 16px; }
  #tour { display:none!important; }
}
@media (max-width:380px) {
  .masthead .header-inner { gap:5px; }
  .masthead .brand-name { font-size:17px; }
  .masthead .header-action { padding-inline:7px!important; }
}