:root {
  
  --f: 1;
  --f-mobile: calc(32.4 / 40);
  
  --figma-px-scale: calc(var(--f) * 953 / 1024);
  --figma-font-scale: calc(var(--f) * .578);
  
  --logo-scale: calc(var(--f) * 22 / 28);
  
  --main-background-color: #25353e;
  --main-background-color-light20: var(--main-background-color-light20-cm,#515d65);
  
}

@supports (color: color-mix(in srgb,#000,#fff 1%)) {
  
  :root {
    
    --main-background-color-light20-cm: color-mix(in srgb,var(--main-background-color),#fff 20%);
    
  }
  
}

body {
  color: var(--main-background-color);
  background-color: #fff;
  font-family: "Montserrat", sans-serif;
  font-size: calc(24pt * var(--figma-font-scale));
  margin: 0;
}

h1, h2, h3, h4, h5, h6, p {
  font-optical-sizing: auto;
  margin: 0;
}
h1 {
  font-weight: 700;
  font-size: calc(48pt * var(--figma-font-scale));
}
h2 {
  font-weight: 300;
  font-size: calc(40pt * var(--figma-font-scale));
}
h3 {
  font-weight: 600;
  font-size: calc(36pt * var(--figma-font-scale));
}
h4 {
  font-weight: 400;
  font-size: calc(36pt * var(--figma-font-scale));
  line-height: 1.3;
}
h5 {
  font-weight: 600;
  font-size: calc(24pt * var(--figma-font-scale));
}
h6 {
  font-weight: 400;
  font-size: calc(24pt * var(--figma-font-scale));
  line-height: 1.3;
}

button {
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: calc(var(--button-gap) * var(--figma-px-scale));
  border-width: 0;
  padding: calc(18px * var(--figma-px-scale)) calc(var(--button-horizontal-padding) * var(--figma-px-scale));
  color: var(--subsite-highlight-color);
  text-transform: uppercase;
  font-family: inherit;
  font-weight: bold;
  font-size: calc(16pt * var(--figma-font-scale));
  transition:
    background-color .3s ease-out;
  --button-gap: 12px;
  --button-icon-size: 32px;
  --button-horizontal-padding: 40px;
}
button,
button:hover:focus:not(:disabled) {
  background-color: var(--main-background-color);
}
button:hover:not(:disabled) {
  background-color: var(--main-background-color-light20);
}
button:focus:not(:disabled) {
  outline: calc(3px * var(--figma-px-scale)) solid var(--main-background-color-light20);
  box-shadow: 0 0 calc(8px * var(--figma-px-scale)) calc(3px * var(--figma-px-scale)) rgba(0,0,0,.25);
}
button svg.icon {
  flex: 0 0 auto;
  fill: var(--subsite-highlight-color);
  width: calc(var(--button-icon-size) * var(--figma-px-scale));
  height: calc(var(--button-icon-size) * var(--figma-px-scale));
  margin: calc((var(--button-icon-size) - 20px) / -2 * var(--figma-px-scale)) 0;
  vertical-align: middle;
}
button.white {
  color: var(--main-background-color);
}
button.white,
button.white:hover:focus:not(:disabled) {
  background-color: #fff;
}
button.white:hover:not(:disabled) {
  background-color: var(--subsite-highlight-color);
}
button.white:focus:not(:disabled) {
  outline-color: var(--subsite-highlight-color);
}
button.white svg.icon {
  fill: var(--main-background-color);
}
button+form {
  display: none;
}