Margem é o espaço vazio em volta do conteúdo, entre ele e a borda do container ou da tela. Ela dá respiro, estrutura e clareza. Sem margem, o layout fica espremido, pesado e com cara de amador.
Vale separar margem de padding. O padding é o espaço de dentro do container, entre o conteúdo e a borda dele. A margem é o espaço de fora do container. Entender essa diferença é o que permite controlar com intenção tanto o espaçamento interno quanto o externo, em vez de empurrar valores no chute.
A margem mexe diretamente com leiturabilidade e com hierarquia. Uma margem generosa em volta de um bloco encurta a linha, melhora a leitura e isola o elemento pra atrair foco. Já uma margem apertada agrupa elementos relacionados, sinalizando que eles andam juntos. E no responsivo ela precisa se adaptar à tela, muitas vezes em unidade flexível, e não em pixel fixo.