.premiery-page{display:block}

.hero-grid{display:grid;grid-template-columns:60% 40%;gap:0;min-height:70vh}
.hero-image img{width:100%;height:100%;object-fit:cover}
.hero-content{display:flex;align-items:center;padding:var(--space-4)}
.hero-text{max-width:520px;display:flex;flex-direction:column;gap:var(--space-2)}

.filters-row{display:flex;flex-wrap:wrap;gap:var(--space-2)}
.filter-group{display:flex;gap:var(--space-1);flex-wrap:wrap}
.filter-group button{background:var(--color-bg-secondary);border-radius:999px;padding:0.4rem 0.8rem}
.filter-group button.active{background:var(--color-accent-primary);color:#fff}

.timeline-grid{display:grid;grid-template-columns:2px 1fr;gap:var(--space-3)}
.timeline-line{background:var(--color-accent-primary)}
.timeline-items{display:flex;flex-direction:column;gap:var(--space-4)}
.timeline-cards{display:flex;flex-direction:column;gap:var(--space-2)}
.timeline-card{background:var(--color-bg-secondary);padding:var(--space-2);border-radius:var(--radius-md)}

.highlights-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-3)}
.highlight-card{background:var(--color-bg-secondary);border-radius:var(--radius-md);overflow:hidden}
.card-body{padding:var(--space-2)}

.cards-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-3)}
.game-card{background:var(--color-bg-secondary);padding:var(--space-2);border-radius:var(--radius-md);display:flex;flex-direction:column;gap:var(--space-1)}

.recent-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-3)}

.trend{display:flex;justify-content:center;padding:var(--space-5) var(--space-2)}
.trend-inner{max-width:640px;text-align:center}

.saved{padding-top:var(--space-4)}

.cta{display:flex;justify-content:center;padding:var(--space-5)}
.cta-inner{max-width:500px;text-align:center;display:flex;flex-direction:column;gap:var(--space-2)}

@media (max-width:1000px){
.hero-grid{grid-template-columns:1fr}
.cards-grid{grid-template-columns:repeat(2,1fr)}
.highlights-grid{grid-template-columns:1fr 1fr}
.recent-grid{grid-template-columns:1fr}
}

@media (max-width:600px){
.cards-grid{grid-template-columns:1fr}
.highlights-grid{grid-template-columns:1fr}
}
