@import url('https://fonts.googleapis.com/css2?family=Raleway:ital,wght@0,400;0,600;0,900;1,400;1,700&display=swap');

:root {
   --text-color: #fff;
   --header-color: #fff;
   --header-background-color: #111111;
   --background-color: #111111;
   --rgba-06: rgba(0, 0, 0, .6);
   --products-shadow: rgba(255, 255, 255, .2);
   --app-height: 100%
}

body {
   font-family: 'Raleway', sans-serif;
   font-size: 18px;
   color: var(--text-color);
   background-color: var(--background-color);
   -webkit-tap-highlight-color: rgba(255, 255, 255, 0.2)
}

body.white {
   --text-color: #111;
   --background-color: #fff;
   --rgba-06: rgba(255, 255, 255, .6);
   --products-shadow: rgba(0, 0, 0, .2)
}

::-webkit-scrollbar {
   width: 10px;
   height: 10px
}

::-webkit-scrollbar-thumb {
   background-color: #949494;
   border-radius: 20px;
   border: 3px solid transparent
}

::-webkit-scrollbar-track {
   background: transparent
}

.container {
   max-width: 1500px;
   width: 100%;
   padding: 0px 15px;
   margin: 0 auto
}

.header {
   position: fixed;
   top: 0;
   left: 0;
   width: 100%;
   z-index: 10;
   transition: blur .4s, background-color .4s;
   color: var(--header-color)
}

.header.sticky {
   background-color: var(--rgba-06);
   backdrop-filter: blur(10px);
   --header-color: var(--text-color);
   --header-background-color: var(--background-color)
}

.header__inner {
   padding: 20px 0px;
   display: flex;
   justify-content: space-between;
   align-items: center
}

.header__inner-left {
   display: flex;
   gap: 60px
}

.header__logo-link {
   display: block;
   justify-content: center;
   align-items: center
}

.header__logo {
   max-width: 180px;
   width: 100%
}

.header__menu {
   display: flex;
   align-items: center;
   justify-content: center
}

.header__menu-list {
   display: flex;
   gap: 40px;
   align-items: center
}

.header__menu-link {
   color: inherit;
   text-decoration: none;
   font-size: 22px;
   font-weight: 600;
   position: relative
}

.header__menu-link::after {
   content: '';
   height: 2px;
   position: absolute;
   left: 0;
   bottom: -2px;
   width: 0;
   background-color: var(--header-color);
   transition: .2s
}

.header__menu-link:hover::after {
   width: 100%
}

.header__info {
   display: flex;
   gap: 20px;
   align-items: stretch
}

.header__info-link {
   color: inherit;
   font-size: 20px;
   font-weight: 600;
   display: flex;
   gap: 12px;
   text-decoration: none;
   padding: 15px 20px;
   border-radius: 40px;
   border: 2px solid var(--header-color);
   transition: .2s
}

.header__info-block {
   font-size: 20px;
   font-weight: 600;
   display: flex;
   gap: 20px;
   text-decoration: none;
   padding: 10px;
   border-radius: 40px;
   border: 2px solid var(--header-color);
   transition: .2s;
   align-items: center
}

.header__info-block-language {
   display: flex;
   align-items: center;
   flex: 0 0 auto;
   cursor: pointer;
   position: relative
}

.header__info-block-language:hover .header__info-block-language-hover {
   opacity: 1;
   pointer-events: all;
   transform: translateY(100%)
}

.header__info-block-language-img {
   max-width: 32px;
   width: 100%
}

.header__info-link:hover {
   border-radius: 0px
}

.header__info-block-language-hover {
   opacity: 0;
   pointer-events: none;
   position: absolute;
   display: flex;
   flex-direction: column;
   gap: 10px;
   width: 150px;
   bottom: -20px;
   left: -13px;
   transform: translateY(120%);
   transition: .2s
}

.header__info-block-language-hover::before {
   content: '';
   position: absolute;
   top: -30px;
   height: 30px;
   width: 100%
}

.header__info-block-language-hover-item {
   display: flex;
   gap: 10px;
   align-items: center;
   padding: 10px;
   color: inherit;
   text-decoration: none;
   border: 2px solid var(--header-color);
   background-color: var(--header-background-color);
   transition: .15s
}

.header__info-block-language-hover-item:hover {
   background-color: var(--header-color);
   color: var(--header-background-color)
}

.header__info-block-language-hover-item-img {
   max-width: 32px;
   width: 100%;
   display: block
}

.header__info-block-mode {
   display: flex;
   align-items: center;
   justify-content: center;
   font-size: 24px;
   transition: .2s;
   flex: 0 0 auto;
   width: 25px
}

.header__info-block-mode:hover {
   transform: scale(.9)
}

.header__info-block-mode.white .header__info-block-mode-sun {
   display: none
}

.header__info-block-mode.white .header__info-block-mode-moon {
   display: block
}

.header__info-block-mode .header__info-block-mode-sun {
   display: block
}

