/* Step134 — recorded polish: resilient homepage rail, lighter lead title,
   and a wider desktop user-blog feed. */

/* Homepage: date/time must never collide with the news headline, even when
   the browser/system text size is enlarged. */
.news-home-v28.belta-paper-home .headline-rail .rail-item {
  grid-template-columns: max-content minmax(0, 1fr) !important;
  column-gap: 10px !important;
  align-items: start !important;
}
.news-home-v28.belta-paper-home .headline-rail .rail-datetime {
  min-width: 0 !important;
  position: static !important;
  flex: 0 0 auto !important;
}
.news-home-v28.belta-paper-home .headline-rail .rail-item > span:last-child {
  min-width: 0 !important;
  overflow-wrap: anywhere !important;
  word-break: normal !important;
}

/* The lead/top story should look editorial rather than heavily bold. */
.news-home-v28.belta-paper-home .belta-lead-title {
  font-weight: 520 !important;
  letter-spacing: -.035em !important;
  line-height: 1.02 !important;
}

/* Desktop blogs: use the available screen instead of a narrow 790px card. */
@media (min-width: 981px) {
  body .portal-layout.blog-layout.blog-layout--beauty {
    display: grid !important;
    grid-template-columns: minmax(0, 960px) minmax(220px, 240px) !important;
    gap: 28px !important;
    align-items: start !important;
    max-width: 1240px !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
  body .blog-layout--beauty > .portal-main {
    min-width: 0 !important;
    width: 100% !important;
  }
  body .blog-feed.blog-feed--beauty {
    width: 100% !important;
    max-width: 960px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  body .blog-feed-card.blog-feed-card--beauty {
    width: 100% !important;
    max-width: none !important;
  }
  body .blog-sidebar--beauty {
    width: 100% !important;
    min-width: 0 !important;
  }
}

/* At medium desktop widths keep the feed roomy without forcing horizontal scroll. */
@media (min-width: 981px) and (max-width: 1240px) {
  body .portal-layout.blog-layout.blog-layout--beauty {
    grid-template-columns: minmax(0, 1fr) 230px !important;
    gap: 22px !important;
  }
}

@media (max-width: 900px) {
  .news-home-v28.belta-paper-home .headline-rail .rail-item {
    grid-template-columns: max-content minmax(0, 1fr) !important;
  }
}

@media (max-width: 700px) {
  .news-home-v28.belta-paper-home .headline-rail .rail-item {
    grid-template-columns: 1fr !important;
    row-gap: 4px !important;
  }
  .news-home-v28.belta-paper-home .headline-rail .rail-datetime {
    margin: 0 !important;
  }
}