/* assets/css/grid.css - Сетка BSL PRO (замена Tilda Grid) */

/* =============================================================================
   КОНТЕЙНЕРЫ
   ============================================================================= */

.t-container {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding-left: 15px;
    padding-right: 15px;
    box-sizing: border-box;
}

.t-container_fluid {
    max-width: none;
    width: 100%;
}

.t-container_flex {
    display: flex;
    align-items: center;
}

/* Узкий контейнер */
.t-container_narrow {
    max-width: 800px;
}

/* Широкий контейнер */
.t-container_wide {
    max-width: 1400px;
}

/* =============================================================================
   СЕТКА КОЛОНОК
   ============================================================================= */

.t-row {
    display: flex;
    flex-wrap: wrap;
    margin-left: -15px;
    margin-right: -15px;
}

.t-col {
    position: relative;
    width: 100%;
    padding-left: 15px;
    padding-right: 15px;
    box-sizing: border-box;
}

/* Колонки по размеру */
.t-col_1 { flex: 0 0 8.333333%; max-width: 8.333333%; }
.t-col_2 { flex: 0 0 16.666667%; max-width: 16.666667%; }
.t-col_3 { flex: 0 0 25%; max-width: 25%; }
.t-col_4 { flex: 0 0 33.333333%; max-width: 33.333333%; }
.t-col_5 { flex: 0 0 41.666667%; max-width: 41.666667%; }
.t-col_6 { flex: 0 0 50%; max-width: 50%; }
.t-col_7 { flex: 0 0 58.333333%; max-width: 58.333333%; }
.t-col_8 { flex: 0 0 66.666667%; max-width: 66.666667%; }
.t-col_9 { flex: 0 0 75%; max-width: 75%; }
.t-col_10 { flex: 0 0 83.333333%; max-width: 83.333333%; }
.t-col_11 { flex: 0 0 91.666667%; max-width: 91.666667%; }
.t-col_12 { flex: 0 0 100%; max-width: 100%; }

/* Автоматические колонки */
.t-col_auto {
    flex: 0 0 auto;
    width: auto;
    max-width: 100%;
}

.t-col_grow {
    flex: 1 1 0;
    max-width: 100%;
}

/* =============================================================================
   ОТСТУПЫ (ПРЕФИКСЫ)
   ============================================================================= */

.t-prefix_1 { margin-left: 8.333333%; }
.t-prefix_2 { margin-left: 16.666667%; }
.t-prefix_3 { margin-left: 25%; }
.t-prefix_4 { margin-left: 33.333333%; }
.t-prefix_5 { margin-left: 41.666667%; }
.t-prefix_6 { margin-left: 50%; }
.t-prefix_7 { margin-left: 58.333333%; }
.t-prefix_8 { margin-left: 66.666667%; }
.t-prefix_9 { margin-left: 75%; }
.t-prefix_10 { margin-left: 83.333333%; }
.t-prefix_11 { margin-left: 91.666667%; }

/* =============================================================================
   ВЫРАВНИВАНИЕ
   ============================================================================= */

/* Горизонтальное выравнивание */
.t-align_left { text-align: left; }
.t-align_center { text-align: center; }
.t-align_right { text-align: right; }
.t-align_justify { text-align: justify; }

/* Вертикальное выравнивание для flex */
.t-valign_top {
    display: flex;
    align-items: flex-start;
}

.t-valign_middle {
    display: flex;
    align-items: center;
}

.t-valign_bottom {
    display: flex;
    align-items: flex-end;
}

/* Выравнивание контента в flex контейнерах */
.justify-start { justify-content: flex-start; }
.justify-center { justify-content: center; }
.justify-end { justify-content: flex-end; }
.justify-between { justify-content: space-between; }
.justify-around { justify-content: space-around; }
.justify-evenly { justify-content: space-evenly; }

/* =============================================================================
   FLEXBOX УТИЛИТЫ
   ============================================================================= */

.d-flex { display: flex; }
.d-inline-flex { display: inline-flex; }
.d-block { display: block; }
.d-inline-block { display: inline-block; }
.d-inline { display: inline; }
.d-none { display: none; }

