.related-shells { margin-top: 40px; }
.related-shells > h3 { margin: 0 0 12px; font-size: 1.2rem; font-weight: 600; letter-spacing: -.02em; }
.related-shells-note { max-width: 900px; margin: 0 0 22px; color: var(--ink-muted); font-size: .88rem; line-height: 1.7; }
.related-shells-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.related-shell-card { display: flex; align-items: flex-start; gap: 16px; padding: 20px; border: 1px solid var(--line-light); border-radius: 16px; background: #fff; color: var(--ink); text-decoration: none; transition: border-color 180ms ease, box-shadow 180ms ease; }
.related-shell-card:hover, .related-shell-card:focus-visible { border-color: var(--ink-muted); box-shadow: 0 8px 24px rgba(12, 19, 28, .06); }
.related-shell-card > img { flex: none; width: 80px; height: 80px; object-fit: contain; }
.related-shell-copy { min-width: 0; }
.related-shell-copy h4 { margin: 0 0 8px; font-size: 1rem; font-weight: 600; }
.related-shell-copy p { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; margin: 0 0 12px; color: var(--ink-muted); font-size: .8rem; line-height: 1.6; }
.related-shell-copy > span { font-size: .78rem; font-weight: 600; }
.aerator-single-core-page .model-detail-section { display: block; }
@media (max-width: 1100px) { .related-shells-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .related-shells-grid { grid-template-columns: 1fr; } }