/* TYPOGRAPHY */

/* Text style definitions */

.heading-title {
  /* Larger than heading-1 */
  font-size: clamp(2.625rem, 5vw, 3.125rem);
  line-height: 1.12;
  letter-spacing: -0.125rem;
  font-weight: 400;
}

.heading-1 {
  font-size: clamp(var(--heading-1-size-mobile), 5vw, var(--heading-1-size));
  line-height: 1.27;
  letter-spacing: -0.01125rem;
  font-weight: 400;
}

.heading-2 {
  font-size: clamp(var(--heading-2-size-mobile), 4vw, var(--heading-2-size));
  line-height: var(--heading-2-line-height);
  font-weight: 600;
}

.heading-3 {
  font-size: clamp(var(--heading-3-size-mobile), 3vw, var(--heading-3-size));
  line-height: 1.1;
  font-weight: 600;
}

.heading-4 {
  font-size: var(--heading-4-size);
  line-height: 1.25;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
}

.heading-panel {
  font-size: 17px;
  line-height: 1.1;
  font-weight: 600;
}

.text-default {
  font-family: Montserrat;
  font-size: var(--text-size-default);
  line-height: 1.47;
}

.text-large {
  font-size: clamp(var(--text-size-large-mobile), 2vw, var(--text-size-large));
  line-height: 1.45;
}

.text-small {
  font-size: var(--text-size-small);
  line-height: 1.3;
}

/* Text style utilities for non headings */

.text-bold {
  font-weight: var(--font-weight-bold);
}

.text-extra-bold {
  font-weight: var(--font-weight-extra-bold);
}

@media screen and (min-width: 600px) {
  .text-center--tablet {
    text-align: center;
  }

  .text-start--tablet {
    text-align: start;
  }
}

@media screen and (min-width: 1000px) {
  .text-end--desktop {
    text-align: end;
  }

  .text-start--desktop {
    text-align: start;
  }
}

.text-end {
  text-align: end;
}

.text-uppercase {
  text-transform: uppercase;
}

.text-paragraph {
  max-width: 65ch;
  line-height: 1.55;
}

/* The SVG file stretches to fit any text size as long as it's on one line */

.text-underline-svg {
  position: relative;
}

.text-underline-svg::after {
  content: '';
  position: absolute;
  background-image: url("/assets/icons/underline-1ee5e276.svg");
  background-repeat: no-repeat;
  background-size: 100% 100%;
  bottom: -0.375rem;
  left: -0.125rem;
  right: -0.125rem;
  height: 0.375rem;
}

.text-underline-svg--short::after {
  background-image: url("/assets/icons/underline_short-6e0d3536.svg");
}

.text-underling-svg--spacious::after {
  bottom: -1.5rem;
}