/* ==========================================================
   UIP Direction Card — точна копія стилів з html/css/style.css
   ========================================================== */

.uip-dir-card {
    display: flex;
    flex-direction: column;
    padding: 2.5rem;
    background: var(--color-white, #fff);
    border: 1px solid var(--color-border-light, #E8EFF5);
    transition: var(--transition, 0.3s cubic-bezier(0.4, 0, 0.2, 1));
    position: relative;
    overflow: hidden;
    text-decoration: none !important;
    color: inherit;
    height: 100%;
}

/* Синя смужка зверху — анімована */
.uip-dir-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 3px;
    background: var(--color-primary, #033899);
    transform: scaleX(0);
    transform-origin: left;
    transition: var(--transition, 0.3s cubic-bezier(0.4, 0, 0.2, 1));
}

.uip-dir-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-lg, 0 8px 32px rgba(10, 94, 176, 0.12));
    border-color: var(--color-primary-200, #8DA8EA);
    color: inherit;
    text-decoration: none !important;
}

.uip-dir-card:hover::before {
    transform: scaleX(1);
}

/* ── Іконка ── */
.uip-dir-card__icon {
    width: 90px;
    height: 90px;
    color: var(--color-primary, #033899);
    margin-bottom: var(--space-lg, 1.5rem);
    flex-shrink: 0;
}

.uip-dir-card__icon-img,
.uip-dir-card__icon svg {
    width: 100%;
    height: auto;
    object-fit: contain;
    display: block;
}

/* ── Заголовок ── */
.uip-dir-card__title {
    font-size: var(--font-size-lg, 1.125rem);
    font-weight: 600;
    color: var(--color-text, #1A2332);
    margin: 0 0 var(--space-sm, 0.5rem);
    line-height: 1.3;
}

/* ── Опис ── */
.uip-dir-card__desc {
    font-size: var(--font-size-sm, 0.875rem);
    color: var(--color-text-secondary, #556377);
    margin: 0 0 var(--space-lg, 1.5rem);
    flex-grow: 1;
    line-height: 1.6;
}

/* ── Посилання ── */
.uip-dir-card__link {
    font-size: var(--font-size-sm, 0.875rem);
    font-weight: 600;
    color: var(--color-primary, #033899);
    transition: var(--transition, 0.3s ease);
    display: inline-block;
}

.uip-dir-card:hover .uip-dir-card__link {
    transform: translateX(4px);
}