.header__info-block-mode .header__info-block-mode-moon {
   display: none
}

.intro {
   position: relative;
   overflow: hidden;
   height: 100vh;
   height: calc(var(--vh, 1vh) * 100);
   display: flex;
   align-items: center;
   justify-content: center;
   color: var(--header-color)
}

.intro.hiden {
   height: 20vh
}

.intro.hiden .intro__inner {
   display: none
}

canvas {
   background-image: url('img/bg.jpg');
   background-size: cover;
   background-repeat: no-repeat;
   background-position: center center
}

.intro__svg {
   position: absolute;
   left: 0;
   right: 0;
   bottom: 0%;
   width: 100%;
   z-index: -1
}

.intro.hiden .intro__svg {
   transform: translateY(20%)
}

.intro__inner {
   display: flex;
   align-items: center;
   justify-content: center;
   flex-direction: column
}

.intro__background {
   position: absolute;
   z-index: -1;
   left: 0;
   top: 0;
   pointer-events: none
}

.intro__title {
   font-size: 62px;
   font-weight: 900;
   text-align: center;
   margin-bottom: 40px
}

.intro__inner {
   max-width: 800px;
   width: 100%;
   margin: 0 auto
}

.intro__text {
   font-size: 20px;
   font-style: italic;
   padding: 20px 30px;
   background: var(--rgba-06);
   margin-bottom: 40px
}

.intro__btn {
   display: flex;
   gap: 15px;
   font-size: 24px;
   text-transform: uppercase;
   align-items: center;
   padding: 20px 30px;
   border: 2px solid var(--header-color);
   font-weight: 700;
   transition: .2s;
   color: inherit;
   text-decoration: none;
}

.intro__btn:hover {
   border-radius: 40px
}

.intro__span {
   margin-bottom: 10px;
   display: flex;
   gap: 10px
}

.content {
   padding: 100px 0px
}

.products__category {
   display: grid;
   grid-template-columns: 1fr 1fr 1fr;
   gap: 40px
}

.products__category-item {
   display: flex;
   align-items: center;
   justify-content: center;
   width: 100%;
   padding: 20px;
   border: 2px solid var(--text-color);
   text-align: center;
   color: inherit;
   text-decoration: none;
   transition: .2s;
   font-weight: 600
}

.products__category-item:hover {
   border-radius: 40px
}

.products {
   display: flex;
   flex-direction: column;
   gap: 80px;
   padding: 80px 0px
}

.products__section-title-link {
   text-decoration: none;
   color: inherit;
   margin-bottom: 40px;
   display: flex;
   gap: 20px;
   align-items: center;
   width: fit-content
}

.products__section-title-link:hover .products__section-title::after {
   width: 100%
}

.products__section-title-icon {
   font-size: 36px;
   padding: 15px;
   border-radius: 50%;
   border: 2px solid var(--text-color);
   max-width: 60px;
   max-height: 60px;
   width: 100%;
   height: 100%;
   display: flex;
   align-items: center;
   justify-content: center
}

.products__section-title {
   font-size: 36px;
   text-transform: uppercase;
   font-weight: 600;
   position: relative
}

.products__section-title::after {
   position: absolute;
   content: '';
   bottom: -10px;
   width: 0%;
   height: 2px;
   background-color: var(--text-color);
   transition: .2s;
   left: 0
}

.products__section-item {
   display: flex;
   align-items: center;
   flex-direction: column;
   justify-content: center;
   border-radius: 0px;
   border: 2px solid var(--text-color);
   transition: .2s
}

.products__section-item:hover {
   /* transform: translateY(-10px) scale(1.02); */
   border-radius: 36px;
   box-shadow: 0px 2px 35px 0px rgba(255, 255, 255, 0.22);
}

.products__section-inner {
   display: grid;
   grid-template-columns: 1fr 1fr 1fr 1fr;
   gap: 40px
}

.products__section-item-link {
   text-decoration: none;
   color: inherit;
   text-align: center;
   padding: 20px 20px 0px
}

.products__section-item-info {
   padding: 0px 20px 20px;
   width: 100%;
   display: flex;
   flex-direction: column;
   align-items: center;
   max-width: 80%
}

.products__section-item-img {
   display: block;
   margin: 0 auto 33px;
   max-width: 200px;
   width: 100%
}

.products__section-item-title {
   margin-bottom: 15px;
   font-size: 24px;
   font-weight: 600;
   line-height: 28px;
   display: none;
}

.products__section-item-price {
   display: flex;
   flex-direction: column;
   align-items: center;
   gap: 10px;
   border-radius: 0px;
   padding: 10px 20px;
   width: 100%;
   margin-bottom: 20px;
   border: 2px solid var(--text-color);
   transition: .2s
}

.products__section-item:hover .products__section-item-price {
   border-radius: 20px
}

.products__section-item-price-value {
   font-size: 36px;
   color: rgb(22, 215, 22);
   font-weight: 600;
   text-transform: uppercase
}

