﻿/* ========================================================================
   1. ОБЩАЯ КРАСИВАЯ ОБЕРТКА ДЛЯ ВСЕХ 3 СТОЛБЦОВ (ВАШИ ЦВЕТА И РАЗМЕРЫ!)
   ======================================================================== */
.panel-display.panel-3col-33.clearfix,
.panel-display.panel-3col, 
.panel-3col-33-34-33 {
    display: block !important;
    width: 100% !important;
    max-width: 1158px !important;
    margin: 0 auto !important;
    margin-bottom: 10px !important;
    margin-top: -10px !important;
    padding: 25px 20px !important; /* Уютные внутренние отступы */
    text-align: center !important; /* Ровное центрирование колонок-ячеек */
    background: #f3dbbb !important; /* Благородный светлый фон под всем хабом */
    border: solid 7px #9b300d !important; /* Мощный фирменный контур */
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.04) !important; /* Объемная мягкая тень */
    box-sizing: border-box !important;
}

/* ========================================================================
   2. ОБЩЕЕ ПОВЕДЕНИЕ И ИДЕАЛЬНАЯ ВЕРТИКАЛЬНАЯ ЦЕНТРОВКА (inline-block)
   ======================================================================== */
.panel-display .panel-col-first, 
.panel-display .panel-col-left,
.panel-display .panel-col-middle,
.panel-display .panel-col-last, 
.panel-display .panel-col-right,
.panel-display .panel-panel {
    display: inline-block !important; /* Выстраивает столбцы строго в один ряд */
    vertical-align: middle !important; /* Выравнивает лево и право ровно по центру справочника */
    float: none !important; /* Сбрасывает старые обтекания темы Друпала */
    text-align: left !important; /* Возвращает тексту нормальное левое чтение */
}

/* ВЫЖИГАЕМ СИСТЕМНУЮ ДРЯНЬ PANELS ДЛЯ ИДЕАЛЬНОЙ ЦЕНТРОВКИ НА КОМПЬЮТЕРАХ */
.panel-3col-33 .panel-col .inside,
.panel-3col-33 .panel-col-first .inside,
.panel-3col-33 .panel-col-middle .inside,
.panel-3col-33 .panel-col-last .inside {
    margin-left: 0 !important;  /* Намертво стираем левый перекос */
    margin-right: 0 !important; /* Намертво стираем правый перекос */
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

/* ========================================================================
   3. ЛЕВАЯ КОЛОНКА (СТАТЬИ АГРОСТАРТ) — СТИЛИЗАЦИЯ И ОГРАНИЧЕНИЕ В СТРОКАХ
   ======================================================================== */
.panel-display .panel-col-first, 
.panel-display .panel-col-left,
.layout__region--first {
    width: 31% !important;
    background: #9b300d !important; /* Фирменный терракотовый фон */
    padding: 30px 20px 30px 20px !important;
    border: 1px solid #e2e8f0 !important; 
    border-radius: 8px !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.03) !important; 
    box-sizing: border-box !important;
}

.panel-display .panel-col-first a,
.panel-display .panel-col-left a,
.layout__region--first a {
    display: -webkit-box !important;          /* Переключаем в режим бокса для обрезки текста */
    -webkit-line-clamp: 2 !important;          /* ОГРАНИЧЕНИЕ СТРОГО В 2 СТРОКИ */
    -webkit-box-orient: vertical !important;  /* Вертикальная ориентация */
    overflow: hidden !important;              /* Скрываем лишнее */
    text-overflow: ellipsis !important;       /* Добавляет троеточие ... в конце */
    position: relative !important;             /* Для идеального позиционирования красных точек */
    padding-left: 22px !important;             /* Место под красную точку */
    font-size: 20px !important;                 /* Крупный сочный читаемый шрифт */
    color: bisque !important;                  /* Контрастный цвет bisque */
    text-decoration: none !important;
    line-height: 25px !important;              /* Ровная высота строки */
    margin-bottom: 14px !important;            /* Расстояние между строками */
    transition: all 0.2s ease !important;
}

