//
// Hero
//
@use '../config' as *;

.hero {
  padding: 6.5rem 0;
  text-align: center;
}

.hero-title {
  font-size: 3rem;
  font-weight: var(--font-weight-bold);
  line-height: $headings-line-height;
  letter-spacing: $spacing-tight;

  @include media-breakpoint-down(md) {
    font-size: 2rem;
  }
}

.hero-description {
  max-width: 45rem;
  margin: 0 auto;
  font-size: var(--font-size-h2);
  line-height: 1.5;
  color: var(--secondary);

  @include media-breakpoint-down(sm) {
    font-size: var(--font-size-h3);
  }
}

.hero-description-wide {
  max-width: 61.875rem;
}

//
// Hero subheader
//
.hero-subheader {
  @include subheader();
  margin-bottom: 0.5rem;
}

.hero-img {
  position: relative;
  z-index: 1;
  max-width: 65rem;
  margin: 4rem auto;
  @include border-radius($border-radius-lg);
  //box-shadow: 0 10px 15px -3px rgba($color-text, 0.1),
  //  0 4px 6px -2px rgba($color-text, 0.05);

  img,
  svg {
    position: relative;
    display: block;
    max-width: 100%;
    height: auto;
  }
}
//
//.hero-img-side {
//  img,
//  svg {
//    max-width: 100%;
//    height: auto;
//    display: block;
//  }
//}