@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@400;500;600;700&display=swap');

:root {
    --black: #1D1D1D;
    --white: #ffffff;
    --grey: #777777;
    --grey40: #A2A2A2;
    --blue: #0004A9;
    --blue-light: #ECF1FF;
    --bg: #F9F9F9;
    --line: #E6E6E6;
    --transition: 0.3s ease all;
}

*::-webkit-scrollbar {
    width: 6px;
    background-color: var(--blue-light);
}

*::-webkit-scrollbar-thumb {
    background-color: var(--blue);
    border-radius: 3px;
}

*::selection {
    background: var(--blue);
    color: white;
}

*::-moz-selection {
    background: var(--blue);
    color: white;
}

*::-o-selection {
    background: var(--blue);
    color: white;
}

*::-ms-selection {
    background: var(--blue);
    color: white;
}

body {
    font-family: 'Nunito', sans-serif;
    background: var(--bg);
}

a, h1, h2, h3, h4, h5, h6 {
    color: var(--black);
    transition: var(--transition);
    text-decoration: none;
}

a:hover {
    color: var(--blue);
}

h1, .h1 {
    font-weight: 700;
    font-size: 36px;
    line-height: 125%;
    text-transform: uppercase;
    color: var(--black);
    margin-bottom: 20px;
}

h2, .h2 {
    font-weight: 700;
    font-size: 32px;
    line-height: 44px;
    color: var(--black);
    margin-bottom: 20px;
}

.button {
    font-weight: 500;
    font-size: 18px;
    line-height: 25px;
    color: var(--blue);
    padding: 16px 26px;
    background: var(--blue-light);
    border-radius: 15px;
    border: 2px solid var(--blue-light);
    outline-width: 0;
    transition: var(--transition);
    display: inline-block;
}

.button-blue {
    background: var(--blue);
    border-color: var(--blue);
    color: var(--white);
}

.button:hover,
.button-blue:hover,
.button-black {
    background: var(--black);
    border-color: var(--black);
    color: var(--white);
}

.button-black:hover {
    background: var(--blue-light);
    border-color: var(--blue-light);
    color: var(--blue);
}

.input {
    width: 100%;
    font-weight: 400;
    font-size: 20px;
    line-height: 27px;
    color: var(--grey40);
    padding: 25px;
    background: var(--white);
    border-radius: 15px;
    border-color: transparent;
    outline-color: transparent;
    margin-bottom: 20px;
}

.input:-webkit-autofill, .input:autofill {
    -webkit-box-shadow: 0 0 0 100px white inset !important;
    color: var(--grey40) !important;
}

.input::placeholder {
    font-weight: 400;
    font-size: 20px;
    line-height: 27px;
    color: var(--grey40);
}

.input-phone {
    background: url('../img/icon-input-phone.svg') 24px center no-repeat, linear-gradient(to top, var(--white), var(--white)) !important;
    padding-left: 64px;
}

.input-mail {
    background: url('../img/icon-input-mail.svg') 24px center no-repeat, linear-gradient(to top, var(--white), var(--white)) !important;
    padding-left: 64px;
}

.error {
    color: red;
    font-size: 14px;
    margin-top: -12px;
    text-align: left;
    margin-left: 27px;
}

/*Header*/
header {
    background: var(--white);
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1000;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
}

.bg-light {
    background: var(--white) !important;
}

main {
    padding-top: 105px;
}

.navbar {
    padding: 8px 50px;
}

.navbar .navbar-brand {
    max-width: min(50vw, 300px);
}

.navbar .navbar-brand img {
    width: 100%;
}

.navbar-expand-lg .navbar-nav .nav-link {
    font-weight: 400;
    font-size: 16px;
    line-height: 22px;
    color: var(--grey);
    padding: 8px 15px;
}

.header-phone {
    font-weight: 600;
    font-size: 18px;
    line-height: 25px;
    color: var(--blue);
    text-decoration: none;
    margin-right: 52px;
}

.header-phone:hover {
    color: var(--black);
}

/*Hero section*/
.container-hero-title {
    background: var(--blue);
    border-radius: 15px;
    padding: 30px 30px 0;
}

