a{
    -webkit-tap-highlight-color: transparent;
}

.fixed-fix{
    width: 100%;
    height: 136px;
}

.header-top{
    background-color: #141414;
    position: fixed;
    width: 100%;
    z-index: 99999;
}

.header-bottom{
    position: absolute;
    top: 72px;
    width: 100%;
}
.header-bottom.menu-opened{
    position: fixed;
    z-index: 9999;
}

.search-panel {
    z-index: 99999;
}

.header-panel-menu__item{
    position: relative;
}

.header-panel-menu__item:last-child .header-submenu{
    grid-template-columns: repeat(1, 1fr);   
}

.header-panel-menu__submenu-wrapper{
    width: inherit;
}

.header-panel-menu__item:hover .header-panel-menu__submenu-wrapper:before{
    content: '';
    width: 100%;
    height: 224px;
    position: fixed;
    left: inherit;
    top: inherit;
    background: #141414;
    z-index: -1;
    transition: 0.3s;
}
.header-submenu{
    justify-content: center;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(4, 1fr);
    grid-column-gap: 56px;
    margin-left: -20px;
}

.header-submenu__col{
    padding: 10px 10px 10px 0;
    white-space: nowrap;
}

.mobile-menu-tabs-containers{
    position: fixed;
    bottom: 150px;
}

.close-menu, .close-search {
    width: 120px;
    height: 40px;
    background: #E2E2E2;
    box-shadow: 0px 0px 4px rgb(0 0 0 / 15%);
    border-radius: 29px;
    font-style: normal;
    font-weight: 600;
    font-size: 12px;
    line-height: 16px;
    letter-spacing: 0.1em;
    text-transform: lowercase;
    color: #504C4C;
    cursor: pointer;
    position: fixed;
    bottom: 50px;
    left: 50%;
    transform: translate(-50%, 0);
}

.mobile-search-tabs-containers{
    position: fixed;
    bottom: 150px;
    display: none;
}

.mobile-search-tabs-container__link {
    font-family: 'Montserrat',san-serif;
    display: block;
    transition: color ease-in-out .3s;
    margin-bottom: 30px;
    text-decoration-line: none;
    color: #FFFFFF;
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    letter-spacing: 0.02em;
    color: #FFFFFF;
}

.close-search{
    display: none;
}

section.content-gray{
    background: #f1f1f1;
}

section.content-darkgray{
    background: #eaeaea;
    box-shadow: inset 0px 0px 12px rgba(0, 0, 0, 0.05);
}

.header-top-menu{
    gap: 39px;
}

.header-bottom{
    background: #C4C4C4;
}
.header-bottom.menu-opened{
    background: #141414;
}
.header-bottom-wrapper{
    height: 64px;
    display: flex;
    align-content: center;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: space-between;
}
.header-bottom-left{
    display: flex;
    gap: 16px;
}
.header-bottom__item{
    display: flex;
    flex-direction: row;
    align-items: center;
    height: 28px;
    padding: 6px 10px 6px 10px;
    gap: 4px;
    background: #E2E2E2;
    box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.15);
    border-radius: 29px;
    font-weight: 500;
    font-size: 12px;
    line-height: 14px;
    text-align: center;
    letter-spacing: 0.1em;
    text-transform: lowercase;
    color: #504C4C;
    transition: 0.2s;
    white-space: nowrap;
}

.header-bottom__item.active,
.header-bottom__item:active,
.header-bottom__item:hover {
    background: #FECC43;
}

.header-bottom__item.active svg rect:nth-child(1),
.header-bottom__item:active svg rect:nth-child(1),
.header-bottom__item:hover svg rect:nth-child(1){
    fill: #fff;
}

.header-bottom__item:hover svg rect{
    transition: 0.2s;
}

.header-bottom-center{
    display: flex;
    gap: 16px;
    margin-left: 131px;
}
.header-bottom-center .header-bottom__item{
    text-align: center;
}
.header-bottom-right{
    display: flex;
    gap: 58px;
}
.header-bottom-right__item{
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    letter-spacing: 0.02em;
    text-transform: lowercase;
    color: #504C4C;
    transition: 0.3s;
}

.header-bottom-right__item:hover{
    color: #FFFFFF;
}

.section-header{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: space-between;
}

.section-header-right{
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
    min-width: 425px;
}

.section-search{
    display: flex;
    gap: 8px;
}

.section-search .search-field{
    min-width: 217px;
    border-bottom: 2px solid #504C4C;
    background: transparent;
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 400;
    font-size: 13px;
    line-height: 17px;
    display: flex;
    align-items: center;
    letter-spacing: 0.02em;
    text-transform: lowercase;
    color: #504C4C;
    border-radius: 0;
}

.section-search .search-field--long{
    min-width: 470px;
    margin-top: 4px;
}

.breadcrumbs{
    font-family: 'Montserrat';
}

.breadcrumbs__title{
    font-style: normal;
    font-weight: 600;
    font-size: 24px;
    line-height: 28px;
    color: #504C4C;
}

.content--article .breadcrumbs__item:last-child{
    display: none;
}

.btn-filter{
    cursor: pointer;
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 17px;
    display: flex;
    align-items: center;
    gap: 8px;
    letter-spacing: 0.02em;
    text-transform: lowercase;
    color: #504C4C;
    display: none;
}

.filters{
    display: none;
    margin: 40px -10px 20px;
    background: #FFFFFF;
    border-radius: 16px;
    padding: 24px;
}

.filters.active{
    display: block;
    
}

.filters-header{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
}
.filters-header__title{
    font-family: 'IBM Plex Sans';
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 21px;
    color: #626262;
}
.filters-header__title--mobile{
    display: none;
}

