.home .hero-grid{display:grid;grid-template-columns:40% 60%;gap:var(--space-6);align-items:center}
.hero-text{max-width:45ch}
.hero-image img{width:100%;border-radius:var(--radius);box-shadow:0 0 16px rgba(74,141,255,0.25)}
.hero-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-5);margin-top:var(--space-6)}
.hero-card{position:relative}
.hero-card:hover{transform:translateY(-4px)}

.guides-header{max-width:60ch;margin-inline:auto;text-align:center}
.guides-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-5);margin-top:var(--space-6)}

.categories-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:var(--space-4);margin-top:var(--space-5)}

.bosses-grid{display:grid;grid-template-columns:40% 60%;gap:var(--space-6)}
.bosses-text{max-width:50ch}
.bosses-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-4)}

.news-grid{display:grid;grid-template-columns:40% 60%;gap:var(--space-6)}
.news-list{display:flex;flex-direction:column;gap:var(--space-4);max-width:55ch}

.classes-intro{max-width:60ch;margin-inline:auto;text-align:center}
.classes-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-4);margin-top:var(--space-5)}

.equipment-grid{display:grid;grid-template-columns:50% 50%;gap:var(--space-6)}
.equipment-cards{display:grid;grid-template-columns:repeat(1,minmax(0,1fr));gap:var(--space-4)}

.builds-center{max-width:55ch;margin-inline:auto;text-align:center}

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

.cta-box{max-width:45ch;margin-inline:auto;text-align:center;display:flex;flex-direction:column;gap:var(--space-4)}

@media(max-width:1000px){
.hero-grid{grid-template-columns:1fr}
.hero-cards{grid-template-columns:1fr}
.guides-grid{grid-template-columns:1fr 1fr}
.categories-grid{grid-template-columns:1fr 1fr}
.bosses-grid{grid-template-columns:1fr}
.bosses-list{grid-template-columns:1fr}
.news-grid{grid-template-columns:1fr}
.classes-grid{grid-template-columns:1fr 1fr}
.why-grid{grid-template-columns:1fr 1fr}
.equipment-grid{grid-template-columns:1fr}
}

@media(max-width:600px){
.guides-grid{grid-template-columns:1fr}
.classes-grid{grid-template-columns:1fr}
.categories-grid{grid-template-columns:1fr}
.why-grid{grid-template-columns:1fr}
}