.hero-title {
    font-weight: 700;
    font-size: 64px;
    line-height: 100%;
    text-transform: uppercase;
    color: var(--white);
    margin-bottom: 0;
}

.section-main-form .hero-title {
    max-width: none;
    margin-bottom: 20px;
}

.hero-form {
    background: var(--white);
    border-radius: 15px;
    padding: 9px 68px 9px 20px;
    position: relative;
    top: 33px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
}

.hero-form-input {
    line-height: 48px;
    padding: 0;
    border-width: 0;
    outline-width: 0;
    margin-right: 30px;
    font-weight: 300;
    font-size: 16px;
    color: var(--black);
}

.hero-form-input:first-child {
    border-right: 1px solid var(--line);
    padding-right: 30px;
}

.hero-form-input::placeholder {
    color: var(--grey40);
}

.hero-form-button {
    width: 48px;
    height: 48px;
    padding: 0;
    background: url('../img/service-arrow.svg') center center no-repeat, linear-gradient(to top, var(--black), var(--black));
    border-width: 0;
    outline-width: 0;
    border-radius: 10px;
    transition: var(--transition);
    position: absolute;
    top: 9px;
    right: 20px;
}

.hero-form-button:hover {
    background: url('../img/service-arrow.svg') center center no-repeat, linear-gradient(to top, var(--blue), var(--blue));
}

.hero-discounts {
    background: var(--black);
    padding: 30px;
    border-radius: 15px;
    list-style-type: none;
}

.section-main-form .hero-discounts {
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 30px;
}

.hero-discounts li {
    font-weight: 500;
    font-size: 24px;
    line-height: 135%;
    text-transform: uppercase;
    color: var(--white);
    margin-bottom: 30px;
    padding-left: 0;
}

.section-main-form .hero-discounts li {
    margin-bottom: 0;
}

.section-main:not(.section-main-form) .hero-discounts li:last-child {
    margin-bottom: 0;
}

.hero-discounts li span {
    color: var(--blue-light);
}

/*Services section*/
.section-services {
    padding: 40px 0;
}

.container-service {
    display: block;
    height: 203px;
    padding: 20px;
    background: var(--white);
    border-radius: 15px;
    position: relative;
    margin-bottom: 20px;
    overflow: hidden;
}

.container-service::after {
    content: url('../img/service-arrow.svg');
    width: 48px;
    height: 48px;
    padding: 12px;
    background: var(--blue);
    position: absolute;
    left: 50%;
    -ms-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
    border-radius: 50%;
    bottom: -70px;
    transition: var(--transition);
}

.container-service:hover:after {
    bottom: 20px;
}

.service-title {
    font-weight: 500;
    font-size: 16px;
    line-height: 137.5%;
    text-align: center;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--grey);
	position: relative;
	z-index: 1;
}

.container-service:hover .service-title {
    font-weight: 700;
    color: var(--blue);
}

.service-img {
    max-width: 100%;
    position: absolute;
    bottom: 0;
    left: 50%;
    -ms-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
}

.brands-title {
    text-align: center;
}