.filters__prev-category{
    display: flex;
    flex-direction: row;
    align-content: center;
    align-items: center;
    flex-wrap: nowrap;
    gap: 9px;
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    color: #504C4C;
}

.filters-header__close{
    cursor: pointer;
    display: none;
}

.filters-wrapper{
    margin-top: 16px;
    display: flex;
    align-content: center;
    flex-direction: column-reverse;
    flex-wrap: nowrap;
    align-items: flex-start;
    justify-content: flex-start;
}

.filters-formats {
    border-top: 2px solid #E2E2E2;
    width: 100%;
    padding-top: 25px;
    margin-top: 17px;
}

.filters-formats ul {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
}

.filters-formats ul li{
    display: flex;
    font-style: normal;
    gap: 4px;
    font-weight: 400;
    font-size: 12px;
    line-height: 22px;
    align-items: center;
    text-align: center;
    letter-spacing: 0.1em;
    text-transform: lowercase;
    color: #504C4C;
    margin-bottom: 8px;
    padding-left: 25px;
}

.filters-formats ul li label{
    display: flex;
    align-items: center;
    gap: 4px;
}

.filters-category {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    /* grid-template-rows: repeat(3, 1fr); */
    grid-column-gap: 50px;
    grid-row-gap: 15px;
    width: 100%;
    border-top: 2px solid #E2E2E2;
    padding-top: 29px;
    padding-bottom: 29px;
    max-height: 115px;
    overflow: hidden;
}
.filters-category.active{
    max-height: initial;
}

.filter__link{
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 17px;
    letter-spacing: 0.02em;
    color: #504C4C;
}
.filter__link:hover{
    font-weight: 600;
}

.n-articles-top{
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: repeat(3, 1fr);
    grid-column-gap: 32px;
    grid-row-gap: 32px;
}

.n-articles-top__card{
    border-radius: 16px;
    background-size: cover;
    position: relative;
    color: #FFF;
    transition: 0.3s;
}
.n-articles-top__card:hover{
    box-shadow: 0px 14px 14px rgba(0, 0, 0, 0.20);
}

.n-articles-top__card .card-wrapper{
    padding: 24px;
    display: flex;
    align-content: flex-start;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    height: 100%;
}
.n-articles-top__card .card-wrapper .card-info{
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: flex-start;
    grid-gap: 8px;
}

.n-articles-top__card:nth-child(1) .card-wrapper .card-info{
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: flex-start;
    grid-gap: 24px;
    max-width: 50%;
}

.n-articles-top__card .card__authors,
.n-articles-small__card .card__authors,
.n-articles-third__card .card__authors {
    font-weight: 400;
    font-size: 10px;
    line-height: 11px;
    letter-spacing: 0.1px;
}

.n-articles-top__card:nth-child(1) .card__title{
    font-weight: 700;
    font-size: 40px;
    line-height: 46px;
    color: #FFFFFF;
    max-width: 750px;
}

.n-articles-top__card .card__title{
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    line-height: 18px;
    padding: 0;
}

.n-articles-top__card .card__subtitle{
    font-weight: 400;
    font-size: 10px;
    line-height: 11px;
}

.n-articles-top__card .card__tag{
    position: absolute;
    top: 24px;
    left: 24px;
    padding: 5px 16px;
    display: inline-block;
    text-align: center;
    letter-spacing: 0.1em;
    text-transform: lowercase;
    color: #FFFFFF;
    border: 1px solid #FFFFFF;
    filter: drop-shadow(0px 0px 2px rgba(0, 0, 0, 0.15));
    border-radius: 29px;
}

.n-articles-top__card .card__favorite{
    position: absolute;
    top: 32px;
    right: 34px;
}

.n-articles-top__card .card__favorite svg path{
    stroke: #fff;
}

.n-articles-top__card .card__favorite.voted svg path{
    fill: #fff;
}

.n-articles-top__card .card-counters{
    display: flex;
    grid-gap: 16px;
    position: absolute;
    bottom: 24px;
    left: 24px;
}

.n-articles-top__card .card__read{
    position: absolute;
    bottom: 24px;
    right: 24px;
    font-weight: 400;
    font-size: 12px;
    border-bottom: 1px solid;
}

.n-articles-top__card .card__comments, .n-articles-top__card .card__likes{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: center;
    grid-gap: 8px;
}

.n-articles-top__card:nth-child(1){
    grid-area: 1 / 1 / 3 / 4;
    min-height: 500px;
}


.n-articles-top__card:nth-child(2){
    grid-area: 1 / 4 / 2 / 5;
    color: #504C4C;
    transition: 0.3s;
}
.n-articles-top__card:nth-child(2):hover{
    background: #fff !important;
}
.n-articles-top__card:nth-child(2) .card__tag, .n-articles-top__card:nth-child(3) .card__tag{
    color: #504C4C;
    border: 1px solid #504C4C;
}
.n-articles-top__card:nth-child(2) .card__tag:hover, .n-articles-top__card:nth-child(3) .card__tag:hover{
    background: #FECC43;
    box-shadow: 0px 0px 4px rgb(0 0 0 / 15%);
    border: 1px solid #FECC43;
}
.n-articles-top__card:nth-child(2) .card__favorite svg path, 
.n-articles-top__card:nth-child(3) .card__favorite svg path, 
.n-articles-top__card:nth-child(2) .card__comments svg path, 
.n-articles-top__card:nth-child(3) .card__likes svg path,
.n-articles-top__card:nth-child(3) .card__comments svg path, 
.n-articles-top__card:nth-child(2) .card__likes svg path{
    stroke: #504C4C;
}

.n-articles-top__card:nth-child(2) .card__favorite.voted svg path, .n-articles-top__card:nth-child(3) .card__favorite.voted svg path{
    fill: #504C4C;
}

