// ==============================================
// 💪 HOME PAGE SCSS
// ==============================================

.sec-banner{
  position: relative;
  padding: 219px 0 254px;
  background-size: cover!important;
  @media screen and (max-width: 991px) and (min-width: 768px) {
    padding: 150px 0 245px;
  }
  @media screen and (max-width: $screen-xs) {
    padding: 116px 0 361px;
  }
  .content-wrapper{
    max-width: 631px;
    h1{
      //line-height: 60px;
      color: $primary-01;
      font-family: $font-berlingske;
      margin-bottom: 0;
    }
    h3{
      font-weight: 400;
    }
  }
}

.sec-search-box{
  margin: -134px 0 0 -32px;
  //padding-bottom: 90px;
  position: relative;
  z-index: 1;
  @media screen and (max-width: 1199px) and (min-width: 768px) {
    margin: -134px 0 0 0;
  }
  @media screen and (max-width: $screen-xs) {
    margin: -59px 0 0 0;
  }
  .container{
    padding: 0;
    @media screen and (max-width: 1199px) and (min-width: 768px) {
      padding: 0 24px;
    }
  }

  .primary-tab-1{
    max-width: 922px;
    .tab-content{
      padding: 24px 32px;
      @media screen and (max-width: $screen-xs) {
        padding: 24px 8px 12px 16px;
      }
      .tab-pane{

      }
    }
  }
}

.sec-growth-boost{
  padding: 129px 0 123px;
  @media screen and (max-width: 1199px) and (min-width: 992px) {
    padding: 100px 0;
  }
  @media screen and (max-width: 991px) and (min-width: 768px) {
    padding: 80px 0 70px;
  }
  @media screen and (max-width: $screen-xs) {
    padding: 75px 0 47px;
  }
  .container{
    >h2{
      margin-bottom: 80px;
      @media screen and (max-width: $screen-xs) {
        margin-bottom: 60px;
      }
    }
  }
  ul.btn-list{
    li{
      display: inline-block;
      @media screen and (max-width: 991px) {
        display: block;
      }
      &:not(:last-of-type){
        margin: 0 24px 0 0;
        @media screen and (max-width: 991px) {
          margin: 0 0 12px;
        }
      }
      .btn-style{
        @media screen and (max-width: 991px) {
          min-width: 100%;
        }
      }
    }
  }
}

.sec-talents-specialist{
  padding: 75px 0 60px;
  overflow: hidden;
  @media screen and (max-width: $screen-xs) {
    padding: 47px 0 30px;
  }
  .container{
    >h2{
      margin-bottom: 80px;
      @media screen and (max-width: $screen-xs) {
        margin-bottom: 50px;
      }
    }
  }
  .primary-tab-2{

  }
  .nav-tabs{
    margin-bottom: 48px;
  }
  .tab-content{
    .tab-pane{
      .specialist-card{
        .video-card-01{
          @media screen and (max-width: 991px) {
            margin-bottom: 24px;
          }
          .video-wrapper{
            video{
              width: 100%;
              height: 369px;
              @media screen and (max-width: $screen-xs) {
                height: 192px;
              }
            }
          }
        }
        .img-wrapper{
          @media screen and (max-width: 991px) {
            margin-bottom: 32px;
          }
          img{
            width: 100%;
          }
        }
        .content-wrapper{
          &.p-lr-24{
            padding: 0 24px;
            @media screen and (max-width: $screen-xs) {
              padding: 0;
            }
          }
          >p{
            margin-bottom: 0;
          }
          .position-wrapper{
            margin-top: 48px;
            @media screen and (max-width: $screen-xs) {
              margin-top: 32px;
            }
            >p{
              margin-bottom: 20px;
            }
          }
        }
      }
    }
  }
  .btn-wrapper{
    .btn-style{
      @media screen and (max-width: $screen-xs) {
        min-width: 100%;
      }
    }
  }
}

.sec-candidates{
  padding: 60px 0 0;
  @media screen and (max-width: $screen-xs) {
    padding: 30px 0 40px;
  }
  ul.arrow-list{
    text-align: right;
    li{
      display: inline-block;
      vertical-align: middle;
      &:not(:last-of-type){
        margin: 0 40px 0 0;
      }
      a{
        img{
          min-width: 18px;
        }
        &.swiper-button-disabled{
          pointer-events: none;
          img{
            filter: brightness(0) saturate(100%) invert(68%) sepia(30%) saturate(0%) hue-rotate(147deg) brightness(101%) contrast(102%);
          }
        }
      }
    }
  }
  .candidates-header{
    h2{
      margin-bottom: 0;
    }
    ul.arrow-list{
      @media screen and (max-width: $screen-xs) {
        display: none;
      }
    }
  }
  .swiper-container{
    max-width: 1140px;
    min-width: calc((100vw - 1140px) / 2 + 1163px);
    margin: 0 0 0 auto;
    @media screen and (max-width: 1199px) {
      min-width: auto;
    }
    .swiper{
      padding: 70px 0 70px 45px;
      @media screen and (max-width: $screen-xs) {
        padding: 60px 0 52px 24px;
      }
    }
  }
  .slider-navigation{
    ul.arrow-list{
      padding-left: 44px;
      text-align: left;
    }
  }
}

.sec-our-brands{
  padding: 60px 0 75px;
  @media screen and (max-width: $screen-xs) {
    padding: 40px 0 60px;
  }
  .title{
    text-align: center;
    margin-bottom: 48px;
  }
  ul.brand-list-01{
    li{
      &:last-of-type{
        display: none;
      }
    }
  }
}

.sec-market-people{
  padding: 155px 0 150px;
  @media screen and (max-width: 1199px) and (min-width: 768px) {
    padding: 80px 0;
  }
  @media screen and (max-width: $screen-xs) {
    padding: 48px 0 60px;
  }
  .market-content{
    max-width: 849px;
    h1{

    }
    p{
      margin-bottom: 0;
    }
  }
}

.sec-breadcrumb{
  .container{
    padding: 0;
  }
}