/* M05 owns its complete card layout, including M04 cards within a tutorial. */
.wbh-m05 { min-width: 0; margin-block: 42px 0; padding-block: 28px 0; border-top: 1px solid var(--wbh-line); }
.wbh-m05 > h2 { margin-block: 0 12px; font-size: clamp(25px, 3vw, 32px); }
.wbh-m05 .wbh-relations-intro { margin-block: 0 20px; color: var(--wbh-muted); font-size: 14px; }
.wbh-m05 .wbh-relations-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.wbh-m05 :is(.wbh-product-card, .wbh-relation-tutorial) { display: flex; flex-direction: column; min-width: 0; overflow: hidden; border: 1px solid var(--wbh-line); border-radius: 16px; background: var(--wbh-surface); }
.wbh-m05 :is(.wbh-product-card-image, .wbh-relation-tutorial-image) { display: block; overflow: hidden; background: var(--wbh-paper); }
.wbh-m05 :is(.wbh-product-card-image, .wbh-relation-tutorial-image) img { display: block; width: 100%; aspect-ratio: 4 / 3; height: auto; object-fit: cover; }
.wbh-m05 :is(.wbh-product-card-body, .wbh-relation-tutorial-body) { display: flex; flex-direction: column; flex: 1; gap: 12px; min-width: 0; padding: 20px; }
.wbh-m05 :is(.wbh-product-card-title, .wbh-relation-tutorial h3) { margin: 0; font-size: 20px; line-height: 1.45; }
.wbh-m05 :is(.wbh-product-card-title a, .wbh-relation-tutorial h3 a) { text-decoration: none; overflow-wrap: anywhere; }
.wbh-m05 :is(.wbh-product-price, .wbh-product-card-price, .price) { margin: 0; color: var(--wbh-gold); font-weight: 700; }
.wbh-m05 :is(.wbh-product-card-meta, .wbh-product-card-stock, .wbh-product-stock, .wbh-product-disclosure, .wbh-product-preview-hint, .wbh-relation-tutorial time) { margin: 0; color: var(--wbh-muted); font-size: 13px; line-height: 1.6; }
.wbh-m05 .wbh-product-badge { align-self: flex-start; padding: 3px 9px; border: 1px solid var(--wbh-line); border-radius: 999px; color: var(--wbh-muted); font-size: 12px; line-height: 1.6; }
.wbh-m05 .wbh-product-card .button { display: inline-flex; align-items: center; justify-content: center; align-self: flex-start; min-height: 44px; padding: 10px 16px; border: 1px solid var(--wbh-ink); border-radius: 999px; background: var(--wbh-ink); color: var(--wbh-surface); font-size: 14px; font-weight: 700; line-height: 1.5; text-decoration: none; }
.wbh-m05 .wbh-product-card .button:hover { background: #345044; color: var(--wbh-surface); }
.wbh-m05 .wbh-product-card .wbh-affiliate-link { border-color: var(--wbh-line); background: transparent; color: var(--wbh-ink); }
.wbh-m05 :is(.wbh-product-card-actions, .wbh-relation-tutorial-link) { margin-top: auto; }
.wbh-m05 :is(.wbh-product-card-link, .wbh-relation-tutorial-link) { display: inline-flex; align-items: center; min-height: 44px; color: var(--wbh-ink); font-size: 14px; font-weight: 700; text-decoration: none; }
.wbh-m05 .wbh-product-card-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.wbh-m05 :is(.wbh-product-card a, .wbh-relation-tutorial a):focus-visible { outline: 3px solid var(--wbh-blue); outline-offset: 3px; }
@media (max-width: 760px) {
  .wbh-m05 { margin-top: 30px; padding-top: 24px; }
  .wbh-m05 .wbh-relations-grid { grid-template-columns: 1fr; gap: 16px; }
}