/* sidebar.css — Homepage identity sidebar */

.sidebar {
    position: sticky; top: 64px; height: calc(100vh - 64px);
    border-right: 1px solid var(--rule); background: var(--bg);
    display: flex; flex-direction: column; justify-content: space-between;
    padding: 56px 40px 40px;
}

.identity-name {
    margin-bottom: 20px;
}
.identity-name img { width: 130px; height: auto; display: block; }

.identity-role {
    font-family: var(--font-mono); font-size: 0.6875rem;
    letter-spacing: 0.12em; text-transform: uppercase;
    color: var(--muted); margin-bottom: 32px; padding-left: 2px;
}

.identity-bio {
    font-size: 0.9375rem; line-height: 1.7;
    color: var(--mid); max-width: 30ch;
}
.identity-bio strong { color: var(--ink); font-weight: 600; }

.status-row {
    display: flex; align-items: center; gap: 10px;
    margin-bottom: 28px; padding-bottom: 28px;
    border-bottom: 1px solid var(--rule);
}

.status-dot {
    width: 7px; height: 7px; background: #4ADE80; border-radius: 50%;
    animation: pulse-dot 2.5s ease-in-out infinite;
}

@keyframes pulse-dot {
    0%, 100% { opacity: 1; box-shadow: 0 0 0 0 rgba(74, 222, 128, 0.4); }
    50% { opacity: 0.7; box-shadow: 0 0 0 6px rgba(74, 222, 128, 0); }
}

.status-text {
    font-family: var(--font-mono); font-size: 0.6875rem;
    letter-spacing: 0.06em; color: var(--mid);
}

.contact-stack { display: flex; flex-direction: column; gap: 6px; }

.contact-link {
    display: flex; align-items: center; justify-content: space-between;
    padding: 10px 14px; text-decoration: none;
    color: var(--ink); font-size: 0.8125rem; font-weight: 500;
    border-radius: 8px; border: 1px solid transparent;
    transition: all 0.2s var(--ease);
}
.contact-link svg {
    width: 15px; height: 15px; color: var(--muted);
    flex-shrink: 0; transition: color 0.2s var(--ease);
}

@media (hover: hover) {
    .contact-link:hover { background: var(--white); border-color: var(--rule); }
    .contact-link:hover svg { color: var(--accent); }
}

.cl-label { display: flex; align-items: center; gap: 10px; }

.cl-arrow {
    font-family: var(--font-mono); font-size: 0.75rem;
    color: var(--muted); opacity: 0; transform: translateX(-4px);
    transition: all 0.2s var(--ease);
}

@media (hover: hover) {
    .contact-link:hover .cl-arrow { opacity: 1; transform: translateX(0); }
}

/* Responsive */
@media (max-width: 900px) {
    .sidebar {
        position: relative; top: 0; height: auto;
        border-right: none; border-bottom: 1px solid var(--rule);
        padding: 40px 32px;
    }
    .status-row { margin-top: 32px; }
    .contact-link { min-height: 44px; }
}

@media (max-width: 560px) {
    .sidebar { padding: 32px 20px; }
    .contact-stack { gap: 2px; }
}