<div class="container">
    <h1>Adaptive font-size 24px-40px based on vw.</h1>
    <p>font-size 12px-16px</p><p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Sapiente labore est nemo odit, recusandae at
      deserunt magnam officia ex incidunt in dolorem cumque vel, molestiae doloribus molestias consectetur commodi ad!
      Dignissimos veritatis in quidem delectus eligendi enim libero saepe eaque, doloribus provident deleniti voluptate,
      facere id esse architecto? Facere, voluptates! Adipisci aperiam quidem labore asperiores, cum sunt quia omnis
      blanditiis?</p>
  </div>

/* определения */
:root {
  --fz-min: 12;
  --fz-max: 16;
}

* {
  --fz-min-px: calc(var(--fz-min) * 1px);
  --fz-max-px: calc(var(--fz-max) * 1px);
  --fz-diff: calc(var(--fz-max) - var(--fz-min));
  font-size: clamp(
    var(--fz-min-px),
    calc(var(--fz-min-px) + var(--fz-diff) * ((100vw - 320px) / (1280 - 320))),
    var(--fz-max-px)
  );
}
.container {
  max-width: 1280px;
  padding: 0 15px;
  margin: 0 auto;
}
/* а теперь юзаем  */

h1 {
  --fz-min: 28;
  --fz-max: 40;
  line-height: 1.2;
}

p {
  --fz-min: 12;
  --fz-max: 16;
  line-height: 1.614;
}