.n-articles-top__card:nth-child(2) .card__authors, 
.n-articles-top__card:nth-child(3) .card__authors,
.n-articles-top__card:nth-child(2) .card__title, 
.n-articles-top__card:nth-child(3) .card__title{
    color: #504C4C;
}

.n-articles-top__card:nth-child(3){
    grid-area: 2 / 4 / 3 / 5;
    color: #504C4C;
}
.n-articles-top__card:nth-child(3):hover{
    background: #fff !important;
}
.n-articles-top__card:nth-child(4){
    grid-area: 3 / 1 / 4 / 2;
}
.n-articles-top__card:nth-child(5){
    grid-area: 3 / 2 / 4 / 3;
}
.n-articles-top__card:nth-child(6){
    grid-area: 3 / 3 / 4 / 4;
}
.n-articles-top__card:nth-child(7){
    grid-area: 3 / 4 / 4 / 5;
}

/* разные отображения первого экрана 1-1-1-1, 1-2-1, 2-1-1, 1-1-2) */

.n-articles-top.big-left .n-articles-top__card:nth-child(4) {
    grid-area: 3 / 1 / 4 / 3;
}

.n-articles-top.big-left .n-articles-top__card:nth-child(5) {
    grid-area: 3 / 3 / 3 / 3;
}

.n-articles-top.big-left .n-articles-top__card:nth-child(6) {
    grid-area: 3 / 4 / 4 / 4;
}

.n-articles-top.big-right .n-articles-top__card:nth-child(6) {
    grid-area: 3 / 3 / 4 / 5;
}

.n-articles-top.big-center .n-articles-top__card:nth-child(5) {
    grid-area: 3 / 2 / 4 / 4;
    
}

.n-articles-top.big-center .n-articles-top__card:nth-child(5) .card-info{
    max-width: 50%;
}

.n-articles-top.big-center .n-articles-top__card:nth-child(6) {
    grid-area: 3 / 4 / 4 / 4;
}

/* Слайдер на главной */
#slider-discussed{
    margin-left: -33px;
}

#slider-discussed .slick-slide img{
    border-radius: 0;
}
.slick-prev.slick-disabled, 
.slick-next.slick-disabled {
    display: none !important;
}

.block--discussed h2{
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    line-height: 18px;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    color: #504C4C;
}

.n-articles-small__card{
    border-radius: 16px;
    background-size: cover;
    position: relative;
    color: #504C4C;
    transition: 0.3s;
}

.n-articles-small__card .card-wrapper{
    border-radius: 14px;
    transition: 0.3s;
    position: relative;
}

.n-articles-small__card:hover .card-wrapper{
    box-shadow: 0px 4px 9px rgb(0 0 0 / 14%);
    background: #fff;
}

.n-articles-small__card .card-wrapper{
    padding: 24px;
    display: flex;
    align-content: flex-start;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    height: 100%;
    min-height: 240px;
    padding-top: 75px;
}
.n-articles-small__card .card-wrapper .card-info{
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: flex-start;
    grid-gap: 8px;
}

.n-articles-small__card .card__title{
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    line-height: 18px;
    padding: 0;
    color: #504C4C;
    text-transform: none;
}
.n-articles-small__card .card__subtitle{
    font-weight: 400;
    font-size: 10px;
    line-height: 11px;
}

.n-articles-small__card .card__tag{
    position: absolute;
    top: 24px;
    left: 24px;
    padding: 5px 16px;
    display: flex;
    text-align: center;
    letter-spacing: 0.1em;
    text-transform: lowercase;
    color: #504C4C;
    border: 1px solid #504C4C;
    filter: drop-shadow(0px 0px 2px rgba(0, 0, 0, 0.15));
    border-radius: 29px;
}

.n-articles-small__card .card__favorite{
    position: absolute;
    top: 32px;
    right: 34px;
}
.n-articles-small__card .card__favorite svg path,
.n-articles-small__card .card__comments svg path,
.n-articles-small__card .card__likes svg path {
    stroke: #504C4C;
}
.n-articles-small__card .card__favorite.voted svg path{
    fill: #504C4C;
}

.n-articles-small__card .card-counters{
    display: flex;
    grid-gap: 16px;
    position: absolute;
    bottom: 24px;
    left: 24px;
}

.n-articles-small__card .card__read{
    position: absolute;
    bottom: 24px;
    right: 24px;
    font-weight: 400;
    font-size: 12px;
    border-bottom: 1px solid;
}

.n-articles-small__card .card__comments, .n-articles-small__card .card__likes{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: center;
    grid-gap: 8px;
}

/* второй блок статей на главной */
.block--second-articles {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: 1fr;
    grid-column-gap: 32px;
    grid-row-gap: 0px;
}

.n-articles-second__card:nth-child(1) {
    grid-area: 1 / 1 / 2 / 3; 
    
}
.n-articles-second__card:nth-child(2) { 
    grid-area: 1 / 3 / 2 / 4; 
    
}
.n-articles-second__card:nth-child(3) { 
    grid-area: 1 / 4 / 2 / 5;
}

.n-articles-second__card{
    border-radius: 16px;
    background-size: cover;
    position: relative;
    color: #FFF;
    transition: 0.3s;
}

.n-articles-second__card:hover{
    box-shadow: 0px 14px 14px rgba(0, 0, 0, 0.20);
}

.n-articles-second__card:nth-child(n+4) {
    display: none;
}
.n-articles-second__card .second-card__bg{
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    position: absolute;
    left: 0;
    top: 0;
    border-radius: 16px;
}

.n-articles-second__card:nth-child(2), .n-articles-second__card:nth-child(3){
    color: #504C4C;
    background: #fff;
}

