.hero {
    height: 588px;
    background-image: url("../img/media/bg.webp");
    background-repeat: no-repeat;
    border-radius: 24px;
    position: relative;
    margin-top: 24px;
}
.hero__left {
    position: absolute;
    left: 54px;
    bottom: 29px;
}
.hero__right__flex {
    position: absolute;
    bottom: 26px;
    right: 32px;
    display: flex;
    justify-content: flex-end;
    gap: 40px;
}
.hero__right__flex__block {
    display: flex;
    gap: 15px;
}
.hero__right__flex__block__flex {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.hero__right__flex__block__flex__title {
    color: white;
    font-size: 20.57px;
    font-weight: 600;
}
.hero__right__flex__block__flex__desc {
    color: white;
    font-size: 18px;
    font-weight: 500;
}

@media (max-width: 1440px) {
    .hero {
        height: 530px;
    }
}
@media (max-width: 1000px) {
    .hero {
        height: 323px;
        background-size: cover;
        margin-top: 32px;
    }
    .hero__left {
        top: 21px;
        left: 23px;
    }
    .hero__left img {
        height: 48px;
    }
    .hero__right__flex {
        flex-direction: column;
        left: 23px;
        gap: 18px;
    }
    .hero__right__flex__block {
        gap: 12px;
    }
    .hero__right__flex__block img {
        height: 40px;
    }
    .hero__right__flex__block__flex__title {
        font-weight: 600;
        font-size: 16px;
    }
    .hero__right__flex__block__flex__desc {
        font-size: 14px;
        font-weight: 500;
    }
}
@media (max-width: 500px) {
    .hero {
        background-image: url("../img/media/bg2.webp");
    }
}
.h1 {
    font-size: 40px;
    font-weight: 600;
    margin-top: 48px;
    margin-bottom: 20px;
}
.h1__article {
    font-size: 40px;
    font-weight: 600;
    margin-top: 72px;
    margin-bottom: 20px;
}
.main__search {
    display: flex;
    gap: 72px;
    margin-bottom: 48px;
    position: relative;
}
.main__search__input {
    flex: 1;
    position: relative;
}
.main__search__input input {
    height: 60px;
    border-radius: 40px;
    font-size: 18px;
    border: 1px solid rgba(179, 179, 179, 0.5);
    padding: 0 40px;
    width: 100%;
}
.main__search__input input::-moz-placeholder {
    color: var(--color-grey-70, #b3b3b3);
}
.main__search__input input::placeholder {
    color: var(--color-grey-70, #b3b3b3);
}
.main__search__input svg {
    position: absolute;
    right: 37px;
    top: 20px;
    outline: none;
    cursor: pointer;
}

.main__search__results {
    position: absolute;
    left: 0;
    top: calc(100% + 10px);
    z-index: 30;
    width: calc(100% - 352px);
    max-height: 360px;
    overflow: auto;
    border: 1px solid rgba(179, 179, 179, 0.35);
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 18px 48px rgba(19, 19, 19, 0.14);
    overflow: hidden;
}

.main__search__results__list {
    display: flex;
    flex-direction: column;
    padding: 8px;
    max-height: 360px;
    overflow: auto;
    scrollbar-gutter: stable;
}

.main__search__results__list::-webkit-scrollbar {
    width: 8px;
}

.main__search__results__list::-webkit-scrollbar-thumb {
    border: 2px solid #fff;
    border-radius: 999px;
    background: rgba(179, 179, 179, 0.55);
}

.main__search__results__item {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 10px;
    border-radius: 16px;
    color: #131313;
    font-size: 16px;
    font-weight: 500;
    text-decoration: none;
}

.main__search__results__item:hover {
    background: rgba(214, 181, 149, 0.16);
}

.main__search__results__item img {
    width: 64px;
    height: 48px;
    flex: 0 0 64px;
    border-radius: 10px;
    object-fit: cover;
}

.main__search__results__empty {
    padding: 18px 20px;
    color: #767676;
    font-size: 16px;
}


.quiz__search {
    display: flex;
    gap: 72px;
    margin-bottom: 48px;
}
.quiz__search__input {
    flex: 1;
    position: relative;
}
.quiz__search__input input {
    height: 60px;
    border-radius: 40px;
    font-size: 18px;
    border: 1px solid rgba(179, 179, 179, 0.5);
    padding: 0 40px;
    width: 100%;
}
.quiz__search__input input::-moz-placeholder {
    color: var(--color-grey-70, #b3b3b3);
}
.quiz__search__input input::placeholder {
    color: var(--color-grey-70, #b3b3b3);
}
.quiz__search__input svg {
    position: absolute;
    right: 37px;
    top: 20px;
}
.main__search button {
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
    height: 60px;
    color: var(--color-blue-57, #5533ee);
    font-size: 18px;
    border-radius: 40px;
    width: 280px;
    border: 1px #E6E6E6 solid;
}
.quiz__search button {
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
    height: 60px;
    color: var(--color-blue-57, #5533ee);
    font-size: 18px;
    border-radius: 40px;
    width: 280px;
    border: 1px #E6E6E6 solid;
}

@media (max-width: 1000px) {
    .h1 {
        font-size: 24px;
        margin-top: 36px;
    }
    .h1__article {
        font-size: 24px;
        margin-top: 32px;

    }

    .quiz__search {
        gap: 40px;
    }
    .main__search {
        gap: 40px;
    }
}
@media (max-width: 800px) {
    .main__search {
        flex-direction: column;
        gap: 12px;
        margin-bottom: 0px;
    }
    .main__search__results {
        top: 62px;
        width: 100%;
        max-height: 320px;
    }
    .main__search button {
        width: 100%;
        height: 50px;
    }
    .quiz__search {
        flex-direction: column;
        gap: 12px;
        margin-bottom: 0px;
    }
    .quiz__search button {
        width: 100%;
        height: 50px;
    }



}
.h2__top {
    font-size: 32px;
    font-weight: 600;
    margin-bottom: 32px;
    margin-top: 49px;
}

@media (max-width: 800px) {
    .h2__top {
        font-size: 20px;
        margin-top: 26px;
        margin-bottom: 20px;
    }
}
.h2 {
    font-size: 32px;
    font-weight: 600;
    margin-bottom: 32px;
    margin-top: 64px;
}

@media (max-width: 800px) {
    .h2 {
        font-size: 20px;
        margin-top: 32px;
        margin-bottom: 20px;
    }
}
.theme {
    display: flex;
    flex-wrap: wrap;
    gap: 32px;
    width: 100%;
}
.theme__block {
    width: calc((100% - 96px) / 4);
    aspect-ratio: 350/340;
    position: relative;
    background: linear-gradient(to bottom, rgba(214, 181, 149, 1) 50%, white 50%);
    overflow: hidden;
    border-radius: 24px;
    height: 350px;
    box-shadow: 0 6px 20px 0 rgba(122, 88, 56, 0.3);
border: 1.5px solid rgba(214, 181, 149, 1);


}
.theme__block:after {
    content: "";
    position: absolute;
    top: 25px;
    right: 0;
    left: 0;
    height: 68%;
    background: radial-gradient(circle at 50% 38%, #DDBC9D 0%, #D5B494 100%);
    pointer-events: none;
    z-index: 1;
    border-radius: 24px 24px 50% 50% / 24px 24px 12% 12%;

}




.theme__block__img1 {
    height: 206px;
}
.theme__block__img2 {
    height: 192px;
}
.theme__block__img3 {
    height: 216px;
}
.theme__block__img4 {
    height: 177px;
}
.theme__block__img5 {
    height: 180px;
}
.theme__block__img6 {
    height: 186px;
}
.theme__block__img7 {
    height: 160px;
}
.theme__block__img8 {
    height: 202px;
}
.theme__block__special_img1 {
    height: 227px;
}
.theme__block__special_img2 {
    height: 224px;
}
.theme__block__special_img3 {
    height: 201px;
}
.theme__block__special_img4 {
    height: 220px;
}
.theme__block .theme__block__bg {
    position: absolute;
    top: 40%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 80%;
    -o-object-fit: contain;
    object-fit: contain;
    box-sizing: border-box;
    border-radius: 12px;
    max-height: 296px;
    z-index: 2;
}
.theme__block span {
    color: rgba(139, 108, 72, 1);
    font-size: 24px;

    font-weight: 600;
    box-sizing: border-box;

}
.theme__block .theme__block_arrow {
    position: absolute;
    bottom: 21px;
    z-index: 2;
    width: 100%;
    padding: 0 28px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 52px;
}

.theme__slider {
    position: relative;
    overflow: hidden;
    display: none;
}

.swiper-pagination-theme {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
    width: 100%;
    margin-top: 16px;
}

.swiper-pagination-bullet-theme {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: rgba(179, 179, 179, 0.5);
    cursor: pointer;
}

.swiper-pagination-bullet-theme:nth-last-child(3) {
    background-color: rgba(179, 179, 179, 0.3);
}

.swiper-pagination-bullet-theme:nth-last-child(2) {
    background-color: rgba(179, 179, 179, 0.2);
}

.swiper-pagination-bullet-theme:last-child {
    background-color: rgba(179, 179, 179, 0.1);
}

.swiper-pagination-bullet-theme.swiper-pagination-bullet-theme-active {
    background-color: #131313;
}

@media (max-width: 1600px) {
    .theme__block span {
        font-size: 18px;
        bottom: 30px;
    }
    .theme__block:after {
        height: 68%;
    }
    .theme__block {
        background: linear-gradient(to bottom, rgba(214, 181, 149, 1) 50%, white 50%);
    }
}
@media (max-width: 1200px) {

    .theme__block span {
        bottom: 16px;
    }
}
@media (max-width: 1000px) {
    .theme__block {
        width: calc((100% - 64px) / 3);
        height: 200px;
        border-radius: 12px;
    }
    .theme__block span {
        font-size: 16px;
    }

    .theme__block .theme__block_arrow img {
        height: 33px;
    }

    .theme__block .theme__block_arrow {
        bottom: 7px;
    }

}
@media (max-width: 700px) {
    .theme__block .theme__block_arrow img {
        display: none;
    }

    .theme__block span {
        text-align: center;
        font-size: 13px;

    }
    .theme__block .theme__block_arrow {
        justify-content: center;
        height: 41px;
    }

    .theme__block .theme__block_arrow {
        bottom: 0;
    }
    .theme__block .theme__block__bg {
        width: 54%;
    }
    .theme__block:after {
        height: 62%;
    }





    .swiper-pagination-theme {
        gap: 3px;
    }
    .artilce__top .swiper-pagination-theme {
        margin-top: 27px;
    }
    .theme {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 22px;
    }
    .theme__slider {
        display: none;
    }
    .theme__block {
        width: 100%;
        height: 167px;
    }
    .swiper-pagination-bullet-theme {
        width: 6px;
        height: 6px;
    }
}

@media (max-width: 400px) {
.theme {
    gap: 12px;

}
    .theme__block span {
        font-size: 11px;
    }
    .main__search__input input {
        padding: 0 30px;
    }
    .quiz__search__input input {
        padding: 0 30px;
    }

    .theme__block .theme__block_arrow {
        bottom: 5px;
    }
    .theme__block:after {
        height: 57%;
    }
}


.swiper__slide__block {
    position: relative;
    background: #d6b595;
    border-radius: 12px;
    height: 251px;
    text-align: center;
}
.swiper__slide__block img {
    height: 90%;
    border-radius: 12px;
    padding-top: 39px;
}
.swiper__slide__block span {
    color: white;
    font-size: 20px;
    position: absolute;
    bottom: 34px;
    font-weight: 700;
    box-sizing: border-box;
    z-index: 2;
    left: 24px;
}
.swiper__slide__block::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 12px;
    background: linear-gradient(180deg, rgba(202, 163, 121, 0) 36%, rgb(202, 163, 121) 83%);
    pointer-events: none;
    z-index: 1;
}

.revievs__head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 64px;
    margin-bottom: 32px;
}
.revievs__head__title {
    font-size: 32px;
    font-weight: 600;
}
.revievs__head__all {
    text-decoration: underline !important;
    font-size: 20px;
    color: var(--color-grey-46, #767676);
}

.revievs__videos {
    width: 100%;
    overflow: hidden;
}
.revievs__videos > .swiper-wrapper {
    display: flex;
    flex-wrap: wrap;
    gap: 32px;
}
.revievs__videos__video {
    width: calc((100% - 96px) / 4);
    height: 508px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    position: relative;
    border-radius: 12px;
    overflow: hidden;
    -webkit-tap-highlight-color: transparent;
    user-select: none;
}
.revievs__videos__video::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    height: 45%;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.8) 100%);
    pointer-events: none;
    z-index: 1;
}
.revievs__videos__video.is-playing::after {
    opacity: 0;
}
.revievs__videos__video * {
    -webkit-tap-highlight-color: transparent;
}
.revievs__videos__video::selection,
.revievs__videos__video *::selection {
    background: transparent;
}
.revievs__videos__video video {
    position: absolute;
    inset: 0;
    width: 100%;
    max-width: none;
    height: 100%;
    display: block;
    border-radius: 12px;
    -o-object-fit: cover;
    object-fit: cover;
    z-index: 0;
}
.revievs__videos__video__block {
    position: absolute;
    bottom: 34px;
    justify-content: space-between;
    display: flex;
    width: 100%;
    padding: 0 20px;
    z-index: 2;
    align-items: center;
}
.revievs__videos__video__block__play {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 2;
    cursor: pointer;
}
.revievs__videos__video__block__svg {
    border: 0;
    height: 44px;
    width: 44px;
    background: #ffffff;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    padding: 0;
}
.revievs__videos__video__block__inner {
    font-size: 32px;
    font-weight: 700;
    color: white;

}
.revievs__videos__video__block__inner__top {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.revievs__videos__video__block__date {
    color: white;
    font-size: 14px;
    font-weight: 400;
}
.revievs__videos__video__block span {
    color: white;
    font-size: 20px;
    font-weight: 600;
    box-sizing: border-box;
    z-index: 1;
}

.revievs__videos__video--expensive {
    height: auto;
    background: none;
    border-radius: 0;
    overflow: visible;
}

.revievs__videos__video--expensive::after {
    display: none;
}

.revievs__videos__video__photo {
    position: relative;
    height: 508px;
    overflow: hidden;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    border-radius: 12px;
}

.revievs__videos__video__photo::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    height: 45%;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.8) 100%);
    pointer-events: none;
    z-index: 1;
}

.revievs__videos__bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 12px;
}
.revievs__videos__bottom .revievs__videos__bottom__left {
    border: 0;
    background: transparent;
    color: #212121;
    cursor: pointer;
    font-size: 14px;
    padding: 0;
    text-decoration: underline dotted;
    text-underline-offset: 4px;
}
.revievs__videos__bottom .revievs__videos__bottom__right {
    color: #9A9A9A;
    font-size: 14px;
}

.videos-expensive-page .revievs__videos__video--expensive .revievs__videos__video__block span,
.videos-expensive-page .revievs__videos__video--expensive .revievs__videos__video__block__date,
.videos-expensive-page .revievs__videos__video--expensive .revievs__videos__video__block__svg {
    display: none;
}

.videos-expensive-page .revievs__videos__video--expensive .revievs__videos__video__block span {
    font-size: 24px;
    font-weight: 600;
}

.videos-expensive-page .revievs__videos__video--expensive .revievs__videos__video__block__inner__top {
    font-size:32px;
    font-weight: 600;
}

.videos-expensive-page .revievs__videos__video--expensive .revievs__videos__video__block {
    padding-left: 24px;
}



.receipt-modal[hidden] {
    display: none;
}

.receipt-modal {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px;
}

.receipt-modal__overlay {
    position: absolute;
    inset: 0;
    border: 0;
    background: rgba(19, 19, 19, 0.72);
    cursor: pointer;
}

.receipt-modal__content {
    position: relative;
    z-index: 1;
    max-width: calc(100vw - 80px);
    max-height: calc(100vh - 80px);
    overflow: auto;
    background: #ffffff;
    border-radius: 12px;
    padding: 48px 170px 48px;
}

.receipt-modal__content img {
    display: block;
    max-width: 100%;
    max-height: calc(100vh - 176px);
    width: auto;
    height: auto;
}

.receipt-modal__close {
    position: absolute;
    top: 12px;
    right: 16px;
    border: 0;
    background: transparent;
    color: #131313;
    cursor: pointer;
    font-size: 32px;
    line-height: 1;
    padding: 0;
}

.revievs__videos > .swiper-wrapper > .revievs__videos__video {
    width: calc((100% - 96px) / 4);
    height: 508px;
}

.revievs__videos > .swiper-wrapper > .revievs__videos__video--expensive {
    height: auto;
}

.swiper-pagination-reviews {
    display: none;
}

@media (max-width: 1440px) {
    .revievs__videos > .swiper-wrapper > .revievs__videos__video {
        height: 400px;
    }
    .revievs__videos > .swiper-wrapper > .revievs__videos__video--expensive {
        height: auto;
    }
    .revievs__videos__video__photo {
        height: 400px;
    }
}
@media (max-width: 1000px) {
    .revievs__videos > .swiper-wrapper > .revievs__videos__video {
        width: calc((100% - 64px) / 3);
    }
}
@media (max-width: 900px) {
    .revievs__videos > .swiper-wrapper > .revievs__videos__video {
        width: calc((100% - 32px) / 2);
    }
}
@media (max-width: 700px) {
    .revievs__videos {
        overflow: visible;
        width: calc(100% + 15px);
        margin-right: -15px;
    }
    .revievs__videos > .swiper-wrapper > .revievs__videos__video {
        height: 507px;
    }
    .revievs__videos > .swiper-wrapper > .revievs__videos__video--expensive {
        height: auto;
    }
    .revievs__videos__video__photo {
        height: 507px;
    }
    .revievs__head {
        margin-top: 28px;
        margin-bottom: 20px;
    }
    .revievs__videos > .swiper-wrapper {
        flex-wrap: nowrap;
        gap: 0;
    }
    .revievs__videos--no-mobile-slider {
        overflow: hidden;
        width: 100%;
        margin-right: 0;
    }
    .revievs__videos--no-mobile-slider > .swiper-wrapper {
        display: flex;
        flex-wrap: wrap;
        gap: 16px;
        transform: none !important;
    }
    .revievs__videos--no-mobile-slider > .swiper-wrapper > .revievs__videos__video {
        width: 100%;
        flex-shrink: 1;
    }
    .revievs__videos--no-mobile-slider > .swiper-pagination-reviews {
        display: none;
    }
    .swiper-pagination-reviews {
        display: flex;
    }
    .videos-expensive-page .revievs__videos__video--expensive .revievs__videos__video__block span,
    .videos-expensive-page .revievs__videos__video--expensive .revievs__videos__video__block__date {
        display: block;
    }
    .videos-expensive-page .revievs__videos__video--expensive .revievs__videos__video__block__svg {
        display: flex;
    }
    .videos-expensive-page .revievs__videos__video--expensive .revievs__videos__bottom {
        display: none;
    }
    .videos-expensive-page .revievs__videos__video--expensive .revievs__videos__video__block__inner__top {
        display: none;
    }
    .revievs__head__title {
        font-size: 20px;
    }
    .videos-all-page .revievs__head__title {
        width: 100%;
        text-align: center;
    }
    .revievs__head__all {
        font-size: 14px;
    }
}

@media (max-width: 390px) {
    .revievs__head__all {
        font-size: 12px;
    }
    .revievs__head__title {
        font-size: 18px;
    }
}



.artilce__top {
    width: 100%;
    overflow: hidden;
}
.artilce__top > .swiper-wrapper {
    display: flex;
    flex-wrap: wrap;
    row-gap: 32px;
    -moz-column-gap: 32px;
    column-gap: 32px;
}
.artilce__top__block {
    --article-image-height: 340px;
    display: block;
    height: 340px;
    border-radius: 12px;
    position: relative;
    text-decoration: none;
}
.artilce__top__block::before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    height: var(--article-image-height);
    border-radius: 12px;
    background-image: var(--article-bg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    z-index: 0;
}
.artilce__top__block__flex {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}
.artilce__top__block__flex__reactions {
    background: rgba(208, 171, 131, 0.1);
    border-radius: 32px;
    padding: 4px 12px;
    display: flex;
    gap: 18px;
    height: 44px;
}
.artilce__top__block__flex__reactions__reaction {
    appearance: none;
    background: transparent;
    border: 0;
    color: inherit;
    cursor: pointer;
    display: flex;
    font: inherit;
    gap: 8px;
    align-items: center;
    padding: 0;
}
.artilce__top__block__flex__reactions__reaction span:first-child {
    font-size: 20px;
}
.artilce__top__block__flex__reactions span {
    display: flex;
    gap: 8px;
}
.artilce__top__block__flex__reactions [hidden] {
    display: none !important;
}
.artilce__top__block__flex__time {
    font-size: 16px;
    font-weight: 600;
    color: #d0d0d0;
    display: flex;
    gap: 6px;
}
.artilce__top__block__imageLink {
    display: block;
    position: relative;
    z-index: 1;
    height: var(--article-image-height);
    margin-bottom: 29px;
    border-radius: 12px;
    overflow: hidden;
}



.artilce__top__block img {
    display: block;
    width: 100%;
    height: var(--article-image-height);
    border-radius: 12px;
    visibility: hidden;
}
.artilce__top__block__title {
    position: relative;
    z-index: 1;
    color: #212121;
    font-size: 24px;
    font-weight: 600;
    line-height: 1.2;
    min-height: 56px;
    margin-bottom: 20px;
    overflow: hidden;
}
.artilce__top__block__title a {
    color: inherit;
    text-decoration: none;
}

.artilce__top > .swiper-wrapper > .artilce__top__block {
    width: calc((100% - 64px) / 3);
    height: 340px;
}

.swiper-pagination-articles {
    display: none;
}

@media (min-width: 900px) {
    .artilce__top > .swiper-wrapper > .artilce__top__block {
        height: auto;
    }
    .artilce__top__block {
        --article-image-height: 340px;
    }
    .artilce__top__block img {
        display: block;
        width: 100%;
        height: 340px;
        margin-bottom: 29px;
    }
}
@media (max-width: 1600px) {
    .artilce__top__block__title {
        font-size: 20px;

    }

}

@media (max-width: 1270px) {
    .artilce__top > .swiper-wrapper > .artilce__top__block {
        width: calc((100% - 32px) / 2);
    }
}
@media (max-width: 899px) {
    .artilce__top__block__imageLink:after {
        content: "";
        position: absolute;
        right: 0;
        bottom: 0;
        left: 0;
        height: 45%;
        background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.8) 100%);
        pointer-events: none;
        z-index: 1;
    }

    .artilce__top {
        overflow: visible;
    }
    .artilce__top__block__flex__reactions span {
        color: white;
    }
    .artilce__top > .swiper-wrapper {
        flex-wrap: nowrap;
        gap: 0;
    }
    .artilce__top > .swiper-wrapper > .artilce__top__block {
        height: auto;
    }
    .artilce__top .artilce__top__block {
        --article-image-height: 242px;
        display: grid;
        grid-template-columns: 1fr;
        row-gap: 0;
    }
    .artilce__top .artilce__top__block::before {
        height: var(--article-image-height);
        background-size: cover;
    }
    .artilce__top__block img {
        grid-area: 1/1;
        width: 100%;
        height: var(--article-image-height);
        margin-bottom: 0;
    }
    .artilce__top__block__imageLink {
        grid-area: 1/1;
        height: var(--article-image-height);
        margin-bottom: 0;
    }
    .artilce__top__block__flex {
        grid-area: 1/1;
        align-self: end;
        z-index: 1;
        margin: 4px 10px;
    }
    .artilce__top__block__flex__reactions {
        background: rgba(208, 171, 131, 0.25);
        backdrop-filter: blur(8px);
        -webkit-backdrop-filter: blur(8px);
        height: 30px;
    }
    .artilce__top__block__flex__reactions__reaction span:last-child {
        font-size: 12px;
    }
    .artilce__top__block__flex__reactions__reaction span:first-child {
        font-size: 16px;
    }
    .artilce__top__block__flex__time {
        color: #fff;
    }
    .artilce__top__block__flex__time svg path {
        stroke: #fff;
    }
    .artilce__top__block__title {
        grid-area: 2/1;
        min-height: 0;
        margin-bottom: 0;
        padding-top: 10px;
    background: transparent;
        z-index: 2;
        height: 82px;
    }
    .swiper-pagination-articles {
        display: flex;
    }
}
@media (max-width: 420px) {
    .artilce__top__block__flex__time {
        display: none;
    }
    .artilce__top__block img {
        height: var(--article-image-height);
    }
}
.bottom_divider {
    height: 100px;
}

