/* Vacancies page — final composition from the approved desktop and phone boards. */
.moscow-v4.page-vacancies .jobs-hero{
  display:block;
  min-height:356px;
  padding:66px 52px 30px;
}
.moscow-v4.page-vacancies .jobs-hero h1{
  max-width:54%;
  margin:17px 0 20px;
  font-size:clamp(58px,5.6vw,78px);
}
.moscow-v4.page-vacancies .jobs-hero-copy{
  max-width:54%;
  margin:0;
  text-align:left;
}
.moscow-v4.page-vacancies .jobs-hero-copy p{
  color:#c7cdca;
  font-size:14px;
  line-height:1.5;
}
.moscow-v4.page-vacancies .jobs-hero-copy p+p{margin-top:9px}
.moscow-v4.page-vacancies .jobs-hero::after{
  right:4.5%;
  top:12%;
  width:40%;
  height:75%;
  border-color:rgba(255,255,255,.2);
  background:linear-gradient(145deg,rgba(255,255,255,.075),rgba(141,240,199,.025));
  box-shadow:26px 22px 0 rgba(141,240,199,.08);
  transform:rotate(2deg);
}
.moscow-v4.page-vacancies .jobs-hero-card{
  position:absolute;
  z-index:3;
  right:9.5%;
  top:19%;
  display:flex;
  width:30%;
  height:61%;
  padding:38px 42px 27px;
  align-items:flex-start;
  justify-content:space-between;
  flex-direction:column;
  border:1px solid rgba(255,255,255,.18);
  border-radius:10px;
  color:#d4dad7;
  background:linear-gradient(150deg,rgba(40,44,43,.9),rgba(24,28,27,.72));
  box-shadow:16px 18px 0 rgba(141,240,199,.055);
  transform:rotate(-1.2deg);
}
.moscow-v4.page-vacancies .jobs-hero-card span{
  font-size:17px;
  font-weight:650;
  line-height:1.38;
}
.moscow-v4.page-vacancies .jobs-hero-card i{
  display:grid;
  width:42px;
  height:42px;
  place-items:center;
  align-self:flex-end;
  border:1px solid rgba(141,240,199,.4);
  border-radius:50%;
  color:#8df0c7;
  font-size:20px;
  font-style:normal;
}

.moscow-v4.page-vacancies .jobs-spontaneous{
  min-height:252px;
  padding:36px 52px!important;
  align-items:stretch;
}
.moscow-v4.page-vacancies .jobs-spontaneous>div:last-child{
  display:flex;
  min-height:100%;
  align-items:flex-start;
  flex-direction:column;
}
.moscow-v4.page-vacancies .jobs-spontaneous>div:last-child .button{
  min-width:172px;
  min-height:50px;
  margin-top:24px;
  color:#102019;
  background:#8df0c7;
}

