/* Header with photo and name */ .cv-header { margin-bottom: 2rem; } .cv-header-content { display: flex; justify-content: space-between; align-items: flex-start; gap: 2rem; } .cv-header-left { flex: 1; position: relative; /* Desktop: Add right padding to make room for the photo */ padding-right: 185px; /* Photo width (150px) + gap (35px) */ } .cv-photo { width: 150px; height: 200px; flex-shrink: 0; overflow: hidden; border: 3px solid white; box-shadow: 0 2px 8px rgba(0,0,0,0.15); /* Desktop: Position photo in the right padding area */ position: absolute; top: 15px; right: 15px; /* Margin from the right edge */ } .cv-photo img { width: 100%; height: 100%; object-fit: cover; } .cv-name { font-family: 'Quicksand', sans-serif; font-size: 2.2em; font-weight: 400; /* font-style: italic; */ line-height: 1.1; margin-bottom: 8px; color: var(--text-primary, #1a1a1a); text-align: right; } .cv-experience-years { font-family: 'Quicksand', sans-serif; font-size: 0.9em; font-weight: 500; line-height: 1.5; color: var(--text-primary, #1a1a1a); margin: 0; } .years-experience { font-family: 'Quicksand', sans-serif; font-size: 1.25em; font-weight: 400; color: var(--text-muted, #666666); margin: 4px 0 0 0; line-height: 1.4; text-align: right; } /* Intro/Excerpt Text - Positioned inside header, matching old React CV */ .intro-text { font-family: 'Quicksand', sans-serif; font-size: 1.0em; line-height: 1.6; color: var(--text-secondary, #333333); margin-top: 20px; text-align: justify; text-justify: inter-word; hyphens: auto; -webkit-hyphens: auto; font-style: italic; }