.about__content {
    display: flex;
    flex-direction: row-reverse;
    align-items: flex-start;
    gap: var(--space-12);
}

@media(max-width: 900px) {
    .about__content {
        flex-direction: column-reverse;
        align-items: stretch;
        gap: var(--space-8);
    }
}

.about__photo-container {
    flex: 0 0 320px;
    margin: 0;
}

@media(max-width: 900px) {
    .about__photo-container {
        flex: 0 0 auto;
        max-width: 320px;
        align-self: center;
    }
}

@media (max-width: 640px) {
    .about__content { gap: var(--space-6); }
    .about__photo-container { max-width: 220px; }
}

.about__text {
    flex: 1;
    min-width: 0;
}

.about__photo {
    width: 100%;
    height: auto;
    border-radius: 8px;
    border: 2px solid var(--accent);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35), 0 0 0 1px rgba(215, 38, 56, 0.15);
    transition: transform 250ms ease, box-shadow 250ms ease, filter 250ms ease;
}

.about__photo:hover {
    transform: translateY(-2px);
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.45), 0 0 0 2px rgba(215, 38, 56, 0.35);
    filter: brightness(1.05);
}

.about__body {
    font-family: var(--font-mono);
    font-size: var(--text-base);
    color: var(--fg-muted);
    line-height: var(--line-relax);
    max-width: 60ch;
    margin-bottom: var(--space-6);
    min-height: calc(var(--line-relax) * var(--text-base) * 6);
}

.about__body.is-typing::after {
    content: '';
    display: inline-block;
    width: 0.55ch;
    height: 1em;
    margin-left: 1px;
    vertical-align: -0.15em;
    background: var(--accent);
    animation: about-caret-blink 1s steps(1) infinite;
}

@keyframes about-caret-blink {
    50% { opacity: 0; }
}

.resume-toggle {
    background: transparent;
    font: inherit;
    cursor: pointer;
}
