/* === СЕТКА === */
.albion-catalog-grid {
    display: grid !important;
    grid-template-columns: repeat(5, 1fr) !important;
    gap: 20px !important;
    width: 100% !important;
    margin: 0 auto !important;
    align-items: center !important;
}

/* === ЛОГОТИПЫ (занимают всю ширину - 5 колонок) === */
.albion-logo-row {
    grid-column: 1 / 6 !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    padding: 20px 0 !important;
}

.albion-logo-content {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
}

.albion-logo-content img {
    max-width: 160px !important;
    max-height: 70px !important;
    object-fit: contain !important;
    margin-bottom: 10px !important;
}

.albion-logo-name {
    font-size: 16px !important;
    font-weight: 700 !important;
    letter-spacing: 3px !important;
    color: #111 !important;
    margin-bottom: 4px !important;
    text-transform: uppercase !important;
}

.albion-logo-subtitle-premium {
    font-size: 12px !important;
    font-weight: 500 !important;
    color: #666 !important;
    font-style: italic !important;
    margin-bottom: 4px !important;
}

.albion-logo-subtitle {
    font-size: 11px !important;
    font-weight: 400 !important;
    color: #888 !important;
    letter-spacing: 1px !important;
}

/* === КАРТОЧКИ МАШИН === */
.albion-item {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    position: relative !important;
    background: #fff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 8px !important;
    padding: 16px !important;
    text-align: center !important;
    box-sizing: border-box !important;
    transition: box-shadow 0.3s ease, transform 0.2s ease !important;
}

.albion-item:hover {
    box-shadow: 0 10px 25px rgba(0,0,0,0.08) !important;
    transform: translateY(-3px) !important;
}

.albion-link-overlay {
    position: absolute !important;
    top: 0 !important; left: 0 !important;
    width: 100% !important; height: 100% !important;
    z-index: 10 !important;
    font-size: 0 !important; line-height: 0 !important;
}

/* === РАСПОЛОЖЕНИЕ МАШИН ПО РЯДАМ === */

/* РЯД 2: 3 машины Dongfeng (колонки 1, 2, 3) */
.albion-item:nth-of-type(2) { grid-column: 1 / 2 !important; grid-row: 2 / 3 !important; }
.albion-item:nth-of-type(3) { grid-column: 2 / 3 !important; grid-row: 2 / 3 !important; }
.albion-item:nth-of-type(4) { grid-column: 3 / 4 !important; grid-row: 2 / 3 !important; }

/* РЯД 4: 5 машин Forthing (колонки 1-5) */
.albion-item:nth-of-type(6) { grid-column: 1 / 2 !important; grid-row: 4 / 5 !important; }
.albion-item:nth-of-type(7) { grid-column: 2 / 3 !important; grid-row: 4 / 5 !important; }
.albion-item:nth-of-type(8) { grid-column: 3 / 4 !important; grid-row: 4 / 5 !important; }
.albion-item:nth-of-type(9) { grid-column: 4 / 5 !important; grid-row: 4 / 5 !important; }
.albion-item:nth-of-type(10) { grid-column: 5 / 6 !important; grid-row: 4 / 5 !important; }

/* РЯД 6: 3 машины Voyah (колонки 1, 2, 3) */
.albion-item:nth-of-type(12) { grid-column: 1 / 2 !important; grid-row: 6 / 7 !important; }
.albion-item:nth-of-type(13) { grid-column: 2 / 3 !important; grid-row: 6 / 7 !important; }
.albion-item:nth-of-type(14) { grid-column: 3 / 4 !important; grid-row: 6 / 7 !important; }

/* РЯД 8: 1 машина M-HERO (колонка 1) */
.albion-item:nth-of-type(16) { grid-column: 1 / 2 !important; grid-row: 8 / 9 !important; }

/* === КАРТИНКА И ТЕКСТ === */
.albion-img-wrap {
    position: relative !important;
    width: 100% !important; 
    height: 130px !important;
    display: flex !important; 
    align-items: center !important; 
    justify-content: center !important;
    margin-bottom: 12px !important; 
    z-index: 1 !important;
}

.albion-img-wrap > img {
    max-width: 100% !important; 
    max-height: 100% !important;
    object-fit: contain !important;
}

.albion-text-wrap {
    display: flex !important; 
    flex-direction: column !important;
    gap: 4px !important; 
    width: 100% !important; 
    z-index: 1 !important;
}

.albion-name { 
    font-size: 15px !important;
    font-weight: 600 !important; 
    color: #111 !important; 
    line-height: 1.3 !important;
}

.albion-price { 
    font-size: 14px !important; 
    color: #555 !important; 
    font-weight: 500 !important;
}

.albion-badge {
    position: absolute !important; 
    top: 0 !important; 
    right: 0 !important;
    padding: 4px 6px !important; 
    font-size: 10px !important; 
    font-weight: 700 !important;
    color: #fff !important; 
    background: #ed3030 !important; 
    border-radius: 4px !important; 
    z-index: 2 !important;
}

.albion-badge-new {
    background: #cccccc !important;
    color: #222 !important;
}

.albion-fuel { 
    position: absolute !important; 
    top: 0 !important; 
    left: 0 !important; 
    z-index: 2 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 4px !important;
}

.albion-fuel img { 
    width: 22px !important; 
    height: 22px !important;
    object-fit: contain !important;
}

/* === АДАПТИВНОСТЬ (ИСПРАВЛЕННАЯ И УСИЛЕННАЯ) === */

