/* These pages previously used template 77; keep its shared page layouts. */
@import url('/templates/template77/style.css');

/* Keep horizontal clipping without making body a scroll container for sticky ads. */
html,
body.moto-design {
  overflow-x: clip;
}

body.moto-design .moto-info-sidebar {
  grid-column: 2;
  align-self: stretch;
  display: block;
  width: 100%;
  max-width: 300px;
  min-width: 0;
  --moto-info-sticky-top: 120px;
}
body.moto-design :is(.news-article__layout, .article-detail__layout, .club-detail__layout, .moto-tech-layout) > .moto-info-sidebar {
  grid-column: 3;
}
body.moto-design .moto-info-sidebar__segment {
  position: relative;
}
body.moto-design .moto-info-sidebar__segment:nth-child(n+2) {
  display: none;
}
body.moto-design .moto-info-sidebar[data-info-ready] .moto-info-sidebar__segment:not([hidden]) {
  display: block;
}
body.moto-design .moto-info-sidebar__segment[hidden],
body.moto-design .moto-info-sidebar[hidden] {
  display: none;
}
body.moto-design .moto-info-sidebar__segment > .moto-banner-slot.moto-banner-slot--portrait {
  position: sticky;
  top: var(--moto-info-sticky-top);
  width: min(300px, calc((100dvh - 144px) / 2));
  margin-inline: 0;
}
@media (min-width: 1200px) {
  body.moto-design .club-detail__layout > .club-detail__sidebar {
    grid-column: 3;
    grid-row: 2;
  }
  body.moto-design .moto-tech-layout {
    grid-template-columns: 200px minmax(0, 1fr) 300px;
    align-items: stretch;
  }
  body.moto-design .moto-tech-layout > .moto-tech-main {
    grid-column: 2;
    grid-row: 1;
  }
}
@media (min-width: 1200px) and (max-width: 1399px) {
  body.moto-design .news-article--reading .news-article__layout,
  body.moto-design .article-detail--reading .article-detail__layout,
  body.moto-design .club-detail--reading .club-detail__layout {
    display: grid;
    width: 100%;
    grid-template-columns: minmax(0, 1fr) minmax(0, 680px) 300px;
    column-gap: 20px;
  }
  body.moto-design :is(.news-article__layout, .article-detail__layout, .club-detail__layout) >
  :is(.news-article__main, .article-detail__main, .club-detail__main) {
    grid-column: 2;
  }
  body.moto-design :is(.news-article__layout, .article-detail__layout, .club-detail__layout) > .moto-info-sidebar {
    grid-column: 3;
  }
}
@media (max-width: 1199px) {
  body.moto-design .moto-info-sidebar {
    display: none !important;
  }
  body.moto-design .club-detail__layout > .club-detail__sidebar {
    grid-column: auto;
    grid-row: auto;
  }
}