.flex-row { flex-direction: row; }
.flex-column { flex-direction: column; }
.flex-row-reverse { flex-direction: row-reverse; }
.flex-column-reverse { flex-direction: column-reverse; }

.flex-wrap { flex-wrap: wrap; }
.flex-nowrap { flex-wrap: nowrap; }
.flex-wrap-reverse { flex-wrap: wrap-reverse; }

.align-start { align-items: flex-start; }
.align-center { align-items: center; }
.align-end { align-items: flex-end; }
.align-stretch { align-items: stretch; }
.align-baseline { align-items: baseline; }

/* =============================================================================
   ОТСТУПЫ
   ============================================================================= */

/* Внешние отступы */
.m-0 { margin: 0; }
.m-1 { margin: 0.25rem; }
.m-2 { margin: 0.5rem; }
.m-3 { margin: 1rem; }
.m-4 { margin: 1.5rem; }
.m-5 { margin: 3rem; }

.mt-0 { margin-top: 0; }
.mt-1 { margin-top: 0.25rem; }
.mt-2 { margin-top: 0.5rem; }
.mt-3 { margin-top: 1rem; }
.mt-4 { margin-top: 1.5rem; }
.mt-5 { margin-top: 3rem; }

.mb-0 { margin-bottom: 0; }
.mb-1 { margin-bottom: 0.25rem; }
.mb-2 { margin-bottom: 0.5rem; }
.mb-3 { margin-bottom: 1rem; }
.mb-4 { margin-bottom: 1.5rem; }
.mb-5 { margin-bottom: 3rem; }

.ml-0 { margin-left: 0; }
.ml-1 { margin-left: 0.25rem; }
.ml-2 { margin-left: 0.5rem; }
.ml-3 { margin-left: 1rem; }
.ml-4 { margin-left: 1.5rem; }
.ml-5 { margin-left: 3rem; }

.mr-0 { margin-right: 0; }
.mr-1 { margin-right: 0.25rem; }
.mr-2 { margin-right: 0.5rem; }
.mr-3 { margin-right: 1rem; }
.mr-4 { margin-right: 1.5rem; }
.mr-5 { margin-right: 3rem; }

/* Внутренние отступы */
.p-0 { padding: 0; }
.p-1 { padding: 0.25rem; }
.p-2 { padding: 0.5rem; }
.p-3 { padding: 1rem; }
.p-4 { padding: 1.5rem; }
.p-5 { padding: 3rem; }

.pt-0 { padding-top: 0; }
.pt-1 { padding-top: 0.25rem; }
.pt-2 { padding-top: 0.5rem; }
.pt-3 { padding-top: 1rem; }
.pt-4 { padding-top: 1.5rem; }
.pt-5 { padding-top: 3rem; }

.pb-0 { padding-bottom: 0; }
.pb-1 { padding-bottom: 0.25rem; }
.pb-2 { padding-bottom: 0.5rem; }
.pb-3 { padding-bottom: 1rem; }
.pb-4 { padding-bottom: 1.5rem; }
.pb-5 { padding-bottom: 3rem; }

.pl-0 { padding-left: 0; }
.pl-1 { padding-left: 0.25rem; }
.pl-2 { padding-left: 0.5rem; }
.pl-3 { padding-left: 1rem; }
.pl-4 { padding-left: 1.5rem; }
.pl-5 { padding-left: 3rem; }

.pr-0 { padding-right: 0; }
.pr-1 { padding-right: 0.25rem; }
.pr-2 { padding-right: 0.5rem; }
.pr-3 { padding-right: 1rem; }
.pr-4 { padding-right: 1.5rem; }
.pr-5 { padding-right: 3rem; }

/* =============================================================================
   ПОЗИЦИОНИРОВАНИЕ
   ============================================================================= */

.position-static { position: static; }
.position-relative { position: relative; }
.position-absolute { position: absolute; }
.position-fixed { position: fixed; }
.position-sticky { position: sticky; }

/* =============================================================================
   АДАПТИВНОСТЬ
   ============================================================================= */

