/*header*/
header {
    padding-top: 8px;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--Stroke-light-gray-2);
    background: var(--color-white);
}

.header__main {
    gap: 32px;
    width: 100%;
    max-width: fit-content;
}

.logo-wrapper {
    width: 265px;
    height: 40px;
}

.logo-wrapper img {
    width: 100%;
}

.header-city__name{
    color: var(--Text-dark-gray);
}

.courses-icon {
    gap: 4px;
}

.courses-icon:before {
    content: '';
    display: inline-block;
    flex: 0 0 16px;
    height: 16px;
    width: 16px;
    background-color: var(--Text-blue);
    -webkit-mask: url('../images/icons/figma/category-book.svg') center / contain no-repeat;
    mask: url('../images/icons/figma/category-book.svg') center / contain no-repeat;
}

/* Keep the homepage CTA aligned with the header course icon. */
.more-courses-btn.courses-icon:before {
    content: '';
}

.header-city__btn{
    height: 100%;
    gap: 6px;
    padding:0 12px;
    transition: background-color 300ms, color 300ms;
}

.header-city__name{
    transition: color 300ms;
}

.header-city svg path{
    transition: fill 300ms;
}

.header-nav-list{
    align-items: center;
}

.header-nav-list .header-nav__btn {
    color: var(--Text-dark-gray);
    padding: 12px 20px;
    font-weight: 500;
    line-height: 120%;
    white-space: nowrap;
}

.hover-type .header-nav__btn{
    background-color: var(--Background-light-gray-2);
}


.header-container {
    gap: 32px
}

.header__menu {
    width: 100%;
    justify-content: space-between;
}

.header__contacts-btn {
    gap: 8px;
}

.header__contacts {
    gap: 24px;
}

.city-list{
    opacity: 0;
    visibility: hidden;
    border-radius: 8px;
    top: 100%;
    left: 0;
    width: 100%;
    z-index: 2;
    box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.08);
    position: absolute;
    overflow-y: auto;
    max-height: 167px;
}

.header-dropdown__list{
    overflow: hidden;
    opacity: 0;
    visibility: hidden;
    transition: visibility 300ms, opacity 300ms;
    position: absolute;
}

.city-list li a{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 4px;
    padding: 12px 12px 12px 16px;
    color: var(--Text-gray);
    background-color: var(--color-white);
    transition: color 300ms, background-color 300ms;
}
.city-list li a.active{
    background-color: var(--Background-light-gray-2);
    color: var(--Text-black);
}

.city-list li a.active:after{
    content: url("/assets/images/icons/check-mark-black.svg");
}

.city-list li:not(:last-child) a{
    border-bottom: 1px solid var(--Stroke-light-gray-2);
}

.header-nav-list__dropdown{
    top: 100%;
    padding-top: 10px;
    box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.08);
    border-radius: 0 0 12px 12px;
}

.header-dropdown{
    min-width: 292px;
    padding: 16px 24px 24px;
    overflow-y: auto;
    max-height: 234px;
}

.header-dropdown a svg{
    min-width: 16px;
    width: 16px;
}

.header-dropdown a{
    padding: 12px 0;
    color: var(--Text-dark-gray);
}

.header-dropdown-catalog{
    top: calc(100% - 8px);
    padding-top: 8px;
    width: 100%;
    display: none;
}

.header-dropdown-catalog__wrapper{
    border-radius: 0 0 12px 12px;
    box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.08);
    padding: 16px 24px 24px;

    border-top: 1px solid var(--Stroke-light-gray-2);
}

.header-dropdown-catalog.active {
    display: block;
}

.header-dropdown-catalog__list a{
    color: var(--Text-dark-gray);
    display: flex;
    padding: 10px 0;
}

.header-dropdown-catalog__item{
    gap: 8px;
    width: 100%;
    max-width: 244px;
}

.header-dropdown-catalog__icon{
    min-width: 16px;
    width: fit-content;
    gap: 2px;
}

.header-dropdown-catalog__content{
    display: flex;
    justify-content: center;
    gap: 32px;
}

.header-nav-list__item{
    justify-content: center;
}

.popup-content{
    padding: 32px 40px;
    gap: 24px;
}

.popup-result__content{
    gap: 12px;
}

.gallery-item__video .video-player{
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.gallery-item__video .play-icon{
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);

    height: 40px;
    width: 40px;
}

.play-icon.hidden{
    display: none;
}




    /*END Header*/


.section-content {
    margin-top: 40px;
}

.section-top {
    gap: 20px;
}


.home-top{
    padding-top: 80px;
    background-image: url("/assets/images/banners/home-tope-bg.webp");
    background-size: 100%;
    background-repeat: no-repeat;
    background-position: top;
}

.page-top__content{
    gap: 20px;
    width: 100%;
    max-width: 690px;
}

.our-advantages{
    display: grid;
    grid-template-columns: repeat(3, minmax(210px, 1fr));
    gap: 20px;
}

.our-advantages__icon{
    height: 24px;
    width: 24px;
    border-radius: 4px;
    background-color: var(--Text-blue);
}

.our-advantages__item{
    gap: 12px;
    padding: 16px;
    background-color: var(--color-white);
}

.page-top__btn{
    max-width: fit-content;
}

.additional-advantages{
    margin-top: 104px;
    display: grid;
    grid-template-columns: repeat(4, minmax(220px, 1fr));
    gap: 8px;
}

.additional-advantages__card{
    padding: 20px 24px;
    gap: 12px;
    background-color: var(--color-white);
}

.home-top__mobile-banner{
    display: none;
}

