/* body{
  font-family: 'Inter', sans-serif;
} */
._section_calculator{
  max-width: 1350px;
  margin: auto;
  color: #1d253d;
  padding:60px 20px 30px;
}
._h2{
  font-size: 45px;
  font-weight: 700;
  text-align: center;
  max-width: 590px;
  margin: auto;
  color: #1d253d;
  margin-bottom: 25px;
  line-height: 1.3;
}
._h2 span{
  color:#0171f6;
}
._p{
  font-size: 18px;
  max-width: 634px;
  margin: auto;
  text-align: center;
  color: #1d253d;
  font-weight: 400;
}
._container_calculator{
  background: #f1f7ff;
  padding: 80px 50px 80px 80px;
  border-radius: 25px;
  margin-top: 50px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  column-gap: 20px;
}
._rangers{
  width: 60%
}
._label{
  font-weight: 600;
  font-size: 22px;
  color: #1e253d;
}


._range_value {
  font-size: 22px;
  font-weight: 600;
  color: #0070f6;
  display: inline-block;
  width: 100px;
  margin-left: 20px;
}
._result_desc{
  font-size: 26px;
  font-weight: 600;
  color: #1d263e;
  max-width: 370px;
  text-align: center;
  width: 370px;
  padding: 20px 28px;
  line-height: 1.3;
}
#value_result{
  font-size: 50px;
  font-weight: 600;
  letter-spacing: -2px;
  padding: 25px;
  border: 3px solid #0071f6;
  color: #0071f6;
  border-radius: 15px;
  background: white;
  display: inline-block;
  width: 370px;
  text-align: center;
}
._range_sec{
  display: flex;
  align-items: center;
}
._results{
  text-align: center;
}

.c_slide {
  --k: calc((var(--val) - var(--min))/
    (var(--max) - var(--min)));
  --pos: calc(1.125em + var(--k)*(100% - 2.25em));
  grid-gap: 0.25em;
  place-self: center;
  width: 100%;
  display: inline-grid;
  max-width: 540px;
  margin: 35px 0;
}
}
.c_slide:focus-within, .c_slide:hover {
  --hl: 1 ;
}

._section_calculator input[type=range] {
  border-radius: 2.25em;
  cursor: pointer;
}
._section_calculator input[type=range], ._section_calculator input[type=range]::-webkit-slider-runnable-track, ._section_calculator input[type=range]::-webkit-slider-thumb {
  -webkit-appearance: none;
}

._section_calculator input[type=range]::-webkit-slider-container {
  -webkit-user-modify: read-write !important;
  height: 18px;
  border-radius: 0.75em;
  background: linear-gradient(#0171f6, #0171f6) 0/var(--pos) no-repeat, linear-gradient(#fff, #fff);
  box-shadow: 0 2px 0px 2px black;
  -webkit-box-shadow: 0px 6px 9px 3px rgba(0,0,0,0.1);
  box-shadow: 0px 5px 15px 0px rgb(10 11 11 / 9%);
}
._section_calculator input[type=range]::-webkit-slider-runnable-track {
  margin: -0.375em;
}
._section_calculator input[type=range]::-moz-range-track {
  margin: 0.375em;
  height: 18px;
  border-radius: 0.75em;
  background: linear-gradient(#0171f6, #0171f6) 0/var(--pos) no-repeat, linear-gradient(#fff, #fff);
}
._section_calculator input[type=range]::-webkit-slider-thumb {
  border: 4px solid #0171f5;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: #ffffff;
}
._section_calculator input[type=range]::-moz-range-thumb {
  border: 4px solid #0171f5;
  width: 38px;
  height:38px;
  border-radius: 50%;
  background: #ffffff;
}
._section_calculator input[type=range]:focus {
  outline: none;
}

@media screen and (max-width: 992px){
  ._h2 {
    font-size: 40px;
    max-width: 500px;
  }
  ._p {
    font-size: 19px;
    max-width: 700px;
  }
  #value_result {
    font-size: 40px;
    padding: 20px;
    width: 280px;
  }
  ._result_desc {
    font-size: 20px;
    max-width: 370px;
    width: auto;
  }
  ._container_calculator {
    padding: 60px 40px 60px 60px;
    margin: 30px 20px;
  }
}
@media screen and (max-width: 776px){
  ._container_calculator {
    padding: 20px 15px;
    display: flex;
    flex-direction: column;
  }
  ._rangers {
    width: 100%;
  }
  ._p {
    font-size: 17px;
    padding: 20px;
  }
  ._h2 {
    font-size: 28px;
    font-weight: 600;
    max-width: 345px;
  }
  #value_result {
    font-size: 30px;
    width: auto;
    min-width: 200px;
  }
  ._result_desc {
    font-size: 20px;
    max-width: none;
    width: auto;
    padding: 20px 0;
  }
  ._label {
    font-size: 16px;
  }
  ._range_value {
    font-size: 16px;
    width: 90px;
    margin-left: 15px;
  }
  ._section_calculator input[type=range]::-webkit-slider-container {
    height: 12px;
  }
  ._section_calculator input[type=range]::-moz-range-track {
    height: 12px;
  }
  ._section_calculator input[type=range]::-webkit-slider-thumb {
    width: 26px;
    height: 26px;
  }
  ._section_calculator input[type=range]::-moz-range-thumb {
    width: 26px;
    height: 26px;
  }
  .c_slide {
    margin: 30px 0;
  }
}