.owl-brands .item {
    background: var(--white);
    border-radius: 15px;
    min-height: 146px;
    height: 100%;
    padding: 10px 16px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.owl-brands .owl-nav {
    display: flex;
    justify-content: center;
}

.owl-brands .owl-nav button.owl-prev,
.owl-brands .owl-nav button.owl-next {
    width: 80px;
    height: 32px;
    background: url('../img/brands-arrow.svg') center center no-repeat;
    transition: 0.3s ease all;
    margin: 24px 10px;
}

.owl-brands .owl-nav button.owl-prev:hover,
.owl-brands .owl-nav button.owl-next:hover {
    width: 80px;
    height: 32px;
    background: url('../img/brands-arrow-hover.svg') center center no-repeat;
}

.owl-brands .owl-nav button span {
    display: none;
}

.owl-brands .owl-nav button.owl-next {
    transform: rotate(180deg);
}

.brand-img {
    width: auto !important;
    max-width: 100%;
}

.section-advantage {
    margin: 100px 0;
}

.section-advantage .container-advantage {
    padding: 70px 100px;
}

.section-advantage .container {
    background: linear-gradient(to right, var(--white) 0%, var(--white) 49.999999%, var(--blue) 50%, var(--blue) 100%);
    border-radius: 15px;
    overflow: hidden;
}

.section-advantage .advantage {
    display: flex;
    align-items: flex-start;
    color: white;
    margin-bottom: 50px;
}

.section-advantage .advantage:last-child {
    margin-bottom: 0;
}

.section-advantage .advantage h3 {
    font-weight: 600;
    font-size: 24px;
    line-height: 33px;
    color: var(--white);
    margin-bottom: 5px;
}


.section-advantage .advantage img {
    margin-right: 44px;
}

.section-last .container {
    background: var(--white);
    border-radius: 15px;
}

.section-last-form .container {
    background: var(--blue);
}

.section-last .img-wrapper {
    width: 100%;
    height: 100%;
    border-radius: 15px 0 0 15px;
    overflow: hidden;
}

.section-last .img-wrapper img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.section-reviews {
    padding: 0 0 100px;
}

.owl-reviews .item {
    padding: 30px;
    background: var(--white);
    border-radius: 15px;
}

.owl-reviews .title-block {
    display: flex;
    align-items: center;
    margin-bottom: 20px;
}

.owl-reviews .img-review {
    width: 80px;
    height: 80px;
    border-radius: 15px;
    margin-right: 30px;
}

.owl-reviews .title-block .name {
    font-weight: 700;
    font-size: 24px;
    line-height: 33px;
    color: var(--black);
    margin-bottom: 0;
}

.owl-reviews .title-block .position {
    font-weight: 500;
    font-size: 20px;
    line-height: 27px;
    color: var(--grey);
    margin-bottom: 0;
}

.owl-reviews .text-review {
    max-width: 410px;
    font-weight: 500;
    font-size: 18px;
    line-height: 180%;
    margin-bottom: 30px;
}

.owl-reviews .stars-title {
    font-weight: 500;
    font-size: 20px;
    line-height: 180%;
    margin-bottom: 0;
    margin-right: 15px;
}

.owl-reviews .stars-title span {
    margin-right: 15px;
}

.owl-reviews .star-full::before {
    content: url('../img/star-full.svg');
    margin-right: 7px;
    position: relative;
    top: 2px;
}

.owl-reviews .star-empty::before {
    content: url('../img/star.svg');
    margin-right: 7px;
    position: relative;
    top: 2px;
}

.owl-reviews .owl-dots {
    display: flex;
    justify-content: center;
    margin-top: 40px;
}

.owl-reviews button.owl-dot {
    width: 10px;
    height: 10px;
    border: 4px solid var(--line);
    border-radius: 5px;
    background: var(--line);
    outline-width: 0;
    margin: 0 2.5px;
    transition: var(--transition);
}

.owl-reviews button.owl-dot.active {
    width: 24px;
    height: 10px;
    background: var(--blue);
    border-color: var(--blue);
}

.owl-reviews button.owl-dot span {
    display: none;
}

.section-how {
    padding: 0 0 100px;
}

.section-how h2 {
    margin-bottom: 40px;
}

.section-how .how {
    display: flex;
    align-items: flex-start;
    background: var(--white);
    border-radius: 15px;
    padding: 30px;
    margin-bottom: 20px;
}

.section-how .how img {
    width: 35px;
    margin-right: 35px;
}

.section-how .how h3 {
    font-weight: 700;
    font-size: 20px;
    line-height: 27px;
    color: var(--black);
    margin-bottom: 5px;
}

.section-how .how p {
    font-weight: 400;
    font-size: 18px;
    line-height: 155%;
    color: var(--grey);
    margin-bottom: 0;
}

.section-how .guarantees {
    border-radius: 15px;
    background: var(--white);
    overflow: hidden;
}

.section-how .guarantees .text-guarantees {
    padding: 30px 30px 14px;
}

.section-how .guarantees h2 {
    font-size: 24px;
    line-height: 33px;
    margin-bottom: 10px;
}

.section-how .guarantees .text-guarantees p,
.section-how .guarantees .text-guarantees li {
    font-weight: 400;
    font-size: 18px;
    line-height: 155%;
    color: var(--grey);
}

.section-how .guarantees .img-guarantees {
    position: relative;
}

.section-how .guarantees .img-guarantees::before {
    content: url('../img/icon-guarantee.svg');
    position: absolute;
    top: 0;
    left: 0;
}

.section-how .guarantees .img-guarantees img {
    width: 100%;
}

footer {
    background: var(--white);
    padding: 40px 0 70px;
    margin-top: 100px;
}

footer .logo {
    max-width: min(50vw, 300px);
}

footer .logo img {
    width: 100%;
    margin-bottom: 20px;
}

footer .copyright {
    font-weight: 400;
    font-size: 16px;
    line-height: 22px;
    color: var(--grey);
}

footer h2 {
    font-weight: 600;
    font-size: 18px;
    line-height: 25px;
    color: var(--black);
    margin-bottom: 10px;
}

footer ul {
    list-style-type: none;
    padding-left: 0;
}

footer ul li {
    padding-left: 0;
    font-weight: 400;
    font-size: 16px;
    line-height: 22px;
    margin-bottom: 10px;
}

footer ul li:last-child {
    margin-bottom: 0;
}

footer ul li a {
    color: var(--grey);
}

footer .form-subscribe .input {
    font-weight: 400;
    font-size: 18px;
    line-height: 54px;
    color: var(--grey);
    border-width: 0;
    border-bottom: 2px solid var(--line);
    border-radius: 0;
    margin-right: 20px;
    width: calc(60% - 20px);
    padding: 0;
}

footer .form-subscribe .input::placeholder {
    font-weight: 400;
    font-size: 18px;
    line-height: 54px;
    color: var(--grey);
}

footer .form-subscribe .button {
    max-width: 38%;
}

footer .social {
    margin: 40px 0;
}

footer .social a {
    display: inline-block;
    width: 30px;
    height: 30px;
    border-radius: 15px;
    margin-right: 20px;
}

footer .social .google {
    background: url('../img/icon-google.svg') center center no-repeat;
}


footer .social .telegram {
    background: url('../img/icon-telegram.svg') center center no-repeat;
}


footer .social .instagram {
    background: url('../img/icon-instagram.svg') center center no-repeat;
}

footer .social .phone {
    background: url('../img/icon-phone.svg') left center no-repeat;
    width: 320px;
    padding-left: 35px;
    display: flex;
    white-space: nowrap;
    transition: 0.3s ease all;
}

footer .social .phone span {
    font-weight: 600;
    font-size: 18px;
    line-height: 30px;
    color: var(--blue);
    text-decoration: none;
    margin-left: 5px;
}

footer .social .phone:hover {
    filter: brightness(0);
}

footer .mail {
    font-weight: 400;
    font-size: 16px;
    line-height: 22px;
    color: var(--blue);
}

/*Pricing*/
.section-pricing {
    padding: 40px 0 100px;
}

#pricingTab {
    justify-content: center;
    border-color: transparent;
    margin-bottom: 40px;
}

