.contact-line {
    display: flex;
    align-items: flex-start;
    gap: var(--space-16);
    color: var(--text-primary);
    text-decoration: none;
}

.contact-line .icon {
    flex-shrink: 0;
    width: 24px;
    height: 24px;
    color: var(--text-accent);
}

.contact-line__value {
    display: block;
    margin: 0;
    color: var(--text-primary);
    transition: color var(--duration-base) var(--ease-out);
}

a.contact-line:hover .contact-line__value {
    color: var(--text-accent);
}

.contact-line__note {
    display: block;
    margin: 0;
    color: var(--text-tertiary);
}
