@charset "UTF-8";
/* Превью и слоган у логотипа шапки — первый экран about и главной. Только с md; блок абсолютный,
   отсчёт — от верхнего левого угла первого экрана (на одной линии с логотипом шапки). */
.hero-intro {
  display: none;
}
@media (min-width: 768px) {
  .hero-intro {
    position: absolute;
    top: 1.375rem;
    left: 9rem;
    z-index: 1;
    display: block;
  }
}
@media (min-width: 1280px) {
  .hero-intro {
    top: 1.75rem;
    display: flex;
    gap: 0.5rem;
  }
}
.hero-intro__preview {
  width: 7.125rem;
  height: 7.125rem;
  object-fit: cover;
  border-radius: var(--radius-8);
}
@media (min-width: 1280px) {
  .hero-intro__preview {
    width: 6.75rem;
    height: 6.75rem;
  }
}
.hero-intro__slogan {
  font-family: var(--font-text);
  font-weight: 500;
  font-size: 0.875rem;
  line-height: 1.4;
  color: var(--color-white-60);
}
@media (min-width: 768px) {
  .hero-intro__slogan {
    position: absolute;
    top: 7.125rem;
    left: -7.625rem;
    width: 14.75rem;
    padding-block: 1.375rem;
  }
}
@media (min-width: 1280px) {
  .hero-intro__slogan {
    position: static;
    display: flex;
    align-items: center;
    width: 14rem;
    height: 6.75rem;
    padding: 0 1rem;
  }
}