.more-courses-btn {
    max-width: fit-content;
    gap: 8px;
}

.reasons__grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(325px, 1fr));
    gap: 20px;

}

.reason-card {
    padding: 20px;
    background-color: var(--color-white);
    gap: 12px;
    transition: box-shadow 300ms;
}

.reason-card__content {
    gap: 4px;
}

.icon-wrapper{
    height: 48px;
    width: 48px;
    min-width: 48px;
    background-color: var(--Background-light-gray-2);
    transition: background-color 300ms;
}

.icon-wrapper svg path {
    transition: fill 300ms;
}


.categories-card{
    height: 100%;
    padding: 24px;
    gap: 16px;
    background-color: var(--Background-light-gray-2);
}

.categories-card__top{
    position: relative;
}

.categories-card__tag{
    position: absolute;
    top: 12px;
    left: 12px;
    border-radius: 40px;
    padding: 0 16px;
    background-color: var(--Background-light-gray-2);
    gap: 8px;
    height: 40px;
}

.categories-card__image{
    height: 218px;
    min-height: 218px;
    width: 100%;
    overflow: hidden;
}

.categories-card__image img{
    border-radius: 12px;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.categories-card__content{
    gap: 16px;
    height: 100%;
}

.categories-card__title{
    gap: 4px;
}

.categories-card__list{
    gap: 8px;
    padding-top: 16px;
}
.categories-card__list li{
    display: flex;
    gap: 12px;
}
.categories-card__list li:before{
    content: url("/assets/images/icons/check-mark.svg");
}

.categories-card__bottom{
    padding-top: 16px;
    gap: 24px;
    margin-top: auto;
}

.categories-card__price{
    width: 100%;
    max-width: fit-content;
    white-space: nowrap;
}

.promotions-payments {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}

.promotions-payments__card {
    padding: 32px;
    border-radius: 12px;
    min-height: 240px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 8px;
    background-repeat: no-repeat;
    background-size: cover;
}

.fixPrice-card {
    background-color: var(--Text-blue);
}

.installment-card {
    background-image: url("/assets/images/cards-images/promotions-image-1.webp");
}

.promotion-card {
    border: 1px solid var(--Text-blue);
}

.deduction-card {
    background-image: url("/assets/images/cards-images/promotions-image-2.webp");
}

.matCapital-card {
    background-image: url("/assets/images/cards-images/promotions-image-3.webp");
}

.promotions-payments__card-title {
    color: var(--Text-blue);
}

.fixPrice-card__subtitle {
    color: var(--Stroke-light-gray);
}

.promotions-payments__card__subtitle {
    color: var(--Text-gray);
}

.promotions-payments__card-content {
    gap: 16px;
}

.promotions-payments__btn {
    max-width: fit-content;
}

.sign-up-btn {
    border-radius: 8px;
    max-width: 325px;
}

.trainings-wrapper {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}

.step-list {
    counter-reset: step 0;
}

.step-list .step-number::before {
    counter-increment: step;
    content: "0" counter(step);
}

.step-list .training-step:nth-child(n+10) .step-number::before {
    content: counter(step);
}

.training-step {
    background-color: var(--Background-light-gray-2);
    padding: 16px 20px 24px;
    gap: 16px;
}

.training-step__icon svg {
    max-width: 24px;
}

.training-step__subtitle {
    margin-top: 8px;
}

.step-number {
    color: var(--Text-blue);
    background-color: var(--color-white);
    border-radius: 100%;
    height: 48px;
    width: 48px;
}

.training-step__title {
    color: var(--Text-dark-gray);
}


.training-step:first-child {
    background-color: var(--Text-dark-gray);
}

.training-step:first-child .step-number {
    color: var(--color-white);
    background-color: var(--Text-gray);
    border-color: var(--Text-dark-gray);
}

.training-step:first-child .training-step__title,
.training-step:last-child .training-step__title {
    color: var(--color-white);
}

.training-step:first-child .training-step__icon svg path,
.training-step:last-child .training-step__icon svg path {
    fill: var(--color-white)
}

.training-step:first-child .training-step__subtitle,
.training-step:last-child .training-step__subtitle {
    color: var(--Background-light-gray);
}

.training-step:last-child {
    background-color: var(--Text-blue);
    border-color: var(--Text-blue);
}

.training-step:last-child .step-number {
    border-color: var(--Background-light-gray);
}

.features {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}

.feature {
    gap: 32px;
    background-color: var(--Background-light-gray-2);
    padding: 24px;
}

.feature-image {
    width: 100%;
    max-width: 144px;
    height: 200px;
    border-radius: 8px;
    overflow: hidden;
}

.feature-image img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
}

.feature-icon {
    height: 48px;
    width: 48px;
    border-radius: 100%;
    background-color: var(--color-white);
}

.feature-description {
    gap: 8px;
}

.feature-content {
    gap: 12px;
}


.instructors-card {
    padding: 24px;
    gap: 24px;
    background-color: var(--Background-light-gray-2);
    height: 100%;
}

.instructors-card__bottom {
    padding-top: 24px;

}

.instructor-image {
    overflow: hidden;
    height: 88px;
    width: 88px;
    min-width: 88px;
    background-color: var(--Stroke-light-gray);
}

.instructor-image img{
    border-radius: 8px;
}

.instructor-data{
    gap: 4px;
}

.instructors-card__top{
    gap: 20px;
}

.exam-advantages {
    display: grid;
    grid-template-columns: repeat(3, minmax(296px, 1fr));
    gap: 20px;
}

