@font-face {
  font-family: "CC Display";
  src: url("fonts/display.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "CC Sans";
  src: url("fonts/sans-400.woff2") format("woff2");
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "CC Sans";
  src: url("fonts/sans-500.woff2") format("woff2");
  font-weight: 500;
  font-display: swap;
}
@font-face {
  font-family: "CC Sans";
  src: url("fonts/sans-700.woff2") format("woff2");
  font-weight: 700;
  font-display: swap;
}
@font-face {
  font-family: "CC Mono";
  src: url("fonts/mono-400.woff2") format("woff2");
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "CC Mono";
  src: url("fonts/mono-500.woff2") format("woff2");
  font-weight: 500;
  font-display: swap;
}

:root {
  --blue: #4d6bfe;
  --blue-deep: #2f4be0;
  --blue-dark: #1b2a6b;
  --blue-soft: #8fa4ff;
  --cyan: #7fe3ff;
  --mint: #c8f8e8;

  --navy: #080d1e;
  --ink: #0b1226;
  --ice: #eef3ff;
  --ice-2: #e2e9ff;
  --white: #ffffff;
  --line: #d7e0fa;
  --muted: #596685;

  --display: "CC Display", "CC Sans", "PingFang SC", "HarmonyOS Sans SC", sans-serif;
  --sans: "CC Sans", "PingFang SC", "HarmonyOS Sans SC", "MiSans", system-ui, sans-serif;
  --mono: "CC Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;

  --gutter: clamp(20px, 5vw, 80px);
  --max: 1480px;

  --r-pill: 999px;
  --r-xl: 44px;
  --r-lg: 28px;
  --r-md: 18px;
  --r-sm: 10px;

  --shadow: 0 24px 70px rgba(21, 42, 120, 0.14);
  --shadow-blue: 0 28px 80px rgba(77, 107, 254, 0.26);

  --ease: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-soft: cubic-bezier(0.2, 0.8, 0.2, 1);

  --t-h1: clamp(3.4rem, 8.4vw, 8.4rem);
  --t-h2: clamp(2.3rem, 4.8vw, 4.8rem);
  --t-h3: clamp(1.35rem, 1.9vw, 1.8rem);
  --t-body: clamp(1rem, 1.05vw, 1.1rem);
}