/* Suggested articles: three image tiles with the title over a navy tint (Rails article.suggestions) */
.wp-block-hdyo-suggestions { margin-top: var(--wp--preset--spacing--40); }
.hdyo-suggestions__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr)); gap: 1rem; }
.hdyo-suggestion { position: relative; display: flex; align-items: center; justify-content: center; min-height: 200px; padding: 0.5rem; overflow: hidden; color: #fff; text-decoration: none; }
.hdyo-suggestion img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.hdyo-suggestion::before { content: ''; position: absolute; inset: 0; background-color: rgba(6, 28, 89, 0.5); }
.hdyo-suggestion__title { position: relative; display: block; width: 100%; font-size: var(--wp--preset--font-size--x-large); font-weight: 700; line-height: 1.2; text-align: center; text-shadow: 0 0 6px rgba(0, 0, 0, 0.8); }
.hdyo-suggestion:hover .hdyo-suggestion__title { text-decoration: underline; }
.hdyo-suggestion.is-featured { border: 4px solid var(--wp--preset--color--hdyo-pink); }
.hdyo-suggestion__banner { position: absolute; top: 0; left: 0; right: 0; z-index: 1; background-color: var(--wp--preset--color--hdyo-blue); font-weight: 700; text-align: center; text-transform: uppercase; }
@media print { .wp-block-hdyo-suggestions { display: none; } }