.products__section-item-buy-btn {
   padding: 20px;
   text-transform: uppercase;
   font-weight: 600;
   border-radius: 20px;
   color: inherit;
   font-size: 26px;
   text-decoration: none;
   border: 2px solid var(--text-color);
   width: 100%;
   text-align: center;
   background: var(--text-color);
   color: var(--background-color);
   margin-bottom: 20px;
   transition: .3s;
   cursor: pointer
}

.products__section-item-buy-btn:hover {
   background: var(--background-color);
   color: var(--text-color)
}

.products__section-item-img-wrapper {
   width: 100%;
   display: flex;
   align-items: center;
   justify-content: center;
   flex-direction: column-reverse;
   position: relative
}

.products__section-item-img-tcp {
   font-size: 32px;
   text-transform: lowercase;
   text-shadow: 0 0 3px BLACK;
   /* color: ; */
   font-weight: 600;
   display: block;
   margin-bottom: 26px;
}

.footer {
   border-top: 2px solid var(--text-color)
}

.footer__inner {
   display: grid;
   grid-template-columns: 1.5fr 1fr 1fr auto;
   padding: 40px 0px;
   gap: 30px
}

.footer__logo-img {
   max-width: 200px;
   width: 100%;
   display: block
}

.footer__logo-link {
   margin-bottom: 10px;
   display: block
}

.footer__logo-text {
   font-size: 16px;
   line-height: 20px;
   max-width: 400px;
   margin-bottom: 20px
}

.footer__column-title {
   font-size: 22px;
   font-weight: 600;
   margin-bottom: 20px
}

.footer__column-list {
   display: flex;
   flex-direction: column;
   list-style: none;
   gap: 10px
}

.footer__column-link {
   color: inherit;
   text-decoration: none;
   position: relative
}

.footer__column-link::after {
   content: '';
   width: 0%;
   height: 1px;
   background-color: var(--text-color);
   position: absolute;
   bottom: -2px;
   left: 0;
   transition: .2s
}

.footer__column-link:hover::after {
   width: 100%
}

.footer__logo-support {
   display: inline-flex;
   gap: 10px;
   align-items: center;
   padding: 15px 20px;
   border: 2px solid var(--text-color);
   color: inherit;
   text-decoration: none;
   transition: .2s
}

.footer__logo-support:hover {
   background-color: var(--text-color);
   color: var(--background-color)
}

.footer__logo-support-img {
   font-size: 24px
}

.footer__bottom {
   display: grid;
   grid-template-columns: 1fr 1fr;
   justify-items: center;
   text-align: center;
   padding: 20px 0px;
   font-size: 16px;
   border-top: 2px solid var(--text-color);
   gap: 15px
}

.footer__leque a {
   color: inherit
}

.faq__item-accordion {
   display: flex;
   justify-content: space-between;
   border-bottom: 2px solid var(--text-color);
   font-size: 35px;
   line-height: 48px;
   font-weight: 600;
   text-transform: uppercase;
   cursor: pointer;
   transition: all 0.15s;
   align-items: center;
   gap: 80px;
   padding: 20px 0px
}

.faq__item-title {
   font-weight: 600;
   transition: .2s
}

.faq__item-accordion:hover .faq__item-title {
   transform: translateX(40px)
}

.faq__item-panel {
   max-height: 0px;
   overflow: hidden;
   transition: all .2s ease
}

.faq__item-accordion.open .faq__item-title {
   transform: translateX(40px)
}

.faq__title,
.price__title,
.checkipv__title,
.myorders__title,
.terms__title,
.rule__title,
.politics__title {
   font-size: 62px;
   font-weight: 900;
   text-align: center;
   margin-bottom: 40px;
   text-transform: uppercase
}

.faq__item-icon {
   max-width: 54px;
   transition: .3s
}

.faq__item-icon.open {
   transform: rotate(135deg)
}

.faq__inner {
   display: flex;
   flex-direction: column;
   gap: 30px
}

.faq__item-panel p {
   font-size: 20px;
   line-height: 24px;
   text-align: justify
}

.faq__item-panel-body {
   margin: 40px 20px;
   display: flex;
   flex-direction: column;
   gap: 20px
}

.faq__fancybox {
   margin: 20px auto;
   display: block
}

.faq__item-panel img {
   display: block;
   max-width: 600px;
   width: 100%
}

.faq__item-panel a {
   color: inherit
}

.price__list {
   display: flex;
   flex-direction: column;
   gap: 40px;
   max-width: 1000px;
   margin: 0 auto 80px
}

.price__list-item {
   display: flex;
   align-items: center;
   gap: 20px
}

.price__list-count {
   font-size: 52px;
   -webkit-text-stroke-width: 1px;
   -webkit-text-stroke-color: var(--text-color);
   color: transparent;
   font-weight: 900
}

.price__list-text {
   font-size: 20px;
   line-height: 24px
}

.price__price {
   margin-bottom: 80px
}