.n-articles-second__card:nth-child(2) .hacklink-tags-main, .n-articles-second__card:nth-child(3) .hacklink-tags-main{
    position: inherit;
}

.n-articles-second__card:nth-child(2) .card-wrapper, .n-articles-second__card:nth-child(3) .card-wrapper{
    justify-content: flex-start;
    padding: 0;
    padding-bottom: 50px;
}

.n-articles-second__card:nth-child(2) .card-info, .n-articles-second__card:nth-child(3) .card-info{
    padding: 0px 24px 24px 24px;
}

.second-card-wrap-links{
    display: flex;
    flex-direction: row;
    align-content: center;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 24px 24px 20px 24px;
}

.n-articles-second__card:nth-child(2) .card__title, .n-articles-second__card:nth-child(3) .card__title{
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    line-height: 18px;
    color: #504C4C;
}

.n-articles-second__card:nth-child(2) .card__tag, .n-articles-second__card:nth-child(3) .card__tag{
    color: #504C4C;
    border: 1px solid;
}

.n-articles-second__card:nth-child(2) .card__tag:hover, .n-articles-second__card:nth-child(3) .card__tag:hover{
    background: #FECC43;
    box-shadow: 0px 0px 4px rgb(0 0 0 / 15%);
    border: 1px solid #FECC43;
}

.n-articles-second__card:nth-child(2) .card__favorite, .n-articles-second__card:nth-child(3) .card__favorite{
    position: inherit;
}

.n-articles-second__card:nth-child(2) .card__favorite svg path, 
.n-articles-second__card:nth-child(3) .card__favorite svg path,
.n-articles-second__card:nth-child(2) .card__comments svg path, 
.n-articles-second__card:nth-child(3) .card__comments svg path,
.n-articles-second__card:nth-child(2) .card__likes svg path, 
.n-articles-second__card:nth-child(3) .card__likes svg path{
    stroke: #504C4C;
}

.n-articles-second__card:nth-child(2) .card__favorite.voted svg path, .n-articles-second__card:nth-child(3) .card__favorite.voted svg path{
    fill: #504C4C;
}

.n-articles-second__card:nth-child(2) .card-counters, 
.n-articles-second__card:nth-child(3) .card-counters
.n-articles-second__card:nth-child(2) .card__read, 
.n-articles-second__card:nth-child(3) .card__read{
    position: inherit;
}

.n-articles-second__card:nth-child(2) .second-card__bg, 
.n-articles-second__card:nth-child(3) .second-card__bg {
    width: 100%;
    height: 275px;
    -o-object-fit: cover;
    object-fit: cover;
    object-position: right;
    position: inherit;
    border-radius: 16px 16px 0 0;
}

.card-bottom-wrap{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    padding: 24px;
    position: absolute;
    bottom: 0;
    left: 0;
}

.n-articles-second__card.dark-font,
.n-articles-second__card.dark-font:nth-child(1) .card__title {
    color: #504C4C;
}

.n-articles-second__card.dark-font .card__tag {
    background: transparent;
    color: #504C4C;
    border: 1px solid #504C4C;
    transition: 0.3s;
}

.n-articles-second__card.dark-font .card__favorite svg path,
.n-articles-second__card.dark-font .card__comments svg path,
.n-articles-second__card.dark-font .card__likes svg path {
    stroke: #504C4C;
}

.n-articles-second__card:nth-child(1) .card-wrapper{
    justify-content: center;
}

.n-articles-second__card .card-wrapper{
    padding: 24px;
    display: flex;
    align-content: flex-start;
    flex-direction: column;
    justify-content: space-between;
    align-items: flex-start;
    height: 100%;
}

.n-articles-second__card .card-wrapper .card-info,
.n-articles-second__card:nth-child(1) .card-wrapper .card-info {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: flex-start;
}

.n-articles-second__card .card-wrapper .card-info{
    grid-gap: 8px;
}

.n-articles-second__card:nth-child(1) .card-wrapper .card-info{
    grid-gap: 24px;
    max-width: 50%;
}

.n-articles-second__card .card__authors, 
.n-articles-second__card .card__subtitle {
    font-weight: 400;
    font-size: 10px;
    line-height: 11px;
}
.n-articles-second__card .card__authors{
    letter-spacing: 0.1px;
}

.n-articles-second__card:nth-child(1) .card__title{
    font-weight: 700;
    font-size: 40px;
    line-height: 46px;
    color: #FFFFFF;
}

.n-articles-second__card .card__title{
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    line-height: 18px;
    padding: 0;
}

.n-articles-second__card .card__tag{
    position: absolute;
    top: 24px;
    left: 24px;
    padding: 5px 16px;
    display: inline-block;
    text-align: center;
    letter-spacing: 0.1em;
    text-transform: lowercase;
    color: #FFFFFF;
    border: 1px solid #FFFFFF;
    filter: drop-shadow(0px 0px 2px rgba(0, 0, 0, 0.15));
    border-radius: 29px;
}

.n-articles-second__card .card__favorite{
    position: absolute;
    top: 32px;
    right: 34px;
}
.n-articles-second__card .card__favorite svg path{
    stroke: #fff;
}
.n-articles-second__card .card-counters{
    display: flex;
    grid-gap: 16px;
    position: absolute;
    bottom: 24px;
    left: 24px;
}

.n-articles-second__card .card__read{
    position: absolute;
    bottom: 24px;
    right: 24px;
    font-weight: 400;
    font-size: 12px;
    border-bottom: 1px solid;
}

.n-articles-second__card .card__comments, .n-articles-second__card .card__likes{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: center;
    grid-gap: 8px;
}

