/* File: wp-content/themes/log-core/assets/css/log-contact-hero.css */
/* Depends on: log-contact.css (inherits tokens, keyframes, hero layout) */
/* Prefix: .log-co- */

/* ── Illustration ── */
.log-co-hero-illustration {
    display: flex; align-items: center; justify-content: center; position: relative;
    animation: log-co-heroIn .8s var(--ease) .3s forwards;
}

.log-co-ill-wrap {
    position: relative; width: 100%; max-width: 560px;
    animation: log-co-floatIll 6s ease-in-out infinite;
}

.log-co-ill-stat {
    position: absolute;
    background: var(--white); border-radius: 14px;
    padding: 10px 14px;
    box-shadow: 0 8px 24px rgba(31, 14, 28, .22);
    font-size: 12px; font-weight: 700; color: var(--ink-900);
    display: flex; align-items: center; gap: 8px;
    opacity: 0; animation: log-co-popIn .5s var(--ease) forwards;
}

.log-co-ill-stat.s1 { bottom: 22%; left: -16px; animation-delay: 1.5s; }
.log-co-ill-stat.s2 { bottom: 8%; right: 10px; animation-delay: 1.8s; }

.log-co-ill-stat-num { font-family: var(--display); font-size: 20px; font-weight: 700; color: var(--plum-700); }
.log-co-ill-stat-label { font-size: 10.5px; color: var(--gray-600); font-weight: 600; line-height: 1.3; }

/* ── Stats bar ── */
.log-co-hero-statsbar {
    position: relative; z-index: 5;
    display: grid; grid-template-columns: repeat(4, 1fr);
    border-top: 1.5px solid var(--line);
    background: var(--white);
}

.log-co-hsb-item {
    display: flex; align-items: center; gap: 14px;
    padding: 22px 24px;
    border-right: 1px solid var(--line);
    transition: background .3s;
}

.log-co-hsb-item:last-child { border-right: none; }
.log-co-hsb-item:hover { background: var(--paper); }

.log-co-hsb-icon {
    width: 40px; height: 40px; border-radius: 11px; flex-shrink: 0;
    background: rgba(29, 219, 149, .1);
    display: flex; align-items: center; justify-content: center;
    color: var(--sage-600);
}

.log-co-hsb-icon .icon { width: 18px; height: 18px; }
.log-co-hsb-item strong { display: block; font-size: 14.5px; font-weight: 700; color: var(--ink-900); }
.log-co-hsb-item span { display: block; font-size: 11.5px; color: var(--gray-600); margin-top: 1px; }

/* ── Wave ── */
.log-co-hero-wave {
    position: absolute; bottom: 0; left: 0; right: 0; line-height: 0; z-index: 1;
}

.log-co-hero-wave svg { display: block; width: 100%; height: auto; }

/* ── Responsive hero ── */
@media (max-width: 1080px) {
    .log-co-hero-topbar { padding: 24px 28px 0; }
    .log-co-hero-body { grid-template-columns: 1fr; padding: 36px 28px 60px; gap: 40px; }
    .log-co-hero-illustration { justify-content: center; }
    .log-co-ill-wrap { max-width: 380px; }
    .log-co-hero-statsbar { grid-template-columns: repeat(2, 1fr); }
    .log-co-hsb-item { border-right: none; border-bottom: 1px solid var(--line); }
    .log-co-hero-live { font-size: 11px; padding: 5px 12px; }
}

@media (max-width: 600px) {
    .log-co-hero-topbar { padding: 20px 20px 0; }
    .log-co-hero-body { padding: 28px 20px 48px; }
    .log-co-hero-btns { flex-direction: column; }
    .log-co-hero-statsbar { grid-template-columns: 1fr 1fr; }
    .log-co-ill-wrap { max-width: 300px; }
    .log-co-ill-stat { display: none; }
}