@import "./liftkitvars.css";

/* Regular families */
.display1 {
  --lineHeightInEms: calc(1em * var(--lk-quarterstep));
  --md: var(--lineHeightInEms);

  --sm: calc(var(--lineHeightInEms) * var(--lk-wholestep-dec));
  --xs: calc(var(--lineHeightInEms) * var(--lk-halfstep-dec));
  --2xs: calc(var(--lineHeightInEms) * var(--lk-quarterstep-dec));

  --sm: calc(var(--lineHeightInEms) * calc(1 / var(--lk-halfstep)));
  --lg: calc(var(--lineHeightInEms) * var(--lk-wholestep));
  --xl: calc(var(--lk-size-lg) * var(--lk-wholestep));
  --2xl: calc(var(--lk-size-xl) * var(--lk-wholestep));

  letter-spacing: -0.022em;
  font-size: var(--display1-font-size);
  font-weight: 400;
  line-height: var(--lk-quarterstep);
}

.display2 {
  --lineHeightInEms: calc(1em * var(--lk-halfstep));
  --md: var(--lineHeightInEms);

  --sm: calc(var(--lineHeightInEms) * var(--lk-wholestep-dec));
  --xs: calc(var(--lineHeightInEms) * var(--lk-halfstep-dec));
  --2xs: calc(var(--lineHeightInEms) * var(--lk-quarterstep-dec));

  --lg: calc(var(--lineHeightInEms) * var(--lk-wholestep));
  --xl: calc(var(--lk-size-lg) * var(--lk-wholestep));
  --2xl: calc(var(--lk-size-xl) * var(--lk-wholestep));

  letter-spacing: -0.022em;
  font-size: var(--display2-font-size);
  font-weight: 400;
  line-height: var(--lk-halfstep);
}

.title1 {
  --lineHeightInEms: calc(1em * var(--lk-halfstep));
  --md: var(--lineHeightInEms);

  --sm: calc(var(--lineHeightInEms) * var(--lk-wholestep-dec));
  --xs: calc(var(--lineHeightInEms) * var(--lk-halfstep-dec));
  --2xs: calc(var(--lineHeightInEms) * var(--lk-quarterstep-dec));

  --lg: calc(var(--lineHeightInEms) * var(--lk-wholestep));
  --xl: calc(var(--lk-size-lg) * var(--lk-wholestep));
  --2xl: calc(var(--lk-size-xl) * var(--lk-wholestep));

  letter-spacing: -0.022em;
  font-size: var(--title1-font-size);
  font-weight: 400;
  line-height: var(--lk-halfstep);
}

.title2 {
  --lineHeightInEms: calc(1em * var(--lk-halfstep));
  --md: var(--lineHeightInEms);

  --sm: calc(var(--lineHeightInEms) * var(--lk-wholestep-dec));
  --xs: calc(var(--lineHeightInEms) * var(--lk-halfstep-dec));
  --2xs: calc(var(--lineHeightInEms) * var(--lk-quarterstep-dec));

  --lg: calc(var(--lineHeightInEms) * var(--lk-wholestep));
  --xl: calc(var(--lk-size-lg) * var(--lk-wholestep));
  --2xl: calc(var(--lk-size-xl) * var(--lk-wholestep));

  letter-spacing: -0.02em;
  font-size: var(--title2-font-size);
  font-weight: 400;
  line-height: var(--lk-halfstep);
}

.title3 {
  --lineHeightInEms: calc(1em * var(--lk-halfstep));
  --md: var(--lineHeightInEms);

  --sm: calc(var(--lineHeightInEms) * var(--lk-wholestep-dec));
  --xs: calc(var(--lineHeightInEms) * var(--lk-halfstep-dec));
  --2xs: calc(var(--lineHeightInEms) * var(--lk-quarterstep-dec));

  --lg: calc(var(--lineHeightInEms) * var(--lk-wholestep));
  --xl: calc(var(--lk-size-lg) * var(--lk-wholestep));
  --2xl: calc(var(--lk-size-xl) * var(--lk-wholestep));

  letter-spacing: -0.017em;
  font-size: var(--title3-font-size);
  font-weight: 400;
  line-height: var(--lk-halfstep);
}