/* форма подписки на главной */
.main-subscribe{
    position: relative;
    margin-top: 20px;
    margin-bottom: 25px;
}

.block--search .main-subscribe{
    margin-top: 50px;
}

.main-subscribe-img{
    position: absolute;
    right: 88px;
    bottom: -46px;
    z-index: 1;
    max-width: 175px;
}
.main-subscribe-img.hide{
    display: none;
}
.main-subscribe-img-send{
    display: none;
    position: absolute;
    right: -32px;
    bottom: -26px;
    z-index: 1;
    max-width: 175px;
}
.main-subscribe-img-send.show{
    display: block;
}
.main-subscribe h2{
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 700;
    font-size: 16px;
    line-height: 18px;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    color: #504C4C;
}

.main-subcribe-wrapper{
    padding: 34px 24px;
    background: linear-gradient(0deg, #FFB800, #FFB800), #C4C4C4;
    border-radius: 16px;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-content: center;
}

.main-subcribe-wrapper.text-sub.active{
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: flex-start;
    align-content: center;
}

.main-subcribe-wrapper .sub-title,
.main-subcribe-wrapper .sub-text,
.main-subcribe-wrapper .main-subscribe__title,
.main-subcribe-wrapper .main-subscribe__subtitle {
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 700;
    letter-spacing: 0.03em;
    color: #FFFFFF;
}

.main-subcribe-wrapper .sub-title{
    font-size: 34px;
    line-height: 39px;
    max-width: 90%;
}

.main-subcribe-wrapper .sub-text{
    font-size: 24px;
    line-height: 28px;
    max-width: 90%;
}

.main-subcribe-wrapper .main-subscribe__title{
    font-size: 34px;
    line-height: 39px;
}

.main-subcribe-wrapper .main-subscribe__subtitle{
    font-weight: 600;
    font-size: 24px;
    line-height: 40px;
}

.main-subscribe__form{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    margin-left: 210px;
}

.form-white{
    background: transparent;
    border-bottom: 2px solid #FFFFFF;
    color: #fff;
    font-weight: 100;
    font-size: 18px;
    line-height: 19px;
    letter-spacing: 0.2;
    padding-bottom: 10px;
    width: 288px;
}
.form-white::placeholder {
    color: #fff;
    opacity: 1;
    font-style: normal;
    font-weight: 100;
    font-size: 18px;
    line-height: 19px;
    letter-spacing: 0.2;
}

.form-descr{
    font-style: normal;
    font-weight: 400;
    font-size: 10px;
    line-height: 12px;
    color: #504C4C;
    margin-top: 10px;
    max-width: 290px;
}
.form-descr a{
    border-bottom: 1px solid;
}
.form-descr a:hover{
    border-bottom: 1px transparent;
}
.form-submit{
    position: absolute;
    top: -10px;
    right: -90px;
    width: 56px;
    height: 56px;
    border-radius: 50%;
    border: 2px solid #fff;
    background: transparent;
    transition: 0.3s;
    cursor: pointer;
    z-index: 999;
}
.form-submit:hover{
    background: #fff;
}
.form-submit:hover:after{
    border-left: 2px solid #000;
    border-right: 2px solid transparent;
    border-top: 2px solid #000;
    border-bottom: 2px transparent;
}
.form-submit:after{
    position: absolute;
    content: '';
    width: 20px;
    height: 20px;
    color: #fff;
    border-left: 2px solid;
    border-right: 2px solid transparent;
    border-top: 2px solid;
    border-bottom: 2px transparent;
    border-radius: 1px;
    left: 13px;
    top: 16px;
    transform: rotate(135deg);
}

/* третий блок статей на главной */

.block--third-articles {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: 1fr;
    grid-column-gap: 32px;
    grid-row-gap: 32px;
    width: 100%;
}
/* 
.n-articles-third:nth-child(1) {
    grid-area: 1 / 1 / 2 / 2; 
    
}
.n-articles-third__card:nth-child(2) { 
    grid-area: 1 / 2 / 2 / 3; 
    
}
.n-articles-third__card:nth-child(3) { 
    grid-area: 1 / 3 / 2 / 4;
}

.n-articles-third__card:nth-child(4) { 
    grid-area: 1 / 4 / 2 / 5;
} */
.block--third-articles .main-subscribe  { 
   grid-column: 1 / 5
} 
.n-articles-third__card{
    max-width: 325px;
    border-radius: 16px;
    background-size: cover;
    position: relative;
    color: #FFF;
    transition: 0.3s;
    color: #504C4C;
    background: #fff;
}

.n-articles-third__card:hover{
    box-shadow: 0px 14px 14px rgba(0, 0, 0, 0.20);
}

.n-articles-third__card.third:nth-child(n+5) {
    display: none;
}
.n-articles-third__card .third-card__bg{
    width: 100%;
    height: 275px;
    -o-object-fit: cover;
    object-fit: cover;
    object-position: right;
    position: absolute;
    left: 0;
    top: 0;
    border-radius: 16px;
}

.n-articles-third__card .card-wrapper{
    padding: 0;
}
.n-articles-third__card .card-info{
    padding: 0px 24px 24px 24px;
}

.second-card-wrap-links{
    display: flex;
    flex-direction: row;
    align-content: center;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 24px 24px 20px 24px;
}

.n-articles-third__card .third-card__bg{
    width: 100%;
    height: 275px;
    -o-object-fit: cover;
    object-fit: cover;
    position: inherit;
    border-radius: 16px 16px 0 0;
}

.n-articles-third__card.dark-font{
    color: #504C4C;
}

.n-articles-third__card .card-wrapper{
    display: flex;
    align-content: flex-start;
    flex-direction: column;
    align-items: flex-start;
    height: 100%;
    padding-bottom: 50px;
}

.n-articles-third__card .card-wrapper .card-info{
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: flex-start;
    grid-gap: 8px;
}

.n-articles-third__card .card__title{
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    line-height: 18px;
    padding: 0;
    color: #504C4C;
}
.n-articles-third__card .card__subtitle{
    font-weight: 400;
    font-size: 14px;
    line-height: 16px;
}
.n-articles-third__card .card__subtitle{
    font-weight: 400;
    font-size: 10px;
    line-height: 11px;
}

.n-articles-third__card .card__tag{
    top: 24px;
    left: 24px;
    padding: 5px 10px;
    text-align: center;
    letter-spacing: 0.1em;
    text-transform: lowercase;
    max-height: 31px;
    background: #E2E2E2;
    box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.15);
    border-radius: 29px;
    position: inherit;
    color: #504C4C;
    display: inline-flex;
    align-items: center;
}