.exam-advantages__banner {
    margin-top: 20px;
    background-image: url("/assets/images/banners/banner-bg-1.webp");
    background-repeat: no-repeat;
    background-position: right;
    background-size: cover;
    padding: 24px 72px;
    gap: 24px;
}

.banner-graduate__content {
    gap: 4px;
}

.banner-graduate__image {
    height: 56px;
    width: 56px;
    min-width: 56px;
    overflow: hidden;
}

.banner-graduate__image img {
    border-radius: 8px;
}

.exam-advantages__banner-content {
    width: 100%;
    max-width: 599px;
    gap: 12px;
    padding-left: 40px;
    border-left: 1px solid var(--color-white);
}

.exam-advantages__banner-graduate {
    gap: 12px;
}

.exam-advantages__banner-result {
    gap: 8px;
    width: 100%;
    max-width: 260px;
}

.exam-advantages__item {
    padding: 16px;
    background-color: var(--Background-light-gray-2);
    gap: 20px;
}

.exam-advantages__list {
    gap: 4px;
    height: 100%;
}

.exam-advantages__list li {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background-color: var(--color-white);
    border-radius: 8px;
    min-height: 70px;
    height: 100%;
}

.exam-advantages__blue-item {
    background-color: var(--Text-blue);
}

.exam-advantages__blue-item .exam-advantages__item-title {
    color: var(--color-white);
}






.slider-controls {
    gap: 12px;
}

.slider-control-btn {
    height: 40px;
    width: 40px;
    border: 1px solid var(--Stroke-light-gray-2);
    background: var(--Background-light-gray);
    border-radius: 12px;
}

.swiper-button-disabled svg path{
    fill: var(--Text-gray);
}

.reviews-card {
    background-color: var(--color-white);
    border: 1px solid var(--Stroke-light-gray);
    padding: 24px;
    gap: 40px;
    height: 100%;
}

.reviews-card__content {
    width: 100%;
    gap: 12px;
}

.reviews-card__content-bottom {
    padding-top: 12px;
    gap: 4px;
}

.reviews-creator__image {
    width: 212px;
    min-width: 212px;
    height: 212px;
}

.reviews-creator__image img {
    height: 100%;
    border-radius: 8px;
}

.reviews-card__rating {
    gap: 4px;
}

.reviews-card__content-top {
    gap: 12px;
}

.swiper-slide {
    height: auto;
}

.slider-pagination {
    display: none;
}

.faq-section {
    width: 100%;
    max-width: 670px;
}

.faq-section__content {
    width: 100%;
    gap: 20px;
}

.faq-item {
    background-color: var(--Background-light-gray-2);
    width: 100%;
}

.faq-question {
    padding: 24px;
    gap: 24px;
    width: 100%;
    white-space: normal;
    text-align: left;
    transition: padding-bottom 300ms;
}

.faq-question__icon {
    height: fit-content;
}

.faq-question__icon svg {
    transform: rotate(0deg);
    transition: transform 300ms;
}

.faq-answer {
    margin-top: 0;
    max-height: 0;
    overflow: hidden;
    transition: margin-top 300ms, max-height 300ms;
}

.open .faq-question__icon svg {
    transform: rotate(45deg);
}

.open .faq-question {
    padding-bottom: 0;
}

.faq-answer-content {
    padding: 0 24px 24px;
}

.open .faq-answer {
    margin-top: 12px;
}

.branches-section{
    justify-content: center;
}

.branches-nam{
    margin-top: 24px;
    background-color: var(--color-white);
    padding: 12px 12px 12px 16px;
}

.available-addresses{
    margin-top: 20px;
}

.available-addresses__icon{
    height: 48px;
    width: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background-color: var(--Background-light-gray-2);
}

.available-addresses__list{
    margin-top: 8px;
    gap: 12px;
}

.available-addresses__list li{
    display: flex;
    align-items: center;
    gap: 12px;
    background-color: var(--color-white);
    border-radius: 12px;
    padding: 20px;
}

.available-addresses-title{
    gap: 4px;
}
.branches-container{
    justify-content: center;
    gap: 112px;
}
.branches-container-col{
    width: 100%;
    max-width: 552px;
}

.map-wrapper{
    width: 100%;
    height: 366px;
    overflow: hidden;
    border: 1px solid var(--Background-light-gray);
}
.map-wrapper iframe{
    border-radius: 12px;
    height: 100%;
    width: 100%;
}

.consultation-banner{
    margin-top: 12px;
    background-color: var(--color-white);
    padding: 20px;
    gap: 12px;
}

.consultation-image{
    height: 48px;
    width: 48px;
    min-width: 48px;

}

.consultation-image img{
    border-radius: 8px;
}

.consultation-data{
    gap: 4px;
}

.consultation-banner__top{
    gap: 16px;
}

.consultation-banner__bottom{
    padding-top: 12px;
    gap: 12px;
}

.consultation-banner__actions{
    gap: 8px;
}

.consultation-banner__btn{
    gap: 8px;
    white-space: nowrap;
}

.consultation-description{
    width: 100%;
    max-width: 226px;
}

.consultation-banner__bottom-content{
    gap: 12px;
}

.consultation-banner__bottom-icon{
    padding-top: 4px;
    width: 24px;
    min-width: 24px;
}

.advantages {
    display: inline-grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}

.advantage {
    padding: 24px;
    gap: 20px;
}

.advantage-icon {
    background-color: var(--Background-light-gray-2);
    height: 48px;
    width: 48px;
    border-radius: 12px;
}

