@import settings.sass
  
header
  background: $white
  box-shadow: 0px 5px 20px rgba(0, 56, 79, 0.07)
  padding: 20px 0
  position: relative
  +resp(md)
    padding: 15px 0
    position: sticky
    top: 0
    z-index: 2
  +resp(esm)
    padding: 10px 0

  div.header__inner
    display: flex
    justify-content: space-between
    +resp(sm)
      align-items: center
    
    div.header__logo-side
      display: flex
      align-items: center
      a.header__logo
        display: inherit
        margin-right: 30px
        +resp(lg)
          margin-right: 16px
      div.header__text
        font-weight: 500
        font-size: 16px
        line-height: 25px
        +resp(sm)
          display: none
        p
          font-size: 16px
          color: #ACACAD
          text-align: left
          +resp(md)
            display: none

    div.header__links-side
      display: grid
      grid-template-columns: 1fr auto auto auto
      grid-gap: 31px
      justify-items: center
      align-items: center
      +resp(lg)
        grid-gap: 20px
        text-align: center
      +resp(sm)
        display: none
      a
        font-weight: 600
        font-size: 15px
        line-height: 14px
        text-transform: uppercase
        text-decoration: none
        color: $black
        transition: 0.3s
        +resp(lg)
          font-size: 14px
        &:hover
          color: $orange