@media (max-width: 600px) {
  .container {
    padding: 0 20px;
    background-image: url("../img/fon_mob.png");
  }

  .header {
    min-height: 900px; 
    overflow: visible;
  }

  .header-row {
    display: grid;
    grid-template-areas:
      "logo"
      "title"
      "subtitle"
      "phone"
      "actions";
    row-gap: 16px;
    justify-items: center;
    position: relative;
  }

  .header-img {
    float: none;
    margin: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    justify-self: center;
    grid-area: phone;
    position: relative;
    z-index: 1; 
  }

  .header-img picture,
  .header-img img {
    position: relative;
    z-index: 1;
  }

  .header-img img {
    max-width: 100%;
    height: auto;
    display: block;
    margin: 0 auto;
  }

  .header-content {
    margin-left: 0;
    max-width: 100%;
    text-align: center;
    display: contents; 
  }


  .header-content > img:first-child {
    grid-area: logo;
  }

  .header-content > .header-heading { 
    grid-area: title;
  }

  .header-content > p { 
    grid-area: subtitle;
  }

  .buttons {
    width: max-content;
    position: absolute;
    top: 814px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 5; 
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
  }
}