.price__price-title {
   text-align: center;
   font-size: 46px;
   margin-bottom: 40px;
   text-transform: uppercase;
}

.price__price-inner {
   display: grid;
   grid-template-columns: repeat(4, 1fr);
   grid-column-gap: 60px;
   grid-row-gap: 30px;
   margin-bottom: 30px;
}

.price__price-item {
   display: grid;
   grid-template-columns: 1fr 1fr;
   border: 2px solid var(--text-color);
   justify-items: center;
   font-size: 26px;
   font-weight: 600
}

.price__price-item-tcp,
.price__price-item-value {
   width: 100%;
   text-align: center;
   padding: 20px 0px
}

.price__price-item-value {
   background-color: var(--text-color);
   color: var(--background-color)
}

.price__price-more-text {
   padding: 20px;
   background-color: var(--text-color);
   color: var(--background-color);
   font-weight: 600;
   width: fit-content;
   font-size: 22px;
   margin: 0 auto;
   text-align: center;
   line-height: 26px;
}

.price__calculator-title {
   text-align: center;
   font-size: 46px;
   margin-bottom: 40px
}

.price__calculator-text {
   text-align: center;
   margin-bottom: 40px
}

.price__calculator-form {
   display: grid;
   grid-template-columns: 1fr 1fr 1fr 1fr;
   max-width: 680px;
   width: 100%;
   border: 2px solid var(--text-color);
   margin: 0 auto 40px;
   transition: .2s;
   align-items: stretch;
}

.price__calculator-form-period,
.price__calculator-form-type {
   border-right: 2px solid var(--text-color);
   cursor: pointer;
   position: relative;
}

.price__calculator-form-period-list,
.price__calculator-form-type-list {
   position: absolute;
   left: -2px;
   bottom: 0;
   transform: translateY(100%);
   display: flex;
   flex-direction: column;
   width: calc(100% + 4px);
   border: 2px solid var(--text-color);
   z-index: 3;
   opacity: 0;
   pointer-events: none;
   transition: .2s;
   background: var(--background-color);
}

.price__calculator-form-period-list-item,
.price__calculator-form-type-list-item {
   padding: 20px;
   display: block;
   border-bottom: 2px solid var(--text-color);
   transition: .1s;
}

.price__calculator-form-period-list-item.active-value,
.price__calculator-form-type-list-item.active-value {
   background: var(--text-color);
   color: var(--background-color);
   display: none;
}

.price__calculator-form-period-list-item:hover,
.price__calculator-form-type-list-item:hover {
   background: var(--text-color);
   color: var(--background-color);
}

.price__calculator-form-period-list-item:last-child,
.price__calculator-form-type-list-item:last-child {
   border-bottom: none;
}

.price__calculator-form-period-value,
.price__calculator-form-type-value {
   display: flex;
   justify-content: space-between;
   padding: 20px;
   height: 100%;
   align-items: center;
}

.price__calculator-form-period-list.showed,
.price__calculator-form-type-list.showed {
   opacity: 1;
   pointer-events: all;
}

.price__calculator-form-period-icon,
.price__calculator-form-type-icon {
   transition: .2s;
}

.price__calculator-form-period-icon.showed,
.price__calculator-form-type-icon.showed {
   transform: rotate(180deg);
}

.price__calculator-form-input,
.price__calculator-form-btn {
   padding: 20px 0px
}

.price__calculator-form-input {
   width: 100%;
   display: block;
   background: transparent;
   font-family: inherit;
   font-size: inherit;
   border: none;
   text-align: center;
   color: inherit;
   outline: none
}

.price__calculator-form:focus-within {
   box-shadow: 0px 2px 10px 2px var(--text-color);
   transform: scale(1.1)
}

.price__calculator-form-input::placeholder {
   font-family: inherit;
   font-size: inherit;
   text-align: center;
   color: inherit
}

.price__calculator-form-btn {
   background-color: var(--text-color);
   color: var(--background-color);
   font-weight: 600;
   font-size: 22px;
   border-left: 2px solid var(--text-color);
   transition: .2s;
   text-transform: uppercase
}

.price__calculator-form-btn:hover {
   background-color: transparent;
   color: var(--text-color)
}

.price__calculator-output {
   max-width: 500px;
   width: 100%;
   margin: 0 auto;
   border: 2px solid var(--text-color);
   padding: 25px;
   display: flex;
   flex-direction: column;
   gap: 20px;
   opacity: 0;
   transition: .2s;
   position: relative;
}

.price__calculator-output.shows {
   opacity: 1
}

.price__calculator-output-limit {
   position: absolute;
   left: 0;
   top: 0;
   width: 100%;
   height: 100%;
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center;
   padding: 25px;
   background-color: var(--background-color);
   gap: 10px;
   opacity: 0;
   pointer-events: none;
   visibility: hidden;
   transition: .05s;
}

.price__calculator-output-limit.show {
   pointer-events: all;
   visibility: visible;
   opacity: 1;
}

