@font-face {
  font-family: 'Outfit';
  src:
    url('/fonts/Outfit/Outfit-ExtraLight.ttf') format('truetype');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Outfit';
  src:
    url('/fonts/Outfit/Outfit-Regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Outfit';
  src:
    url('/fonts/Outfit/Outfit-Medium.ttf') format('truetype');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Outfit';
  src:
    url('/fonts/Outfit/Outfit-Bold.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

body, input, button, textarea, select {
  font-family: 'Outfit', Arial, sans-serif;
  color: #333;
}

/* Минимальный размер шрифта */
html {
  font-size: 0.9rem;
}

/* Плавное увеличение */
@media (min-width: 480px) {
  html {
    font-size: calc(.9em + (100vw - 480px) * 0.005);
  }
}

/* Фиксируем на 1920px и шире */
@media (min-width: 1920px) {
  html {
    font-size: 1.3em;
  }
}

@media only screen and (min-width: 321px) and (max-width:768px) {
  html {
    -webkit-text-size-adjust: none;
    text-size-adjust: none;
  }

  p, li, ol, h1, h2, h3, h4, h5, h6 {
    font-size: inherit;
  }
}

@media (max-width: 630px) {
  :root { --page-offset: 4vw; }
}

@media (max-width: 360px) {
  html { font-size: 0.95rem; }
}

@media (max-width: 320px) {
  html { font-size: 0.82rem; }
}



html {
  -webkit-text-size-adjust: none;
  text-size-adjust: none;
  color-scheme: only light;
}

input,
textarea,
select,
button {
  font: inherit;
  -webkit-text-size-adjust: none;
  text-size-adjust: none;
  color-scheme: only light;
}