.wif-main{
  padding-bottom:56px
}

.wif-hero{
  margin-bottom:18px
}

.wif-method,
.wif-source{
  margin-top:16px
}

.wif-method strong,
.wif-source strong{
  font-weight:750
}

.wif-filters{
  display:grid;
  grid-template-columns:minmax(190px,1.6fr) repeat(5,minmax(110px,.72fr)) auto;
  gap:9px;
  align-items:end;
  margin:18px 0 14px;
  padding:14px;
  border:1px solid rgba(44,62,68,.11);
  border-radius:18px;
  background:rgba(255,255,255,.83);
  box-shadow:0 8px 28px rgba(36,50,56,.045)
}

.wif-filters label{
  display:flex;
  min-width:0;
  flex-direction:column;
  gap:6px
}

.wif-filters label>span{
  padding-left:2px;
  color:#718087;
  font-size:11px;
  font-weight:750;
  letter-spacing:.02em
}

.wif-filters input,
.wif-filters select{
  width:100%;
  min-width:0;
  height:42px;
  box-sizing:border-box;
  padding:0 11px;
  border:1px solid #d8dfe1;
  border-radius:11px;
  outline:0;
  background:#fff;
  color:#253237;
  font:inherit;
  font-size:13px
}

.wif-filters input:focus,
.wif-filters select:focus{
  border-color:#9aa9ae;
  box-shadow:0 0 0 3px rgba(92,109,115,.08)
}

.wif-filters button{
  height:42px;
  padding:0 16px;
  border:0;
  border-radius:11px;
  background:#3f5057;
  color:#fff;
  font:inherit;
  font-size:13px;
  font-weight:750;
  cursor:pointer
}

.wif-result-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:14px;
  margin:10px 2px 12px
}

.wif-result-head>div{
  display:flex;
  align-items:baseline;
  gap:7px
}

.wif-result-head span{
  color:#89969b;
  font-size:10px;
  font-weight:800;
  letter-spacing:.09em
}

.wif-result-head strong{
  color:#233137;
  font-size:22px
}

.wif-result-head em{
  color:#75838a;
  font-size:12px;
  font-style:normal
}

.wif-result-head>a{
  color:#56686f;
  font-size:12px;
  font-weight:700;
  text-decoration:none
}

.wif-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px
}

.wif-card{
  overflow:hidden;
  border:1px solid rgba(44,62,68,.11);
  border-radius:19px;
  background:#fff;
  box-shadow:0 8px 28px rgba(35,49,54,.045)
}

.wif-card>header{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  padding:17px 18px 13px
}

.wif-card>header>div{
  min-width:0
}

.wif-card h2{
  margin:5px 0 3px;
  color:#243238;
  font-size:19px;
  line-height:1.18
}

.wif-card header p{
  margin:0;
  color:#77858b;
  font-size:12px
}

.wif-band{
  display:block;
  color:#708087;
  font-size:10px;
  font-weight:800;
  letter-spacing:.065em
}

.wif-qn{
  flex:0 0 auto;
  padding:7px 9px;
  border-radius:10px;
  background:#eef2f3;
  color:#35464d;
  font-size:12px;
  white-space:nowrap
}

.wif-stats{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  border-top:1px solid #edf0f1;
  border-bottom:1px solid #edf0f1
}

.wif-stats>span{
  padding:11px 12px;
  border-right:1px solid #edf0f1
}

.wif-stats>span:last-child{
  border-right:0
}

.wif-stats small,
.wif-qn-grid small,
.wif-card footer small{
  display:block;
  margin-bottom:3px;
  color:#879399;
  font-size:10px
}

.wif-stats b{
  color:#334249;
  font-size:14px
}

.wif-qn-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:7px;
  padding:12px 18px
}

.wif-qn-grid>span{
  padding:8px 9px;
  border-radius:10px;
  background:#f5f7f7
}

.wif-qn-grid b{
  color:#35464c;
  font-size:13px
}

.wif-card>footer{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:12px;
  padding:12px 18px 15px;
  border-top:1px solid #f0f2f3
}

.wif-card footer b{
  display:block;
  color:#34454b;
  font-size:12px
}

.wif-card footer em{
  display:block;
  margin-top:2px;
  color:#859197;
  font-size:11px;
  font-style:normal
}

.wif-phase-label{
  flex:0 0 auto;
  color:#697980;
  font-size:11px;
  font-weight:700
}

@media(max-width:1080px){
  .wif-filters{
    grid-template-columns:repeat(3,minmax(0,1fr))
  }

  .wif-filters button{
    width:100%
  }
}

@media(max-width:760px){
  .wif-grid{
    grid-template-columns:1fr
  }

  .wif-filters{
    grid-template-columns:repeat(2,minmax(0,1fr));
    padding:11px;
    border-radius:15px
  }

  .wif-filters label:first-child{
    grid-column:1/-1
  }

  .wif-filters button{
    grid-column:1/-1
  }

  .wif-card>header{
    padding:15px 14px 12px
  }

  .wif-card h2{
    font-size:17px
  }

  .wif-stats>span{
    padding:10px 8px
  }

  .wif-qn-grid{
    padding:10px 14px
  }

  .wif-card>footer{
    padding:11px 14px 14px
  }
}

@media(max-width:430px){
  .wif-filters{
    grid-template-columns:1fr 1fr;
    gap:8px
  }

  .wif-stats{
    grid-template-columns:repeat(2,1fr)
  }

  .wif-stats>span:nth-child(2){
    border-right:0
  }

  .wif-stats>span:nth-child(-n+2){
    border-bottom:1px solid #edf0f1
  }

  .wif-qn-grid{
    grid-template-columns:repeat(2,1fr)
  }

  .wif-card>footer{
    align-items:flex-start;
    flex-direction:column
  }

  .wif-result-head{
    align-items:flex-start;
    flex-direction:column
  }
}


.wif-card-links{
  display:flex;
  align-items:flex-end;
  flex-direction:column;
  gap:5px
}

.wif-detail-link{
  color:#4e626a;
  font-size:11px;
  font-weight:750;
  text-decoration:none
}

.wif-detail-link:hover{
  text-decoration:underline
}

@media(max-width:430px){
  .wif-card-links{
    align-items:flex-start
  }
}