.n-articles-third__card .card__favorite{
    position: absolute;
    top: 32px;
    right: 34px;
}

.n-articles-third__card .card-counters{
    display: flex;
    grid-gap: 16px;
    bottom: 24px;
    left: 24px;
}

.n-articles-third__card .card__read{
    bottom: 24px;
    right: 24px;
    font-weight: 400;
    font-size: 12px;
    border-bottom: 1px solid;
}

.n-articles-third__card .card__comments, .n-articles-third__card .card__likes{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: center;
    grid-gap: 8px;
}

.n-articles-third__card .card__favorite{
    position: inherit;
}

.n-articles-third__card .card__favorite svg path,
.n-articles-third__card .card__comments svg path,
.n-articles-third__card .card__likes svg path {
    stroke: #504C4C;
}

.n-articles-third__card .card__favorite.voted svg path{
    fill: #504C4C;
}

.n-articles-third__card .card-counters,
.n-articles-third__card .card__read {
    position: inherit;
}

.third-card-wrap-links{
    display: flex;
    flex-direction: row;
    align-content: center;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 24px 24px 20px 24px;
}

/* блок подборок */
.block--compilations h2{
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 700;
    font-size: 16px;
    line-height: 18px;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    color: #504C4C;
}
.slick-slide img{
    border-radius: 16px;
}
.card--slider-compilations{
    position: relative;
    border-radius: 16px;
    height: 200px;
    box-shadow: none;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: flex-start;
}
.card--slider-compilations:before{
    content: '';
    position: absolute;
    width: 170px;
    height: 170px;
    left: 75px;
    top: 19px;
    background: #DDDCDC;
    border-radius: 50%;
    transition: 0.3s;
}
.card--slider-compilations:hover:before{
    background: #FECC43;
}

.card--slider .card__title{
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 600;
    font-size: 30px;
    line-height: 34px;
    text-transform: uppercase;
    color: #504C4C;
}

.card--slider .card__counter{
    font-style: normal;
    font-weight: 400;
    font-size: 10px;
    line-height: 11px;
    color: #504C4C;
}

.card__tag{
    transition: 0.3s;
}

.n-articles-top__card:hover .card__tag,
.n-articles-second__card:hover .card__tag,
.n-articles-small__card:hover .card__tag {
    background: #FECC43;
    border: 1px solid #FECC43;
}

.n-articles-third__card:hover .card__tag,
.n-articles-small__card:hover .card__tag {
    background: #FECC43;
    box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.15);
}

.scroll-top{
    display: none;
    position: fixed;
    bottom: 50px;
    right: 10px;
    z-index: 999;
}
.scroll-top.active{
    display: block;
}
.scroll-top img{
    width: 50%;
}

.bg-remove2, .bg-remove3{
    background: none !important;
}
    
.btn--more{
    color: #000;
}  

.card__authors{
    height: 15px;
}

.card__content-bottom{
    margin-top: -20px;
    margin-left: 35px;
}

.tabs-container--second{
    padding-top: 46px;
    min-height: 480px;
}

/* START Темное оформление для карточек */

.n-articles-top__card.dark-font,
.n-articles-top__card.dark-font .card__title,
.n-articles-top__card.dark-font .card__authors,
.n-articles-top__card.dark-font .card__tag {
    color: #504C4C !important;
}

.n-articles-top__card.dark-font .card__tag{
    background: transparent;
    border: 1px solid #504C4C !important;
    transition: 0.3s;
}
.n-articles-top__card.dark-font:hover .card__tag{
    background: #FECC43 !important;
    border: 1px solid #FECC43 !important;
}

.n-articles-top__card.dark-font .card__favorite svg path,
.n-articles-top__card.dark-font .card__comments svg path, 
.n-articles-top__card.dark-font .card__likes svg path {
    stroke: #504C4C !important;
}

/* START хак вывода по 8 статей на главной  */
.articles-more-h-8 .n-articles-third__card:nth-child(-n+4){
    display: none;
}
/* END хак вывода по 8 статей на главной  */

/* END Темное оформление для карточек */

.hacklink-tags{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    gap: 10px;
}

.hacklink-tags-main{
    position: absolute;
    top: 30px;
    left: 24px;
    width: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    gap: 10px;
}

.hacklink-tags-main .card__tag{
    position: initial;
    display: flex;
}

.filters-close,
.fliters-close-wrapper,
.btn-filter-mobile {
    display: none;
}

@media screen and (max-width: 1199px){
    .block--discussed{
        background-color: inherit;
        margin-left: -40px;
        margin-right: -40px;
        padding: 28px 0 60px 40px;
    }

    .header-bottom-center{
        margin-left: 16px;
        padding-right: 16px;
    }
    .header-bottom {
        overflow: scroll;
    }
    .header-bottom-right{
        display: none;
    }
}

