.direction-page {

    padding: 24px 0 70px;

}

.breadcrumbs {

    margin-bottom: 30px;

}

.breadcrumbs a {

    color: var(--color-primary);

    text-decoration: none;

    font-weight: 600;

}

.breadcrumbs a:hover {

    text-decoration: underline;

}

.direction-header {

    margin-bottom: 16px;

}

.direction-title {

    font-size: 28px;

    font-weight: 700;

    line-height: 1.2;

    color: var(--color-primary-dark);

    margin-bottom: 6px;

}

.direction-count {
    margin: 0;

    font-size: 18px;

    color: var(--color-text-light);

}

.direction-page .search-section {
    padding: 0px 0 10px;
}

/* ==========================================
   Сетка карточек кружков
========================================== */

.clubs-grid {

    display: grid;

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

    gap: 28px;

    margin-top: 40px;

}

@media (max-width: 992px) {

    .clubs-grid {

        grid-template-columns: repeat(2, 1fr);

    }

}

@media (max-width: 640px) {

    .clubs-grid {

        grid-template-columns: 1fr;

    }

}

/* ==========================================
   Телефоны
========================================== */

@media (max-width: 480px) {

    .direction-page {

        padding: 16px 0 40px;

    }

    .breadcrumbs {

        margin-bottom: 18px;

    }

    .direction-header {

        margin-bottom: 12px;

    }

    .direction-title {

        font-size: 24px;

        line-height: 1.25;

        margin-bottom: 8px;

    }

    .direction-count {

        font-size: 16px;

    }

    .clubs-grid {

        margin-top: 24px;

        gap: 20px;

    }

    .breadcrumbs {

    font-size: 15px;

}
}