@font-face {
  font-family: "Inter Tight";
  src: url("../fonts/InterTight-VariableFont_wght.ttf") format("truetype-variations");
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
}

:root {
  --stay-dark: #3C3C3C;
  --stay-body: #6A6D73;
  --stay-turquoise: #07C2A8;
  --stay-turquoise-dark: #049985;
  --stay-turquoise-soft: #E9FAF7;
  --stay-yellow: #FFDC0E;
  --stay-yellow-hover: #E9C800;
  --stay-page: #F4F5FC;
  --stay-line: #E5E7EC;
  --stay-white: #FFFFFF;
  --stay-lilac: #EFEDFF;
  --stay-font: "Inter Tight", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  --stay-r-lg: 24px;
  --stay-r-md: 17px;
  --stay-r-sm: 11px;
  --stay-shadow-card: 0 14px 38px rgba(60,60,60,.07);
  --stay-shadow-overlay: 0 18px 48px rgba(60,60,60,.12);
  --stay-space-1: 4px;
  --stay-space-2: 8px;
  --stay-space-3: 12px;
  --stay-space-4: 16px;
  --stay-space-6: 24px;
  --stay-space-8: 32px;
  --stay-space-12: 48px;
  --stay-space-16: 64px;
  --stay-space-20: 80px;
  --stay-space-28: 112px;
  --stay-container: 1200px;
  --stay-container-wide: 1240px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--stay-body);
  background: var(--stay-page);
  font-family: var(--stay-font);
  font-size: 16px;
  font-weight: 400;
  line-height: 1.65;
  font-synthesis: none;
  -webkit-font-smoothing: antialiased;
}
button, input, textarea, select { font: inherit; }
a { color: inherit; }
img { max-width: 100%; display: block; }
h1,h2,h3,h4,h5 { margin: 0; color: var(--stay-dark); }
h1 { font-size: clamp(44px,5.2vw,68px); font-weight: 600; line-height: 1.02; letter-spacing: -.035em; }
h2 { font-size: clamp(34px,3.8vw,50px); font-weight: 560; line-height: 1.06; letter-spacing: -.03em; }
h3 { font-size: 28px; font-weight: 550; line-height: 1.12; letter-spacing: -.02em; }
h4 { font-size: 22px; font-weight: 550; line-height: 1.2; letter-spacing: -.015em; }
h5 { font-size: 18px; font-weight: 550; line-height: 1.28; letter-spacing: -.01em; }
p { margin: 0; }
:focus-visible { outline: 3px solid rgba(7,194,168,.28); outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *,*::before,*::after { animation: none !important; transition: none !important; }
}
@media (max-width:480px) {
  h1 { font-size: 40px; }
  h3 { font-size: 25px; }
  h4 { font-size: 20px; }
}
