/* =========================================
   Shared Company Card Component
   Используется на: главная (мобиль), страница экосистемы
   ========================================= */

/* --- Анимации --- */

/* Блик — косой луч света */
@keyframes cc-shine {
    0%,  30% { transform: translateX(-160%) skewX(-20deg); opacity: 0; }
    33%       { opacity: 1; }
    58%       { transform: translateX(240%)  skewX(-20deg); opacity: 0; }
    100%      { transform: translateX(240%)  skewX(-20deg); opacity: 0; }
}

/* Стрелка — периодический толчок */
@keyframes cc-arrow {
    0%, 60%, 100% { transform: translateX(0);    opacity: 1;   }
    75%            { transform: translateX(5px);  opacity: 0.5; }
    85%            { transform: translateX(-2px); opacity: 1;   }
    95%            { transform: translateX(2px);  opacity: 0.8; }
}

/* --- Карточка --- */

.company-card {
    position: relative;
    display: flex;
    flex-direction: column;
    background: #ffffff;
    border: 1px solid rgba(0,0,0,0.07);
    border-radius: 16px;
    overflow: hidden;
    text-decoration: none;
    box-shadow: 0 2px 10px rgba(0,0,0,0.06);
    transition: box-shadow 0.25s ease, transform 0.25s ease;
}

/* Блик поверх карточки */
.company-card::before {
    content: '';
    position: absolute;
    top: -10%; left: 0;
    width: 60%;
    height: 120%;
    background: linear-gradient(
        105deg,
        transparent             20%,
        rgba(255,255,255,0.06)  35%,
        rgba(255,255,255,0.42)  50%,
        rgba(255,255,255,0.06)  65%,
        transparent             80%
    );
    transform: translateX(-160%) skewX(-20deg);
    animation: cc-shine 5s ease-in-out infinite;
    animation-delay: calc(var(--i, 0) * 0.55s);
    pointer-events: none;
    z-index: 2;
}

@media (hover: hover) {
    .company-card:hover {
        box-shadow: 0 8px 28px rgba(0,0,0,0.12);
        transform: translateY(-3px);
    }
    .company-card:hover::before {
        animation-play-state: paused;
    }
}

/* --- Зона логотипа --- */

.company-card__media {
    position: relative;
    width: 100%;
    /* Пропорциональная высота через padding-top — работает везде */
    padding-top: 62%;
    background-color: var(--color-bg-light);
    background-image: radial-gradient(circle, rgba(0,0,0,0.06) 1px, transparent 1px);
    background-size: 20px 20px;
    overflow: hidden;
}

.company-card__logo {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    /* Логотип вписывается без обрезки при любых пропорциях */
    max-width: 68%;
    max-height: 68%;
    width: auto;
    height: auto;
    object-fit: contain;
    display: block;
}

/* --- Нижняя полоса --- */

.company-card__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 11px 14px 12px;
    background: #ffffff;
    border-top: 1px solid rgba(0,0,0,0.06);
}

.company-card__info {
    display: flex;
    flex-direction: column;
    gap: 1px;
    min-width: 0;
}

.company-card__tag {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--color-primary);
    line-height: 1.3;
}

.company-card__name {
    font-size: 13px;
    font-weight: 700;
    color: #1a1a1a;
    line-height: 1.25;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.company-card__desc {
    font-size: 11px;
    line-height: 1.45;
    color: #374151;
    font-weight: 400;
    margin: 3px 0 0;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    max-height: calc(11px * 1.45 * 2);
}

/* Стрелка с анимацией */
.company-card__arrow {
    flex-shrink: 0;
    color: var(--color-primary);
    animation: cc-arrow 3s ease-in-out infinite;
    animation-delay: calc(var(--i, 0) * 0.4s);
}

/* --- Tap на тач-устройствах --- */
.company-card:active {
    transform: scale(0.97);
    box-shadow: 0 1px 6px rgba(0,0,0,0.08);
}