.levels-page .hero-levels{position:relative;overflow:hidden}
.hero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.6}
.hero-inner{position:relative;display:flex}
.hero-card{max-width:480px;display:flex;flex-direction:column;gap:16px}

.system-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}
.system-card{min-width:0}

.zones-img{margin-bottom:24px;border-radius:24px}
.zones-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}

.levels-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
.level-card{min-width:0}

.difficulty-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}

.progress-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px}

.tips-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}

.cta-card{max-width:500px;text-align:center;display:flex;flex-direction:column;gap:16px}

@media(max-width:1024px){
.system-grid,.zones-grid,.difficulty-grid,.tips-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.levels-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.progress-grid{grid-template-columns:1fr}
}

@media(max-width:768px){
.system-grid,.zones-grid,.levels-grid,.difficulty-grid,.tips-grid{grid-template-columns:1fr}
.hero-inner{justify-content:center}
.hero-card{text-align:center}
}