.section-pricing #pricingTab .nav-link {
    background: transparent;
    font-weight: 400;
    font-size: 18px;
    line-height: 125%;
    color: var(--grey);
    border-color: transparent;
    transition: var(--transition);
    padding: 0 0 16px;
    border-bottom: 1px solid var(--grey);
    margin: 0 15px;
    outline-color: transparent;
}

.section-pricing #pricingTab .nav-link.active {
    font-weight: 700;
    color: var(--blue);
    border-bottom: 2px solid var(--blue);
}

.section-pricing h2 {
    font-weight: 500;
    font-size: 24px;
    line-height: 125%;
    text-align: center;
    color: var(--black);
    margin-bottom: 5px;
}

.section-pricing .text {
    font-weight: 400;
    font-size: 16px;
    line-height: 125%;
    color: var(--grey);
    margin-bottom: 0;
}

.section-pricing .img {
    width: 100%;
    display: flex;
    justify-content: center;
    padding: 8px 8px 0;
    background: var(--white);
    border-radius: 15px;
    margin: 20px 0;
}

.section-pricing .prices {
    margin-bottom: 40px;
}

.section-pricing .prices .price-header {
    display: flex;
    justify-content: space-between;
    padding: 0 30px 20px;
}

.section-pricing .prices .price-position {
    display: flex;
    justify-content: space-between;
    background: var(--white);
    border-radius: 15px;
    padding: 25px;
    margin-bottom: 20px;
}

