/* ===== PARTNERS SECTION STYLES ===== */
/* Prefix: cp- (clients-partners) — безопасно переносить в другие проекты */

.cp-section {
    /* background-color: #0e0e0e; */
    padding: 64px 0 56px;
    overflow: hidden;
    position: relative;
    /* font-family: 'Segoe UI', sans-serif; */
}

/* Заголовок */
.cp-title {
    text-align: center;
    /* font-size: 2rem; */
    font-weight: 400;
    color: #c8c8c8;
    letter-spacing: 0.02em;
    margin: 0 0 40px;
    position: relative;
    z-index: 2;
}

/* Обёртка нижней части: большая цифра + лента логотипов */
.cp-body {
    position: relative;
}

/* Большая фоновая цифра */
.cp-bg-number {
    position: absolute;
    left: 50%;
    top: 50%;
    margin-bottom: 10px;
    transform: translate(-50%, -50%);
    font-size: clamp(120px, 18vw, 220px);
    font-weight: 700;
    color: rgba(255, 255, 255, 0.09);
    letter-spacing: -0.04em;
    line-height: 1;
    white-space: nowrap;
    pointer-events: none;
    user-select: none;
    z-index: 0;
}

/* Контейнер ленты */
.cp-ticker-wrap {
    position: relative;
    z-index: 2;
    width: 100%;
    overflow: hidden;
    /* Мягкое затухание по краям */
    -webkit-mask-image: linear-gradient(
    to right,
    transparent 0%,
    black 8%,
    black 92%,
    transparent 100%
    );
    mask-image: linear-gradient(
    to right,
    transparent 0%,
    black 8%,
    black 92%,
    transparent 100%
    );
}

/* Сама лента (дублируется для бесконечного скролла) */
.cp-ticker-track {
    display: flex;
    align-items: center;
    width: max-content;
    animation: cp-scroll 30s linear infinite;
}

/* При наведении — пауза */
.cp-ticker-wrap:hover .cp-ticker-track {
    animation-play-state: paused;
}

@keyframes cp-scroll {
    from { transform: translateX(0); }
    to   { transform: translateX(-50%); }
}

/* Один элемент-логотип */
.cp-logo-item {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 56px;
    height: 80px;
    flex-shrink: 0;
}

/* Изображение логотипа */
.cp-logo-item img {
    max-height: 40px;
    max-width: 140px;
    width: auto;
    height: auto;
    object-fit: contain;
    /* Белый монохром с прозрачностью — как в оригинале */
    filter: opacity(0.8);
    /* filter: brightness(0) invert(1) opacity(0.65); */
    transition: filter 0.3s ease;
}

.cp-logo-item img:hover {
    filter: brightness(0) invert(1) opacity(1);
}

/* Разделитель между логотипами (точка) */
.cp-logo-divider {
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: rgba(255,255,255,0.15);
    flex-shrink: 0;
}

/* ===== DEMO-ONLY: плейсхолдеры вместо реальных PNG ===== */
/* Удалите блок .cp-logo-placeholder и весь JS ниже, когда добавите настоящие PNG */
.cp-logo-placeholder {
    display: flex;
    align-items: center;
    gap: 6px;
    color: rgba(255,255,255,0.55);
    font-size: 15px;
    font-weight: 600;
    letter-spacing: 0.05em;
    white-space: nowrap;
}
.cp-logo-placeholder svg {
    opacity: 0.5;
}