/* Планшеты (до 992px) */
@media (max-width: 991.98px) {
    .t-col_md_1 { flex: 0 0 8.333333%; max-width: 8.333333%; }
    .t-col_md_2 { flex: 0 0 16.666667%; max-width: 16.666667%; }
    .t-col_md_3 { flex: 0 0 25%; max-width: 25%; }
    .t-col_md_4 { flex: 0 0 33.333333%; max-width: 33.333333%; }
    .t-col_md_5 { flex: 0 0 41.666667%; max-width: 41.666667%; }
    .t-col_md_6 { flex: 0 0 50%; max-width: 50%; }
    .t-col_md_7 { flex: 0 0 58.333333%; max-width: 58.333333%; }
    .t-col_md_8 { flex: 0 0 66.666667%; max-width: 66.666667%; }
    .t-col_md_9 { flex: 0 0 75%; max-width: 75%; }
    .t-col_md_10 { flex: 0 0 83.333333%; max-width: 83.333333%; }
    .t-col_md_11 { flex: 0 0 91.666667%; max-width: 91.666667%; }
    .t-col_md_12 { flex: 0 0 100%; max-width: 100%; }
    
    .d-md-none { display: none; }
    .d-md-block { display: block; }
    .d-md-flex { display: flex; }
}

/* Мобильные (до 768px) */
@media (max-width: 767.98px) {
    .t-container {
        padding-left: 10px;
        padding-right: 10px;
    }
    
    .t-row {
        margin-left: -10px;
        margin-right: -10px;
    }
    
    .t-col {
        padding-left: 10px;
        padding-right: 10px;
    }
    
    /* Мобильные колонки */
    .t-col_sm_1 { flex: 0 0 8.333333%; max-width: 8.333333%; }
    .t-col_sm_2 { flex: 0 0 16.666667%; max-width: 16.666667%; }
    .t-col_sm_3 { flex: 0 0 25%; max-width: 25%; }
    .t-col_sm_4 { flex: 0 0 33.333333%; max-width: 33.333333%; }
    .t-col_sm_5 { flex: 0 0 41.666667%; max-width: 41.666667%; }
    .t-col_sm_6 { flex: 0 0 50%; max-width: 50%; }
    .t-col_sm_7 { flex: 0 0 58.333333%; max-width: 58.333333%; }
    .t-col_sm_8 { flex: 0 0 66.666667%; max-width: 66.666667%; }
    .t-col_sm_9 { flex: 0 0 75%; max-width: 75%; }
    .t-col_sm_10 { flex: 0 0 83.333333%; max-width: 83.333333%; }
    .t-col_sm_11 { flex: 0 0 91.666667%; max-width: 91.666667%; }
    .t-col_sm_12 { flex: 0 0 100%; max-width: 100%; }
    
    /* Автоматическое схлопывание колонок на мобильных */
    .t-col_6,
    .t-col_8,
    .t-col_10 {
        flex: 0 0 100%;
        max-width: 100%;
    }
    
    /* Сброс префиксов на мобильных */
    .t-prefix_1,
    .t-prefix_2,
    .t-prefix_3,
    .t-prefix_4,
    .t-prefix_5,
    .t-prefix_6 {
        margin-left: 0;
    }
    
    .d-sm-none { display: none; }
    .d-sm-block { display: block; }
    .d-sm-flex { display: flex; }
}

/* Очень маленькие экраны (до 576px) */
@media (max-width: 575.98px) {
    .t-container {
        padding-left: 8px;
        padding-right: 8px;
    }
    
    .d-xs-none { display: none; }
    .d-xs-block { display: block; }
    .d-xs-flex { display: flex; }
}

/* =============================================================================
   СЕКЦИИ ЗАПИСЕЙ (ЗАМЕНА TILDA RECORDS)
   ============================================================================= */

.t-records {
    position: relative;
}

.t-rec {
    position: relative;
    overflow: hidden;
}

