/* Über mich: Forest-Einstieg, eingefasstes Porträt, Paper-Stärken, Butter-Abschluss. */
.about-page { --fs-ui:.875rem; --about-width:1160px; --about-gutter:clamp(20px,4.5vw,72px); font-size:1.0625rem; }
.about-wrap { width:min(var(--about-width),calc(100% - var(--about-gutter)*2)); margin-inline:auto; }
.about-page .site-nav { padding-inline:var(--about-gutter); gap:24px; }
.about-page .brand { font-size:17px; white-space:nowrap; }
.about-page .brand-mark { flex-shrink:0; }
.about-page .site-nav nav { gap:24px; }
.about-page .site-nav a { display:inline-flex; align-items:center; min-height:44px; }
.about-page .nav-cta { white-space:nowrap; }
.about-page [aria-current="page"] { text-decoration:underline; text-underline-offset:5px; }
.about-page :is(a,button):focus-visible { outline:3px solid currentColor; outline-offset:5px; }
.about-skip { position:fixed; top:10px; left:16px; z-index:100; padding:12px 20px; background:var(--paper); transform:translateY(-180%); }
.about-skip:focus { transform:none; }
.about-page section[id],.about-main { scroll-margin-top:88px; }
.about-hero { background:var(--forest); color:var(--paper); padding:80px 0 88px; }
.about-intro { display:grid; grid-template-columns:minmax(0,1.18fr) minmax(0,.9fr); gap:clamp(40px,5vw,72px); align-items:center; }
.about-intro-copy > .eyebrow { background:var(--butter); border-color:var(--butter); color:var(--ink); margin-bottom:28px; font-size:.875rem; }
.about-intro h1 { font-size:clamp(2.6rem,4.4vw,4rem); line-height:1.055; letter-spacing:-.04em; max-width:10.5em; text-wrap:initial; }
.about-intro h1 span { display:block; color:var(--butter); margin-top:.2em; }
.about-copy { margin-top:28px; max-width:510px; font-size:1.0625rem; line-height:1.7; text-wrap:pretty; }
.about-copy p + p { margin-top:16px; }
.about-introduction { font-weight:650; }
.about-jump { display:inline-flex; align-items:center; gap:18px; min-height:44px; margin-top:24px; color:var(--butter); font-size:.9375rem; font-weight:650; }
.about-jump svg { width:20px; height:20px; }
.about-jump:hover { text-decoration:underline; text-underline-offset:5px; }
.about-person { margin:0; background:var(--paper); color:var(--ink); border-radius:16px; overflow:hidden; position:relative; }
.portrait-surface { position:relative; aspect-ratio:1/1.15; overflow:hidden; isolation:isolate; background:radial-gradient(ellipse at 60% 32%,#f3e7c5 10%,#e5d4a6 62%,#d8be84 100%); }
.portrait-surface::before { content:""; position:absolute; width:112%; aspect-ratio:1; border:1px solid rgba(30,51,40,.2); border-radius:50%; top:12%; left:-6%; }
.portrait-surface::after { content:""; position:absolute; inset:auto 0 0; height:8px; background:var(--brick); }
.portrait-mark { position:absolute; width:64px; height:64px; top:25px; left:25px; opacity:.55; }
.portrait-mark img { width:100%; height:100%; object-fit:contain; }
.portrait-photo { position:relative; width:100%; height:100%; aspect-ratio:1/1.15; object-fit:cover; object-position:50% 12%; }
.about-person figcaption { display:grid; gap:5px; padding:22px 28px 24px; }
.about-person strong { font-family:var(--font-display); font-size:1.5rem; font-weight:800; line-height:1.2; }
.about-person figcaption span { font-size:.875rem; line-height:1.4; }
.about-strengths { background:var(--paper); padding:76px 0 80px; }
.strengths-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:32px; padding-bottom:38px; }
.strengths-heading .eyebrow { font-size:.8125rem; margin-bottom:18px; }
.strengths-heading h2 { font-size:clamp(2.2rem,3.5vw,3rem); line-height:1.08; letter-spacing:-.035em; }
.strengths-heading > p { font-size:.9375rem; line-height:1.55; padding-bottom:3px; }
.strengths-list { list-style:none; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:30px 48px; margin:0; padding:0; }
.strength-item { padding-top:26px; border-top:1px solid rgba(30,51,40,.24); min-width:0; }
.strength-item > p { max-width:32ch; margin-top:18px; font-size:1rem; line-height:1.6; text-wrap:pretty; }
.strength { --marker:var(--butter); --marker-ink:var(--ink); display:inline-flex; align-items:center; isolation:isolate; min-height:46px; }
.strength-icon { display:grid; place-items:center; width:42px; height:42px; flex-shrink:0; border-radius:4px; background:var(--forest); color:var(--marker); position:relative; z-index:1; }
.strength-icon svg { width:24px; height:24px; }
.strength-label { display:flex; align-items:center; position:relative; min-height:43px; padding:9px 17px 9px 16px; font:500 1rem/1.45 var(--font-mono); color:var(--marker-ink); }
.strength-label::before { content:""; position:absolute; inset:-1px -3px -2px -8px; z-index:-1; background:var(--marker); clip-path:polygon(0 6%,8% 5%,14% 0,24% 5%,35% 3%,43% 8%,54% 5%,65% 7%,78% 2%,88% 4%,98% 0,100% 7%,99% 22%,100% 39%,99% 55%,100% 73%,99% 94%,91% 93%,83% 100%,72% 97%,64% 99%,52% 95%,40% 98%,29% 94%,20% 98%,10% 94%,0 96%,1% 75%,0 53%,1% 31%); transform:rotate(-1deg); }
.strength--1 { --marker:var(--brick); --marker-ink:#fff7e8; }
.strength--1 .strength-icon { color:var(--butter); }
.strength--2 { --marker:#c4ceaf; }
.strength--3 { --marker:var(--butter); }
.strength--4 { --marker:#d5c3a2; }
.strength--5 { --marker:#c5d5ca; }
.strength--6 { --marker:var(--olive); --marker-ink:#fff7e8; }
.strength--6 .strength-icon { color:#e7ddbd; }
.strength-item:nth-child(even) .strength-label::before { transform:rotate(1deg) scaleY(.98); }
.strengths-action { display:flex; align-items:center; gap:28px; margin-top:42px; }
.strengths-action > span { max-width:29ch; font-size:.875rem; line-height:1.6; }
.about-cta { display:inline-flex; align-items:center; justify-content:center; gap:24px; min-height:56px; padding:16px 24px; border:2px solid var(--forest); border-radius:7px; background:var(--forest); color:var(--butter); font-size:1rem; font-weight:750; line-height:1.35; transition:background .2s ease,transform .2s ease; }
.about-cta svg { width:23px; height:23px; flex-shrink:0; }
.about-cta:hover { background:var(--ink); transform:translateY(-2px); }
.about-partnership { background:var(--butter); padding:66px 0 72px; border-top:1px solid rgba(30,51,40,.14); }
.partnership-layout { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr); gap:72px; align-items:center; }
.about-partnership h2 { font-size:clamp(2.2rem,3.5vw,3.2rem); line-height:1.1; letter-spacing:-.035em; text-wrap:initial; }
.about-partnership h2 span { display:block; margin-top:.2em; }
.about-partnership p { font-size:1rem; line-height:1.7; text-wrap:pretty; }
.about-partnership p + p { margin-top:16px; }
.about-page footer { padding-inline:max(var(--about-gutter),calc((100% - var(--about-width))/2)); }
.about-page .footer-links { font-size:.875rem; padding-bottom:36px; }
.about-page .footer-links a { overflow-wrap:anywhere; }
.about-page .footer-wordmark { font-size:clamp(90px,20vw,240px); margin-block:48px; }
.about-page .footer-wordmark .brand-mark { width:clamp(62px,15vw,175px); }
@media (min-width:901px) and (max-width:1100px) {
 .about-page .site-nav { padding-inline:20px; gap:16px; }
 .about-page .site-nav nav { gap:14px; }
 .about-intro { gap:36px; grid-template-columns:minmax(0,1.12fr) minmax(0,1fr); }
 .about-intro h1 { font-size:clamp(2.5rem,4.4vw,3rem); }
 .about-copy { font-size:1rem; }
 .strengths-list { gap:30px; }
 .strength-label { padding-inline:12px; }
 .partnership-layout { gap:42px; }
}
@media (max-width:900px) {
 .about-page .site-nav { grid-template-columns:1fr auto auto; gap:12px; }
 .about-page .site-nav nav { gap:0; }
 .about-hero { padding-block:56px 64px; }
 .about-intro { grid-template-columns:1fr; gap:36px; max-width:680px; }
 .about-intro h1 { max-width:620px; font-size:clamp(2.6rem,6.4vw,3.7rem); }
 .about-copy { max-width:600px; }
 .about-person { width:min(100%,480px); margin-inline:auto; }
 .portrait-surface,.portrait-photo { aspect-ratio:1/1.03; }
 .strengths-list { grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px 36px; }
 .strengths-heading { display:block; }
 .strengths-heading > p { margin-top:20px; }
 .strengths-heading > p br { display:none; }
 .partnership-layout { grid-template-columns:1fr; gap:28px; }
 .about-partnership h2 { max-width:620px; }
 .about-partnership p { max-width:620px; }
}
@media (max-width:600px) {
 .about-page .site-nav { height:66px; grid-template-columns:1fr auto; padding-inline:20px; }
 .about-page .site-nav .nav-cta { display:none; }
 .about-page .site-nav nav { top:66px; }
 .about-hero { padding-block:40px 44px; }
 .about-intro-copy > .eyebrow { margin-bottom:22px; }
 .about-intro h1 { font-size:clamp(2.25rem,9.4vw,3.5rem); line-height:1.08; }
 .about-intro h1 span { margin-top:.25em; }
 .about-copy { margin-top:24px; font-size:1rem; line-height:1.65; }
 .about-jump { margin-top:18px; }
 .about-intro { gap:30px; }
 .about-person { width:100%; }
 .portrait-surface,.portrait-photo { aspect-ratio:1/1.05; }
 .portrait-mark { width:52px; height:52px; left:20px; top:20px; }
 .about-person figcaption { padding:19px 22px 21px; }
 .about-person strong { font-size:1.35rem; }
 .about-strengths { padding-block:44px 48px; }
 .strengths-heading { padding-bottom:28px; }
 .strengths-heading h2 { font-size:2rem; }
 .strengths-heading > p { font-size:.875rem; margin-top:16px; }
 .strengths-list { grid-template-columns:repeat(2,max-content); justify-content:center; align-items:center; gap:24px clamp(12px,3.5vw,24px); }
 .strength-item { padding:0; border:0; display:flex; justify-content:center; }
 .strength { min-height:40px; }
 .strength-icon { width:clamp(28px,8vw,36px); height:clamp(28px,8vw,36px); }
 .strength-icon svg { width:21px; height:21px; }
 .strength-label { min-height:38px; padding:8px 6px; font-size:clamp(.75rem,3.5vw,.9375rem); white-space:nowrap; }
 .strength-item > p { display:none; }
 .strengths-action { flex-direction:column; align-items:center; gap:16px; margin-top:38px; text-align:center; }
 .strengths-action > span { max-width:29ch; }
 .about-partnership { padding-block:42px 48px; }
 .about-partnership h2 { font-size:clamp(2rem,8.6vw,2.8rem); }
 .partnership-layout { gap:24px; }
}
@media (max-width:360px) {
 .about-strengths .about-wrap { width:calc(100% - 20px); }
 .strengths-heading { padding-inline:10px; }
}
@media (prefers-reduced-motion:reduce) { .about-page,.about-page * { scroll-behavior:auto; } .about-cta { transition:none; } }

/* Das Schließ-Icon reicht den Klick an seinen Button weiter. */
.about-page .tb-close svg, .about-page .tb-close svg * { pointer-events:none; }