.advantage-content {
    gap: 12px;
}


.dos-school{
    gap: 112px;
    justify-content: center;
}

.dos-school__title{
    margin-top: 24px;
}
.dos-school__subtitle{
    margin-top: 12px;
}

.dos-school-icon{
    gap: 12px;
}

.dos-school-icon img{
    width: 28px;
    height: 28px;
    min-width: 28px;
}

.dos-school-stories{
    margin-top: 32px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}
.dos-school-story{
    background-color: var(--color-white);
    min-height: 161px;
    background-repeat: no-repeat;
    background-size: cover;
    padding: 12px;
    gap: 12px;
}

.dos-school__content{
    width: 100%;
    max-width: 665px;
}

.dos-school__form{
    width: 100%;
    max-width: 440px;
    padding: 32px 40px;
    background-color: var(--color-white);
    max-height: fit-content;
}

.dos-school-story__content{
    gap: 4px;
    margin-top: auto;
}

.dos-school-story__image{
    background-color: var(--Background-light-gray-2);
    height: 64px;
    width: 64px;
    overflow: hidden;
}

.dos-school-story__image img{
    border-radius: 8px;
}


.dos-school-form__top{
    gap: 12px;
}

.dos-school-form__content{
    margin-top: 24px;
    gap: 20px;
    height: 100%;
}

.school-form__label{
    gap: 8px;
}

.school-form__label input{
    padding: 0 12px 0 16px;
    height: 40px;
}

.school-form__label input:focus{
    border: 1px solid var(--Background-light-gray);
    outline: none;
}

.dos-school__form-inputs{
    gap: 12px;
}

.dos-school-form__bottom{
    margin-top: auto;
    gap: 12px;
}

.category-type{
    padding: 0 22px 0 16px;
    height: 40px;
    outline: none;
}
.category-type:focus{
    border: 1px solid var(--Background-light-gray);
}
.form-agreement {
    gap: 6px;
}

.form-agreement__check {
    height:24px;
    width: 24px;
    min-width:24px;
    border-radius: 2px;
}


.form-agreement .form-agreement__check svg {
    opacity: 0;
    visibility: hidden;
    transition: opacity 300ms, visibility 300ms;
}

.form-agreement:has(input:checked) .form-agreement__check svg {
    opacity: 1;
    visibility: visible;
}

select {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-image: url('/assets/images/icons/arro-select.svg');
    background-repeat: no-repeat;
    background-position: right 12px center;
    background-size: 7px;
}

.any-questions-section {
    padding: 24px 32px;
}

.any-questions__top {
    gap: 8px;
}

.any-questions__contacts {
    margin-top: 16px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}

.any-questions__contact {
    padding: 20px;
    border: 1px solid var(--Stroke-light-gray);
    background: var(--Background-light-gray-2);
    gap: 24px;
}

.questions-contact__type {
    color: var(--Text-blue);
}

.any-questions__contact-icon {
    height: 48px;
    width: 48px;
    min-width: 48px;
    border-radius: 100%;
    background-color: var(--Text-blue);
}

.any-questions__label {
    gap: 4px;
}



/*footer*/
footer {
    gap: 40px;
}

.footer-main {
    padding-top: 40px;
    gap: 20px;
}

.footer-logo__wrapper {
    width: 100%;
    max-width: 450px;
}

.footer-content {
    width: 100%;
    max-width: 800px;
    display: grid;
    grid-template-columns: minmax(200px, 1fr) minmax(200px, 1fr) 200px;
    gap: 20px;
}

.footer-nav__list {
    margin-top: 4px;
}

.footer-nav__list a {
    padding: 10px 0;
    display: flex;
}

.footer-contacts {
    gap: 4px;
}

.soc-item {
    height: 40px;
    width: 40px;
    min-width: 40px;
    border-radius: 12px;
    border: 1px solid var(--Stroke-light-gray-2);
    background: var(--Background-light-gray);
    transition: background-color 300ms;
}

.soc-wrapper {
    gap: 8px;
}

.footer-contacts-phone {
    height: 40px;
}

.footer-contacts-btn {
    width: fit-content;
}

.footer-bottom-container {
    background-color: var(--Background-light-gray-2);
    padding-top: 8px;
    padding-bottom: 60px;
}

.footer-bottom {
    line-height: 120%;
}

.footer-bottom__list {
    gap: 104px;
}

/*END Footer*/


.fix-menu{
    position: fixed;
    left: 50%;
    transform: translateX(-50%);
    bottom: 10px;
    background-color: var(--color-white);
    padding: 4px;
    gap: 4px;
    z-index: 9;
}


.menu-overlay,
.popup-overlay {
    position: fixed;
    inset: 0;
    background: var(--overlay-bg);
    display: none;
}


.menu-overlay{
    z-index: 9;
}

.popup-overlay{
    z-index: 99;
}

.popup-overlay.active,
.menu-overlay.active{
    display: flex;
}

.anchor-item{
    scroll-margin-top: 57px;
}

/*popup*/
.popup {
    position: fixed;
    width: 100%;
    max-width: 440px;
    max-height: 95vh;
    overflow-y: auto;
    z-index: 1000;
    left: 50%;
    top: 50%;
    transform: translateY(-50%) translateX(-50%);
    display: none;
    padding: 0 10px;
}

.popup.active {
    display: block;
}

.popup::-webkit-scrollbar {
    width: 4px;
}

.popup::-webkit-scrollbar-thumb {
    border-radius: 20px;
    background: var(--Background-light-gray);
}

.popup::-webkit-scrollbar-track {
    background: transparent;
}

