/* Related products on single product pages ([echuan_related_products] in template 3080).
 * Thumbnails are CSS backgrounds on purpose: Google does not take CSS images as page images,
 * so a product page can only be represented by its own photos (see echuan-related-products.php). */
.echuan-related { margin: 10px 0 60px; content-visibility: auto; contain-intrinsic-size: auto 360px; }
.echuan-related__heading { margin: 0 0 18px; font-size: 25px; line-height: 1.4; font-weight: 700; color: #1e1e1e; text-shadow: 0 0 10px rgba(0,0,0,.3); }
.echuan-related__grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 20px; margin: 0; padding: 0; list-style: none; }
.echuan-related__grid li { min-width: 0; margin: 0; }
.echuan-related__link { display: block; color: inherit; text-decoration: none; }
.echuan-related__img { display: block; aspect-ratio: 1; border: 1px solid #E3E4E5; background: #fff center / contain no-repeat; }
.echuan-related__title { display: block; margin-top: 15px; font-size: 13px; line-height: 1.5; font-weight: 600; color: #1e1e1e; overflow-wrap: anywhere; }
.echuan-related__link:hover .echuan-related__title, .echuan-related__link:focus-visible .echuan-related__title { color: #253993; text-decoration: underline; }
@media (max-width: 1024px) { .echuan-related__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 767px) { .echuan-related__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; } .echuan-related__heading { font-size: 22px; } }
@media print { .echuan-related { display: none !important; } }