/* Scoped repairs: artwork images remain uncropped; article titles can wrap. */
.cards .card { min-width: 0; overflow: visible; }
.cards .card .card-action { gap: 12px; flex-wrap: wrap; }
.cards .card .more,
.cards .card a.buy {
  display: inline-flex; align-items: center; justify-content: center;
  box-sizing: border-box; min-height: 44px; height: auto;
  max-width: 100%; padding: 10px 18px; font-size: 14px; line-height: 1.35;
  white-space: normal; text-align: center; text-transform: none;
  border: 1px solid #102d6a; border-radius: 4px;
  color: #102d6a !important; background: #fff; box-shadow: none;
  isolation: isolate;
}
.cards .card .more::before { content: none; }
.cards .card .more:hover,
.cards .card a.buy:hover { color: #fff !important; background: #102d6a; }
.cards .card .favorite {
  display: inline-flex; align-items: center; justify-content: center;
  flex: 0 0 44px; width: 44px; min-height: 44px; margin: 0;
}
.cards .card > .card-action { flex-wrap: nowrap; gap: 8px; }
.cards .card > .card-action > .more { flex: 1 1 auto; min-width: 0; padding: 10px 8px; }
.cards .card a:focus-visible,
.poster-panel a:focus-visible { outline: 3px solid #1968e0; outline-offset: 3px; }
.cards.article-cards .card strong a,
.cards .article-card strong a,
.blog-list .cards .card strong a { white-space: normal; overflow-wrap: anywhere; line-height: 1.35; }
.cards.article-cards .card .caption,
.cards .article-card .caption,
.blog-list .cards .card .caption { gap: 12px; justify-content: flex-start; }
.blog-list .cards .card .more { margin-top: auto; align-self: flex-start; }
.blog-page .poster-panel {
  display: grid; grid-template-columns: 1.5fr 1fr; grid-template-areas: none;
  gap: 24px; align-items: start;
}
.blog-page .poster-panel .poster,
.blog-page .poster-panel .poster:first-child,
.blog-page .poster-panel .poster:nth-child(2),
.blog-page .poster-panel .poster:nth-child(3) {
  display: flex; flex-direction: column; width: auto; min-width: 0;
  height: auto; grid-area: auto; margin: 0;
}
.blog-page .poster-panel .poster:first-child { grid-row: span 2; }
.blog-page .poster-panel .poster a.img,
.blog-page .poster-panel .poster:first-child a.img {
  display: block; width: 100%; height: auto; aspect-ratio: 16 / 10;
  margin: 0; overflow: hidden;
}
.blog-page .poster-panel .poster a.img img {
  display: block; width: 100%; height: 100%; object-fit: cover;
}
.blog-page .poster-panel .poster .caption { width: 100%; min-width: 0; }
.blog-page .poster-panel .poster .header,
.blog-page .poster-panel .poster:first-child .header { flex-direction: column; gap: 10px; }
.blog-page .poster-panel .poster .header strong,
.blog-page .poster-panel .poster:first-child .header strong {
  margin: 0; font-size: 22px; line-height: 1.35; overflow-wrap: anywhere;
}
.blog-page .poster-panel .poster .header span { margin: 0; font-size: 14px; }
.blog-page .blog-list .cards { display: grid; grid-template-columns: minmax(0, 1fr); gap: 32px; }
.blog-page .blog-list .cards .card { height: auto; flex-direction: row; gap: 20px; }
.blog-page .blog-list .cards .card:not(:last-child) { margin-bottom: 0; }
.blog-page .blog-list .cards .card .img { flex: 0 0 38%; max-width: 340px; min-width: 0; height: 240px; }
.blog-page .blog-list .cards .card .caption { flex: 1 1 auto; min-width: 0; padding: 12px; text-align: left; }
.blog-page .blog-list .cards .card .caption strong a { font-size: 22px; line-height: 1.35; }
.blog-page .blog-list .cards .card .caption .date { margin-bottom: 0; }
@media (max-width: 768px) {
  .blog-page .poster-panel { grid-template-columns: minmax(0, 1fr); gap: 28px; }
  .blog-page .poster-panel .poster:first-child { grid-row: auto; }
  .blog-page .poster-panel .poster .header strong,
  .blog-page .poster-panel .poster:first-child .header strong { font-size: 20px; }
  .blog-list .cards { grid-template-columns: minmax(0, 1fr); }
  .blog-page .blog-list .cards .card { flex-direction: column; gap: 0; }
  .blog-page .blog-list .cards .card .img { flex: 0 0 auto; width: 100%; max-width: none; height: auto; aspect-ratio: 16 / 10; }
  .blog-page .blog-list .cards .card .caption { flex: 1 0 auto; }
  .blog-page .blog-list .cards .card .caption strong a { font-size: 20px; }
  .cards.article-cards .card strong, .cards .article-card strong { margin-right: 0; }
}