.popup::-webkit-scrollbar-button {
    display: none;
}

@supports (-moz-appearance: none) {
    .cities-list {
        scrollbar-width: thin;
        scrollbar-color: transparent var(--Background-light-gray);
    }
}

.popup-close{
    position: absolute;
    top: 8px;
    right: 8px;
    height: 40px;
    width: 40px;
}

.popup .dos-school__form{
    position: relative;
}

.popup-open{
    overflow: hidden;
}

/*END popup*/

/*breadcrumbs*/
.breadcrumbs {
    gap: 12px;
    margin: 14px 0 24px;
    padding: 10px 0;
    font-weight: 500;
    white-space: nowrap;
}

.breadcrumbs li a {
    color: var(--Text-dark-gray);
    font-weight: 500;
}

.breadcrumbs li:not(:first-child):before {
    content: "/";
    margin-right: 12px;
}

.breadcrumbs li:last-child {
    color: var(--Text-gray);
}

/*END breadcrumbs*/

/*error-page*/
.error-page__image{
    width: 100%;
    max-width: 434px;
}
.error-page__btn{
    margin-top: 20px;
}
/*END error page*/


/*needed documents*/
.policy-content h2,
.policy-content h3,
.policy-content h4,
.policy-content h5{
    margin: 24px 0 12px;
}

.needed-documents__top{
    max-width: 1015px;
    gap: 12px;
}

.needed-documents-section{
    margin-top: 32px;
    padding: 40px 0;
}

.needed-documents__item{
    padding: 24px;
}

.needed-documents__wrapper{
    margin-top: 16px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
}

.needed-documents-item__title{
    margin-top: 12px;
    min-height: 52px;
}

.general-subtitle{
    margin-top: 4px;
}

.needed-documents__important-info{
    margin-top: 12px;
    padding: 12px 20px;
    gap: 8px;
}
.needed-documents__important-info-icon{
    height: 24px;
    width: 24px;
}
/*END needed documents*/

/*medical examination*/
.your-question-btn{
    margin-top: 32px;
}

.top-section-layout{
    display: grid;
    grid-template-columns: minmax(300px, 800px) minmax(300px, 400px);
    gap: 20px;
    justify-content: space-between;
    padding: 32px 40px;
}

.columns-layout{
    display: grid;
    grid-template-columns: minmax(300px, 900px) minmax(300px, 440px);
    gap: 20px;
}

.top-section__subtitle{
    margin-top: 12px;
}

.general-advantages{
    margin-top: 20px;
    gap: 20px;
}
.general-advantages__item{
    gap: 12px;
    padding: 20px;
    width: 100%;
}

.general-advantages__icon{
    width: 24px;
    min-width: 24px;
}
.general-advantages__icon svg{
    width: 100%;
}

.top-aside__image{
    height: 170px;
    border-radius: 12px;
}

.top-aside__content{
    margin-top: 16px;
}

.top-aside__content,
.top-aside__buttons{
    gap: 8px;
}

.general-info-container{
    padding: 40px;
    gap: 48px;
}
.general-info__top{
    gap: 20px;
}
.general-info__top-subtitle{
    margin-top: 12px;
}
.general-info__important{
    padding: 16px;
    gap: 16px;
}

.general-info__important-icon{
    height: 56px;
    width: 56px;
    min-width: 56px;
    border-radius: 4px;
}

.general-info__important-icon img{
    border-radius: 4px;
}

.general-info__important-content{
    gap: 4px;
}

.certificate-type__subtitle{
    margin-top: 2px;
}
.certificate-type__content{
    margin-top: 16px;
    padding: 20px 24px;
    gap: 8px;
}

.certificate-type__bottom{
    padding-top: 8px;
}

.certificate-type__list{
    gap: 8px;
}
.certificate-type__list li{
    display: flex;
    align-items: center;
    gap: 16px;
}
.general-info__card{
    gap: 16px;
    padding: 20px 24px;
}
.general-info-card__content{
    gap: 12px;
}
.general-info-checklist{
    gap: 12px;
}
.general-info-checklist li{
    display: flex;
    align-items: center;
    gap: 12px;
}

.general-info-checklist li:before{
    content: url("/assets/images/icons/checkmark-icon.webp");
    height: 16px;
}

