/* R56: full-card banners. Recommended artwork: 1000 × 250 px (4:1).
   Keep all card dimensions equal so loading/failing images cannot change
   the R52 carousel loop length. Only the index uses .travia-r50. */
.travia-r50 .r47-ads .r47-ad-card {
  --r56-card-height:64px;
  height:var(--r56-card-height);
  width:calc((var(--r56-card-height) - 2px) * 4 + 2px);
  min-width:0;
  max-width:none;
  flex:0 0 auto;
}

/* The image fills the inner box, which is exactly 4:1 after its 1px border.
   :has also covers cards refreshed by the feed and R52's visual copies.
   Removing a failed image restores the existing text fallback. */
.travia-r50 .r47-ads .r47-ad-card:has(> .r47-ad-media > img) {
  display:block;
  padding:0;
}
.travia-r50 .r47-ads .r47-ad-card:has(> .r47-ad-media > img) > .r47-ad-media {
  position:absolute;
  inset:0;
  display:block;
  width:100%;
  height:100%;
  margin:0;
  padding:0;
  border:0;
}
.travia-r50 .r47-ads .r47-ad-card:has(> .r47-ad-media > img) > .r47-ad-media > img {
  position:absolute;
  inset:0;
  display:block;
  width:100%;
  height:100%;
  max-width:none;
  max-height:none;
  object-fit:cover;
  object-position:center;
  margin:0;
  padding:0;
  border:0;
}
/* Keep the advertiser's name, destination and ad label available to
   assistive technology, while giving the artwork the whole visible card. */
.travia-r50 .r47-ads .r47-ad-card:has(> .r47-ad-media > img) > .r47-ad-body {
  position:absolute;
  width:1px;
  height:1px;
  min-width:0;
  min-height:0;
  margin:-1px;
  padding:0;
  border:0;
  overflow:hidden;
  clip:rect(0,0,0,0);
  clip-path:inset(50%);
  white-space:nowrap;
}
/* Keep the width stable when mobile browser chrome changes only the
   viewport height; R52 therefore retains the same measured loop length. */