/* Планшеты и большие телефоны (до 768px) - делаем 2 колонки */
@media (max-width: 768px) {
    .albion-catalog-grid {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 15px !important;
    }

    /* ПОЛНЫЙ СБРОС жёсткого позиционирования для мобильных! */
    .albion-item,
    .albion-logo-row,
    .albion-divider {
        grid-column: auto !important;
        grid-row: auto !important;
    }

    /* Логотипы и разделители всегда растягиваются на всю ширину (2 колонки) */
    .albion-logo-row,
    .albion-divider {
        grid-column: 1 / -1 !important;
    }

    .albion-img-wrap {
        height: 120px !important;
    }
    
    .albion-name {
        font-size: 14px !important;
    }
    
    .albion-price {
        font-size: 13px !important;
    }
}

/* Маленькие телефоны (до 480px) - делаем 1 колонку для удобства чтения */
@media (max-width: 480px) {
    .albion-catalog-grid {
        grid-template-columns: 1fr !important;
        gap: 15px !important;
    }

    .albion-logo-row,
    .albion-divider {
        grid-column: 1 / -1 !important;
    }

    .albion-img-wrap {
        height: 140px !important;
    }
}
/* === ЯДЕРНЫЙ СБРОС ДЛЯ МОБИЛЬНЫХ УСТРОЙСТВ === */
@media (max-width: 768px) {
    /* 1. Заставляем сетку быть строго 2 колонки и растягиваться по высоте */
    .albion-catalog-grid {
        display: grid !important;
        grid-template-columns: repeat(2, 1fr) !important;
        grid-auto-rows: minmax(min-content, max-content) !important;
        gap: 15px !important;
        height: auto !important;
        max-height: none !important;
        overflow: visible !important;
    }

    /* 2. ПОЛНОСТЬЮ уничтожаем любые привязки к строкам и колонкам у ВСЕХ элементов */
    .albion-catalog-grid > * {
        grid-column: auto !important;
        grid-row: auto !important;
        width: 100% !important;
        margin: 0 !important;
    }

    /* 3. Логотипы и разделители всегда занимают всю ширину (2 колонки) */
    .albion-logo-row,
    .albion-divider {
        grid-column: 1 / -1 !important;
    }

    /* 4. Исправляем размеры для мобильных */
    .albion-img-wrap {
        height: 110px !important;
    }
    .albion-name {
        font-size: 13px !important;
    }
    .albion-price {
        font-size: 12px !important;
    }
}

/* Для очень узких телефонов (iPhone SE и т.д.) делаем 1 колонку */
@media (max-width: 400px) {
    .albion-catalog-grid {
        grid-template-columns: 1fr !important;
    }
}

/* === ШАГ 1.5: ЛЕЧЕНИЕ "ОБРЕЗАННОГО" МОДУЛЯ JOOMLA === */
/* Эти правила заставляют родительские блоки Joomla показывать всё содержимое */
.sp-column, .sp-row, .container, .article-body, .custom {
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
}
/* === ФИКС ДЛЯ МОБИЛЬНЫХ - ПОЛНЫЙ СБРОС === */
@media (max-width: 768px) {
    /* Принудительно 2 колонки */
    .albion-catalog-grid {
        grid-template-columns: repeat(2, 1fr) !important;
        grid-auto-flow: row !important;
    }
    
    /* ПОЛНОСТЬЮ убираем все привязки к строкам и колонкам */
    .albion-item:nth-of-type(2),
    .albion-item:nth-of-type(3),
    .albion-item:nth-of-type(4),
    .albion-item:nth-of-type(6),
    .albion-item:nth-of-type(7),
    .albion-item:nth-of-type(8),
    .albion-item:nth-of-type(9),
    .albion-item:nth-of-type(10),
    .albion-item:nth-of-type(12),
    .albion-item:nth-of-type(13),
    .albion-item:nth-of-type(14),
    .albion-item:nth-of-type(16) {
        grid-column: auto !important;
        grid-row: auto !important;
    }
    
    /* Логотипы и разделители всегда на всю ширину */
    .albion-logo-row,
    .albion-divider {
        grid-column: 1 / -1 !important;
    }
    
    /* Исправляем размеры для мобильных */
    .albion-img-wrap {
        height: 100px !important;
    }
    .albion-name {
        font-size: 13px !important;
    }
    .albion-price {
        font-size: 12px !important;
    }
}

/* Лечим обрезание контента в Joomla/Helix3 */
@media (max-width: 768px) {
    .sp-column, .sp-row, .container, .article-content, .custom, .albion-catalog-grid {
        overflow: visible !important;
        height: auto !important;
        max-height: none !important;
    }
}
/* === УБИРАЕМ ВЕРХНИЙ ОТСТУП НА МОБИЛЬНЫХ === */
@media (max-width: 768px) {
    .albion-catalog-grid {
        margin-top: -30px !important;
        padding-top: 0 !important;
    }
    
    .albion-logo-row:first-child {
        margin-top: 0 !important;
        padding-top: 0 !important;
    }
    
    .albion-logo-row:first-child .albion-logo-content {
        margin-top: 0 !important;
        padding-top: 0 !important;
    }
}
/* === УБИРАЕМ ВЕРХНИЙ ОТСТУП НА ВСЕХ УСТРОЙСТВАХ === */
.albion-catalog-grid {
    margin-top: -30px !important;
    padding-top: 0 !important;
}

.albion-logo-row:first-child {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

.albion-logo-row:first-child .albion-logo-content {
    margin-top: 0 !important;
    padding-top: 0 !important;
}