.price__calculator-output-limit-link {
   text-decoration: none;
   color: inherit;
   font-weight: 600;
   position: relative;
}

.price__calculator-output-limit-link::after {
   content: '';
   position: absolute;
   bottom: -2px;
   left: 0;
   width: 0%;
   height: 1px;
   background-color: var(--text-color);
   transition: .15s;
}

.price__calculator-output-limit-link:hover::after {
   width: 100%;
}

.price__calculator-output-item {
   display: flex;
   justify-content: space-between;
   align-items: center;
   gap: 20px;
   font-size: 24px
}

.price__calculator-output-item-value-price {
   color: rgb(22, 215, 22);
   font-weight: 600
}

.price__calculator-output-item-value-base-price {
   text-decoration: line-through;
   font-weight: 600
}

.checkipv__text {
   text-align: center;
   margin-bottom: 40px
}

.checkipv__form {
   display: flex;
   flex-direction: column;
   gap: 40px;
   max-width: 600px;
   margin: 0 auto 40px;
   align-items: center
}

.checkipv__form-group {
   display: flex;
   width: 100%;
   align-items: stretch;
   border: 2px solid var(--text-color);
   transition: .2s
}

.checkipv__form-protocol {
   padding: 15px 30px;
   background-color: var(--text-color);
   color: var(--background-color);
   font-weight: 600
}

.checkipv__form-input {
   width: 100%;
   padding: 0px 10px;
   background: transparent;
   font-family: inherit;
   font-size: inherit;
   color: inherit;
   outline: none;
   border: none
}

.checkipv__form-group:focus-within {
   box-shadow: 0px 2px 10px 2px var(--text-color);
   transform: scale(1.1)
}

.checkipv__form-input::placeholder {
   font-family: inherit;
   font-size: inherit;
   color: inherit
}

.checkipv__form-btn {
   padding: 20px 30px;
   background-color: var(--text-color);
   width: fit-content;
   color: var(--background-color);
   font-weight: 600;
   font-size: 24px;
   text-transform: uppercase;
   transition: .2s;
   border: 2px solid transparent
}

.checkipv__form-btn:hover {
   border-color: var(--text-color);
   background-color: transparent;
   color: var(--text-color)
}

.checkipv__output {
   width: fit-content;
   margin: 0 auto;
   padding: 15px 20px;
   background-color: var(--text-color);
   color: var(--background-color);
   font-size: 20px;
   font-weight: 600;
   transition: .2s;
   opacity: 0
}

.checkipv__output.showed {
   opacity: 1
}

.checkipv__output b {
   font-weight: 600
}

.checkipv__output-inner {
   display: flex;
   gap: 10px;
   align-items: center
}

.checkipv__output-false,
.checkipv__output-true {
   display: none
}

.checkipv__output-false.showed {
   display: flex
}

.checkipv__output-true.showed {
   display: flex
}

.product-one-title {
   margin-bottom: 50px;
   text-align: center;
   font-size: 42px;
   font-style: normal;
   font-weight: 700;
   line-height: 120%;
}

.product-one-inner {
   display: flex;
   gap: 40px;
   align-items: flex-start;
   justify-content: center;
}

.product-one-item {
   display: flex;
   align-items: center;
   flex-direction: column;
   justify-content: center;
   border-radius: 0px;
   border: 2px solid var(--text-color);
   transition: .2s;
   max-width: 350px;
   width: 100%
}

.product-one-item .products__section-item-link {
   width: 100%;
   margin-bottom: 15px
}

.product-one-description-title {
   font-size: 30px;
   margin-bottom: 40px
}

.product-one-description-body-inner {
   display: grid;
   grid-template-columns: 1fr 1fr;
   gap: 40px
}

.product-one-description-body-item {
   display: flex;
   align-items: stretch;
   border: 2px solid var(--text-color)
}

.product-one-description-body-item-icon {
   display: flex;
   align-items: center;
   justify-content: center;
   flex: 0 0 auto;
   font-size: 56px;
   padding: 25px;
   border-right: 2px solid var(--text-color);
   max-width: 120px;
   width: 100%
}

.product-one-description-body-item-text {
   font-size: 18px;
   line-height: 22px;
   padding: 25px
}

.product-one-description-body-item-text b {
   display: block;
   margin-top: 20px
}

.myorders__form {
   max-width: 600px;
   margin: 0 auto 60px;
   width: 100%;
   text-align: center
}

.myorders__form-text {
   margin-bottom: 30px
}

.myorders__form-input {
   width: 100%;
   padding: 0px 10px;
   background: transparent;
   font-family: inherit;
   font-size: inherit;
   color: inherit;
   outline: none;
   border: 2px solid var(--text-color);
   padding: 20px;
   margin-bottom: 30px;
   transition: .2s
}

.myorders__form-input:focus {
   box-shadow: 0px 2px 10px 2px var(--text-color);
   transform: scale(1.1)
}

