/* =========================================================
   볼트스토리 (story.php) — page.css 와 함께 로드
   ========================================================= */
.story-sec { padding-top: 44px; padding-bottom: 64px; }

.story-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 30px 24px; }

.story-card__thumb {
    display: flex; align-items: center; justify-content: center;
    aspect-ratio: 4/3; border-radius: 10px; overflow: hidden;
    background: #f4f6f9; border: 1px solid #eef1f4;
}
.story-card__thumb img { width: 46%; max-width: 132px; opacity: .5; }

.story-card__body { padding: 14px 2px 0; }
.story-card__title { margin: 10px 0 14px; font-size: 16px; font-weight: 600; line-height: 1.45; }
.story-card__title a {
    color: #191f28; display: -webkit-box; -webkit-line-clamp: 2;
    -webkit-box-orient: vertical; overflow: hidden;
}
.story-card__title a:hover { color: var(--brand); }
.story-card__meta { display: flex; align-items: center; gap: 12px; font-size: 13px; color: #b0b8c1; }
.story-card__views { display: inline-flex; align-items: center; gap: 4px; }
.story-card__views svg { width: 15px; height: 15px; }

@media (max-width: 900px) { .story-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 520px) { .story-grid { grid-template-columns: 1fr; } }