.klasy-page{display:block}

.klasy-hero-grid{display:grid;grid-template-columns:45% 55%;gap:var(--space-6);align-items:center}
.klasy-hero-text{max-width:65ch}
.klasy-hero-image img{border-radius:var(--radius);box-shadow:0 0 16px var(--color-accent-purple);transition:transform .3s}
.klasy-hero-image:hover img{transform:scale(1.03)}

.klasy-intro-inner{max-width:720px;margin-inline:auto;text-align:center}

.klasy-grid-4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-5)}
.klasy-card{min-width:0;transition:.2s}
.klasy-card:hover{border-color:var(--color-accent-blue)}

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

.klasy-buildy-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-6);align-items:center}
.klasy-buildy-image img{border-radius:var(--radius)}
.klasy-build-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-3)}

.klasy-search-bar{max-width:600px}

.klasy-grid-articles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-5)}
.bookmark{align-self:flex-end}

.klasy-cta-inner{text-align:center;max-width:600px;margin-inline:auto;display:flex;flex-direction:column;gap:var(--space-4)}

@media(max-width:1100px){
.klasy-grid-4{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(max-width:900px){
.klasy-hero-grid{grid-template-columns:1fr}
.klasy-buildy-grid{grid-template-columns:1fr}
}

@media(max-width:700px){
.klasy-grid-3,.klasy-grid-articles,.klasy-build-cards{grid-template-columns:1fr}
}