:root {
  --base-font-size: 12px;
  --color-white: #fff;
  --bg-color: hsl(0, 0%, 100%);
  --bg-color-accent: hsl(215, 50%, 95%);
  --text-color: hsl(202, 85%, 5%);
  --primary-color: hsl(277, 54%, 55%);
  --primary-color-light: hsl(260, 77%, 70%);
  --primary-color-lighter: hsl(268, 95%, 92%);
/*  --primary-color-lighter: hsl(264, 100%, 98%); */
  --primary-color-darker: hsl(277, 76%, 21%);
  --error-color: hsl(9, 95%, 41%);
  --flip-color: hsl(207, 10%, 42%);
  --link-color: var(--primary-color);
  --link-color-hover: var(--flip-color);
  --link-color-visited: var(--primary-color);
  --menu-color-background: hsl(207, 92%, 90%);
  --menu-color: var(--primary-color);
  --form-border-color: hsl(0, 0%, 90%);
  --font-sans-serif: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  --font-sans-serif: ProximaNova,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  --max-width: 1440px;
  --border-radius: 0.25rem;
  --measure: 60ch;
  --gap: 1rem;
  --s-5: clamp(0.33rem,0.39rem + -0.29vw,0.18rem);
  --s-4: clamp(0.41rem,0.47rem + -0.31vw,0.25rem);
  --s-3: clamp(0.51rem,0.57rem + -0.31vw,0.35rem);
  --s-2: clamp(0.64rem,0.69rem + -0.27vw,0.5rem);
  --s-1: clamp(0.8rem,0.84rem + -0.18vw,0.71rem);
  --s0: clamp(1rem,1rem + 0vw,1rem);
  --s1: clamp(1.25rem,1.19rem + 0.32vw,1.41rem);
  --s2: clamp(1.56rem,1.39rem + 0.85vw,2rem);
  --s3: clamp(1.95rem,1.61rem + 1.7vw,2.83rem);
  --s4: clamp(2.44rem,1.83rem + 3.04vw,4rem);
  --s5: clamp(3.05rem,2.04rem + 5.07vw,5.65rem);
}