.heading {
  --lineHeightInEms: calc(1em * var(--lk-halfstep));
  --md: var(--lineHeightInEms);

  --sm: calc(var(--lineHeightInEms) * var(--lk-wholestep-dec));
  --xs: calc(var(--lineHeightInEms) * var(--lk-halfstep-dec));
  --2xs: calc(var(--lineHeightInEms) * var(--lk-quarterstep-dec));

  --lg: calc(var(--lineHeightInEms) * var(--lk-wholestep));
  --xl: calc(var(--lk-size-lg) * var(--lk-wholestep));
  --2xl: calc(var(--lk-size-xl) * var(--lk-wholestep));

  letter-spacing: -0.014em;
  font-size: var(--heading-font-size);
  font-weight: 600;
  line-height: var(--lk-halfstep);
}

.subheading {
  --lineHeightInEms: calc(1em * var(--lk-halfstep));
  --md: var(--lineHeightInEms);

  --sm: calc(var(--lineHeightInEms) * var(--lk-wholestep-dec));
  --xs: calc(var(--lineHeightInEms) * var(--lk-halfstep-dec));
  --2xs: calc(var(--lineHeightInEms) * var(--lk-quarterstep-dec));

  --lg: calc(var(--lineHeightInEms) * var(--lk-wholestep));
  --xl: calc(var(--lk-size-lg) * var(--lk-wholestep));
  --2xl: calc(var(--lk-size-xl) * var(--lk-wholestep));

  letter-spacing: -0.007em;
  font-size: var(--subheading-font-size);
  font-weight: 400;
  line-height: var(--lk-halfstep);
}

.body {
  --lineHeightInEms: var(--title2-font-size);
  --md: 1em;
  --sm: calc(var(--lineHeightInEms) * var(--lk-wholestep-dec));
  --xs: calc(var(--lineHeightInEms) * var(--lk-halfstep-dec));
  --2xs: calc(var(--lineHeightInEms) * var(--lk-quarterstep-dec));

  --lg: calc(1em * var(--lk-wholestep));
  --xl: calc(var(--lk-size-lg) * var(--lk-wholestep));
  --2xl: calc(var(--lk-size-xl) * var(--lk-wholestep));

  letter-spacing: -0.011em;
  cursor: default;
  font-size: 1em;
  font-weight: 400;
  line-height: var(--lk-wholestep);
}

.callout {
  --lineHeightInEms: calc(1em * var(--lk-halfstep));
  --md: var(--lineHeightInEms);

  --sm: calc(var(--lineHeightInEms) * var(--lk-wholestep-dec));
  --xs: calc(var(--lineHeightInEms) * var(--lk-halfstep-dec));
  --2xs: calc(var(--lineHeightInEms) * var(--lk-quarterstep-dec));

  --lg: calc(var(--lineHeightInEms) * var(--lk-wholestep));
  --xl: calc(var(--lk-size-lg) * var(--lk-wholestep));
  --2xl: calc(var(--lk-size-xl) * var(--lk-wholestep));

  letter-spacing: -0.009em;
  font-size: var(--callout-font-size);
  font-weight: 400;
  line-height: var(--lk-halfstep);
}

.label {
  --lineHeightInEms: calc(1em * var(--lk-halfstep));
  --md: var(--lineHeightInEms);

  --sm: calc(var(--lineHeightInEms) * var(--lk-wholestep-dec));
  --xs: calc(var(--lineHeightInEms) * var(--lk-halfstep-dec));
  --2xs: calc(var(--lineHeightInEms) * var(--lk-quarterstep-dec));

  --lg: calc(var(--lineHeightInEms) * var(--lk-wholestep));
  --xl: calc(var(--lk-size-lg) * var(--lk-wholestep));
  --2xl: calc(var(--lk-size-xl) * var(--lk-wholestep));

  letter-spacing: -0.004em;
  font-size: var(--label-font-size);
  font-weight: 600;
  line-height: var(--lk-halfstep);
  position: static;
}

