@import "src/styles/colors";
@import "src/styles/spacing";
@import "src/styles/font";

.Header {
  background: #fefefe;
  border-bottom: 1px solid $color-neutral9;
}

.HeaderNavBrand {
  display: flex;
  align-items: center;
}

.HeaderNavBrand:active {
  opacity: 0.5;
}

.HeaderNavDivider {
  padding: 1px;
  height: 16px;
  border-right: 1px solid $color-neutral9;
}

.HeaderNavTitle {
  color: $color-primary5;
  font-size: $font-large;
}

.Intro {
  align-items: center;
  display: flex;
  padding-bottom: 230px;
  padding-top: 200px;
}

.IntroSiteTitle {
  font-style: italic;
  text-align: center;
  background: linear-gradient(
    90deg,
    $color-primary1 0%,
    $color-primary6 50%,
    $color-primary7 100%
  );
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: $color-primary6;
}

.IntroTitle {
  color: $color-neutral4;
  text-align: center;
}

.IntroSubtitle {
  color: $color-neutral6;
  text-align: center;
}

@import "src/styles/colors";
@import "src/styles/spacing";
@import "src/styles/font";

.Header {
  background: #fefefe;
  border-bottom: 1px solid $color-neutral9;
}

.HeaderNavBrand {
  display: flex;
  align-items: center;
}

.HeaderNavBrand:active {
  opacity: 0.5;
}

.HeaderNavDivider {
  padding: 1px;
  height: 16px;
  border-right: 1px solid $color-neutral9;
}

.HeaderNavTitle {
  color: $color-primary5;
  font-size: $font-large;
}

.Intro {
  align-items: center;
  display: flex;
  height: calc(90vh - 150px);
  min-height: 400px;
}

.IntroSiteTitle {
  font-style: italic;
  text-align: center;
  background: linear-gradient(
    90deg,
    $color-primary1 0%,
    $color-primary6 50%,
    $color-primary7 100%
  );
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: $color-primary6;
}

.IntroTitle {
  color: $color-neutral4;
  text-align: center;
}

.IntroSubtitle {
  color: $color-neutral6;
  text-align: center;
}

Set height instead of padding
Set height instead of padding
