/* Контейнер с отступами от краев экрана */
#happy-clients .container {
    padding: 0 20px;
    max-width: 1240px;
    margin: 0 auto;
}

/* Настройка горизонтальной ленты */
#happy-clients .services-slider {
    display: flex !important; /* Убеждаемся, что флекс включен */
    gap: 20px;
    padding: 20px 0;
    
    /* Убираем стандартный скролл, чтобы он не конфликтовал с JS */
    overflow-x: hidden; 
    
    /* Важно для стабильной прокрутки */
    touch-action: pan-y; /* Разрешаем только вертикальный свайп страницы */
    user-select: none;   /* Запрещаем выделение текста при перетаскивании */
    cursor: grab;
}

/* Обертка карточки */
.selfie-item-slider {
    flex: 0 0 280px; /* Ширина фото */
    pointer-events: auto; /* Карточки реагируют на наведение */
}

/* КАРТОЧКА (РОВНАЯ) */
.selfie-card {
    background: white;
    padding: 10px 10px 15px 10px;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
    
    transform: rotate(0deg); 
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    cursor: pointer;
    border: 1px solid #f0f0f0;
}

/* ГЛАВНОЕ ИСПРАВЛЕНИЕ ЗАЛИПАНИЯ */
.selfie-card img {
    width: 100%;
    height: 300px; /* ТВОЯ ВЫСОТА */
    object-fit: cover;
    border-radius: 4px;
    
    /* Эти строки запрещают картинке "прилипать" к мышке */
    pointer-events: none;      /* Мышь "не видит" картинку, а видит слайдер */
    -webkit-user-drag: none;   /* Запрещаем тащить картинку как файл */
    user-select: none;         /* Запрещаем выделение синим цветом */
}

.selfie-badge {
    text-align: center;
    font-size: 14px;
    font-weight: 700;
    color: #;
    margin-top: 12px;
}

/* ЭФФЕКТ ПРИ НАВЕДЕНИИ */
.selfie-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 15px 30px rgba(0,0,0,0.15);
}

/* Кружочки пагинации */
.slider-pagination {
    display: flex;
    justify-content: center;
    gap: 8px;
    margin-top: 25px;
}

/* Смена курсора при захвате */
#happy-clients .services-slider:active {
    cursor: grabbing;
}

/* Адаптив для телефонов */
@media (max-width: 768px) {
    .selfie-item-slider {
        flex: 0 0 240px;
    }
    .selfie-card img {
        height: 260px;
    }
}