.section-pricing .prices .price-header div,
.section-pricing .prices .price-position div {
    width: 50%;
}

.section-pricing .prices .price-position .title {
    font-weight: 700;
    font-size: 18px;
    line-height: 125%;
    color: var(--black);
    margin-bottom: 0;
}

.section-pricing .prices .price-position .price {
    font-weight: 400;
    font-size: 18px;
    line-height: 125%;
    color: var(--grey);
    margin-bottom: 0;
}

.section-pricing .prices .price-position .price span {
    margin-left: 10px;
    color: var(--black);
}

.section-pricing .reference {
    background: url('../img/icon-pricing.svg') 25px 25px no-repeat, linear-gradient(to top, var(--white), var(--white));
    border-radius: 15px;
    padding: 25px 35px 25px 64px;
    margin: 40px 0 20px;
}

.section-pricing .reference h3 {
    font-weight: 600;
    font-size: 16px;
    line-height: 125%;
    color: var(--black);
    margin-bottom: 9px;
}

.section-pricing .reference p {
    font-weight: 400;
    font-size: 16px;
    line-height: 125%;
    color: var(--grey);
    margin-bottom: 0;
}

/*Become a tech*/
.section-tech-hero .content {
    background: url('../img/bg-tech.png') right center no-repeat, linear-gradient(to top, var(--blue), var(--blue));
    min-height: 530px;
    padding: 70px;
    border-radius: 15px;
}

.section-tech-hero .content h1 {
    font-weight: 700;
    font-size: 60px;
    line-height: 125%;
    text-transform: uppercase;
    color: var(--white);
    margin-bottom: 20px;
    max-width: 480px;
}

.section-tech-hero .content .subtitle {
    font-weight: 400;
    font-size: 32px;
    line-height: 125%;
    color: var(--white);
    opacity: 0.9;
    max-width: 480px;
}

/*Section hero*/
.section-hero .content {
    background: var(--blue);
    padding: 50px;
    border-radius: 15px;
    height: 100%;
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
}

.section-hero .img-wrapper {
    width: 100%;
    height: 100%;
    border-radius: 15px;
    overflow: hidden;
}

.section-hero .img-wrapper img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.section-hero .content h1 {
    font-weight: 700;
    font-size: 55px;
    line-height: 125%;
    text-transform: uppercase;
    color: var(--white);
    margin-bottom: 20px;
}

.section-hero .content .subtitle {
    font-weight: 400;
    font-size: 32px;
    line-height: 125%;
    color: var(--white);
    opacity: 0.9;
}

/*Section apply*/
.section-apply {
    padding: 40px 0;
}

.section-apply h2 {
    font-weight: 700;
    font-size: 36px;
    line-height: 125%;
    text-align: center;
    text-transform: uppercase;
    color: var(--black);
    margin-bottom: 10px;
}

.section-apply p {
    font-weight: 500;
    font-size: 20px;
    line-height: 27px;
    text-align: center;
    color: var(--grey);
    margin-bottom: 20px;
}

.section-apply .service {
    width: 100%;
    padding: 20px 20px 0;
    background: var(--white);
    border-radius: 15px;
    text-align: center;
    overflow: hidden;
    border: 2px solid transparent;
    transition: var(--transition);
    cursor: pointer;
    margin-bottom: 20px;
}

.section-apply .service.active,
.section-apply .service:hover {
    border-color: var(--blue);
}

.section-apply .service h3 {
    font-weight: 500;
    font-size: 16px;
    line-height: 22px;
    text-align: center;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--grey);
    margin-bottom: 25px;
}

.section-apply .service:hover h3,
.section-apply .service.active h3 {
    color: var(--blue);
}

.section-apply .service img {
    width: auto;
    height: 186px;
}

/*Section referrer*/
.section-referrer form {
    background: var(--blue-light);
    border-radius: 15px;
    padding: 24px;
}

.section-referrer form .input {
    font-size: 20px;
    line-height: 24px;
    padding: 24px;
    margin-bottom: 0;
}