.myorders__form-input::placeholder {
   font-family: inherit;
   font-size: inherit;
   color: inherit
}

.myorders__form-button {
   padding: 20px 30px;
   background-color: var(--text-color);
   width: fit-content;
   color: var(--background-color);
   font-weight: 600;
   font-size: 24px;
   text-transform: uppercase;
   transition: .2s;
   border: 2px solid transparent
}

.myorders__form-button:hover {
   border-color: var(--text-color);
   background-color: transparent;
   color: var(--text-color)
}

.myorders__products-title {
   font-size: 42px;
   text-transform: uppercase;
   margin-bottom: 40px
}

div.remodal-overlay {
   background-color: var(--rgba-06);
   backdrop-filter: blur(4px)
}

div.remodal {
   background: var(--background-color);
   border: 2px solid var(--text-color);
   border-radius: 0px;
   color: var(--text-color);
   padding: 60px 30px
}

.modal__title {
   font-weight: 900;
   font-size: 42px;
   margin-bottom: 30px;
   text-transform: uppercase
}

.modal__form {
   max-width: 500px;
   margin: 0 auto
}

.modal__form-product-title {
   font-size: 24px;
   margin: 0 auto 30px;
   font-weight: 600
}

.modal__form-inputs {
   display: flex;
   justify-content: space-between;
   flex-direction: column;
   margin: 0 auto;
   gap: 30px
}

.modal__form-inputs-item-input {
   width: 100%;
   background: transparent;
   font-family: inherit;
   font-size: inherit;
   color: inherit;
   outline: none;
   border: none;
   padding: 0px 15px
}

.modal__form-inputs-item-input::placeholder {
   font-family: inherit;
   font-size: inherit;
   color: inherit
}

.modal__form-inputs-item {
   display: flex;
   align-items: stretch;
   border: 2px solid var(--text-color);
   transition: .2s
}

.modal__form-inputs-item:focus-within {
   box-shadow: 0px 2px 10px 2px var(--text-color);
   transform: scale(1.1)
}

.modal__form-inputs-item-icon {
   font-size: 36px;
   display: flex;
   align-items: center;
   justify-content: center;
   max-width: 70px;
   width: 100%;
   border-right: 2px solid var(--text-color);
   padding: 15px
}

.modal__close {
   position: absolute;
   top: 15px;
   right: 15px
}

.modal__close img {
   max-width: 100%;
   transform: rotate(45deg);
   transition: .2s
}

.modal__close img:hover {
   transform: rotate(-135deg)
}

@-moz-keyframes dothabottomcheck {
   0% {
      height: 0
   }

   100% {
      height: 15px
   }
}

@-webkit-keyframes dothabottomcheck {
   0% {
      height: 0
   }

   100% {
      height: 15px
   }
}

@keyframes dothabottomcheck {
   0% {
      height: 0
   }

   100% {
      height: 15px
   }
}

@keyframes dothatopcheck {
   0% {
      height: 0
   }

   50% {
      height: 0
   }

   100% {
      height: 45px
   }
}

@-webkit-keyframes dothatopcheck {
   0% {
      height: 0
   }

   50% {
      height: 0
   }

   100% {
      height: 45px
   }
}

@-moz-keyframes dothatopcheck {
   0% {
      height: 0
   }

   50% {
      height: 0
   }

   100% {
      height: 45px
   }
}

.modal__form-accept-checkbox-checkbox {
   height: 30px;
   width: 30px;
   background-color: transparent;
   border: 2px solid var(--text-color);
   position: relative;
   display: inline-block;
   -moz-box-sizing: border-box;
   -webkit-box-sizing: border-box;
   box-sizing: border-box;
   -moz-transition: border-color ease 0.2s;
   -o-transition: border-color ease 0.2s;
   -webkit-transition: border-color ease 0.2s;
   transition: border-color ease 0.2s;
   cursor: pointer
}

.modal__form-accept-checkbox-checkbox::before,
.modal__form-accept-checkbox-checkbox::after {
   -moz-box-sizing: border-box;
   -webkit-box-sizing: border-box;
   box-sizing: border-box;
   position: absolute;
   height: 0;
   width: 5px;
   background-color: #34b93d;
   display: inline-block;
   -moz-transform-origin: left top;
   -ms-transform-origin: left top;
   -o-transform-origin: left top;
   -webkit-transform-origin: left top;
   transform-origin: left top;
   content: ' ';
   -webkit-transition: opacity ease .5;
   -moz-transition: opacity ease .5;
   transition: opacity ease .5
}

.modal__form-accept-checkbox-checkbox::before {
   top: 23px;
   left: 14px;
   -moz-transform: rotate(-135deg);
   -ms-transform: rotate(-135deg);
   -o-transform: rotate(-135deg);
   -webkit-transform: rotate(-135deg);
   transform: rotate(-135deg)
}

