@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300;400;500;600;700&display=swap');

.hv-footer {
    background: #000;
    padding: 22px 40px;
    border-top: 1px solid rgba(255,255,255,0.08);
    font-family: 'Space Grotesk', system-ui, sans-serif;
}

.hv-inner {
    max-width: 1100px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
}

.hv-copy {
    font-size: 11px;
    color: rgba(255,255,255,0.5);
    font-weight: 400;
    letter-spacing: 0.03em;
    margin: 0;
}

.hv-socials {
    display: flex;
    gap: 24px;
    align-items: center;
}

.hv-socials a {
    font-size: 11px;
    color: rgba(255,255,255,0.65);
    text-decoration: none;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    font-weight: 400;
    transition: color 0.2s ease;
}

.hv-socials a:hover {
    color: #fff;
}

@media (max-width: 600px) {
    .hv-footer { padding: 18px 20px; }
    .hv-inner { justify-content: center; gap: 12px; }
    .hv-copy { width: 100%; text-align: center; }
    .hv-socials { justify-content: center; gap: 16px; flex-wrap: wrap; row-gap: 10px; }
}

@media (max-width: 380px) {
    .hv-footer { padding: 16px 14px; }
    .hv-socials { gap: 14px; }
    .hv-copy { font-size: 10px; }
}