.section-referrer form .button {
    font-size: 20px;
    line-height: 24px;
    padding: 24px;
    background: var(--blue);
    border-color: var(--blue);
    color: white;
}

.section-referrer form .button:hover {
    background: var(--black);
    border-color: var(--black);
}

/*Section callback*/
.section-callback {
    padding: 0 0 100px;
}

.section-callback h2 {
    font-weight: 700;
    font-size: 20px;
    line-height: 125%;
    text-align: center;
    text-transform: uppercase;
    color: var(--black);
    margin-bottom: 40px;
}

.section-callback .text,
.price-block .text {
    font-weight: 400;
    font-size: 16px;
    line-height: 165%;
    text-align: center;
    text-transform: uppercase;
    color: var(--black);
    margin-bottom: 25px;
}

.section-callback .text .phone,
.price-block .text .phone {
    font-weight: 700;
}

.section-callback .text .terms,
.price-block .text .terms {
    text-decoration: underline;
    color: var(--blue);
}

.section-callback .price,
.price-block .price {
    font-weight: 500;
    font-size: 24px;
    line-height: 33px;
    text-align: center;
    color: var(--black);
    margin-bottom: 25px;
}

.section-callback .service,
.price-block .service-text {
    font-weight: 400;
    font-size: 16px;
    line-height: 22px;
    text-align: center;
    color: var(--grey40);
    margin-bottom: 0;
}

.section-quiz {
    margin: 40px 0;
    min-height: calc(100vh - 515px);
}

.section-quiz h2 {
    font-weight: 700;
    font-size: 36px;
    line-height: 125%;
    text-align: center;
    text-transform: uppercase;
    color: var(--black);
    margin-bottom: 20px;
}

.section-quiz input,
.main-form input,
.main-form select,
.main-form textarea {
    width: 100%;
    background: var(--white);
    border: 2px solid var(--white);
    border-radius: 15px;
    transition: var(--transition);
    font-weight: 600;
    font-size: 18px;
    line-height: 25px;
}

.main-form input,
.main-form select,
.main-form textarea {
    padding: 12px 16px;
}

.section-quiz input:focus,
.section-quiz input:active,
.main-form input:focus,
.main-form input:active,
.main-form select:focus,
.main-form select:active,
.main-form textarea:focus,
.main-form textarea:active {
    border-color: var(--blue);
    color: var(--blue);
}

.section-quiz input::placeholder,
.main-form input::placeholder,
.main-form select:first-child:checked+option:first-child,
.main-form textarea::placeholder {
    font-weight: 400;
    font-size: 18px;
    line-height: 25px;
    color: var(--grey40);
}

.section-quiz input:focus::placeholder,
.section-quiz input:active::placeholder,
.main-form input:focus::placeholder,
.main-form input:active::placeholder,
.main-form textarea:focus::placeholder,
.main-form textarea:active::placeholder {
    color: var(--blue);
}

.section-quiz .input-address {
    padding-left: 64px;
    background: url('../img/icon-quiz-map.svg') 25px center no-repeat, linear-gradient(to left, var(--white), var(--white));
    margin-bottom: 8px;
}

.section-quiz .input-brands {
    padding-left: 64px;
    background: url('../img/icon-quiz-brand.svg') 25px center no-repeat, linear-gradient(to left, var(--white), var(--white));
    margin-bottom: 8px;
}

.section-quiz .list-brands,
.section-quiz .list-address {
    background: var(--white);
    border: 2px solid var(--white);
    border-radius: 15px;
    padding: 8px;
    margin-bottom: 20px;
}

.section-quiz .list-brands ul,
.section-quiz .list-address ul {
    list-style-type: none;
    text-align: left;
    padding-left: 0;
    margin-bottom: 0;
    max-height: 200px;
    overflow: hidden auto;
}

.section-quiz .list-address ul li {
    cursor: pointer;
    padding: 8px 0 8px 32px;
    background: url('../img/icon-quiz-map.svg') left 8px no-repeat;
}

.section-quiz .list-brands ul li {
    cursor: pointer;
    padding: 8px 0 8px 32px;
    background: url('../img/icon-quiz-brand.svg') left 8px no-repeat;
}

.section-quiz .list-brands ul li:hover,
.section-quiz .list-address ul li:hover {
    font-weight: 600;
}