.modal__form-accept-checkbox-checkbox::after {
   top: 12px;
   left: 3px;
   -moz-transform: rotate(-45deg);
   -ms-transform: rotate(-45deg);
   -o-transform: rotate(-45deg);
   -webkit-transform: rotate(-45deg);
   transform: rotate(-45deg)
}

.modal__form-accept-checkbox-checkbox.active {
   border-color: #34b93d
}

.modal__form-accept-checkbox-checkbox.active::after {
   height: 15px;
   -moz-animation: dothabottomcheck 0.2s ease 0s forwards;
   -o-animation: dothabottomcheck 0.2s ease 0s forwards;
   -webkit-animation: dothabottomcheck 0.2s ease 0s forwards;
   animation: dothabottomcheck 0.2s ease 0s forwards
}

.modal__form-accept-checkbox-checkbox.active::before {
   height: 45px;
   -moz-animation: dothatopcheck 0.4s ease 0s forwards;
   -o-animation: dothatopcheck 0.4s ease 0s forwards;
   -webkit-animation: dothatopcheck 0.4s ease 0s forwards;
   animation: dothatopcheck 0.4s ease 0s forwards
}

.modal__form-accept {
   display: flex;
   gap: 20px;
   align-items: center;
   justify-content: center
}

.modal__form-accept-text-link {
   color: inherit
}

.modal__form-accept-checkbox-input {
   display: none
}

.modal__form-paybtn {
   display: grid;
   grid-template-columns: 1fr 1fr;
   grid-gap: 20px;
   position: relative
}

.modal__form-paybtn::before {
   content: '';
   position: absolute;
   left: 0;
   top: 0;
   height: 100%;
   width: 00%;
   background-color: var(--rgba-06);
   z-index: 2;
   cursor: not-allowed;
   transition: .2s
}

.modal__form-paybtn.blur::before {
   width: 100%
}

.modal__form-paybtn-item {
   border: 2px solid var(--text-color);
   background-color: var(--text-color);
   color: var(--background-color);
   padding: 15px 30px;
   display: flex;
   align-items: center;
   justify-content: center;
   font-weight: 600;
   transition: .2s
}

.modal__form-paybtn-item:hover {
   color: var(--text-color);
   background-color: var(--background-color)
}

.header__mobmenu-btn-wrapper {
   max-width: 60px;
   width: 100%;
   height: 60px;
   border-radius: 50%;
   border: 2px solid var(--header-color);
   padding: 15px;
   justify-content: center;
   align-items: center;
   transition: .2s;
   display: none
}

.header__mobmenu-btn-wrapper:hover {
   transform: scale(.9)
}

.header__mobmenu-btn {
   display: flex;
   max-width: 25px;
   width: 100%;
   height: 20px;
   flex-direction: column;
   justify-content: space-between
}

.header__mobmenu-btn span {
   height: 2px;
   width: 100%;
   background: var(--header-color)
}

.header__mobmenu {
   position: fixed;
   width: 100%;
   min-height: 100vh;
   background: var(--background-color);
   top: 0;
   left: 0;
   z-index: 999;
   display: flex;
   flex-direction: column;
   align-items: center;
   padding: 30px 20px;
   transform: translateY(-150%);
   transition: .4s;
   display: none
}

.header__mobmenu.opened {
   transform: translateY(0)
}

.header__mobmenu-close-img {
   transform: rotate(45deg);
   max-width: 40px;
   width: 100%;
   position: absolute;
   right: 20px;
   top: 20px
}

.header__mobmenu-list {
   display: flex;
   flex-direction: column;
   width: 100%;
   padding: 30px 0px;
   gap: 10px
}

.header__mobmenu-list-item {
   text-align: left
}

.header__mobmenu-list-link {
   font-size: 32px;
   padding: 20px 0px;
   display: block;
   padding: 20px 0px;
   color: inherit;
   font-weight: 900;
   text-decoration: none;
   text-transform: uppercase;
   position: relative
}

.header__mobmenu-list-link::after {
   content: '';
   position: absolute;
   bottom: 0;
   width: 100%;
   height: 2px;
   background-color: var(--text-color);
   left: 0;
   bottom: 10px
}

.terms {
   margin-bottom: 80px
}

.terms__section {
   margin-bottom: 60px;
   line-height: 22px
}

.terms__section h2 {
   margin-bottom: 30px;
   font-size: 36px;
   padding-left: 60px;
   position: relative;
   line-height: 40px
}

.terms__section h2::before {
   content: '';
   position: absolute;
   left: 10px;
   top: 50%;
   height: 25px;
   width: 25px;
   border-radius: 50%;
   transform: translateY(-50%);
   border: 2px solid var(--text-color)
}

.terms__section p {
   margin-bottom: 20px
}

.terms__section p:last-child {
   margin-bottom: 0
}

.terms__section ul {
   display: flex;
   flex-direction: column;
   list-style: none;
   gap: 15px;
   margin-bottom: 20px
}

.terms__section ul li {
   padding-left: 30px;
   position: relative
}