.panel-display .panel-col-first a:last-child,
.panel-display .panel-col-left a:last-child,
.layout__region--first a:last-child {
    margin-bottom: 0 !important;
}

.panel-display .panel-col-first a:hover,
.panel-display .panel-col-left a:hover,
.layout__region--first a:hover {
    color: #ffffff !important;                 /* Белая подсветка при наведении */
    padding-left: 25px !important;             /* Легкий аккуратный сдвиг вправо */
}

/* ========================================================================
   4. ЦЕНТРАЛЬНАЯ КОЛОНКА (СПРАВОЧНИК С АВТОКАРУСЕЛЬЮ)
   ======================================================================== */
.panel-display .panel-col-middle,
.panel-display .layout__region--second {
    width: 34% !important; /* Расширили центр для свободы фрейма */
    box-sizing: border-box !important;
}
.panel-display .panel-col-middle .pane-content {
    background: transparent !important;
    padding: 0 !important;
    box-shadow: none !important;
}

/* ========================================================================
   5. ПРАВАЯ КОЛОНКА (МИКС ЖУРНАЛОВ И ГАЛЕРЕЙ) — ВСТРОИЛИ 2 СТРОКИ И ТРОЕТОЧИЕ
   ======================================================================== */
.panel-display .panel-col-last, 
.panel-display .panel-col-right,
.panel-display .layout__region--third {
    width: 31% !important;
    background: #9b300d !important;
    padding: 32px 20px 32px 20px !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 8px !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.03) !important;
    box-sizing: border-box !important;
}

.panel-display .panel-col-last a,
.panel-display .panel-col-right a,
.layout__region--third a {
    display: -webkit-box !important;          /* Включаем режим бокса для лимита строк */
    -webkit-line-clamp: 2 !important;          /* ОГРАНИЧЕНИЕ СТРОГО В 2 СТРОКИ */
    -webkit-box-orient: vertical !important;  /* Вертикальная ориентация */
    overflow: hidden !important;              /* Скрываем всё, что вылезло за 2 строки */
    text-overflow: ellipsis !important;       /* Ставим троеточие ... */   
    position: relative !important;             /* Для стабильности красных точек */
    padding-left: 22px !important;             /* Делаем ровный отступ слева под маркер */
    font-size: 20px !important;                 /* Ваш крупный сочный шрифт */
    color: bisque !important;                  /* Фирменный цвет bisque */
    text-decoration: none !important;
    line-height: 25px !important;              /* Ровная высота строки */
    margin-bottom: 5px !important;             /* Ваш компактный отступ между записями */
    transition: all 0.2s ease !important;
}

.panel-display .panel-col-last a:last-child,
.panel-display .panel-col-right a:last-child,
.layout__region--third a:last-child {
    margin-bottom: 0 !important;
}

.panel-display .panel-col-last a:hover,
.panel-display .panel-col-right a:hover,
.layout__region--third a:hover {
    color: #ffffff !important;                 /* Белая подсветка при наведении */
    padding-left: 25px !important;             /* Интерактивный легкий сдвиг вправо */
}

/* ========================================================================
   6. СНАЙПЕРСКИЕ КРАСНЫЕ ТОЧКИ (НИКОГДА НЕ СЪЕЗЖАЮТ И НЕ ПУТАЮТСЯ В СТРОКАХ)
   ======================================================================== */
.panel-display .panel-col-first a::before,
.panel-display .panel-col-left a::before,
.layout__region--first a::before,
.panel-display .panel-col-last a::before,
.panel-display .panel-col-right a::before,
.layout__region--third a::before {
    content: "" !important;
    position: absolute !important;             /* Точки теперь намертво привязаны к началу ссылки */
    left: 0 !important;                        /* Прижимаем строго к левому краю */
    top: 7px !important;                       /* Ровное выравнивание по центру первой строки текста */
    display: inline-block !important;
    width: 10px !important;                    /* Ваш идеальный размер маркера */
    height: 10px !important;                   /* Ваш идеальный размер маркера */
    background: #dc3545 !important;            /* Фирменный сочный красный цвет */
    border-radius: 50% !important;             /* Превращаем в круг */
    flex-shrink: 0 !important;
}