.caption {
  --lineHeightInEms: calc(1em * var(--lk-halfstep));
  --md: var(--lineHeightInEms);

  --sm: calc(var(--lineHeightInEms) * var(--lk-wholestep-dec));
  --xs: calc(var(--lineHeightInEms) * var(--lk-halfstep-dec));
  --2xs: calc(var(--lineHeightInEms) * var(--lk-quarterstep-dec));

  --lg: calc(var(--lineHeightInEms) * var(--lk-wholestep));
  --xl: calc(var(--lk-size-lg) * var(--lk-wholestep));
  --2xl: calc(var(--lk-size-xl) * var(--lk-wholestep));

  letter-spacing: -0.007em;
  font-size: var(--caption-font-size);
  font-weight: 400;
  line-height: var(--lk-halfstep);
}

.capline {
  --lineHeightInEms: calc(1em * var(--lk-halfstep));
  --md: var(--lineHeightInEms);

  --sm: calc(var(--lineHeightInEms) * var(--lk-wholestep-dec));
  --xs: calc(var(--lineHeightInEms) * var(--lk-halfstep-dec));
  --2xs: calc(var(--lineHeightInEms) * var(--lk-quarterstep-dec));

  --lg: calc(var(--lineHeightInEms) * var(--lk-wholestep));
  --xl: calc(var(--lk-size-lg) * var(--lk-wholestep));
  --2xl: calc(var(--lk-size-xl) * var(--lk-wholestep));

  letter-spacing: 0.0618em;
  text-transform: uppercase;
  font-size: var(--capline-font-size);
  font-weight: 400;
  line-height: var(--lk-halfstep);
}

/* Bold Families */

.display1-bold {
  --lineHeightInEms: calc(1em * var(--lk-quarterstep));
  --md: calc(1em / var(--lk-wholestep));
  --sm: calc(var(--lineHeightInEms) * var(--lk-wholestep-dec));
  --xs: calc(var(--lineHeightInEms) * var(--lk-halfstep-dec));
  --2xs: calc(var(--lineHeightInEms) * var(--lk-quarterstep-dec));

  --lg: calc(1em * var(--lk-wholestep));
  --xl: calc(var(--lk-size-lg) * var(--lk-wholestep));
  --2xl: calc(var(--lk-size-xl) * var(--lk-wholestep));

  letter-spacing: -0.022em;
  font-size: var(--display1-font-size);
  font-weight: 700;
  line-height: var(--lk-quarterstep);
}

.display2-bold {
  --lineHeightInEms: calc(1em * var(--lk-halfstep));
  --md: var(--lineHeightInEms);

  --sm: calc(var(--lineHeightInEms) * var(--lk-wholestep-dec));
  --xs: calc(var(--lineHeightInEms) * var(--lk-halfstep-dec));
  --2xs: calc(var(--lineHeightInEms) * var(--lk-quarterstep-dec));

  --lg: calc(var(--lineHeightInEms) * var(--lk-wholestep));
  --xl: calc(var(--lk-size-lg) * var(--lk-wholestep));
  --2xl: calc(var(--lk-size-xl) * var(--lk-wholestep));

  letter-spacing: -0.022em;
  font-size: var(--display2-font-size);
  font-weight: 700;
  line-height: var(--lk-halfstep);
}

.title1-bold {
  --lineHeightInEms: calc(1em * var(--lk-halfstep));
  --md: var(--lineHeightInEms);

  --sm: calc(var(--lineHeightInEms) * var(--lk-wholestep-dec));
  --xs: calc(var(--lineHeightInEms) * var(--lk-halfstep-dec));
  --2xs: calc(var(--lineHeightInEms) * var(--lk-quarterstep-dec));

  --lg: calc(var(--lineHeightInEms) * var(--lk-wholestep));
  --xl: calc(var(--lk-size-lg) * var(--lk-wholestep));
  --2xl: calc(var(--lk-size-xl) * var(--lk-wholestep));

  letter-spacing: -0.022em;
  font-size: var(--title1-font-size);
  font-weight: 600;
  line-height: var(--lk-halfstep);
}

