/* === Resume Header Card === */
.resume-header-card { font-family: inherit; }

.resume-header-card { display: flex; flex-direction: row; padding: 1.5rem; background: #ffffff !important; border-radius: 8px; position: relative; overflow: hidden; gap: 1.5rem; align-items: stretch; border: 1px solid var(--border-color); box-shadow: var(--shadow-xs); margin-bottom: 0; }
.resume-header-card::before { content: ''; position: absolute; left: 0; top: 1rem; bottom: 1rem; width: 4px; background: var(--accent-color); border-radius: 0 4px 4px 0; }

/* === Left Sidebar === */
.resume-left-sidebar { width: 35%; flex-shrink: 0; display: flex; flex-direction: column; gap: 0; border-right: none; padding-right: 0; }
.resume-avatar { width: 72px; height: 72px; border-radius: 50%; overflow: hidden; background: transparent; border: 3px solid #ffffff; box-shadow: 0 4px 12px rgba(0,0,0,0.06); flex-shrink: 0; margin-bottom: 1rem; }
.resume-avatar img { width: 100%; height: 100%; object-fit: cover; }
.resume-avatar-placeholder { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; color: #d1d5db; background: #f3f4f6; }
.resume-avatar-placeholder svg { width: 32px; height: 32px; }

.resume-sidebar-info-group { flex: 1; display: flex; flex-direction: column; justify-content: center; gap: 0.5rem; width: 100%; }
.resume-sidebar-info-group > .sidebar-section { width: 100%; padding: 0; margin: 0; }
.resume-sidebar-info-group > .sidebar-section > .sidebar-section { width: 100%; padding: 0; margin: 0; }
.resume-sidebar-info-group .sidebar-section:nth-child(2) { width: 100%; padding: 0; margin: 0; }

.sidebar-section { display: flex; flex-direction: column; gap: 0.5rem; width: 100%; }
.sidebar-section .sidebar-item { width: 100%; }
.sidebar-section.unified-info-module { background: transparent; border-radius: 0; padding: 0; gap: 0.5rem; border: none; width: 100%; }
.sidebar-section.unified-info-module .sidebar-section { width: 100%; padding: 0; }

.sidebar-item { display: flex; gap: 0.75rem; align-items: center; }
.item-icon { width: 32px; height: 32px; display: flex; align-items: center; justify-content: center; background-color: #f3f4f6; border-radius: 4px; color: var(--accent-color); flex-shrink: 0; }
.item-icon svg { width: 16px; height: 16px; display: block; }
.item-icon span { display: flex; align-items: center; justify-content: center; }
.item-content { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 0; justify-content: center; }
.item-primary { font-size: 1rem; font-weight: 300; color: #374151; line-height: 1.3; font-family: var(--normal-font); }
.item-secondary { font-size: 0.95rem; color: #6b7280; line-height: 1.3; font-weight: 300; font-family: var(--normal-font); }
.item-meta { font-family: monospace; font-size: 0.75rem; color: #9ca3af; margin-top: 1px; }
.edu-secondary-row { display: flex; gap: 8px; width: 100%; }
.edu-secondary-row .item-secondary { flex: 1; width: 50%; }
.edu-secondary-row .item-meta { flex: 1; width: 50%; margin-top: 0; text-align: right; }
.item-text { font-size: 1.05rem; color: #4b5563; line-height: 1.2; word-break: break-word; font-weight: 300; font-family: var(--normal-font); }

/* === Right Main Content === */
.resume-main-content { width: 65%; flex-shrink: 0; display: flex; flex-direction: column; justify-content: center; }
.resume-name { font-size: 2.25rem; font-weight: var(--bold-weight, 500); color: #111; line-height: 1.1; letter-spacing: -0.02em; margin-bottom: 0.25rem; font-family: var(--bold-font); }
.resume-role { font-size: 1.25rem; color: var(--accent-color); font-weight: 300; text-transform: uppercase; letter-spacing: 0.05em; margin-bottom: 0.75rem; font-family: var(--normal-font); }
.resume-divider { width: 60px; height: 4px; background-color: #f3f4f6; border-radius: 4px; margin-bottom: 0.75rem; }
.resume-bio { font-size: 1.1rem; color: #4b5563; line-height: 1.6; font-weight: 300; white-space: pre-line; max-width: 100%; margin-bottom: 0; font-family: var(--normal-font); }

/* === Metrics Row === */
.resume-metrics-row { display: flex; flex-direction: row; gap: 2rem; margin-top: 1rem; padding-top: 1rem; border-top: 1px solid #f3f4f6; }
.main-metric-item { display: flex; flex-direction: column; align-items: flex-start; }
.metric-val { font-size: 1.75rem; font-weight: 300; color: #111; line-height: 1; margin-bottom: 0.4rem; font-family: var(--normal-font); }
.metric-label { font-size: 1rem; color: #6b7280; letter-spacing: 0.05em; font-weight: 300; text-transform: uppercase; font-family: var(--normal-font); }