@use 'functions' as f;
@use 'sass:math';
@use 'sass:map';

$breakpoints: (
    'sm': f.em(400),
    'md': f.em(700),
    'lg': f.em(1200),
);

@mixin breakpoint($size) {
    @media (width >= map.get($breakpoints, $size)) {
        @content;
    }
}

@mixin container-wrapper {
    max-width: 1200px;
    margin: 0 auto;
    padding-inline: 20px;
}