:root {
   --gray-color: #6d6d6d;
   --gray-text-color: #909090;
   --beige-light: #f7d6ba;
   --green-light: linear-gradient(180deg, #fff 0%, #c0efcb 100%);
   --green-light-old: #c8e3d0;
   --green-dark-color: #60783D;
   --light-blue-color: #ebf7ff;
   --black: #1c1c1c;
   --text-black-color: #101010;
   --btn-white-color: #fff8fa;
}

@media screen and (min-width: 1280px) {
   :root {
      --h1-big-size: 48px;
      --h2-size: 32px;

      --small-text: 16px;

      --wrapper-padding: 32px;

      --title-margin: 60px;

      --section-margin: 120px;
   }
}

@media screen and (max-width: 1280px) {
   :root {
      --h1-big-size: 48px;
      --h2-size: 32px;

      --small-text: 16px;

      --wrapper-padding: 32px;

      --title-margin: 60px;

      --section-margin: 120px;
   }
}

@media screen and (max-width: 767px) {
   :root {
      --wrapper-padding: 16px;

      --title-margin: 40px;

      --section-margin: 70px;
   }
}

@media screen and (max-width: 582px) {
   :root {
      --h1-big-size: 31px;
      --h2-size: 22px;

      --small-text: 14px;

      --wrapper-padding: 10px;

      --title-margin: 32px;

      --section-margin: 42px;
   }
}