.terms__section ul li::before {
   content: '';
   width: 10px;
   height: 10px;
   left: 0;
   position: absolute;
   border-radius: 50%;
   border: 2px solid var(--text-color);
   top: 4px
}

.rule__list {
   display: flex;
   flex-direction: column;
   gap: 40px;
   max-width: 1000px;
   margin: 0 auto 80px
}

.rule__list-item {
   display: flex;
   align-items: center;
   gap: 20px
}

.rule__list-count {
   font-size: 52px;
   -webkit-text-stroke-width: 1px;
   -webkit-text-stroke-color: var(--text-color);
   color: transparent;
   font-weight: 900
}

.rule__list-text {
   font-size: 20px;
   line-height: 24px
}

.politics__section {
   margin-bottom: 60px;
   line-height: 22px
}

.politics__section h2 {
   margin-bottom: 30px;
   font-size: 36px;
   line-height: 40px
}

.politics__section p {
   margin-bottom: 20px;
}

.politics__section p:last-child {
   margin-bottom: 0
}

.politics__section a {
   color: inherit
}

.modal__form-inputs-item.hiden {
   display: none
}

.owl-carousel .owl-nav button.owl-next,
.owl-carousel .owl-nav button.owl-prev {
   /* position: absolute;
   top: 50%;
   transform: translateY(-50%); */
   display: flex !important;
   padding: 5px !important;
   transition: background .2s ease, opacity .2s ease;
}

.owl-nav {
   position: absolute;
   right: 0px;
   top: -60px;
   display: flex;
   margin-top: 0 !important;
}

.owl-prev {
   left: 0;
}

.owl-next {
   right: 0;
}

.owl-stage-outer {
   padding: 40px 4px 60px;
   margin: -40px -4px -60px;
}

html {
   scroll-behavior: smooth;
}

section.cta {
   padding-bottom: 150px;
}

.cta-content {
   display: flex;
   flex-direction: column;
   gap: 50px;
}

.cta-title {
   text-align: center;
   font-size: 42px;
   font-style: normal;
   font-weight: 700;
   line-height: 120%;
   text-transform: uppercase;
}

.cta-grid {
   display: grid;
   grid-template-columns: repeat(auto-fill, minmax(330px, 1fr));
   gap: 42px 32px;
}

.cta-item {
   display: flex;
   flex-direction: column;
   gap: 24px;
   align-items: center;
   text-align: center;
}

.cta-image {
   max-width: 127px;
   width: 100%;
   pointer-events: none;
}

.cta-text {
   text-align: center;
   font-size: 21px;
   font-style: normal;
   font-weight: 600;
   line-height: 130%;
}

.footer__contacts {
   display: flex;
   flex-direction: column;
   gap: 12px;
}

.footer__contacts-item {
   display: flex;
   align-items: center;
   gap: 14px;
   color: inherit;
   text-decoration: none;
}

.footer__contacts-icon {
   border-radius: 190px;
   border: 1px solid var(--text-color);
   padding: 8px;
   transition: color .2s ease, background .2s ease;

}

.footer__contacts-text {
   font-size: 20px;
   font-style: normal;
   font-weight: 600;
   line-height: 28px;
}

.footer__contacts-item:hover .footer__contacts-icon {
   background: var(--text-color);
   color: var(--background-color);
}

.accordion-section {
   margin-bottom: 8px;
   border-radius: 2px;
   overflow: hidden;
   width: 553px;
}

.accordion-header {
   padding: 18px;
   cursor: pointer;
   background: #1C1C1C;
   font-size: 20px;
   font-weight: 600;
   line-height: 100%;
   transition: background 0.2s ease-in-out;
}

.accordion-header:hover {
   background: #2C2C2C;
}

.accordion-header::after {
   content: '';
   width: 24px;
   height: 24px;
   background: no-repeat center center;
   background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6 9L12 15L18 9' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
   background-size: contain;
   float: right;
   transition: transform .2s ease-in-out;
}

.accordion-header.open::after {
   transform: rotate(180deg);
}

.accordion-content {
   display: none;
   padding: 18px;
   background: #141414;
   font-size: 18px;
   font-weight: 400;
   line-height: 21px;
}

.accordion-content a {
   color: inherit;
   font-style: italic;
   text-decoration-line: underline;
   text-decoration-style: solid;
   text-decoration-skip-ink: none;
   text-decoration-thickness: auto;
   text-underline-offset: auto;
   text-underline-position: from-font;
}

@media (max-width: 960px) {
   .accordion-section {
      width: 100%;
   }

   .product-one-inner {
      align-items: unset !important;
   }
}

.white .accordion-section {
   border: 1px solid #ddd;
}

.white .accordion-header {
   background: #f5f5f5;
}

.white .accordion-header:hover {
   background: #eaeaea;
}

.white .accordion-content {
   background: #fff;
   border-top: 1px solid #ddd;
}

.white .accordion-header::after {
   background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M18 15L12 9L6 15' stroke='%23333' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}