/* ABOUT: Story and education above three independent identity sections. */
.about-overview { padding-top: 3.6rem; }
/* VStack: same readable width, independent content heights at every viewport. */
.about-stack { display: flex; flex-direction: column; gap: 3rem; width: 100%; max-width: 56rem; margin-inline: auto; }
.story { display: flex; flex-direction: column; }
.story h1 { margin-bottom: 2rem; }
.education { display: flex; flex-direction: column; background: linear-gradient(145deg,var(--surface-raised),var(--surface)); border: 1px solid var(--line); padding: clamp(1.4rem, 3vw, 2.5rem); border-radius: var(--radius); }
.education-heading { margin-bottom: 2.2rem; }
.education-heading h2 { font-size: clamp(2.3rem,3.5vw,3.5rem); margin-top: .7rem; }
.school + .school { margin-top: 2.4rem; padding-top: 2rem; border-top: 1px solid var(--line); }
.school-heading h3 { font: 400 1.55rem/1.2 var(--font-display); }
.school-heading > span { display: block; margin-top: .3rem; color: var(--subtle); font-size: .8125rem; }
.degree-group { margin-top: 1.5rem; }
.degree-group + .degree-group { margin-top: 1.6rem; padding-top: 1.3rem; border-top: 1px solid #35434b80; }
.degree-list { margin: 0 0 0 .2rem; border-left: 1px solid #d0af7833; }
.degree { position: relative; padding: 0 0 1.75rem 1.3rem; }
.degree:last-child { padding-bottom: 0; }
.degree::before { content: ''; position: absolute; top: .4rem; left: -3px; width: 5px; height: 5px; background: var(--accent); border-radius: 50%; }
.degree-top { display: flex; align-items: baseline; gap: .4rem 1rem; justify-content: space-between; flex-wrap: wrap; }
.degree h4 { font: 500 .9375rem/1.4 var(--font-body); }
.degree-date { color: var(--accent); font-size: .75rem; }
.degree p { font-size: .875rem; color: var(--muted); margin-top: .25rem; }
.degree .degree-note { font-size: .8125rem; color: var(--subtle); }
.identity { margin-top: var(--section-space); }
.identity-title { margin-bottom: 3rem; }
.identity-section { display: grid; grid-template-columns: .85fr 1.3fr; gap: clamp(2rem, 6vw, 6rem); padding-block: 3rem; border-top: 1px solid var(--line); }
.identity-label { align-self: start; position: sticky; top: 8rem; }
.section-number { display: block; color: var(--accent); font-size: .75rem; letter-spacing: .1em; margin-bottom: 1rem; }
.identity-label h3 { font: 400 clamp(2rem,3.2vw,3.2rem)/1.13 var(--font-display); letter-spacing: -.025em; max-width: 15ch; }
.cv-panel { margin-top: 2rem; padding: 2rem; display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; border: 1px solid var(--line); background: var(--surface); border-radius: var(--radius); }
@media (max-width: 700px) { .identity-section { grid-template-columns: 1fr; gap: 1.5rem; padding-block: 2.5rem; } .identity-label { position: static; } .identity-label h3 { max-width: 20ch; } .cv-panel { align-items: flex-start; flex-direction: column; padding: 1.5rem; } }