.hero-v4 { padding-top: 24px; padding-bottom: 40px; }

.hero-v4-block {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
    width: 100%;
    min-height: 440px;
    padding: 40px;
    background: #f6f8fa;
    border-radius: 16px;
}

.hero-v4-content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 32px;
}
.hero-v4-text { display: flex; flex-direction: column; gap: 16px; }
.hero-v4-text .title { margin: 0; }
.hero-v4-text .desc { margin: 0; }

.hero-v4-buttons { display: flex; gap: 16px; }
.hero-v4-buttons .btn {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 52px;
    padding: 8px 24px;
    font-size: 18px;
    line-height: 28px;
    white-space: nowrap;
}

.hero-v4-illustration {
    position: relative;
    width: 100%;
}

@media (min-width: 1181px) {
    .hero-v4-illustration {
        max-width: 450px;
    }
}

/* Stats row */
.hero-v4-stats {
    display: flex;
    gap: 8px;
    align-items: stretch;
    width: 100%;
    margin-top: 8px;
}
.hero-v4-stat {
    display: flex;
    flex: 1 0 0;
    align-items: center;
    gap: 16px;
    min-width: 0;
    padding: 24px;
    background: #f6f8fa;
    border-radius: 16px;
}
.hero-v4-stat-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 60px;
    height: 60px;
    background: #ebedf2;
    border-radius: 16px;
}
.hero-v4-stat-icon img { width: 32px; height: 32px; }
.hero-v4-stat-text { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.hero-v4-stat-value { margin: 0; font-weight: 900; font-size: 24px; line-height: 30px; color: #221f1f; white-space: nowrap; }
.hero-v4-stat-label { margin: 0; font-weight: 400; font-size: 18px; line-height: 24px; color: #221f1f; }

.hero-v4-block,
.hero-v4-illustration .illu-card,
.hero-v4-illustration .illu-connector {
    opacity: 0;
    transform: translateY(12px);
    transition: opacity .5s ease, transform .5s ease;
}
.hero-v4.is-in-view .hero-v4-block,
.hero-v4.is-in-view .illu-card,
.hero-v4.is-in-view .illu-connector {
    opacity: 1;
    transform: translateY(0);
}

@media (max-width: 1180px) {
    .hero-v4-block { flex-direction: column; align-items: stretch; min-height: 0; }
    .hero-v4-content { max-width: none; }
    .hero-v4-illustration { align-self: center; }
}
@media (max-width: 992px) {
    .hero-v4-stats { flex-direction: column; }
}
@media (max-width: 768px) {
    .hero-v4-block { padding: 24px; gap: 24px; }
    .hero-v4-buttons { flex-direction: column; width: 100%; }
    .hero-v4-buttons .btn { width: 100%; }
}
@media (max-width: 576px) {
    .hero-v4 { padding-top: 16px; padding-bottom: 24px; }
    .hero-v4-block { padding: 16px; border-radius: 12px; }
    .hero-v4-stat { align-items: flex-start; gap: 16px; padding: 16px; }
}