.nowosci-page{overflow-x:hidden}

.nowosci-hero{
background:var(--color-primary);
color:#fff;
position:relative;
}
.nowosci-hero__text{max-width:700px}

.featured-news__grid{display:grid}
.featured-news__card{position:relative;border-radius:var(--radius-lg);overflow:hidden}
.featured-news__overlay{
position:absolute;
bottom:0;
left:0;
padding:var(--space-md);
max-width:500px;
background:linear-gradient(transparent,rgba(0,0,0,0.7));
color:#fff;
display:flex;
flex-direction:column;
gap:var(--space-sm);
}

.filters__inner{
display:flex;
flex-wrap:wrap;
gap:var(--space-sm);
justify-content:center;
}
.filter-btn{
padding:0.5rem 1rem;
border-radius:999px;
border:var(--border);
background:var(--color-surface);
}
.filter-btn.active{background:var(--color-accent-yellow)}

.news-layout{
display:grid;
grid-template-columns:3fr 1fr;
gap:var(--space-lg);
}
.news-grid{
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:var(--space-md);
}
.news-card{gap:var(--space-sm)}

.trending{
background:var(--color-surface);
padding:var(--space-md);
border:var(--border);
border-radius:var(--radius-md);
}
.trending ol{list-style:none;padding:0}
.trending li{margin-bottom:var(--space-sm)}

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

.load-more__inner{text-align:center}

.newsletter__box{
max-width:500px;
margin-inline:auto;
text-align:center;
background:var(--color-primary);
color:#fff;
padding:var(--space-lg);
border-radius:var(--radius-lg);
display:flex;
flex-direction:column;
gap:var(--space-sm);
}
.newsletter-form{
display:flex;
gap:var(--space-sm);
}
.newsletter-form input{
flex:1;
padding:0.6rem;
border-radius:999px;
border:none;
}

.footer-nav__grid{
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:var(--space-md);
}

@media(max-width:1024px){
.news-layout{grid-template-columns:1fr}
.news-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(max-width:640px){
.news-grid{grid-template-columns:1fr}
.topics-grid{grid-template-columns:1fr}
.newsletter-form{flex-direction:column}
}