.title2-bold {
  --lineHeightInEms: calc(1em * var(--lk-halfstep));
  --md: var(--lineHeightInEms);

  --sm: calc(var(--lineHeightInEms) * var(--lk-wholestep-dec));
  --xs: calc(var(--lineHeightInEms) * var(--lk-halfstep-dec));
  --2xs: calc(var(--lineHeightInEms) * var(--lk-quarterstep-dec));

  --lg: calc(var(--lineHeightInEms) * var(--lk-wholestep));
  --xl: calc(var(--lk-size-lg) * var(--lk-wholestep));
  --2xl: calc(var(--lk-size-xl) * var(--lk-wholestep));

  letter-spacing: -0.02em;
  font-size: var(--title2-font-size);
  font-weight: 600;
  line-height: var(--lk-halfstep);
}

.title3-bold {
  --lineHeightInEms: calc(1em * var(--lk-halfstep));
  --md: var(--lineHeightInEms);

  --sm: calc(var(--lineHeightInEms) * var(--lk-wholestep-dec));
  --xs: calc(var(--lineHeightInEms) * var(--lk-halfstep-dec));
  --2xs: calc(var(--lineHeightInEms) * var(--lk-quarterstep-dec));

  --lg: calc(var(--lineHeightInEms) * var(--lk-wholestep));
  --xl: calc(var(--lk-size-lg) * var(--lk-wholestep));
  --2xl: calc(var(--lk-size-xl) * var(--lk-wholestep));

  letter-spacing: -0.017em;
  font-size: var(--title3-font-size);
  font-weight: 600;
  line-height: var(--lk-halfstep);
}

.heading-bold {
  --lineHeightInEms: calc(1em * var(--lk-halfstep));
  --md: var(--lineHeightInEms);

  --sm: calc(var(--lineHeightInEms) * var(--lk-wholestep-dec));
  --xs: calc(var(--lineHeightInEms) * var(--lk-halfstep-dec));
  --2xs: calc(var(--lineHeightInEms) * var(--lk-quarterstep-dec));

  --lg: calc(var(--lineHeightInEms) * var(--lk-wholestep));
  --xl: calc(var(--lk-size-lg) * var(--lk-wholestep));
  --2xl: calc(var(--lk-size-xl) * var(--lk-wholestep));

  letter-spacing: -0.014em;
  font-size: var(--heading-font-size);
  font-weight: 700;
  line-height: var(--lk-halfstep);
}

.subheading-bold {
  --lineHeightInEms: calc(1em * var(--lk-halfstep));
  --md: var(--lineHeightInEms);

  --sm: calc(var(--lineHeightInEms) * var(--lk-wholestep-dec));
  --xs: calc(var(--lineHeightInEms) * var(--lk-halfstep-dec));
  --2xs: calc(var(--lineHeightInEms) * var(--lk-quarterstep-dec));

  --lg: calc(var(--lineHeightInEms) * var(--lk-wholestep));
  --xl: calc(var(--lk-size-lg) * var(--lk-wholestep));
  --2xl: calc(var(--lk-size-xl) * var(--lk-wholestep));

  letter-spacing: -0.007em;
  font-size: var(--subheading-font-size);
  font-weight: 600;
  line-height: var(--lk-halfstep);
}

.body-bold {
  --lineHeightInEms: var(--title2-font-size);
  --md: calc(1em / var(--lk-wholestep));
  --sm: calc(var(--lineHeightInEms) * var(--lk-wholestep-dec));
  --xs: calc(var(--lineHeightInEms) * var(--lk-halfstep-dec));
  --2xs: calc(var(--lineHeightInEms) * var(--lk-quarterstep-dec));

  --lg: calc(1em * var(--lk-wholestep));
  --xl: calc(var(--lk-size-lg) * var(--lk-wholestep));
  --2xl: calc(var(--lk-size-xl) * var(--lk-wholestep));

  letter-spacing: -0.011em;
  padding: 0;
  font-size: 1em;
  font-weight: 600;
  line-height: var(--lk-wholestep);
  position: relative;
}