@media(max-width:700px){
  .moscow-v4.page-vacancies .jobs-hero{
    display:flex;
    min-height:0;
    padding:45px 14px 11px!important;
    align-content:initial;
    flex-direction:column;
  }
  .moscow-v4.page-vacancies .jobs-hero .vacancy-breadcrumbs{
    top:14px;
    left:14px;
    gap:6px;
    font-size:7px;
  }
  .moscow-v4.page-vacancies .jobs-hero h1{
    max-width:none;
    margin:7px 0 7px;
    font-size:32px;
    line-height:.96;
  }
  .moscow-v4.page-vacancies .jobs-hero-copy{
    max-width:none;
    margin:0;
  }
  .moscow-v4.page-vacancies .jobs-hero-copy p{
    max-width:285px;
    color:#d0d5d3;
    font-size:8px;
    line-height:1.3;
  }
  .moscow-v4.page-vacancies .jobs-hero-copy p+p{margin-top:6px}
  .moscow-v4.page-vacancies .jobs-hero::after{
    top:auto;
    right:8px;
    bottom:7px;
    width:53%;
    height:108px;
    border-radius:7px;
    box-shadow:10px 9px 0 rgba(141,240,199,.1);
    transform:rotate(2.5deg);
  }
  .moscow-v4.page-vacancies .jobs-hero-card{
    position:relative;
    right:auto;
    top:auto;
    width:53%;
    height:106px;
    margin:9px 3px 0 auto;
    padding:17px 14px 11px;
    border-radius:7px;
    box-shadow:8px 8px 0 rgba(141,240,199,.055);
    transform:rotate(-2deg);
  }
  .moscow-v4.page-vacancies .jobs-hero-card span{
    font-size:8px;
    line-height:1.28;
  }
  .moscow-v4.page-vacancies .jobs-hero-card i{
    width:27px;
    height:27px;
    font-size:13px;
  }

  .moscow-v4.page-vacancies .jobs-inside{
    margin:8px 0;
    padding:17px 12px!important;
    border:0;
    border-radius:12px;
    background:linear-gradient(145deg,#f2faf6,#eef7f2);
  }
  .moscow-v4.page-vacancies .jobs-inside .jobs-section-head{margin-bottom:13px}
  .moscow-v4.page-vacancies .jobs-inside .jobs-section-head .kicker{font-size:8px}
  .moscow-v4.page-vacancies .jobs-inside .jobs-section-head h2{
    margin-top:7px;
    font-size:27px;
    line-height:1.02;
    overflow-wrap:normal;
  }
  .moscow-v4.page-vacancies .jobs-inside .jobs-section-head>p{
    margin-top:10px;
    color:#747b78;
    font-size:11px;
    line-height:1.38;
  }
  .moscow-v4.page-vacancies .jobs-inside-grid{
    display:grid;
    width:100%;
    grid-template-columns:1fr!important;
    gap:6px;
    border:0;
  }
  .moscow-v4.page-vacancies .jobs-inside-grid article{
    display:grid;
    min-width:0;
    min-height:76px;
    grid-template-columns:48px minmax(0,1fr) 24px;
    grid-template-rows:auto auto;
    column-gap:10px;
    padding:10px 34px 10px 64px!important;
    border:1px solid rgba(70,110,92,.08);
    border-radius:9px;
    background:rgba(255,255,255,.92);
    box-shadow:0 5px 18px rgba(33,70,54,.035);
    overflow:visible;
  }
  .moscow-v4.page-vacancies .jobs-inside-grid article::before{
    left:10px;
    top:50%;
    width:43px;
    height:43px;
    border-radius:50%;
    background-color:#e2f7ed;
    background-size:23px 23px;
    transform:translateY(-50%);
  }
  .moscow-v4.page-vacancies .jobs-inside-grid b{
    position:absolute;
    top:11px;
    right:11px;
    margin:0;
    color:#28936d;
    font-size:9px;
  }
  .moscow-v4.page-vacancies .jobs-inside-grid h3{
    grid-column:2;
    grid-row:1;
    margin:0;
    font-size:14px;
    line-height:1.08;
    overflow-wrap:normal!important;
    word-break:normal;
    hyphens:none;
  }
  .moscow-v4.page-vacancies .jobs-inside-grid p{
    grid-column:2 / 4;
    grid-row:2;
    margin:4px 0 0;
    color:#6f7773;
    font-size:8px;
    line-height:1.28;
    overflow-wrap:normal!important;
    word-break:normal;
  }

  .moscow-v4.page-vacancies .jobs-spontaneous{
    position:relative;
    display:block;
    min-height:248px;
    margin:8px 0 0;
    padding:18px!important;
    border-radius:10px;
    background-color:#111516;
    background-image:linear-gradient(145deg,rgba(141,240,199,.055),transparent 48%);
    overflow:hidden;
  }
  .moscow-v4.page-vacancies .jobs-spontaneous::after{
    content:"";
    position:absolute;
    right:-45px;
    top:47px;
    width:180px;
    height:180px;
    border:1px solid rgba(141,240,199,.07);
    border-radius:28px;
    box-shadow:0 0 0 36px rgba(141,240,199,.025),0 0 0 72px rgba(141,240,199,.015);
    transform:rotate(34deg);
  }
  .moscow-v4.page-vacancies .jobs-spontaneous>div{
    position:relative;
    z-index:1;
  }
  .moscow-v4.page-vacancies .jobs-spontaneous .kicker{font-size:7px}
  .moscow-v4.page-vacancies .jobs-spontaneous h2{
    max-width:280px;
    margin-top:8px;
    font-size:30px;
    line-height:.98;
    overflow-wrap:normal;
  }
  .moscow-v4.page-vacancies .jobs-spontaneous>div:last-child{
    display:flex;
    min-height:0;
    align-items:flex-start;
    flex-direction:column;
  }
  .moscow-v4.page-vacancies .jobs-spontaneous p{
    max-width:285px;
    margin:14px 0 0;
    color:#d0d5d3;
    font-size:10px;
    line-height:1.34;
  }
  .moscow-v4.page-vacancies .jobs-spontaneous>div:last-child .button{
    width:174px;
    min-width:0;
    min-height:42px;
    margin-top:15px;
    padding:0 16px;
    justify-content:space-between;
    color:#102019;
    background:#8df0c7;
  }
  .moscow-v4.page-vacancies .jobs-spontaneous .button::after{
    content:"→";
    margin-left:13px;
    font-size:14px;
  }
}
