.splitting .word {
  white-space: nowrap;
}
.intro {
  height: 100vh;
  text-align: center;
  place-items: center;
  display: grid;
}
.intro__title {
  place-items: center;
  margin: 0;
  font-weight: 300;
  line-height: 0.9;
  display: grid;
}
.intro__title-pre {
  text-transform: uppercase;
  font-family: norman-stencil, sans-serif;
  font-size: clamp(2rem, 10vw, 9rem);
  font-weight: 800;
}
.intro__title-sub {
  font-size: clamp(1rem, 6vw, 2.75rem);
}
.intro__info {
  max-width: 230px;
  opacity: 0.6;
  margin-bottom: 4rem;
  padding-bottom: 1rem;
  line-height: 1.2;
  position: relative;
}
.intro__info:after {
  content: "";
  width: 1px;
  height: 2rem;
  background: #fff;
  position: absolute;
  top: 100%;
  left: 50%;
}
.scroll-container {
  overflow: hidden;
}
.scroll-content {
  padding: 1.5rem 2rem;
  flex-direction: column;
  display: flex;
  position: relative;
  overflow: hidden;
  clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
}
.page-title .char {
  transform: translateY(170px);
  transition: transform 0.5s;
}
.scroll-content:last-child {
  padding-bottom: 1vh;
}
.content--full {
  padding: 0;
}
.scroll-content p {
  max-width: 660px;
  margin: 1.5rem auto;
  font-size: 1.25rem;
  color: #343a44;
  font-weight: 300;
  
  text-align: center;
}
.content--highlight p {
  font-size: clamp(1rem, 3vw, 2rem);
}
.scrollservices {
  overflow: hidden;
  display: block;
  min-height: 550px;
  margin-bottom: 3rem;
  clip-path: polygon(0 0, 95% 0, 100% 100%, 5% 100%);
}
.scroll-content .scrollservices img {
  display: block;
  width: 600px;
  margin-left: auto;
  margin-right: auto;
}
.content__title {
  counter-increment: section;
  text-align: center;
  gap: 2rem;
  font-size: 3vw;
  line-height: 3vw;
  display: grid;
  color: #343a44;
  text-transform: uppercase;
  font-weight: 800;
  margin-top: 0rem;
  margin-bottom: 4rem;
}
.content__title::first-letter {
  text-transform: capitalize;
}
.content__title--sides {
  text-align: left;
  grid-template-rows: auto auto;
  grid-template-columns: 100%;
  gap: 2rem;
  display: grid;
}
.content__title--sides span:last-child {
  justify-self: end;
}
.font_sm {
  font-size: 2vw;
  line-height: 2vw;
}
.font_md {
  font-size: 6vw;
  line-height: 6vw;
}
.font-1 {
  font-family: wayfinder-cf, serif;
  font-weight: 100;
}
.font-2 {
  font-family: campaign-serif, sans-serif;
  font-weight: 400;
}
.font-3 {
  font-family: area-normal, sans-serif;
  font-weight: 600;
}
.font-4 {
  font-family: campaign-serif, sans-serif;
  font-style: italic;
  font-weight: 400;
}
.font-5 {
  text-transform: uppercase;
  font-family: zedou, sans-serif;
  font-weight: 300;
}
.font-6 {
  font-family: afronaut, sans-serif;
  font-weight: 400;
}
.font-7 {
  font-family: hoss-round-wide, sans-serif;
  font-weight: 400;
}
.font-8 {
  text-transform: lowercase;
  font-family: monotalic, sans-serif;
  font-weight: 400;
}
.font-9 {
  font-family: aziga, sans-serif;
  font-weight: 400;
}
.font-10 {
  font-family: norman-stencil, sans-serif;
  font-weight: 800;
}
.font-11 {
  font-family: neighbor, sans-serif;
  font-weight: 400;
}
.font-12 {
  font-family: halogen, sans-serif;
  font-weight: 700;
}
.font-height {
  line-height: 1.4;
}
.font-larger {
  font-size: 27vw;
}
.font-upper {
  text-transform: uppercase;
}
.font-sub {
  margin-top: 2rem;
  font-size: 4vw;
  display: block;
  padding: 0 10%;
}
.splitting .font-sub .word {
  grid-auto-flow: column;
  display: grid;
}
.font-medium {
  margin-top: 3rem;
  font-size: 6vw;
}
.char-wrap {
  display: inline-block;
  position: relative;
  overflow: hidden;
}
.splitting.cells img {
  width: 100%;
  display: block;
}
@supports (display: grid) {
  .splitting.cells {
    visibility: hidden;
    background-size: cover;
    position: relative;
    overflow: hidden;
  }
  .splitting .cell-grid {
    background: inherit;
    width: 100%;
    height: 100%;
    grid-template: repeat(var(--row-total), 1fr) / repeat(var(--col-total), 1fr);
    display: grid;
    position: absolute;
    top: 0;
    left: 0;
  }
  .splitting .cell {
    background: inherit;
    position: relative;
    overflow: hidden;
  }
  .splitting .cell-inner {
    background: inherit;
    visibility: visible;
    width: calc(100% * var(--col-total));
    height: calc(100% * var(--row-total));
    left: calc(-100% * var(--col-index));
    top: calc(-100% * var(--row-index));
    position: absolute;
  }
  .splitting .cell {
    --center-x: calc((var(--col-total) - 1) / 2);
    --center-y: calc((var(--row-total) - 1) / 2);
    --offset-x: calc(var(--col-index) - var(--center-x));
    --offset-y: calc(var(--row-index) - var(--center-y));
    --distance-x: calc((var(--offset-x) * var(--offset-x)) / var(--center-x));
    --distance-y: calc((var(--offset-y) * var(--offset-y)) / var(--center-y));
  }
}
.splitting .word,
.splitting .char {
  display: inline-block;
}
.splitting .char {
  position: relative;
}
.splitting .char:before,
.splitting .char:after {
  content: attr(data-char);
  visibility: hidden;
  -webkit-user-select: none;
  user-select: none;
  transition: inherit;
  position: absolute;
  top: 0;
  left: 0;
}
.splitting {
  --word-center: calc((var(--word-total) - 1) / 2);
  --char-center: calc((var(--char-total) - 1) / 2);
  --line-center: calc((var(--line-total) - 1) / 2);
}
.splitting .word {
  --word-percent: calc(var(--word-index) / var(--word-total));
  --line-percent: calc(var(--line-index) / var(--line-total));
}
.splitting .char {
  --char-percent: calc(var(--char-index) / var(--char-total));
  --char-offset: calc(var(--char-index) - var(--char-center));
  --distance: calc(
    (var(--char-offset) * var(--char-offset)) / var(--char-center)
  );
  --distance-sine: calc(var(--char-offset) / var(--char-center));
  --distance-percent: calc((var(--distance) / var(--char-center)));
}
@media screen and (max-width: 765px) {
  .content__title {
    line-height: 0.5;
  }
  .scrollservices {
    overflow: hidden;
    display: block;
    min-height: 300px;
    margin-bottom: 0rem;
  }
  .small-mb-1 {
    margin-bottom: 1rem;
  }
  .font_sm {
    font-size: 5vw;
    line-height: 5vw;
  }
  .font_md {
    font-size: 7vw;
    line-height: 7vw;
  }
}