/* About page: portrait beside the prose, the where-I've-worked cards and the resume line. Loaded only where `adams-about` or `adams-where` is used. */
.adams-about { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2.4fr); gap: clamp(2rem, 5vw, 4.5rem); align-items: start; }
@media (max-width: 52rem) { .adams-about { grid-template-columns: 1fr; } }
.adams-about .adams-portrait { position: sticky; top: 6rem; margin: 0; border-radius: var(--radius); padding: .4rem; background: linear-gradient(135deg, #0A5655, #4FC3C0); }
.adams-about .adams-portrait img { display: block; width: 100%; height: auto; border-radius: calc(var(--radius) - .1rem); }
@media (max-width: 52rem) { .adams-about .adams-portrait { position: static; max-width: 13rem; } .adams-about .adams-portrait img { aspect-ratio: 4 / 5; object-fit: cover; object-position: top; } }
.adams-about .adams-prose { display: block; }
.adams-about .adams-prose > p { margin: 0; }
.adams-about .adams-prose > p + p { margin-top: 1.25rem; }
.adams-about .adams-intro-p { max-width: 52rem; font-size: 1.375rem; line-height: 1.55; }
.adams-about .adams-prose-h2 { margin: 3.25rem 0 1.1rem; }
/* The "How I work" steps follow the mockup: one column up to and including 48rem, and a 1.15 title line height. */
@media (max-width: 48rem) { .adams-about ol.adams-steps { grid-template-columns: 1fr; } }
.adams-about ol.adams-steps.ico-l > li > strong { line-height: 1.15; }
ul.adams-where { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; }
@media (max-width: 44rem) { ul.adams-where { grid-template-columns: 1fr; } }
ul.adams-where > li { display: grid; gap: .1rem; padding: 1rem 1.25rem; background: var(--panel); border: 1px solid var(--line); border-left: .25rem solid var(--teal); border-radius: var(--radius); transition: transform .25s, box-shadow .25s; }
ul.adams-where strong { font-family: var(--font-display); font-size: 1.1875rem; }
ul.adams-where span { color: var(--muted); font-size: var(--fs-ui); }
@media (any-hover: hover) { ul.adams-where > li:hover { transform: translateX(.3rem); box-shadow: var(--glow); } }
.adams-close { margin-top: 3rem; display: flex; flex-wrap: wrap; gap: 1.25rem; align-items: center; }
.adams-close > p { margin: 0; }
.adams-frame .adams-card-tags { margin-top: .9rem; }
@media (prefers-reduced-motion: reduce) { ul.adams-where > li { transition: none; } }