.header-bottom-center--mobile{
    display: none;
}
.n-articles-second__card:nth-child(1) .card__authors,
.n-articles-second__card:nth-child(1) .card__subtitle{
    z-index: 1;
}

@media screen and (min-width: 992px){
    .n-articles-top__card:nth-child(1) .card__subtitle,
    .n-articles-second__card:nth-child(1) .card__subtitle {
        font-weight: 400;
        font-size: 14px;
        line-height: 16px;
    }
    .n-articles-top__card:nth-child(1) .card__authors,
    .n-articles-second__card:nth-child(1) .card__authors {
        font-weight: 500;
        font-size: 12px;
        line-height: 14px;
        letter-spacing: 0.1px;
    }
    .n-articles-second__card:nth-child(1) .card__authors{
        z-index: 1;
    }
    .n-articles-second__card:nth-child(1) .card__subtitle{
        z-index:1;
    }
}
@media screen and (max-width: 992px){
    .n-articles-top__card .card-info,
    .n-articles-second__card:nth-child(1) .card-info {
        width: 60%;
    }
    
    .header-bottom-wrapper{
        justify-content: flex-start;
        display: none;
    }
    
    .header-bottom-center--mobile{
        display: flex;
        justify-content: space-between;
        flex-direction: row;
        flex-wrap: nowrap;
        gap: 20px;
        height: 64px;
        align-items: center;
    }
    
    .header-bottom-center--mobile:after{
        content: '';
        height: 20px;
        padding-right: 1px;
    }
    
    .n-articles-top{
        display: flex;
        grid-row-gap: 32px;
        flex-direction: column;
        flex-wrap: nowrap;
        justify-content: center;
    }
    .n-articles-top__card{
        min-height: 300px !important;
        display: flex;
        flex-direction: column;
        justify-content: center;
        color: #FFFFFF;
    }
    
    .n-articles-top__card:nth-child(1) .card-wrapper .card-info{
        grid-gap: 14px;
        max-width: 100%;
    }
    
    .n-articles-second__card:nth-child(1) .card-wrapper .card-info,
    .n-articles-top.big-center .n-articles-top__card:nth-child(5) .card-info{
        max-width: 100%;
    }

    .n-articles-top__card:nth-child(1) .card__subtitle{
        grid-gap: 12px;
    }
    .n-articles-top__card:nth-child(1) .card__title{
        font-size: 16px;
        line-height: 115%;
        color: #FFFFFF;
    }
    .n-articles-top__card:nth-child(2),.n-articles-top__card:nth-child(3) {
        display: flex;
        flex-direction: column;
        justify-content: center;
        color: #FFFFFF;
    }
    .n-articles-top__card:nth-child(2) .card-wrapper .card-info,.n-articles-top__card:nth-child(3) .card-wrapper .card-info{
        grid-gap: 14px;
    }
    .n-articles-top__card:nth-child(2) .card__subtitle,.n-articles-top__card:nth-child(3) .card__subtitle{
        grid-gap: 12px;
        color: #FFFFFF;
    }
    .n-articles-top__card:nth-child(2).dark-font .card__subtitle,.n-articles-top__card:nth-child(3).dark-font .card__subtitle{
        color: #504C4C;
    }
    .n-articles-top__card:nth-child(2) .card__title,.n-articles-top__card:nth-child(3) .card__title{
        font-size: 16px;
        line-height: 115%;
        color: #FFFFFF;
    }
    .n-articles-top__card:nth-child(2) .card__authors,.n-articles-top__card:nth-child(3) .card__authors{
        color: #FFFFFF;
    }
    .n-articles-top__card:nth-child(2) .card__tag, .n-articles-top__card:nth-child(3) .card__tag{
        color: #FFFFFF;
        border: 1px solid #FFFFFF;
    }
    .n-articles-top__card:nth-child(2) .card__favorite svg path, 
    .n-articles-top__card:nth-child(3) .card__favorite svg path,
    .n-articles-top__card:nth-child(2) .card__comments svg path, 
    .n-articles-top__card:nth-child(3) .card__likes svg path,
    .n-articles-top__card:nth-child(3) .card__comments svg path, 
    .n-articles-top__card:nth-child(2) .card__likes svg path {
        stroke: #FFF;
    }

    .block--second-articles{
        display: flex;
        flex-direction: column;
        flex-wrap: nowrap;
        grid-gap: 34px;
    }
    .n-articles-second__card:nth-child(1){
        display: flex;
        flex-direction: column;
        justify-content: center;
        min-height: 300px !important;
    }
    .n-articles-second__card:nth-child(1) .card-wrapper .card-info{
        grid-gap: 14px;
    }
    .n-articles-second__card:nth-child(1) .card__subtitle{
        grid-gap: 12px;
    }
    .n-articles-second__card:nth-child(1) .card__title{
        font-size: 16px;
        line-height: 115%;
        color: #FFFFFF;
    }
 
    #slider-discussed {
        margin-left: -20px;
    }
    .block--third-articles{
        display: flex;
        flex-direction: column;
        flex-wrap: wrap;
        grid-gap: 34px;
    }
    .n-articles-third__card{
        max-width: 100%;
    }
    .section-search .search-field{
        margin-bottom: 8px;
    }
    .main-subcribe-wrapper{
        display: flex;
        flex-direction: column;
        flex-wrap: nowrap;
        align-items: flex-start;
        align-content: center;
        margin-bottom: 50px;
    }
    .main-subcribe-wrapper .main-subscribe__title{
        font-size: 24px;
        line-height: 30px;
        letter-spacing: 0.03em;
        color: #FFFFFF;
        max-width: 264px;
    }
    
    .main-subcribe-wrapper .main-subscribe__subtitle{
        font-size: 16px;
        line-height: 40px;
        letter-spacing: 0.03em;
    }
    
    .main-subscribe-img{
        right: 18px;
        bottom: -75px;
        z-index: 1;
        max-width: 120px;
    }
    .main-subscribe__form{
        margin-top: 30px;
        margin-left: 0;
    }
    .form-submit {
        position: absolute;
        top: -14px;
        right: -45px;
        width: 40px;
        height: 40px;
    }
    .form-submit:after{
        width: 15px;
        height: 15px;
        left: 8px;
        top: 11px;
    }
    .filters-category{
        grid-template-columns: repeat(3, 1fr);
        max-height: initial;
    }
    .btn-show-all-cats{
        display: none !important;
    }
    .btn-filter-mobile{
        display: flex;
    }
}