.callout-bold {
  --lineHeightInEms: calc(1em * var(--lk-halfstep));
  --md: var(--lineHeightInEms);

  --sm: calc(var(--lineHeightInEms) * var(--lk-wholestep-dec));
  --xs: calc(var(--lineHeightInEms) * var(--lk-halfstep-dec));
  --2xs: calc(var(--lineHeightInEms) * var(--lk-quarterstep-dec));

  --lg: calc(var(--lineHeightInEms) * var(--lk-wholestep));
  --xl: calc(var(--lk-size-lg) * var(--lk-wholestep));
  --2xl: calc(var(--lk-size-xl) * var(--lk-wholestep));

  letter-spacing: -0.009em;
  font-size: var(--callout-font-size);
  font-weight: 600;
  line-height: var(--lk-halfstep);
  text-decoration: none;
}

.label-bold {
  --lineHeightInEms: calc(1em * var(--lk-halfstep));
  --md: var(--lineHeightInEms);

  --sm: calc(var(--lineHeightInEms) * var(--lk-wholestep-dec));
  --xs: calc(var(--lineHeightInEms) * var(--lk-halfstep-dec));
  --2xs: calc(var(--lineHeightInEms) * var(--lk-quarterstep-dec));

  --lg: calc(var(--lineHeightInEms) * var(--lk-wholestep));
  --xl: calc(var(--lk-size-lg) * var(--lk-wholestep));
  --2xl: calc(var(--lk-size-xl) * var(--lk-wholestep));

  letter-spacing: -0.004em;
  font-size: var(--label-font-size);
  font-weight: 700;
  line-height: var(--lk-halfstep);
}

.caption-bold {
  --lineHeightInEms: calc(1em * var(--lk-halfstep));
  --md: var(--lineHeightInEms);

  --sm: calc(var(--lineHeightInEms) * var(--lk-wholestep-dec));
  --xs: calc(var(--lineHeightInEms) * var(--lk-halfstep-dec));
  --2xs: calc(var(--lineHeightInEms) * var(--lk-quarterstep-dec));

  --lg: calc(var(--lineHeightInEms) * var(--lk-wholestep));
  --xl: calc(var(--lk-size-lg) * var(--lk-wholestep));
  --2xl: calc(var(--lk-size-xl) * var(--lk-wholestep));

  letter-spacing: -0.007em;
  font-size: var(--caption-font-size);
  font-weight: 600;
  line-height: var(--lk-halfstep);
}

.capline-bold {
  --lineHeightInEms: calc(1em * var(--lk-halfstep));
  --md: var(--lineHeightInEms);

  --sm: calc(var(--lineHeightInEms) * var(--lk-wholestep-dec));
  --xs: calc(var(--lineHeightInEms) * var(--lk-halfstep-dec));
  --2xs: calc(var(--lineHeightInEms) * var(--lk-quarterstep-dec));

  --lg: calc(var(--lineHeightInEms) * var(--lk-wholestep));
  --xl: calc(var(--lk-size-lg) * var(--lk-wholestep));
  --2xl: calc(var(--lk-size-xl) * var(--lk-wholestep));

  letter-spacing: 0.0618em;
  text-transform: uppercase;
  font-size: var(--capline-font-size);
  font-weight: 600;
  line-height: var(--lk-halfstep);
}

@media screen and (max-width: 767px) {
  .display1-bold,
  .display1 {
    font-size: 3.3301em;
  }
}

@media screen and (max-width: 479px) {
  .display1 {
    font-size: 2.61743em;
  }

  .display1-bold {
    font-size: 2.61743em;
  }

  .display2 {
    font-size: 2.05818em;
  }

  .display2-bold {
    font-size: 2.05818em;
  }

  .title1-bold,
  .title1 {
    font-size: 1.82285em;
  }
}


.weight-400 {
  font-weight: 400;
}

.italic {
  font-style: italic;
}

.is-link {
  transition: opacity 0.2s ease;
  cursor: pointer;
}

.is-link:hover {
  opacity: 0.6;
}

.mono {
  font-family: monospace;
}
