.hero-image{
margin-top:var(--spacing-lg);
border-radius:var(--color-radius);
box-shadow:var(--shadow-md);
}

.masonry{
column-count:3;
column-gap:var(--spacing-md);
margin-top:var(--spacing-lg);
}

.masonry img{
width:100%;
margin-bottom:var(--spacing-md);
border-radius:var(--color-radius);
break-inside:avoid;
box-shadow:var(--shadow-sm);
}

@media (max-width:1024px){
.masonry{
column-count:2;
}
}

@media (max-width:600px){
.masonry{
column-count:1;
}
}