.mobile-title,
.ico-prev-category__mobile {
    display: none;
}

.ico-prev-category__desktop{
    display: block;
    transform: rotate(180deg);
}

.card__introtext .highlight,
.card__title .highlight {
    background: rgba(254, 204, 67, 0.6);
}

@media screen and (max-width: 768px){
    .filters-header__title--mobile{
        display: block;
    }
    
    .filters-category{
        border-top: 0;
        padding-top: 0;
    }
    .filters__prev-category{
        padding-top: 20px;
        margin-left: -17px;
        padding-top: 20px;
        margin-left: -17px;
        font-family: 'Montserrat';
        font-style: normal;
        font-weight: 600;
        font-size: 14px;
        line-height: 17px;
        letter-spacing: 0.02em;
        color: #181818;
    }
    .mobile-title{
        display: block;
        font-family: 'Montserrat';
        font-style: normal;
        font-weight: 500;
        font-size: 12px;
        line-height: 12px;
        letter-spacing: 0.02em;
        color: #504C4C;
    }
    .section-header-right{
        flex-direction: row-reverse;
    }
    body.mobile-stop-scroll{
        overflow: hidden;
        max-height: 100vh;
    }
    .ico-prev-category__desktop{
        display: none;
    }
    .ico-prev-category__mobile{
        display: block;
    }
    .filters-category{
        grid-template-columns: repeat(2, 1fr);
    }
    .section-header {
        display: flex;
        flex-direction: column;
        flex-wrap: nowrap;
        align-items: inherit;
        justify-content: space-between;
    }
    .section-search{
        display: none;
    }
    .n-articles-third__card{
        max-width: 100%;
    }
    .filters.active{
        position: fixed;
        width: 100%;
        height: 100vh;
        z-index: 9999;
        margin: 0;
        top: 0;
        left: 0;
        border-radius: 0;
        overflow: scroll;
        padding-top: 100px;
        padding-bottom: 140px;
    }
    .btn-filter{
        display: block;
    }
    .btn-filter-mobile{
        display: flex;
    }
    .filters-header__close{
        display: block;
    }
    .filters.active.mob-deactive{
        display: none;
    }
    .filters-close-wrapper{
        display: block;
        position: fixed;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 76px;
        box-shadow: 0px -4px 4px rgb(0 0 0 / 10%);
        background: #fff;
        z-index: 999;
    }
    .filters-close{
        display: block;
        position: fixed;
        bottom: 18px;
        left: 50%;
        transform: translate(-50%, 0);
        background: #FECC43;
        box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.15);
        border-radius: 29px;
        font-style: normal;
        font-weight: 500;
        font-size: 12px;
        line-height: 16px;
        display: flex;
        align-items: center;
        text-align: center;
        letter-spacing: 0.1em;
        text-transform: lowercase;
        width: 120px;
        height: 40px;
        justify-content: center;
        color: #504C4C;
    }
    .breadcrumbs{
        display: none;
    }
    .btn-show-all-cats--tags-page{
        display: none !important;
    }
    .filters-all-categories{
        max-height: initial !important;
    }
    .mobile-search-tabs-containers{
        display: block;
    }
    .close-search{
        display: block;
    }

}

@media screen and (max-width: 500px){
    .wrapper {
        padding: 0 20px;
    }
    .block--discussed h2,
    .block--compilations h2 {
        font-size: 12px;
        line-height: 12px;
        margin-top: 10px;
    }
    .form-white{
        width: 150px;
        font-size: 14px;
    }
    .form-white::placeholder{
        font-size: 14px;
    }
    .form-descr{
        max-width: 150px;
        font-size: 9px;
    }
    .main-subcribe-wrapper .sub-text{
        font-size: 14px;
        line-height: 24px;
        max-width: 75%;
    }
    .scroll-top{
        bottom: 10px;
        right: -40px;
    }
    .card--slider .card__title{
        font-size: 26px;
        line-height: 26px;
    }
    .card__img-bg{
        width: 70%;
        left: 150px;
    }
    .slick-list{
        overflow: initial;
    }
    .filters-category{
        grid-template-columns: repeat(1, 1fr);
        grid-row-gap: 5px;
    }
    .filters-category .filter__item{
        padding: 5px 0;
        position: relative;
    }
    .filters-category .filter__item:after{
        content: '';
        background: url('../img/ico-arrow-svg.svg') no-repeat;
        background-size: contain;
        position: absolute;
        right: 0;
        top: 51%;
        transform: translate(0, -50%);
        width: 6px;
        height: 12px;
    }
    .section-header-right {
        display: flex;
        align-items: center;
        gap: 30px;
        min-width: inherit;
        justify-content: space-between;
        width: 102%;
    }
    .btn-filter span{
        display: none;
    }
}
.test-text-final {
    display: block;
    padding-bottom: 30px;
}
.block--search #pdopage #grid {
    position: relative;
}