/* Отступы секций */
.t-rec_pt_0 { padding-top: 0; }
.t-rec_pt_15 { padding-top: 15px; }
.t-rec_pt_30 { padding-top: 30px; }
.t-rec_pt_45 { padding-top: 45px; }
.t-rec_pt_60 { padding-top: 60px; }
.t-rec_pt_75 { padding-top: 75px; }
.t-rec_pt_90 { padding-top: 90px; }
.t-rec_pt_105 { padding-top: 105px; }
.t-rec_pt_120 { padding-top: 120px; }
.t-rec_pt_135 { padding-top: 135px; }
.t-rec_pt_150 { padding-top: 150px; }
.t-rec_pt_165 { padding-top: 165px; }

.t-rec_pb_0 { padding-bottom: 0; }
.t-rec_pb_15 { padding-bottom: 15px; }
.t-rec_pb_30 { padding-bottom: 30px; }
.t-rec_pb_45 { padding-bottom: 45px; }
.t-rec_pb_60 { padding-bottom: 60px; }
.t-rec_pb_75 { padding-bottom: 75px; }
.t-rec_pb_90 { padding-bottom: 90px; }
.t-rec_pb_105 { padding-bottom: 105px; }
.t-rec_pb_120 { padding-bottom: 120px; }
.t-rec_pb_135 { padding-bottom: 135px; }
.t-rec_pb_150 { padding-bottom: 150px; }

/* =============================================================================
   ЗАГОЛОВКИ И ТЕКСТ
   ============================================================================= */

.t-title {
    font-weight: 700;
    line-height: 1.2;
    margin-bottom: 1rem;
}

.t-title_xs { font-size: 1.25rem; }
.t-title_sm { font-size: 1.5rem; }
.t-title_md { font-size: 2rem; }
.t-title_lg { font-size: 2.5rem; }
.t-title_xl { font-size: 3rem; }
.t-title_xxl { font-size: 3.5rem; }

.t-descr {
    line-height: 1.6;
    margin-bottom: 1rem;
}

.t-descr_xs { font-size: 0.875rem; }
.t-descr_sm { font-size: 1rem; }
.t-descr_md { font-size: 1.125rem; }
.t-descr_lg { font-size: 1.25rem; }
.t-descr_xl { font-size: 1.5rem; }

/* =============================================================================
   АДАПТИВНЫЕ ОТСТУПЫ СЕКЦИЙ
   ============================================================================= */

@media (max-width: 991.98px) {
    .t-rec_pt_165 { padding-top: 120px; }
    .t-rec_pt_150 { padding-top: 105px; }
    .t-rec_pt_135 { padding-top: 90px; }
    .t-rec_pt_120 { padding-top: 75px; }
    .t-rec_pt_105 { padding-top: 60px; }
    .t-rec_pt_90 { padding-top: 45px; }
    
    .t-rec_pb_150 { padding-bottom: 105px; }
    .t-rec_pb_135 { padding-bottom: 90px; }
    .t-rec_pb_120 { padding-bottom: 75px; }
    .t-rec_pb_105 { padding-bottom: 60px; }
    .t-rec_pb_90 { padding-bottom: 45px; }
}

@media (max-width: 767.98px) {
    .t-rec_pt_165 { padding-top: 90px; }
    .t-rec_pt_150 { padding-top: 75px; }
    .t-rec_pt_135 { padding-top: 60px; }
    .t-rec_pt_120 { padding-top: 45px; }
    .t-rec_pt_105 { padding-top: 30px; }
    .t-rec_pt_90 { padding-top: 30px; }
    .t-rec_pt_75 { padding-top: 30px; }
    .t-rec_pt_60 { padding-top: 30px; }
    
    .t-rec_pb_150 { padding-bottom: 75px; }
    .t-rec_pb_135 { padding-bottom: 60px; }
    .t-rec_pb_120 { padding-bottom: 45px; }
    .t-rec_pb_105 { padding-bottom: 30px; }
    .t-rec_pb_90 { padding-bottom: 30px; }
    .t-rec_pb_75 { padding-bottom: 30px; }
    .t-rec_pb_60 { padding-bottom: 30px; }
    
    .t-title_xxl { font-size: 2.5rem; }
    .t-title_xl { font-size: 2rem; }
    .t-title_lg { font-size: 1.75rem; }
    .t-title_md { font-size: 1.5rem; }
}