/* ========================================================================
   7. ЦЕНТРАЛЬНЫЙ БЛОК — СТИЛЬ ДЛЯ КНОПОК НА КОРИЧНЕВОМ ФОНЕ
   ======================================================================== */
.spr-reg-btn {
    display: flex !important; 
    align-items: center !important; 
    justify-content: center !important;
    width: 100% !important; 
    height: 48px !important; 
    background: #1a2a3a !important;            /* Темно-синий благородный фон */
    border: 1px solid bisque !important; 
    border-radius: 6px !important;
    color: bisque !important; 
    font-size: 20px !important; 
    text-decoration: none !important;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1) !important; 
    transition: all 0.2s ease-in-out !important; 
    box-sizing: border-box !important;
}

.spr-reg-btn:hover {
    transform: translateY(-1px) !important;    /* ИСПРАВИЛИ! Закрыли ховер скобкой */
}

/* ========================================================================
   8. УМНАЯ МОБИЛЬНАЯ АДАПТАЦИЯ (ПОЛНЫЙ ИДЕАЛЬНЫЙ СИНТАКСИС)
   ======================================================================== */
@media screen and (max-width: 960px) {
    
    /* 1. Настройки главной обёртки хаба (ПОСТАВИЛИ ТОЧКУ ПЕРЕД КЛАССOM!) */
    .panel-display.panel-3col-33.clearfix, 
    .panel-display.panel-3col, 
    .panel-3col-33-34-33 {
        padding: 15px 10px !important; 
        box-shadow: none !important; 
        text-align: center !important;
    }  

    /* 2. Снайперски выравниваем все три карточки строго по вертикали с одинаковым зазором */
    .panel-display .panel-col-first, 
    .panel-display .panel-col-left,
    .panel-display .layout__region--first,
    .panel-display .panel-col-middle,
    .panel-display .layout__region--second,
    .panel-display .panel-col-last, 
    .panel-display .panel-col-right,
    .panel-display .layout__region--third {
        width: 100% !important;        /* Все три блока честно занимают всю ширину экрана */
        max-width: 100% !important;
        display: block !important;       /* Выстраиваем их строго вертикально по одному */
        float: none !important;          /* Сбрасываем старые перекосы */
        margin: 20px 0 20px 0 !important;   /* ИДЕАЛЬНЫЙ ОДИНАКОВЫЙ ЗАЗОР МЕЖДУ ВСЕМИ БЛОКАМИ */
}

/* ========================================================================
   10. УЛЬТИМАТИВНЫЙ ВЗЛУМАТОР СЖАТИЯ СИСТЕМНЫХ КОЛОНОК PANELS НА МОБИЛКАХ
   ======================================================================== */
@media screen and (max-width: 960px) {
    /* Намертво выжигаем системные 33% ширины и боковые тиски .inside модуля Panels */
    .panel-display .panel-col-middle,
    .panel-display .layout__region--second,
    .panel-col-middle .pane-content,
    .panel-display .panel-panel.panel-col-middle,
    .panel-3col-33 .panel-col,
    .panel-3col-33 .panel-col-middle,
    .panel-3col-33 .panel-col .inside { /* ВАШ НАЙДЕННЫЙ КЛАСС .INSIDE! */
        width: 100% !important;
        max-width: 100% !important;
        float: none !important;      /* Отменяем левое обтекание на смартфонах */
        padding-left: 0 !important;   /* Выжигаем скрытые боковые отступы темы */
        padding-right: 0 !important;  /* Выжигаем скрытые боковые отступы темы */
        margin-left: 0 !important;    /* Намертво обнуляем боковые маргины .inside */
        margin-right: 0 !important;   /* Намертво обнуляем боковые маргины .inside */
    }
}



h2.page-title {display:none;}
 