.section-quiz .service {
    display: inline-block;
    width: 100%;
    background: var(--white);
    border: 2px solid var(--white);
    border-radius: 15px;
    padding: 27.5px 24px 27.5px 82px;
    font-weight: 500;
    font-size: 18px;
    line-height: 25px;
    color: var(--grey40);
    text-align: left;
    margin-bottom: 20px;
    position: relative;
    transition: var(--transition);
    cursor: pointer;
}

.section-quiz .service.active {
    border-color: var(--blue);
    color: var(--blue);
}

.section-quiz .service::before {
    content: "";
    display: block;
    position: absolute;
    top: 24px;
    left: 25px;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    border: 9px solid var(--blue-light);
    background: var(--blue-light);
    transition: var(--transition);
}

.section-quiz .service.active::before {
    background: var(--blue);
}

.section-quiz .price-text {
    font-weight: 500;
    font-size: 24px;
    line-height: 33px;
    margin-bottom: 5px;
    color: var(--black);
    text-align: left;
}

.section-quiz .price-call {
    font-weight: 400;
    font-size: 16px;
    line-height: 22px;
    color: var(--grey40);
}

.section-quiz .calendar {
    position: relative;
    margin-bottom: 16px;
}

.section-quiz .calendar .day {
    width: 100%;
    background: var(--white);
    border-radius: 15px;
    padding: 10px;
    cursor: pointer;
    transition: var(--transition);
    margin-bottom: var(--bs-gutter-x);
    cursor: pointer;
}

.section-quiz .calendar .day.active,
.section-quiz .calendar .day:hover {
    background: var(--blue);
}

.section-quiz .calendar .day .month {
    font-weight: 500;
    font-size: 18px;
    line-height: 25px;
    text-align: center;
    color: var(--grey);
    margin-bottom: 0;
    transition: var(--transition);
}

.section-quiz .calendar .day.active .month,
.section-quiz .calendar .day:hover .month {
    color: var(--white);
}

.section-quiz .calendar .day .date {
    font-weight: 700;
    font-size: 18px;
    line-height: 25px;
    text-align: center;
    color: var(--black);
    margin-bottom: 0;
    transition: var(--transition);
}

.section-quiz .calendar .day.active .date,
.section-quiz .calendar .day:hover .date {
    color: var(--white);
}

.section-quiz .calendar .button {
    position: absolute;
    width: calc(8.33333333% - var(--bs-gutter-x));
    height: 70px;
    line-height: 44px;
    background: var(--white);
    border-width: 0;
    border-radius: 15px;
    top: 0;
    transition: var(--transition);
    cursor: pointer;
    z-index: 1;
}

.section-quiz .calendar .button:hover {
    background: var(--blue);
}

.section-quiz .calendar .button-prev {
    transform: rotate(180deg);
    left: 0;
}

.section-quiz .calendar .button-next {
    right: 0;
}

.section-quiz .calendar .button::before {
    content: url('../img/icon-calendar.svg');
    transition: var(--transition);
}

.section-quiz .calendar .button:hover::before {
    filter: brightness(10);
}

.section-quiz .time {
    width: 100%;
    background: var(--white);
    border-radius: 15px;
    padding: 20px 10px;
    font-weight: 500;
    font-size: 18px;
    line-height: 25px;
    text-align: center;
    color: var(--grey);
    margin-bottom: var(--bs-gutter-x);
    transition: var(--transition);
    cursor: pointer;
}

.section-quiz .time p {
    margin-bottom: 0;
}

.section-quiz .time.active,
.section-quiz .time:hover {
    background: var(--blue);
    color: var(--white);
}

.section-quiz .subtitle {
    font-weight: 500;
    font-size: 20px;
    line-height: 27px;
    text-align: center;
    color: var(--grey);
    margin-bottom: 20px;
}

.price-block {
    margin-top: 40px;
}

.price-block .price {
    margin-bottom: 5px;
}

.section-quiz .button-submit {
    width: auto;
    padding: 20px 30px;
    background: var(--blue-light);
    border-color: var(--blue-light);
}

.section-quiz .button-submit:hover {
    background: var(--blue);
    border-color: var(--blue);
}

