.related-works { margin: 24px 0; padding: 24px; border: 1px solid #dce6f0; border-radius: 12px; background: linear-gradient(135deg, #f3f8ff 0%, #fff 75%); }
.related-works-header { margin-bottom: 20px; }
.related-works-header h2 { margin: 0 0 6px; color: #203b59; font-size: 24px; font-weight: 600; }
.related-works-header p { margin: 0; color: #617287; font-size: 14px; }
.related-works-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.related-work-card { display: flex; flex-direction: column; padding: 20px; color: #24588b; background: #fff; border: 1px solid #dce5ee; border-radius: 9px; text-decoration: none; transition: border-color .15s, box-shadow .15s, transform .15s; }
.related-work-card:hover, .related-work-card:focus { color: #154b80; text-decoration: none; border-color: #71a8d7; box-shadow: 0 6px 18px rgba(33, 76, 118, .1); transform: translateY(-2px); }
.related-work-card:focus-visible { outline: 2px solid #337ab7; outline-offset: 3px; }
.related-work-meta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 14px; font-size: 12px; color: #6b7785; }
.related-work-type { padding: 4px 9px; border-radius: 5px; background: #eaf3fc; color: #2e6597; }
.related-work-card h3 { margin: 0 0 22px; font-size: 16px; font-weight: 500; line-height: 1.5; overflow-wrap: anywhere; }
.related-work-bottom { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; margin-top: auto; }
.related-work-price { color: #203b59; font-size: 19px; font-weight: 600; }
.related-work-more { font-size: 13px; color: #337ab7; }
@media(max-width: 991px) { .related-works-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media(max-width: 575px) { .related-works { padding: 16px; } .related-works-grid { grid-template-columns: 1fr; gap: 12px; } .related-work-card { padding: 16px; } .related-works-header h2 { font-size: 21px; } }
@media(prefers-reduced-motion: reduce) { .related-work-card { transition: none; transform: none; } }