/*!**************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[0].use[1]!./node_modules/sass-loader/dist/cjs.js!./assets/scss/theme/templates/page-specyfication.scss ***!
  \**************************************************************************************************************************************************************************/
/**
 * Keep from smallest to biggest, each value is min px breakpoint
 * - by this breakpoints most of utility classes will be generated, also it will
 */
/**
 * Keep from smallest to biggest
 * scaling value should be calculated of (current break point min / next breakpoint min)
 */
/** 
 * use dynamic assign by breakpoints or assign your custom map of 
 */
/**
 * Bootstrap like
 */
/**
 * Tailwind like
 */
/**
 * Custom by project
 */
/**
 * Directions will be prefixed
 * so if prefix is "m" and providing "t" for top will be mt
 * allowed directions are:
 * ~ t -> top
 * ~ r -> right
 * ~ b -> bottom
 * ~ l -> left
 * ~ x -> left and right
 * ~ y -> top and bottom
 */
/**
 * Gutters value should be keept as an number cause it will be wrapped in val function for negative margins
 */
/**
 * Columns values should contain unit if needed wrap in val to use native calculations
 * - those values are are used for offset
 */
/* EXAMPLE */
/* Font_directory:
 * (
		'class-name-for-family':
 * 		(
 * 			'src': FontFileName.extension, // or map like (FontFileName.extension, FontFileName2.otherExtension)
 * 			'sans-serif': false, //added by default can be disabled
 * 			'params':
 * 			(
 * 				'font-weight': 400,
 * 				'font-style': 'italic',
 * 				'font-stretch': 'condensed',
 * 			)
 * 		)
 * )
 */
/**
 * Pass single numeric value or map with named breakpoints: numeric value
 *
 * If map provided then can be specified default (as "default" or "value" key: numeric value
 */