@media (max-width: 800px) {
    .bottom_divider {
        height: 32px;
    }
}

.artilce__top--grid {
    overflow: visible;
}
.artilce__top--grid > .swiper-wrapper {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 32px;
}
.artilce__top--grid > .swiper-wrapper > .artilce__top__block {
    width: auto;
}
.artilce__top--grid > .swiper-wrapper > .artilce__top__block[hidden] {
    display: none !important;
}
.artilce__top--grid .swiper-pagination-articles {
    display: none;
}

@media (max-width: 1270px) {
    .artilce__top--grid > .swiper-wrapper {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
@media (max-width: 899px) {
    .artilce__top--grid > .swiper-wrapper {
        display: grid;
        grid-template-columns: 1fr;
        gap: 20px;
    }
    .artilce__top--grid > .swiper-wrapper > .artilce__top__block {
        width: auto;
    }
}
.pagination__article {
    margin-top: 60px;
    margin-bottom: 96px;

}
.pagination__article {
margin-left: 48px;
    display: flex;
    gap: 64px;
    justify-content: space-between;
    align-items: center;
}
.pagination__article  .pagination__article__inner {
    display: flex;
gap: 40px;
    font-weight: 600;
    font-size: 18px;

}
.pagination__article button {
    appearance: none;
    background: transparent;
    border: 0;
    color: inherit;
    cursor: pointer;
    font: inherit;
    padding: 0;
}
.pagination__article button:disabled {
    cursor: default;
    opacity: 0.45;
}
.pagination__article .pagination__article__active {
    color: #CAA379;
}

.pagination__article .pagination__article__all {
    font-size: 20px;
}

.pagination__article .pagination__article__all[hidden] {
    display: none !important;
}

.pagination__article  .pagination__article__block  {
display: flex;
gap: 64px;
}

@media (max-width: 899px) {
    .pagination__article .pagination__article__all {
        display: none;
    }
    .pagination__article {
        justify-content: center;
margin-bottom: 56px;
margin-top: 44px;
margin-left: 0;
    }
    .pagination__article .pagination__article__inner {
        gap: 32px;
    }
    .pagination__article .pagination__article__block {
        gap: 44px;
    }

    .pagination__article button {
        font-size: 14px;

    }


}
.banner {
    height: 318px;
}
.banner__mob {
    display: none;
}
@media (max-width: 1440px) {
    .banner {
        height: auto;
    }

}
@media (max-width: 800px) {
 .banner {
     display: none;
 }
    .banner__mob {
        display: block;
    }
}



.artilce__quiz {
    border: 1px solid rgba(241, 242, 249, 1);
    border-radius: 32px;
    padding: 62px 52px;
}

.artilce__quiz  .artilce__quiz__title {
    font-weight: 600;
    font-size: 28px;
    margin-bottom: 40px;
}
.artilce__quiz .artilce__quiz__question__flex {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 16px;
    position: relative;
}
.artilce__quiz .artilce__quiz__question {
    border: 1px solid rgba(217, 219, 233, 1);
    border-radius: 32px;
    padding: 40px 40px;
    height: 106px;
    flex: 1;
    font-size: 24px;
    font-weight: 600;
}
.artilce__quiz .artilce__quiz__question__active {
    border: 1px solid rgba(197, 151, 101, 1);
}
.artilce__quiz .artilce__quiz__question__active input[type="radio"] {
    position: absolute;
    right: 24px;
    top: 20px;
}


.artilce__quiz .artilce__quiz__question__full {
    border: 1px solid rgba(217, 219, 233, 1);
    border-radius: 32px;
    padding: 40px 40px;
    height: 106px;
    flex: 1;
    font-size: 24px;
    font-weight: 600;
    position: relative;

}
.artilce__quiz .artilce__quiz__bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;

    margin-top: 48px;
}

.artilce__quiz .artilce__quiz__bottom .artilce__quiz__bottom__stage {
font-size: 18px;
rgba(111, 108, 143, 1)
}

.artilce__quiz .artilce__quiz__bottom .artilce__quiz__bottom__btn {
    font-size: 18px;
    color: white;
width: 160px;
    background: rgba(202, 163, 121, 1);
    height: 48px;
    border-radius: 12px;
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: 0px 3px 4px rgba(223.02, 237.74, 255, 0.10) inset, 0px 1px 1px rgba(255, 255, 255, 0.10) inset, 0px -2px 2px rgba(0, 66.30, 137.17, 0.15) inset, 0px 2px 5px rgba(74, 58, 255, 0.25);
}
.artilce__quiz .artilce__quiz__bottom .artilce__quiz__bottom__btn__back {
    font-size: 18px;
    color: #170F49;
    width: 160px;
    background: white;
    height: 48px;
    border-radius: 12px;
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    border: 1px solid #D9DBE9;

}
.artilce__quiz .artilce__quiz__bottom .artilce__quiz__bottom__btn__back--hidden {
    display: none;
}
.Article__quiz {
   margin-bottom: 305px;
}
.hide__review__bottom {
    display: none;
}
.artilce__quiz__bottom__btn__flex {
    display: flex;
    gap: 24px;
}





@media (max-width: 1000px) {





    .revievs__head__title {
        font-size: 22px;
        text-align: center;
    }
    .revievs__head {
        margin-bottom: 32px;
    }
    .artilce__quiz {

        padding: 48px;
    }
    .artilce__quiz .artilce__quiz__title {
        font-size: 20px;
        margin-bottom: 32px;
    }
    .artilce__quiz .artilce__quiz__question {
        font-size: 16px;
        padding: 0px 24px;
        max-height: 92px;
        min-height: 92px;
        display: flex;
        align-items: center;
        border-radius: 16px;
    }
    .artilce__quiz .artilce__quiz__question__flex {
        flex-direction: column;
    }
    .artilce__quiz .artilce__quiz__question__full {
        font-size: 16px;     padding: 40px 24px;
        height: 92px;
        border-radius: 16px;
    }
    .artilce__quiz .artilce__quiz__bottom {
        margin-top: 32px;   flex-direction: column;
        width: 100%;
        gap: 32px;
    }

    .artilce__quiz .artilce__quiz__bottom .artilce__quiz__bottom__stage {
        text-align: left;
        width: 100%;
        font-size: 14px;
    }
    .artilce__quiz .artilce__quiz__bottom .artilce__quiz__bottom__btn {
        height: 48px;
        width: 120px;
        font-size: 16px;
    }
    .artilce__quiz .artilce__quiz__bottom .artilce__quiz__bottom__btn__back {
        height: 48px;
        width: 120px;
        font-size: 16px;
    }
    .Article__quiz {
        margin-bottom: 32px;
    }

    .hide__review__bottom {
        display: block;
    }







}
@media (max-width: 390px) {
    .artilce__quiz {
        padding: 30px;
    }
    .artilce__quiz .artilce__quiz__question {
        padding: 0px 36px;
    }
}

.banner__category {
    height: 318px;
    margin-top: 24px;
}
.banner__category__mob {
    display: none;
    margin-top: 32px;
}
@media (max-width: 1440px) {
    .banner__category {
        height: auto;
    }
}

@media (max-width: 800px) {
    .banner__category {
        display: none;
    }
    .banner__category__mob {
        display: block;
    }
}

.h1__category {
    font-size: 40px;
    font-weight: 700;
    margin-top: 48px;
    margin-bottom: 20px;
}


@media (max-width: 1000px) {
    .h1__category {
        font-size: 24px;
        margin-top: 32px;
    }

}

.artilce__quiz__question,
.artilce__quiz__question__full {
    cursor: pointer;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
}

.artilce__quiz__question input[type="radio"],
.artilce__quiz__question__full input[type="radio"] {
    appearance: none;
    -webkit-appearance: none;
    position: absolute;
    right: 24px;
    top: 20px;
    transform: none;
    flex: 0 0 auto;
    width: 24px;
    height: 24px;
    margin: 0;
    border: 2px solid rgba(217, 219, 233, 1);
    border-radius: 50%;
    background: transparent;
    box-shadow: 0 2px 6px rgba(50, 55, 80, 0.14);
    cursor: pointer;
}

.artilce__quiz__question input[type="radio"]:checked,
.artilce__quiz__question__full input[type="radio"]:checked {
    border-color: rgba(214, 181, 149, 1);
    background: rgba(214, 181, 149, 1);
}

.artilce__quiz__question input[type="radio"]::before,
.artilce__quiz__question__full input[type="radio"]::before {
    content: "";
    position: absolute;
    inset: 5px;
    border-radius: 50%;
    background: white;
    transform: scale(0);
    transition: transform .2s;
}

.artilce__quiz__question input[type="radio"]:checked::before,
.artilce__quiz__question__full input[type="radio"]:checked::before {
    transform: scale(1);
}

.artilce__quiz__question:has(input[type="radio"]:checked),
.artilce__quiz__question__full:has(input[type="radio"]:checked) {
    border-color: rgba(214, 181, 149, 1);
}

@media (max-width: 700px) {
    .artilce__quiz__question input[type="radio"],
    .artilce__quiz__question__full input[type="radio"] {
        width: 18px;
        height: 18px;
        right: 18px;
        top: 18px;
    }

    .artilce__quiz__question input[type="radio"]::before,
    .artilce__quiz__question__full input[type="radio"]::before {
        inset: 3px;

    }

    .artilce__quiz .artilce__quiz__question__active input[type="radio"] {

        width: 18px;
        height: 18px;
        right: 18px;
        top: 18px;
    }


}