:root {
  --HlFontSize: 100pt;
  --lineH: 1.2;

  --fontMin: 13px;
  --fontMi: 13;
  --fontMax: 20;
  --viewMin: 300px;
  --viewMax: 1600px;
  --viewMi: 300;
  --viewMa: 1600;
  --baseFontSize: calc(
    var(--fontMin) + (var(--fontMax) - var(--fontMi)) *
      ((100vw - 300px) / (1500 - 300))
  );
}

@font-face {
  font-family: "Headline";
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("Inter.var.woff2") format("woff2");
}

@font-face {
  font-family: "Copy";
  font-style: "normal";
  font-display: swap;
  font-weight: 100 900;
  src: url("Inter.var.woff2") format("woff2");
}

.copy {
  line-height: var(--lineH);
  color: var(--copyColor);
}

.HL {
  font-family: "Headline";
  line-height: var(--lineH);
  font-size: calc(var(--baseFontSize) * 2);
  color: var(--HLcolor);
}

.copy b {
  font-weight: 900;
  color: var(--altCopyColor);
  font-size: calc(var(--baseFontSize) * 1.17);
}

.sign {
  font-family: "Headline";
  font-size: calc(var(--baseFontSize) * 1.7);
  color: #feffc2;
}

.buttonfont {
  font-family: "Headline";
  color: white;
  font-size: calc(var(--baseFontSize) * 1);
}

.copy a {
  color: var(--altCopyColor);
  font-weight: 600;
  text-decoration: none;
}