/* Стили блока «Случайные» */
.random-box { margin-top: 40px; padding-top: 25px; border-top: 2px solid #eee; }
.random-title { font-size: 1.35em; margin-bottom: 20px; color: #111; border-left: 4px solid var(--accent); padding-left: 10px; }
.random-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 16px; }
.random-card { background: #fff; border: 1px solid #eaeaea; border-radius: 8px; overflow: hidden; display: flex; flex-direction: column; transition: transform 0.15s ease, box-shadow 0.15s ease; }
.random-card:hover { transform: translateY(-2px); box-shadow: 0 4px 12px rgba(0,0,0,0.06); }
.random-img-link { display: block; width: 100%; height: 125px; background: #f0f0f0; overflow: hidden; }
.random-thumb { width: 100%; height: 100%; object-fit: cover; }
.random-card-body { padding: 10px 12px; display: flex; flex-direction: column; flex-grow: 1; justify-content: space-between; }
.random-card-title { font-size: 0.95em; line-height: 1.35; margin: 0 0 8px 0; font-weight: 600; }
.random-card-title a { text-decoration: none; color: #222; }
.random-card-title a:hover { color: var(--accent); }
.random-card-date { font-size: 0.8em; color: #888; }

@media (max-width: 600px) {
    .random-grid { grid-template-columns: repeat(2, 1fr); gap: 10px; }
    .random-img-link { height: 100px; }
    .random-card-title { font-size: 0.85em; }
}