.section-quiz .service .price-current {
    display: inline-block;
    color: var(--grey);
    margin: 0 10px;
}

.section-quiz .service .price-old {
    display: inline-block;
    text-decoration: line-through;
    color: var(--line);
}

.section-quiz .additional {
    width: 100%;
    background: var(--white);
    border-radius: 15px;
    padding: 0 20px 20px;
    margin-bottom: 24px;
    border: 2px solid var(--white);
    cursor: pointer;
    transition: var(--transition);
}

.section-quiz .additional.active,
.section-quiz .additional:hover {
    border-color: #0004A9;
}

.section-quiz .additional .img {
    height: 68px;
    position: relative;
}

.section-quiz .additional .img img {
    position: absolute;
    top: 60%;
    left: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.section-quiz .additional .text {
    font-weight: 500;
    font-size: 16px;
    line-height: 22px;
    text-align: center;
    color: var(--grey);
    margin-bottom: 10px;
    min-height: 66px;
    transition: var(--transition);
}

.section-quiz .additional.active .text,
.section-quiz .additional:hover .text {
    color: #0004A9;
}

.section-quiz .additional .price-current {
    font-weight: 500;
    font-size: 16px;
    line-height: 22px;
    text-align: center;
    color: var(--black);
    margin-bottom: 0;
}

.section-quiz .accordion-flush .accordion-item .accordion-button, .section-quiz .accordion-flush .accordion-item .accordion-button.collapsed {
    border-radius: 0;
    font-weight: 500;
    font-size: 18px;
    line-height: 25px;
    color: var(--grey) !important;
    background-color: transparent !important;
    box-shadow: none !important;
    padding: 20px 0;
    border-bottom: 1px solid var(--line);
}

.section-quiz .accordion-header {
    margin-bottom: 0;
}

.section-quiz .accordion-item {
    background-color: transparent;
    border-width: 0 !important;
}

.section-quiz .accordion-button::after {
    background-image: var(--bs-accordion-btn-icon);
}

.section-quiz .accordion-body {
    padding: 20px 0;
}

.housecall {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 15px 0;
    background: var(--white);
    z-index: 500;
    text-align: center;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
}

.housecall .button:hover {
    color: white;
    background: black;
    border-color: black;
}

.section-problems {
    padding: 60px 0;
}

.section-problems h3 {
    font-weight: 700;
    font-size: 24px;
    margin-bottom: 16px;
}

.section-problems .text {
    font-size: 16px;
}

.section-problems .icon {
    padding: 20px;
    background: var(--white);
    border-radius: 15px;
    text-align: center;
    height: 100%;
}

.section-problems .icon i {
    display: block;
    margin-bottom: 20px;
    font-size: 70px;
    color: var(--blue);
}

.modal-content {
    background: var(--blue-light);
}

.modal-content .input {
    padding: 16px 25px;
}

.modal-content .input-mail, .modal-content .input-phone {
    padding-left: 64px;
}

.modal-content .button:hover {
    background: var(--black);
    color: var(--white);
}

.button-black,
.main-form .button-black {
    background: var(--black);
    border-color: var(--black);
    color: var(--white);
}

.button-black:hover,
.main-form .button-black:hover {
    background: var(--blue-light);
    border-color: var(--blue-light);
    color: var(--blue);
}

.button-review {
    display: block;
    font-weight: 600;
    font-size: 18px;
    line-height: 25px;
    color: var(--blue);
    padding: 16px 26px;
    background: white;
    border-radius: 15px;
    border: 2px solid var(--blue);
    outline-width: 0;
    transition: var(--transition);
}

.button-review:hover {
    color: var(--black);
    border-color: var(--black);
}

.button-review span {
    padding-left: 36px;
    position: relative;
}

.button-review span::before {
    content: "";
    width: 24px;
    height: 24px;
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
}

#link.button-review span::before {
    background-image: url('../img/google.svg');
}

#facebook.button-review span::before {
    background-image: url('../img/fb.svg');
}

#angi.button-review span::before {
    background-image: url('../img/angi.svg');
}

#thumbtack.button-review span::before {
    background-image: url('../img/thumbtack.png');
}

#yelp.button-review span::before {
    background-image: url('../img/yelp.svg');
}