/* ============================================================
   birgit theme — ueber-mich.css — Über-mich template
   Part of the conditional-partial split of the original single
   stylesheet. Rules moved verbatim; cascade preserved via enqueue order.
   ============================================================ */

/* ============================================================
   ABOUT INTRO  (portrait + text side by side)
   ============================================================ */

.about-intro {
    background: var(--color-cream-100);
    padding: 4rem 2.5rem;
}

.about-intro__inner {
    display: flex;
    gap: 3rem;
    align-items: flex-start;
    justify-content: center;
    flex-wrap: wrap;
    max-width: 1100px;
    margin: 0 auto;
}

.about-intro__portrait {
    margin: 0;
    flex: 0 1 360px;
}

.about-intro__portrait img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 2px;
}

.about-intro__text {
    flex: 1 1 360px;
    max-width: 480px;
    font-family: var(--font-sans);
    font-size: 1rem;
    line-height: 1.7;
    color: var(--color-stone-800);
}

.about-intro__text p {
    margin: 0 0 1.25rem;
}

.about-intro__text p:last-child {
    margin-bottom: 0;
}

/* ─── Qualifikationen: rows with underline dividers ───────── */
.qualifications {
    list-style: none;
    margin: 0;
    padding: 0;
    font-family: var(--font-sans);
    font-size: 0.95rem;
    color: var(--color-navy-800);
}

.qualifications li {
    padding: 1rem 0;
    border-bottom: 1px solid var(--color-stone-200);
}

.qualifications li:last-child {
    border-bottom: none;
}


/* Über-mich small-screen tweak (split from a shared @media; .section-block half is in chrome.css) */
@media (max-width: 720px) {
    .about-intro { padding: 2.5rem 1.25rem; gap: 2rem; }
}