.spec {
  padding: 123rem 409rem 62rem 129rem;
}
@media (max-width: 991.98px) {
  .spec {
    padding: 233rem 27rem 171rem 27rem;
  }
}
.spec__fixedtop {
  position: fixed;
  top: 0rem;
  left: 0rem;
  right: 0rem;
  padding: 59rem 409rem 29rem 129rem;
  background-color: #ffffff;
  z-index: 1;
}
@media (max-width: 991.98px) {
  .spec__fixedtop {
    padding: 63rem 27rem 29rem 27rem;
  }
  .spec__fixedtop--smallptmobile {
    padding: 23rem 27rem 29rem 27rem;
  }
}
* + .spec__head {
  margin-top: 51.2rem;
}
@media (max-width: 991.98px) {
  * + .spec__head {
    margin-top: 21.2rem;
  }
}
.spec__head {
  width: 100%;
  display: flex;
  justify-content: space-between;
  position: relative;
}
.spec__head__left {
  flex-shrink: 0;
}
.spec__head__right {
  margin-top: auto;
}
@media (max-width: 991.98px) {
  .spec__head__right {
    position: absolute;
    bottom: 0rem;
    right: 0rem;
  }
}
.spec__head__title {
  font-size: 34rem;
  line-height: 54rem;
  letter-spacing: 0.018em;
  font-family: "GEELY", Arial, Helvetica, sans-serif;
  color: #000000;
}
@media (max-width: 991.98px) {
  .spec__head__title {
    font-size: 18rem;
    line-height: 28rem;
    letter-spacing: 0.02em;
  }
}
* + .spec__head__params {
  margin-top: 4rem;
}
.spec__head__params {
  font-size: 14rem;
  line-height: 28rem;
  letter-spacing: 0.02em;
  color: #000000;
}
@media (max-width: 991.98px) {
  .spec__head__params {
    font-size: 10rem;
    line-height: 28rem;
    letter-spacing: -0.015em;
    display: flex;
    flex-direction: column;
  }
}
@media (max-width: 991.98px) {
  .spec__head__params__all {
    display: none;
  }
}
* + .spec__head__params__item {
  margin-top: 9rem;
}
.spec__head__params__item {
  display: none;
}
@media (max-width: 991.98px) {
  .spec__head__params__item {
    display: inline-block;
    width: 139rem;
    padding: 10rem 12rem;
    background-color: #ffffff;
    border-radius: 10rem;
    box-shadow: 0rem 2rem 48rem rgba(0, 0, 0, 0.04);
    font-size: 10rem;
    line-height: 15rem;
    letter-spacing: -0.015em;
    color: #000000;
  }
}
.spec__head__headings {
  display: flex;
  gap: 105rem;
}
@media (max-width: 991.98px) {
  .spec__head__headings {
    gap: 5rem;
  }
}
@media (max-width: 575.98px) {
  .spec__head__headings {
    gap: 2rem;
  }
}
.spec__head__headings__text {
  min-width: 204rem;
  padding: 16rem 32rem;
  font-size: 13rem;
  line-height: 20rem;
  letter-spacing: 0.18em;
  color: #ffffff;
  background-color: #3a7ff8;
  font-weight: 700;
  font-family: "GEELY", Arial, Helvetica, sans-serif;
  border-radius: 10rem;
  box-shadow: 3.47rem 19.7rem 30rem rgba(58, 127, 248, 0.19);
  border: 1px solid transparent;
  cursor: pointer;
  transition: background-color 0.2s linear, color 0.2s linear, border-color 0.2s linear;
}
.spec__head__headings__text.active {
  background-color: transparent;
  color: #3a7ff8;
  border: 1px solid #3a7ff8;
}
@media (max-width: 991.98px) {
  .spec__head__headings__text {
    min-width: auto;
    min-height: 35rem;
    padding: 12rem 20rem;
    font-size: 16rem;
    line-height: 22rem;
    letter-spacing: 0em;
  }
}
@media (max-width: 575.98px) {
  .spec__head__headings__text {
    min-width: auto;
    min-height: auto;
    padding: 4rem 6rem;
    font-size: 7rem;
    line-height: 9rem;
    letter-spacing: 0em;
  }
}
* + .spec__table {
  margin-top: 137rem;
}
@media (max-width: 991.98px) {
  * + .spec__table {
    margin-top: 42rem;
  }
}
.spec__table {
  margin-left: auto;
  width: 1102rem;
}
@media (max-width: 991.98px) {
  .spec__table {
    width: auto;
  }
}
* + .spec__table__group {
  margin-top: 54rem;
}
@media (max-width: 991.98px) {
  * + .spec__table__group {
    margin-top: 39rem;
  }
}
.spec__table__group__title {
  font-size: 16rem;
  line-height: 25rem;
  letter-spacing: 0.05em;
  color: #000000;
  font-family: "GEELY", Arial, Helvetica, sans-serif;
  padding-right: 14rem;
}
@media (max-width: 991.98px) {
  .spec__table__group__title {
    font-size: 14rem;
    line-height: 19rem;
    letter-spacing: 0.05em;
  }
}
@media (max-width: 991.98px) {
  * + .spec__table__group__items {
    margin-top: 3rem;
  }
}
.spec__table__group__items {
  padding-right: 14rem;
  padding-left: 14rem;
  border-radius: 8rem;
  background-color: #ffffff;
  box-shadow: 0rem 2rem 48rem rgba(0, 0, 0, 0.04);
  padding: 6rem 9rem;
}
@media (max-width: 991.98px) {
  .spec__table__group__items {
    padding: 3rem 4rem;
  }
}
.spec__table__group__item {
  display: flex;
  justify-content: space-between;
  border-radius: 6rem;
  background-color: #ffffff;
  padding: 5rem 0rem 5rem 14rem;
  font-size: 14rem;
  line-height: 28rem;
  letter-spacing: 0.03em;
  color: #000000;
  font-weight: 700;
}
@media (max-width: 991.98px) {
  .spec__table__group__item {
    padding: 5rem 0rem 5rem 8rem;
    font-size: 10rem;
    line-height: 28rem;
    letter-spacing: -0.015em;
    color: #000000;
  }
}
.spec__table__group__item:nth-child(2n-1) {
  background-color: rgba(135, 175, 224, 0.14);
}
.spec__table__group__item__values {
  width: 44.827%;
  display: flex;
  justify-content: space-between;
  flex-shrink: 0;
}
@media (max-width: 991.98px) {
  .spec__table__group__item__values {
    width: 47.63%;
  }
}
@media (max-width: 991.98px) {
  .spec__table__group__item__values--text {
    width: 30.1%;
  }
}
.spec__table__group__item__values--center {
  justify-content: center;
}
.spec__table__group__item__values--center .spec__table__group__item__value {
  width: 100%;
}
@media (max-width: 991.98px) {
  .spec__table__group__item__values--separatoronmobile .spec__table__group__item__value:nth-child(2n)::before {
    content: "";
    display: block;
    width: 1px;
    height: calc(100% + 10rem);
    background-color: #3a7ff8;
    position: absolute;
    top: 50%;
    left: 0%;
    transform: translateY(-50%);
  }
}
@media (max-width: 991.98px) {
  .spec__table__group__item__values--checkbox {
    width: 18.63%;
  }
}
.spec__table__group__item__values--checkbox .spec__table__group__item__value:nth-child(2n)::before {
  display: none;
}
.spec__table__group__item__value {
  width: 50%;
  text-align: center;
  flex-shrink: 0;
  position: relative;
}
.spec__table__group__item__value--checkbox {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
}
.spec__table__group__item__value__checkbox {
  width: 10rem;
  height: 10rem;
  border-radius: 9999px;
  border: 1.6px solid #3a7ff8;
  flex-shrink: 0;
}
@media (max-width: 991.98px) {
  .spec__table__group__item__value__checkbox {
    width: 8px;
    height: 8px;
  }
}
.spec__table__group__item__value__checkbox--fill {
  background-color: #3a7ff8;
}
* + .spec__buttons {
  margin-top: 71rem;
}
@media (max-width: 991.98px) {
  * + .spec__buttons {
    margin-top: 76rem;
  }
}
.spec__buttons {
  display: flex;
  align-items: center;
  gap: 14rem 60rem;
}
@media (max-width: 991.98px) {
  .spec__buttons {
    flex-direction: column;
    align-items: flex-start;
  }
}
.spec__buttons__main {
  display: flex;
  align-items: center;
  gap: 14rem;
}
@media (max-width: 991.98px) {
  .spec__buttons__main {
    width: 100%;
    flex-direction: column;
    align-items: flex-start;
  }
  .spec__buttons__main .button-new {
    width: 100%;
  }
}
.spec__buttons__utility {
  display: flex;
  gap: 14rem;
}
@media (max-width: 991.98px) {
  .spec__buttons__utility {
    gap: 12rem;
    justify-content: space-between;
  }
}
* + .spec__monit {
  margin-top: 190rem;
}
@media (max-width: 991.98px) {
  * + .spec__monit {
    margin-top: 33rem;
  }
}
.spec__monit {
  font-size: 9rem;
  line-height: 14rem;
  letter-spacing: 0em;
  color: #000000;
}
@media (max-width: 991.98px) {
  .spec__monit {
    font-size: 8rem;
    line-height: 12rem;
    letter-spacing: -0.005em;
  }
}