/* ==================================================
   КАТАЛОГ СТАТЕЙ
   ================================================== */

.catalog-page {
    width: 100%;

    padding: 42px 48px 60px;

    box-sizing: border-box;
}


/* ==================================================
   ЗАГОЛОВОК
   ================================================== */

.catalog-title {
    margin: 0 0 30px;

    font-size: 42px;
    font-weight: 500;
    line-height: 1.15;

    color: var(--charcoal);
}


/* ==================================================
   ПЕРЕКЛЮЧАТЕЛЬ
   ================================================== */

.catalog-switch {
    display: flex;
    align-items: center;

    gap: 42px;

    margin: 0 0 42px;

    border-bottom: 1px solid var(--cream-500);
}


.catalog-switch-item {
    position: relative;

    display: block;

    padding: 0 0 14px;

    font-size: 16px;
    font-weight: 500;
    line-height: 1.3;

    color: var(--taupe);
    text-decoration: none;
}


a.catalog-switch-item:hover {
    color: var(--charcoal);
}


.catalog-switch-item.active {
    font-weight: 600;

    color: var(--charcoal);
}


.catalog-switch-item.active::after {
    content: '';

    position: absolute;

    left: 0;
    bottom: -1px;

    width: 100%;
    height: 2px;

    background: var(--charcoal);
}


/* ==================================================
   СЕТКА КАТАЛОГА
   ================================================== */

.catalog-grid {
    display: grid;

    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    column-gap: 64px;
    row-gap: 0;

    width: 100%;

    align-items: start;
}


/* ==================================================
   ЯЧЕЙКА КАТАЛОГА
   ================================================== */

.catalog-block {
    display: flex;
    flex-direction: column;

    gap: 30px;

    min-width: 0;
}


/* ==================================================
   ВТОРАЯ СТРОКА КАТАЛОГА
   ================================================== */

.catalog-block:nth-child(n+4) {
    margin-top: 38px;
    padding-top: 38px;

    border-top: 1px solid var(--cream-500);
}


/* ==================================================
   КАТЕГОРИЯ
   ================================================== */

.catalog-group {
    min-width: 0;

    padding-left: 17px;

    border-left: 2px solid var(--sand-300);
}


/* ==================================================
   НАЗВАНИЕ КАТЕГОРИИ
   ================================================== */

.catalog-group-title {
    display: inline-block;

    margin: 0;

    font-size: 18px;
    font-weight: 600;
    line-height: 1.35;

    color: var(--charcoal);
    text-decoration: none;
}


.catalog-group-title:hover {
    color: var(--taupe);
}


/* ==================================================
   ПОДКАТЕГОРИИ
   ================================================== */

.catalog-subcategories {
    display: flex;
    flex-direction: column;

    gap: 7px;

    margin-top: 13px;
}


/* ==================================================
   ПОДКАТЕГОРИЯ
   ================================================== */

.catalog-subcategory {
    display: flex;
    align-items: baseline;

    gap: 9px;

    width: fit-content;
    max-width: 100%;

    font-size: 15px;
    font-weight: 400;
    line-height: 1.4;

    color: var(--gray-700);
    text-decoration: none;
}


.catalog-subcategory-arrow {
    flex: 0 0 auto;

    color: var(--taupe);
}


.catalog-subcategory:hover {
    color: var(--charcoal);
}


.catalog-subcategory:hover
.catalog-subcategory-arrow {
    color: var(--sand-gold);
}

/* ==================================================
   КНОПКА РАСКРЫТИЯ
   НА ДЕСКТОПЕ НЕ ПОКАЗЫВАЕМ
   ================================================== */

.catalog-group-toggle {
    display: none;
}