/* ===================================
   ФИНАЛЬНЫЙ АДАПТИВНЫЙ ДИЗАЙН (БЕЗ ПОВОРОТОВ)
   =================================== */

/* Сброс всех трансформаций и поворотов */
.store-new-container *,
.store-new-container *::before,
.store-new-container *::after {
    transform: none !important;
    writing-mode: horizontal-tb !important;
}

/* Восстанавливаем нужные трансформации для интерактивности */
.product-card:hover {
    transform: scale(1.03) !important;
}

.control-btn:hover {
    transform: scale(1.02) !important;
}

.featured-card:hover {
    transform: translateY(-4px) !important;
}

/* Центрирование контента, который был повернут */
.featured-image,
.product-image {
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
}

.featured-card-bg,
.featured-gradient,
.product-bg {
    transform: none !important;
}

/* 
   ПЕРЕОПРЕДЕЛЕНИЕ СТИЛЕЙ ИЗ FIGMA 
   (Так как Figma Export часто добавляет лишние rotate) 
*/

.featured-title,
.product-info h3,
.generated_Магазин_339_145,
.generated_ЗащитаСтрика_332_218 {
    transform: none !important;
    writing-mode: horizontal-tb !important;
    white-space: normal !important;
}

/* Исправляем иконки */
svg {
    transform: none !important;
}

/* ===================================
   АДАПТИВНАЯ СЕТКА (CSS Grid)
   =================================== */

.products-grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)) !important;
    gap: 20px !important;
    position: relative !important;
    top: auto !important;
    right: auto !important;
    margin-top: 180px;
    /* Отступ для хедера */
    padding: 20px 50px;
}

/* ===================================
   ПОЗИЦИОНИРОВАНИЕ ЭЛЕМЕНТОВ
   =================================== */

.store-header-new {
    position: absolute !important;
    top: 40px !important;
    left: 40px !important;
    display: flex !important;
    flex-direction: row !important;
    /* Горизонтально */
    align-items: center !important;
    transform: none !important;
}

.controls-top {
    position: absolute !important;
    top: 40px !important;
    right: 40px !important;
    display: flex !important;
    flex-direction: row !important;
    transform: none !important;
}

/* Мобильная адаптивность */
@media (max-width: 768px) {
    .products-grid {
        margin-top: 140px;
        padding: 20px;
        grid-template-columns: 1fr !important;
    }

    .store-header-new {
        top: 20px !important;
        left: 20px !important;
        flex-direction: column !important;
        align-items: flex-start !important;
    }

    .store-header-new h2 {
        font-size: 32px !important;
    }

    .controls-top {
        top: 20px !important;
        right: 20px !important;
    }

    .control-btn span {
        display: none;
        /* Скрываем текст кнопок на мобильном */
    }

    .control-btn {
        padding: 15px !important;
    }

    .featured-card {
        position: relative !important;
        width: 100% !important;
        height: 500px !important;
        margin-bottom: 30px !important;
        left: auto !important;
        top: auto !important;
        transform: none !important;
    }
}