@media (min-width: 280px) and (max-width: 767px) {
  .section-container {
    padding-inline: 24px;
  }

  .header__content {
    height: 100px;
  }

  .header__logo {
    font-size: 26px;
    line-height: 38px;
  }

  .menu {
    display: none;
  }

  .mobile-menu {
    display: flex;
  }

  .burger {
    display: block;
  }

  .title {
    font-family: "Work Sans", sans-serif;
    font-size: 54px;
    line-height: 64px;
    font-weight: 600;
    color: var(--text-main);
  }

  .hero {
    background: url("../img/hero-vector.png") bottom center no-repeat,
      url("../img/hero-bg.webp") center left / cover no-repeat, #f5f2ed;
  }

  .hero-pd {
    padding-top: 110px;
    padding-bottom: 90px;
  }

  .services-title {
    font-size: 34px;
    line-height: 44px;
  }

  .services-pd {
    padding-top: 85px;
    padding-bottom: 75px;
  }

  .grid-section {
    grid-template-columns: 1fr;
  }

  .grid-item {
    margin-top: 50px;
    align-items: center;
  }

  .grid-item__icon {
    width: 50px;
    height: 50px;
  }

  .grid-item__title {
    font-size: 22px;
    line-height: 28px;
    text-align: center;
  }

  .grid-item__desc {
    text-align: center;
  }

  .about__cards,
  .contacts__cards {
    grid-template-columns: 1fr;
  }

  .about__title {
    font-size: 34px;
    line-height: 44px;
    font-weight: 600;
    color: var(--text-main);
  }

  .about-pd {
    padding-top: 85px;
    padding-bottom: 85px;
  }

  .about__card {
    padding: 31px;
  }

  .about__card-title {
    font-size: 28px;
    line-height: 36px;
  }

  .contacts-pd {
    padding-top: 90px;
    padding-bottom: 90px;
  }

  .contacts__form-title {
    font-size: 22px;
    line-height: 28px;
  }

  .contacts__card--right {
    padding: 43px 55px;
  }

  .contacts__form .btn {
    margin-top: 56px;
  }

  .contacts__card--left {
    padding: 31px 27px;
  }

  .contacts__card-title {
    font-size: 34px;
    line-height: 44px;
  }

  .footer__content {
    align-items: center;
  }

  .terms__hero {
    background: url(../img/terms-bg.jpg) 45.31% 21.94% / cover no-repeat, rgb(51, 51, 51);
    height: 270px;
  }

  .terms__content {
    padding: 80px 0;
  }

  .terms__title {
    font-size: 34px;
    line-height: 44px;
  }
}