/* === /vernissages — лента прошедших вернисажей с фото === */
.container { max-width: 1200px; margin: 0 auto; padding: 20px 20px 120px; color: var(--text); }

.vr-header { text-align: center; padding: 0 0 20px; border-bottom: 1px solid var(--border); margin-bottom: 30px; }
.vr-header h1 { font-family: 'PT Sans'; font-size: 1rem; font-weight: 900; margin-bottom: 5px; color: var(--text); text-transform: uppercase; }
.vr-subtitle { font-family: 'PT Sans Narrow'; color: var(--accent); letter-spacing: 3px; font-size: 0.8rem; text-transform: uppercase; }

.vr-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 20px; }

.vr-card {
    background: var(--glass-bg); border: 1px solid var(--border-light); border-top: 3px solid var(--color-marker, var(--accent));
    border-radius: var(--radius-lg); overflow: hidden; cursor: pointer; transition: 0.3s; backdrop-filter: blur(10px);
    box-shadow: var(--shadow-md);
}
.vr-card:hover { transform: translateY(-4px); border-color: var(--color-marker, var(--accent)); box-shadow: var(--shadow-lg); }

.vr-cover { width: 100%; aspect-ratio: 16/10; overflow: hidden; background: var(--surface); position: relative; }
.vr-cover img { width: 100%; height: 100%; object-fit: cover; transition: 0.3s; }
.vr-card:hover .vr-cover img { transform: scale(1.04); }
/* Текстовая обложка-заглушка, когда нет фото: градиент + дата */
.vr-cover-text {
    width: 100%; aspect-ratio: 16/10;
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    background:
        radial-gradient(circle at 78% 12%, rgba(255,255,255,0.05), transparent 55%),
        linear-gradient(135deg, var(--surface-hover) 0%, #050505 100%);
    color: var(--color-marker, var(--accent));
    text-align: center; position: relative; overflow: hidden; gap: 6px;
}
.vr-cover-text::before {
    content: '✺'; position: absolute; inset: 0;
    display: flex; align-items: center; justify-content: center;
    font-size: 9rem; opacity: 0.10; pointer-events: none;
}
.vr-cover-text .vc-year { font-family: 'PT Sans'; font-size: 2.8rem; font-weight: 900; letter-spacing: 1px; position: relative; }
.vr-cover-text .vc-month { font-family: 'PT Sans Narrow'; font-size: 0.85rem; letter-spacing: 5px; text-transform: uppercase; position: relative; opacity: 0.85; }

.vr-cover-empty { display: flex; align-items: center; justify-content: center; font-size: 3rem; opacity: 0.3; }

.vr-info { padding: 16px; }
.vr-date { font-family: 'PT Sans Narrow'; color: var(--color-marker, var(--accent)); font-size: 0.72rem; letter-spacing: 2px; text-transform: uppercase; margin-bottom: 8px; }
.vr-title { font-family: 'PT Sans'; font-weight: 900; font-size: 1rem; color: var(--text); text-transform: uppercase; margin-bottom: 6px; line-height: 1.2; }
.vr-loc { font-family: 'PT Sans Narrow'; color: var(--text-muted); font-size: 0.78rem; margin-bottom: 10px; }
.vr-meta { font-family: 'PT Sans Narrow'; color: var(--gold); font-size: 0.78rem; font-weight: bold; }

.vr-loading, .vr-empty { text-align: center; padding: 60px; color: var(--text-muted); font-family: 'PT Sans Narrow'; letter-spacing: 2px; grid-column: 1 / -1; }
.vr-error { color: var(--accent); padding: 30px; text-align: center; grid-column: 1 / -1; font-family: 'PT Sans Narrow'; }