.about-page { padding: 4rem 0; } .about-content { display: flex; align-items: flex-start; gap: 2rem; } .about-avatar { flex-shrink: 0; width: 15rem; height: 15rem; border: 0.25rem solid var(--bg-card); border-radius: 0.5rem; box-shadow: 0 0 0 0.0625rem var(--border); object-fit: cover; } .about-text-content { display: flex; flex: 1; flex-direction: column; gap: 0.5rem; } .about-page-heading { color: var(--fg); font-size: 2.5rem; font-weight: 700; letter-spacing: -0.0625rem; } .about-text { max-width: 45rem; color: var(--fg-secondary); font-size: 0.95rem; line-height: 1.75; } @media (max-width: 43.75rem) { .about-content { flex-direction: column; align-items: center; } }