/* Travespert blog cards: shared by /blogs/ and the homepage "From the blog"
   section. Builds on the global .tv-card (photography-first, one link). */

#brx-content .tv-bgrid, .tv-bgrid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; width: 100%; }

.tv-bcard .tv-card__media { aspect-ratio: 3 / 2; object-position: center 40%; }
.tv-bcard .tv-card__mediaWrap { background: var(--tv-surface); }
.tv-bcard .tv-card__body { gap: 10px; padding: 18px 20px 20px; }
.tv-bcard .tv-card__title {
  font-size: 18px; font-weight: 700; line-height: 1.3; letter-spacing: -0.2px;
  min-height: 0; margin: 0;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.tv-bcard__cat {
  align-self: flex-start;
  font-size: 11.5px; font-weight: 700; letter-spacing: 0.8px; text-transform: uppercase;
  color: var(--tv-primary-hover); background: var(--tv-primary-tint);
  border-radius: var(--tv-radius-pill); padding: 4px 10px; line-height: 1.3;
}
.tv-bcard__txt {
  margin: 0; font-size: 14.5px; line-height: 1.65; color: var(--tv-body);
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
.tv-bcard__more {
  margin-top: auto; padding-top: 6px;
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 14px; font-weight: 700; color: var(--tv-ink);
  transition: color var(--tv-transition);
}
.tv-bcard__more::after { content: '\2192'; display: inline-block; transition: transform var(--tv-transition); }
.tv-bcard:hover .tv-bcard__more { color: var(--tv-primary-hover); }
.tv-bcard:hover .tv-bcard__more::after { transform: translateX(3px); }

/* Homepage "From the blog" section (Bricks): heading row + grid. */
.tv-blog-sec { padding-block: clamp(40px, 6vw, 72px); }
.tv-blog-sec .tv-sechead { display: flex; flex-direction: row; align-items: flex-end; justify-content: space-between; gap: var(--tv-space-lg); flex-wrap: wrap; margin-bottom: 28px; }
.tv-blog-sec .tv-sechead h2 { margin: 0 0 8px; }
.tv-blog-sec .tv-bgrid { width: 100%; }

@media (max-width: 991px) { #brx-content .tv-bgrid, .tv-bgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) {
  #brx-content .tv-bgrid, .tv-bgrid { grid-template-columns: 1fr; gap: 18px; }
  .tv-bcard .tv-card__body { padding: 16px 16px 18px; }
  .tv-blog-sec .tv-sechead .tv-btn { width: 100%; justify-content: center; }
}
@media (prefers-reduced-motion: reduce) {
  .tv-bcard__more::after, .tv-bcard:hover .tv-bcard__more::after { transition: none; transform: none; }
}

/* Homepage blog section: swipeable row on mobile */
@media (max-width: 767px) {
  #brx-content .tv-blog-sec .tv-bgrid, .tv-blog-sec .tv-bgrid {
    display: flex; flex-direction: row; flex-wrap: nowrap; align-items: stretch; gap: 14px;
    overflow-x: auto; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch;
    margin-inline: calc(-1 * var(--tv-gutter)); padding: 6px var(--tv-gutter) 20px; width: auto;
    scroll-padding-inline: var(--tv-gutter); scrollbar-width: none;
  }
  .tv-blog-sec .tv-bgrid::-webkit-scrollbar { display: none; }
  #brx-content .tv-blog-sec .tv-bgrid > .tv-bcard, .tv-blog-sec .tv-bgrid > .tv-bcard { flex: 0 0 82%; max-width: 330px; scroll-snap-align: start; height: auto; }
}