.container-cards{ max-width: var(--max-w-cards); margin: 0 auto; display: grid; grid-gap: calc(var(--spacing)*1); } .container-cards__investigations { @media #{$x-small-up} { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); grid-auto-rows: minmax(100px, auto); grid-gap: var(--padding-body); margin-bottom: 10vh; } @media #{$x-small} { margin-bottom: 10vh; .card--article { // margin-bottom: calc(var(--spacing) * 1.5); } } }