.general-info-bottom-checklist{
    padding-top: 8px;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.general-info-bottom-checklist li{
    border-radius: 6px;
    padding: 4px 6px;
    background-color: var(--color-shadow);
    display: flex;
    align-items: center;
    gap: 4px;
}

.general-info-bottom-checklist li:before{
    content: url("/assets/images/icons/check-mark-transparent.svg");
    height: 14px;
}

.medical-restrictions{
    gap: 16px;
}

.restrictions__list{
    margin-top: 12px;
    gap: 12px;
}

.restrictions__list li{
    display: flex;
    align-items: center;
    gap: 12px;
}

.restrictions__list li:before {
    content: url("/assets/images/icons/restrictions-icon.png");
    height: 14px;
}

.medical-restrictions__lists{
    padding: 20px 24px;
    gap: 20px;
}

.medical-restrictions__lists-bottom{
    padding-top: 8px;
}

.attention-block{
    padding: 8px 8px 8px 20px;
    gap: 8px;
}



.attention-block-icon{
    height: 24px;
    width: 24px;
    min-width: 24px;
}

.dos-school-form__btn{
    gap: 8px;
}

.sign-up__form{
    padding: 24px 24px 32px;
    box-shadow: 0 4px 20px 0 rgba(0, 0, 0, 0.20);
}

.sign-up-form__top{
    gap: 2px;
}

.sign-up-form__content{
    margin-top: 16px;

}

.sign-up-form__content,
.sign-up-form-contacts,
.sign-up-form__inputs{
    gap: 12px;
}

.sign-up-form__label{
    gap: 8px;
}

.sign-up-form__label,
.sign-up-form__label input{
    width: 100%;
}

.sign-up-form__label input {
    padding: 0 12px 0 16px;
    height: 40px;
}

.card-bottom-info{
    margin-top: 16px;
    padding-top: 6px;
}

.column-layout__sidebar{
    gap: 20px;
}

.sidebar-card{
    padding: 20px;
}

.sidebar-contacts{
    padding: 24px;
}
.sidebar-contacts__list{
    margin-top: 8px;
    gap: 4px;
}
.sidebar-contacts__list li{
    display: flex;
    gap: 12px;
    padding: 6px 0;
}
.sidebar-contacts__item{
    gap: 8px;
}

.download-documents{
    gap: 8px;
}
.review-periods__list{
    margin-top: 12px;
}
.list-style__red{
    padding-left: 19px;
    gap: 8px;
}
.list-style__red li::marker {
    color: var(--color-red-10);
}

/*END medical examination*/

/*payment*/
.childes-future{
    margin-top: 20px;
    padding: 16px;
}

.matCapital__card{

}

.matCapital-steps{
    gap: 12px;
    margin-top: 16px;
}

.matCapital-steps li{
    padding: 20px;
    background-color: var(--color-white);
    display: flex;
    align-items: center;
    gap: 12px;
    border-radius: 12px;
}
.matCapital-card__bottom{
    margin-top: 12px;
}
/*End payment*/

/*trial deriving*/

.categories-checklist{
    gap: 8px;
}

.categories-checklist li{
    padding: 8px 20px;
    border-radius: 12px;
    background: linear-gradient(90deg, #D4D7DB 0%, #E5E8EC 100%);
}

.general-info-card__bottom{
    padding-top: 8px;
}

.trial-lesson-stages{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.trial-lesson-stage{
    gap: 16px;
    padding: 16px 24px 24px;
}

.trial-lesson-stage__list{
    gap: 8px;
}

.trial-lesson-stage__top{
    padding-bottom: 12px;
    border-bottom: 1px solid var(--Stroke-light-gray-2);
}

.rial-lesson__cost{
    padding: 24px 24px 32px;
}

.custom-table td{
    padding: 12px;
}

.custom-table {
    width: 100%;
    border-collapse: collapse;
    border-radius: 4px;
}

.custom-table td {
    padding: 12px;
    border: 1px solid var(--Background-light-gray);
}

.custom-table thead td{
    border-top: none;
}

.custom-table tbody td{
    background-color: var(--color-white);
}
.custom-table tbody td.attention-cell{
    background-color: var(--color-green);
    font-weight: 500;
}
.custom-table thead tr td:first-child{
    border-left: none;
}

.custom-table thead tr td:last-child{
    border-right: none;
}

.custom-table tbody tr:last-child td{
    border-bottom: none;
}

.custom-table tbody tr td:first-child{
    border-left: none;
}
.custom-table tbody tr td:last-child{
    border-right: none;
}

.trial-lesson__cost{
    padding: 24px 24px 32px;
}

.type-signUp__list{
    margin-top: 16px;
    margin-bottom: 0;
    padding-bottom: 16px;
    border-bottom: 1px solid var(--Stroke-light-gray-2);
}

.cars-params{
    gap: 4px;
    padding: 4px;
}

.car-param__item{
    border: 1px solid var(--Stroke-light-gray-2);
}
.car-param__item:has(input:checked){
    background-color: var(--Text-dark-gray);
    color: var(--color-white);
}
/*END trial deriving*/

.winter-driving__top-btn{
    padding: 12px 8px;
}
.for-drivers{
    padding: 20px;
}

.for-drivers__list{
    margin-top: 12px;
    gap: 12px;
}

.for-drivers__list li{
    display: flex;
    align-items: center;
    gap: 12px;
}

.course-cost__block{
    padding: 24px 24px 32px;
}
/*categories pages*/
.category-top__section{
    padding-top: 14px;
    background-repeat: no-repeat;
    background-position: right top;
    background-size: auto;
}

.category-top__section .breadcrumbs{
    margin-top: 0;
}

.category-top__content{
    display: grid;
    grid-template-columns: minmax(300px, 670px) minmax(300px, 436px);
    justify-content: space-between;
    gap: 24px;
}

.category-top__advantages{
    margin-top: 20px;
}

.category-top__proposal{
    margin-top: 20px;
    padding: 16px;
    gap: 40px;
}

.category-top-proposal__content{
    gap: 16px;
}

.category-form{
    padding: 32px 40px;
    gap: 24px;
    height: fit-content;
    margin-bottom: 21px;
}

.category-form__top{
    gap: 12px;
}

.category-form__content{
    gap: 20px;
}

.category-top-proposal__description{
    gap: 4px;
}

.tariffs{
    gap: 32px;
}
.tariffs-card__image{
    width: 206px;
    height: 206px;
}

.tariffs-card{
    padding: 24px;
    gap: 24px;
    width: 100%;
    max-width: 380px;
    min-width: 380px;
}

.tariffs-card__bottom{
    height: 100%;
}

.tariffs-calculate-result li{
    display: flex;
    align-items: center;
    gap: 20px;
}

.tariffs-calculate-result__price{
    white-space: nowrap;
}

.tariffs-calculate-result{
    gap: 24px;
}

.entrance-price{
    padding: 8px 0;
    border-top: 1px solid var(--Stroke-light-gray);
    border-bottom: 1px solid var(--Stroke-light-gray);
}

.entrance-price{
    gap: 12px;
}

.tariffs-calculator-item__value {
    max-width: 128px;
}

.tariffs-calculator-item__select{
    padding: 12px 12px 12px 16px;
}



.tariffs-calculator__button{
    height: 12px;
    width: 12px;
}

.custom-select__options{
    left: 0;
    top: 100%;
    width: 100%;
    max-height: 0;
    overflow: hidden;
    transition: max-height 300ms;
    z-index: 2;
}

.custom-select__options li{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 12px 12px 12px 16px;
    border-bottom: 1px solid var(--Stroke-light-gray-2);
}

.custom-select__options li.active:after{
    content: url("/assets/images/icons/check-mark-black.svg");
}

.custom-select__icon{
    transform: scale(1, 1);
    transition: transform 300ms;
}

.open .custom-select__icon{
    transform: scale(1, -1);
}
.tariffs-block{
    gap: 40px;
}

.tariffs-block .general-info-checklist{
    gap: 8px;
}

.driver-license{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}
.driver-license-card{
    padding: 20px 24px;
    gap: 24px;
}
.driver-license-card__content{
    gap: 16px;
}

.driver-license-card__top{
    gap: 8px;
}

.driver-license-card__image{
    width: 120px;
    min-width: 120px;
}

.program-block{
    gap: 32px;
    padding: 24px 32px;
}

.program-block__tag{
    padding: 8px 16px;
    white-space: nowrap;
    border-radius: 40px;
}

.program-block__tags{
    flex-wrap: wrap;
}

.program-block__top{
    gap: 32px;
}

.program-block__content{
    display: flex;
    gap: 56px;
}

.program-card{
    gap: 8px;
    position: relative;
    width: 100%;
}
.program-card:not(:first-child){
    padding-left: 56px;
}
.program-card:not(:first-child)::before{
    content: '';
    display: flex;
    position: absolute;
    left: 0;
    top: 17px;
    width: 1px;
    height: 56px;
    background-color: var(--Stroke-light-gray);
}

.program-plan{
    margin-top: 32px;
    gap: 20px;
}


.program-plan-types{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}
.program-plan-type{
    padding: 24px;
    gap: 32px;
}
.program-plan__list{
    display: grid;
    grid-template-columns: 1fr 1fr;
}

.program-plan__stage{
    gap: 32px;
    padding: 24px;
}

.program-plan__duration{
    padding-bottom: 16px;
    border-bottom: 1px solid var(--Stroke-light-gray);
}

.program-plan-stage__top{
    gap: 12px;
}

.program-plan__stages{
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}

.accident-analytics{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}

.accident-analytic__card-content{
    margin-top: 20px;
    gap: 12px;
}

.accident-analytic__card{
    padding: 24px;
}

.accident-analytics__wrapper{
    gap: 20px;
}

.attention-light-block{
    padding: 12px 20px;
}

.training-checking{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.training-checking__card{
    padding: 24px;
    gap: 32px;
}

.training-checking__card-image{
    width: 118px;
    min-width: 112px;
    height: 164px;
}

.training-checking__card-content{
    gap: 20px;
}

.training-checking__bottom{
    margin-top: 24px;
}

.trainingPark__attention{
    padding: 12px 12px 12px 20px;
}

.vehicle-card{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}

.vehicle-card__info{
    padding: 32px 24px 24px;
    gap: 24px;
    height: 100%;
}
.vehicle-card__specs{
    gap: 12px;
}

.vehicle-card__specs li{
    display: flex;
    align-items: center;
    gap: 8px;
}

.vehicle-card__specs li:before{
    content: url("/assets/images/icons/check-mark-white.svg");
    display: flex;
    height: 16px;
    width: 16px;
}

.vehicle-card__header{
    gap: 24px;
}

.vehicle-card-badge__img{
    height: 112px;
    width: 112px;
    margin-top: -50%;
}

.vehicle-card__footer{
    gap: 48px;
}

.vehicle-card__badge{
    width: 143px;
    min-width: 143px;
    height: 136px;
    gap: 24px;
    padding: 16px;
}

.vehicle-card__details{
    padding-top: 8px;
    gap: 20px;
}

.machine-details{
    gap: 2px;
}

.vehicle-card__image{
    aspect-ratio: 1.3;
}
.approach__footer{
    margin-top: 12px;
    padding: 32px 40px;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    background-image: url('/assets/images/banners/banners-dark-bg.webp');
}
.approach-footer__content{
    max-width: 520px;
    gap: 40px;
}
.approach__cards{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}
.approach__card{
    padding: 24px;
    background: linear-gradient(90deg, #D4D7DB 0%, #E5E8EC 100%);
    min-height: 223px;
    gap: 40px;
}

.approach-card__image{
    height: 158px;
    width: 158px;
    min-width: 158px;
}

.approach-card__tags{
    flex-wrap: wrap;
}

.approach-card__tag{
    border-radius: 6px;
    padding: 4px 6px;
    color: var(--Text-blue);
}

.approach-card__bottom{
    gap: 12px;
}

.approach-card__content{
    height: 100%;
    flex: 1;
    gap: 20px;
}

.key-exercises__top{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}

.key-exercises-top__buttons{
    gap: 20px;
}


.tooltip-content{
    min-width: 260px;
    padding: 12px;
    bottom: calc(100% + 18px);
    display: none;
}

.tooltip-content:after{
    content: url("/assets/images/icons/polygon-icon.svg");
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translate(-50%, 15px);
}

.key-exercises__actions{
    gap: 20px;
}

.exercises-card{
    padding: 24px;
    gap: 24px;
    height: 100%;
}

.exercises-card__image{
    width: 97px;
    height: 71px;
}

.exercises-card__icon{
    height: 62px;
    width: 62px;
    border-radius: 100%;
}

.exercises-card__title{
    margin-top: 16px;
}

.exercises-card__subtitle{
    margin-top: 8px;
}

.general-info-checklist-gray{
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.general-info-checklist-gray li{
    display: flex;
    align-items: center;
    gap: 8px;
}

.general-info-checklist-gray li:before {
    content: url('/assets/images/icons/checkmark-icon-gray.webp');
    height: 16px;
}

.exercises-card__list{
    margin-top: auto;
}

.exercises-card__bottom{
    gap: 20px;
}

.exercises-card__info{
    padding: 12px 16px;
}

.tariffs__B .tariffs-card{
    max-width: 325px;
    min-width: 325px;
}

.tariff-cards__icon{
    padding-bottom: 70px;
    background-repeat: no-repeat;
    background-position: center;
    gap: 38px;
    background-image: url('/assets/images/cards-images/tariff-image.webp');
}

.tariffs-card__aside{
    min-height: 320px;
}

.categories-note{
    gap: 40px;
}
.categories-note__item{
    padding: 12px 16px;
    border-radius: 12px;
    box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.08);
    display: flex;
    align-items: center;
    width: 100%;
}

.categories-note__item:last-child{
    max-width: 390px;
}

.categories-note__content{
    display: flex;
    gap: 20px;
}

.categories-note__type:after{
    content: url("/assets/images/icons/check-mark-black-darck.svg");
    height: 24px;
    margin-top: -2px;
}

.categories-note__type{
    border-right: 1px solid var(--Stroke-light-gray);
    padding-right: 12px;
}

.categories-note__item--active .categories-note__type{
    border-right: 1px solid var(--Text-gray);
}


.categories-note__top{
    gap: 20px;
}
.tariffs{
    gap: 12px;
}

.registration-documents{
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}

.registration-documents__attention{
    padding: 8px 8px 8px 20px;
    gap: 40px;
}


.registration-documents__card{
    display: flex;
    flex-direction: column;
    padding: 24px;
    gap: 20px;
}

.training-category{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}

.training-category__card{
    padding: 24px 32px;
}

.training-category__list{
    gap: 16px;
}

.training-category__list b{
    display: contents;
    font-weight: 500;
}

.training-category__list li:not(:last-child){
    padding-bottom: 16px;
    border-bottom: 1px solid var(--Stroke-light-gray-2);
}

.state-blue-icon__list li{
    display: flex;
    gap: 12px;
}
.state-blue-icon__list li:before{
    content: url("/assets/images/icons/state-blue-icon.svg");
    display: flex;
    height: 24px;
    width: 24px;
}

.training-category__card--dark{
    gap: 20px;
}

.training-category__card-top{
    border-bottom: 1px solid var(--Stroke-light-gray-2);
    padding-bottom: 12px;
}

.category__subtitle{
    margin-top: 16px;
}

.course-info{
    gap: 6px;
}

.course-info__item{
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding-bottom: 6px;
    border-bottom: 1px solid var(--Stroke-light-gray);
}

.course-info__label{
    color: var(--Text-gray);
}

.training-program{
    margin-top: 32px;
    display: flex;
    gap: 20px;
}

.training-program__list{
    margin-bottom: -12px;
}

.training-program-list__item{
    width: 48%;
    margin-bottom: 12px;
}


.training-program__card{
    padding: 24px;
    gap: 24px;
}

.section-info{
    margin-top: 20px;
}

.trainings-tractor-wrapper{
    display: grid;
    grid-template-columns: repeat(3, 1fr );
    gap: 20px;
}

.exam-card{
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.knowledge-block{
    margin-top: 32px;
}

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

.gallery-item{
    display: flex;
    aspect-ratio: 1.675;
    border-radius: 12px;
    overflow: hidden;
}
.gallery-item img{
    border-radius: 12px;
}

.discounts-card{
    padding: 24px;
    gap: 12px;
    min-height: 212px;
}

.discounts__attention{
    margin-top: 24px;
    padding: 12px 8px 12px 20px;
}

.discounts-list li{
    display: flex;
    align-items: center;
    gap: 8px;
}

.discounts-list li:before{
    content: url("/assets/images/icons/circle-check.webp");
    display: flex;
    height: 16px;
    width: 16px;
}

.course_application_form{
    padding: 32px 40px;
    gap: 24px;
}

.course_application_form-comment{
    padding: 8px 12px 8px 16px;
    height: 73px;
}

.single-map-wrapper{
    width: 100%;
    overflow: hidden;
    border: 1px solid var(--Background-light-gray);
    flex: 1;
}
.single-map-wrapper iframe{
    width: 100%;
    height: 100%;
    border: none;
    min-height: 361px;
}

.tariffs__D .tariffs-card{
    justify-content: space-between;
    max-width: 325px;
    min-width: 325px;
}

.tariffs__D__content{
    gap: 24px;
}

.program-d-section{
    gap: 20px;
}

.reason-choose-us{
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}

.category-top__info{
    margin-top: 12px;
}

.program-plan__info{
    margin-top: 32px;
}

/*END categories pages*/