@use "sass:math";
$maxWidthContainer: 1123;
//перевод в %
@function prc($pxOne, $pxTwo) {
    $result: math.div($pxOne, $pxTwo) * 100%;
    @return $result;
  }
  //перевод в rem
  @function rem($px) {
    $result: math.div($px, 8) + rem;
    @return $result;
  }
  //перевод в em
  @function em($px, $size:16) {
    $result: math.div($px, $size) + em;
    @return $result;
  }
  
  
  //адаптивное свойство
  @mixin adaptiv-value($property, $startSize, $minSize, $type) {
    $addSize: $startSize - $minSize;
    @if $type == 1 {
      //только если меньше контейнера, присутствует ограничение
      #{$property}: $startSize+px;
      @media (max-width: em($maxWidthContainer)) {
        #{$property}: calc(
                #{$minSize+px} + #{$addSize} *
                ((100vw - 320px) / #{$maxWidthContainer - 320})
        );
      }
    } @else if $type == 2 {
      //только если больше контейнера, min-width
      #{$property}: rem($startSize);
      @media (min-width: #{$maxWidthContainer + px}) {
        #{$property}: calc(
                #{rem($minSize)} + #{$addSize} * ((100vw - 320px) / #{$maxWidth - 320})
        );
      }
    } @else {
      //всегда на всех экранах
      #{$property}: calc(
              #{rem($minSize)} + #{$addSize} * ((100vw - 320px) / #{$maxWidth - 320})
      );
    }
  }