@font-face{font-family:"Bodoni Moda";src:url(fonts/bodoni-moda.woff2) format("woff2");font-weight:400 900;font-display:swap}
@font-face{font-family:"Hanken Grotesk";src:url(fonts/hanken-grotesk.woff2) format("woff2");font-weight:100 900;font-display:swap}
@font-face{font-family:"Zeichen";src:url(data:font/woff2;base64,d09GMgABAAAAAAQMABIAAAAAB+gAAAOsAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAGYFkGyAcQgZgP1NUQVQqADQRCAqDNIJ1ATYCJAMGCwYABCAFhBgHIAwHFyQYBhtpBlGUMMo8gI/Dpsy9GIkRVozESIQHNys5/JL/8fDffrT7/syqJk3raCJtwi2pJJeEJ21kj0QPmUPFG153Dt+rn2xyKo7oUu2exDzQ/iWmTtVka2xq/jyAAQ1owEKrc5z3irWxBkG9QmsC/nkXlSNS4QJgbW3654HFAODYY1go+0ghNDsAsANRO39hQQXodg7s1QVi9vZq2xli9tFuHUF3kHajoDtE+3SDGM6gkg3QMFmhFiRZs06Bpkllm7NwWqofVCbIepH9O9u1GtN9/jVh8b26d+3WU00UwQhUvGFc+o3aYm68SCCchNCojwDtbFcZ6kRYTqMpKTfCRVzERVycJzKg9uf0Ib5worpWbQaWxdWxhSMiQGVorHrVFq0qzoaUqxbZmXqUCeQLIQDBm+jHqiHOQhA0gt3RzX1kJ/Z26IMQKgHRHl8ABhK6YYFuxBCQZcHVyVJAduauAH+cR9sYTpPRijt4DFDfaM1kWeIWwnGE5wlhmMFz5vjCiDVrGAa1pO/RF9qDqysZ2YgDDIM9kivnrPGFEUsuZCxa5D9vXxQauXbvXnbyfIQqLt7dunTDGt2iXadMLfvv36/2u3OnYs4c386yClxD14IRquSBa81jH2cqoRV196t6j9x41G8OwwXzrbL/J+LkwEsf55HY+54eV61cwOGPi3Hcew/PW62lsMApOdo6LVdIIgW+/dLGhsyIzh/vhnwIjPSatH7/ULUnvDzd041fyPw4EktTrc8Mbm940+91Zd2aZ8xw2c9TZ3mWx3nThMDYBxRlfizI3/b7Est9LzZWA2XqZ8KbfWGTq9Myc1+9Jw0Ped6ieSVgQdYzDIf1t8D5lv/JATOGSPN8iJffxO6/dcgKAAhU3t/7+evuVo+E/64p/YBP5x+VAr57H8hnLc/Tq5QH1KpAkC9MvyL9MIMhnRBMaaQfdrH2cOCOVhBwqMFhWOQGbAY5CFNqQKXVXZCst2Y614EaW/yQas2LqpIIzXELaPstD41qzUjBQSSJZlUYDhEUUrXRXSttKRh00EcfPcSxs+tvUzZ0GlPeWndd2RnRIn8fD0OhXFu9dNSOQoV0CpkG6KMXqkBH7dnvpVCorTY66qurMm2111cXVC8ONiJROKscknjZihXLFt/Lq5YOVqUVrXKql9466q4bBYId2IOta/z9FiK5fWO8rqjO2qK0nbYGaMsTjOKayM3QavfTXk1iRqvsNdeul1HGvsg3RTv0b5r7GPUO06eTCDMKDAMAAA==) format("woff2");font-weight:400 500;unicode-range:U+842C;font-display:swap}
@font-face{font-family:"Zeichen";src:url(data:font/woff2;base64,d09GMgABAAAAAAS8ABIAAAAACQwAAARcAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAGYFkGyAcQgZgP1NUQVQqADQRCAqFWIRoATYCJAMGCwYABCAFhBgHIAwHFyQYBhtcBwAeg+NuiaVh3rwF/fxhXx4PT/vjO/fNfAArZMCVQnNJGzcrNNd1dnwH7+lfqYmZnHbKwA5SRvLR+iKLDLkvkhAT738up/fbmPXiuucH2AA60ETG3BauRWNrFG7wMLtR29JtpXHAlOocVSiJ8SjDjeHh8fiVQqi3B2ALssp5Hn5hoLu1qjgXsJ3FaTmA7cLzs0B3L56Pg+4+vDQfMFRQyAbSZmhRJUiyeq0U9EvlFueQ0hIoRyg7ZZ3Iu1PSk0t/6b8mLL+4IC9/TzyUBV+NptBI7NRLlaWceYlAOIWAWv3UEO5tdBlKCRAzPoPzGzFRJspEmegwNAPYnNOH+AoVFHeIUQCW2pWxAURhAVAIl0C1SgsX6AnOJzZa0iFJJ/kiQQ1AsBI+ZQ9GFaJBWNqts/sRT2ZklhIIKAREM+EroBIJ7WCJvplsMJBlwZ5IJMA8LAWY4rmjKcN+MtqAX8REAIBgW7e8pjns2praRlRXV1tb35Dz2dFVunrrbnErJsea3CQT0bRWfuPdu3eVI302/bpiQn7i5M6dyklL5F7HmEHinXKHatBN7mJcUIzfFqLjc+t0N9y54xO79u5dT9lV7pBFzNoJb/TcuvD9t5c2rVJauKNUGSDFmhAfHdUmNq5axWSmzU2r1+93ZDP5Srzi/ceXIXJ71DImtSePKTBn7iqHO4WHh1c1jl4viVjOgtrVwIyVwIxpmvPYveo9qpY+rr7uHixlbWNklU4A6MyZwHwtwg1DDkv7YRs6YzJsfJzc3zGJCC4JhC9zJfLve9I2bcXuVu0xwXzEvp4eRiwtE7PlJBZz19r6WkcYBx9h+2IHCmCZ95W1VPirtZF6FfqxEn/9wwEPqRe/y8S1JjkJ1AxxSkSTpk44oVLTT+SmfGrt0yD3VIedToRgX3o8mzLA010xTPWIAm0xm1LCu7XMWY6xnn/VyDmV/+0TrT/ug3Cw3MWbFsP6pmYtVghRmZNjLGZTU9Rvh7rIMT+8ZfwX5pNtf/H5W4aUwOm/ykMz+bLef2bSV/vF8EpCU4j5uMzY/flJ8Q0ljO6vGlXmGeQwfcaOaLeWzTpdk0f6PcljXUfAq+vVtizxVK+oXp4wLCCfESi88adk0RJ59t/oKf2Ez2eXggH4IbXPF1TKLelE8gVQqQBBvvj/M+mnfrrnpACm8Ea2UaGo8EvbiCDbahxBErkGq8AcDTNEoYVGj9BkmVX9OQ6tsMFPcaVJEVEUoT4eAJrPeQajpTCAEEEJWTMhmYgFhItUBZKlgV5fplKlCtkyY6ZCE6bwOOWBTVEgjxkDCDCVjtdAhEpTLEs6RBgxhLtKpYrh/GTJyP4uhL80qbKUyRMiTYYyuXDFREyhUOZMeBGy4ylQIE92exmoZmtKmkDEr4qVyFIgHwJLZnZLSoypvCNC3VhvJw8uRxqK06WplJbHYpWrJ28GkTpvIz0koqjcbQy6FyFpe07ug2gGwp//7I+ROQKXUFnmEQAA) format("woff2");font-weight:400 500;unicode-range:U+6A02;font-display:swap}
@font-face{font-family:"Zeichen";src:url(data:font/woff2;base64,d09GMgABAAAAAAQUABIAAAAACAwAAAO0AAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAGYFkGyAcQgZgP1NUQVQqADQRCAqDWIMPATYCJAMGCwYABCAFhBgHIAwHFyQYBhuDBiAehXHDHQOGMimawQHGU5944Dtk/+6aC8cWntPGGhYWBxJlS7MiKm8/T+t8KC//TTNVktKpsNtUxKKQbh8wb1IiFrr+//eT769ple4d/4ADHejARl3aYFUUbbIzkLIqjQJtSmKbujGPtKAEVn+/U6CnFBC8esAGSm0gPjUXTpt97Y0I3G2vakDgnqy5Dk6HsmYZnI5knc0IpAaIKGsO3CyDGiChePpMTQGTN4hJyehGMpQxuq+olrfO76xTVrW0tzQ1LylP5Mu0ZifihA+fgFrmmpcQQNCLgDKWrJERqYECZRKgPZQJF7khXMRFXMTFZqIAmFyQHpIvCiFexULAuJsZVuAdfIFIBgRKZBqezkhA5NzfY2w6+w8KLog1IMBEuH+JrdQQhAYCGhDQSOW8praTEEBEgFBDvoAIEmjAIKABJYACFIG5v5wd2kMBCGAmn506AvMpANXgBvAEGNisuoxltTiOV6daWpSaciVaEWPr9xvNYrWrtGICHi/XWUe7hY3Im7XKcN0tB+OFd/t1CsZWp8K6hXoxN7beV6KTM9QzzAr0cwC7x4GdISTPSzS6ahXLFijp4oXr9aC7zoFdz5vngNFF+3znLDCes8aJXEfevZubeE3yd1/ePG/dBOMFd9wOPL69FTuL/7qNRao1JENH46UIowvpLytOYtdQYsEjZ29zjzPTfQ2e+URKt+zZax4njt6/Gg6G5JV9FGESYb2bfw+r23cH2j+ntWqcKEHYi+ZDk7vcivYHfaymtu26vK7UB1YPnLfYIrV1i+XO89Rsny774Dc7nxvhG3x9BVN8lucNMn2s3EYCs5qzaE8z63PrlNW9cy916sbP/X1SB9NtiRpbo3m673OMX0u28M9KiHIAIIDo9M6XZ3QqdEK/aiTmHcDb2eVZwLf+vnSSvDmdZlIBRVQAAQou/r0B6QcS9uk0CJpDMqwkgQTRYuigOU5Vqh2DFGgC5iBERLhCpELbHMTItaqeliFV5X5I1QSG/CRCwIcpBrrrLOBCwZXAm8hLAAnO4c2XIIpSC7kqAhe1OnVqFcyTp55HUErWVZ2u0KKJJ1dIf4VOLQQ5qrSrU02QK4YgTq9O7WRS1alRq5MgTRWlOl2aZKtSo0sjmXbepEQiHxKJvIRIkCFDgpCljDBDachKIP9X7TrUadFMMGutuFVRYu4+wUv3yg/RRKZBlSVXq9KrSqY1/qTEjUGBPlkIL4OK8m7exj2T/z3SyUgNyO8//y8q68AxnQQEtWPpBAAA) format("woff2");font-weight:400 500;unicode-range:U+58FD;font-display:swap}
@font-face{font-family:"Zeichen";src:url(data:font/woff2;base64,d09GMgABAAAAAAQEABIAAAAAB9AAAAOmAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAGYFkGyAcQgZgP1NUQVQqADQRCAqDHIJsATYCJAMGCwYABCAFhBgHIAwHFyQYBhtgBiiOwzgWfKByktbgeXpP+nMzU2HlrJx2JZZegA+Av8gQ5O5+L56EkEBQW3lAmFn9zzX1/kUvbG+eeoADHejARpEtsKZosIHMJBKknlfwiG3qdJSx+nhEgtNSSij7fH6/EkHwkwcQp3FOnjp7MT361nqR4aOeKjB8xso5eqxYOUaPHdtQZjgnAAaajrrp4zKcACg0fppq7RSUfQs7KDWTTcQ+gqYlnUuk4zS84bcJ069XSuVWXZbB0o66yOnBX3oCp40d94AAwhYCeGmvIzkXudEAtg0Aqcmxxu+EWZiFWZg1zlIA87V6U37lAOOYsRyYdauVtURjMBigkOGmlmlt3jTGn45zpqraR0Dvlo6AQBXef0STE0FwI0BzArRnbM5kN4gABgIgYfkVgAEooDmFAM1pTKDRCGwuts2CI18iAC4JAiHFatCAHzgC3AQGJP3+ABCt6XN1DPgrbx/m5vOuu6fHI+8sXbrkrKt63PfWW4tbvvjuuytFlgTwG3uuusrrzXjHJbzNV670qw9yrjT+rG7u7Yt94hUfe86+2hc4fm2rc2/t5Fty9dXsOeuut7z+Y888cIkklpw19Km33lrc9tl3UZMNLdt79fX3tyhflTc4dUnafbDT7O7fjDtjgn/i/pnr2n3UMz5h6hmDN1cH7O4+3rf2zA2j4xM9L3VjUV3VYf1UNfr9Jv7GDu+FyyYOWflGRBfeDwYWhg91ODSTYNYf5f3ldV+b76M3O/o+Hw7qL1uWPe6PjOI8z7xgaPvP3XJNT9+w4dpf3ca8Pzxe36u9Jqnhq4Z8zZUd/jkyedq/4/64OnSrb6HR5Zr9Lfa0rLb5/6aDgyYw9rZ7yfWtzwYAAQye7vrZkMi60Ojf3Ep9B/DFs5cvAPi26X1zGfpvVo+p2YATAwABvfv/L6C+Y6he+RgCXBLnkoa25I7gL3fAIg91CtEeYDkelMJYy5UGQc5RKha7algnlQ7W+lPhZHgsLRPBL6cYhHe5gF4SejNFWSKG6e+niBrMNEFSRVyKqZesDTaoGmmggTZfhQFiwziECRUlA/WGua4NdArTIil1OWmmxSYxTbHFBnUxs+Vk9OcyzZGSlLNRyUIpGRsVxdRFDWCxDNLfdBGjTDPPPNOManO4i3d27f6w9Fd1DTkVZaZ5snpPIuXadCARGzWPUhJTkLLytJQtUiL3UNlgdoNltrjVIwros+8matZ9Yh+8TZ9Ewsivz/8dDe2mez4JiInd3QA=) format("woff2");font-weight:400 500;unicode-range:U+771E;font-display:swap}

@property --dreh{syntax:"<angle>";inherits:true;initial-value:0deg}
@view-transition{navigation:auto}
::view-transition-old(root){animation:vt-aus .35s ease both}
::view-transition-new(root){animation:vt-ein .55s ease both}
@keyframes vt-aus{to{opacity:0}}
@keyframes vt-ein{from{opacity:0;transform:translateY(16px)}}

/* Konzept: Ein Kommunikationsmensch gestaltet mit seinem Werkzeug, dem Satzzeichen.
   Jede Seite hat ihr eigenes Zeichen, Kernsätze werden wie mit dem Textmarker angestrichen,
   und der laufende Puls endet immer in einem Punkt. Farben: Tannengrün, Farn, Nebel, ein Strich Lindgrün. */
:root{
  color-scheme:dark;
  --tanne:#10261f;--moos:#1a382e;--farn:#2c5344;--salbei:#bccabb;--nebel:#eef0e6;--papier:#f7f8f2;--linde:#d3de7c;--tinte:#10261f;--grau:#3e5349;
  --display:"Bodoni Moda","Bodoni 72",Didot,"Times New Roman",serif;
  --text:"Hanken Grotesk","Helvetica Neue",Arial,sans-serif;
  --zeichen:"Zeichen","Noto Serif TC","Songti TC","PMingLiU",serif;
  --gr:clamp(16px,5vw,76px);--nav:66px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--tanne);overflow-x:clip}
body{margin:0;background:var(--tanne);color:var(--nebel);font:400 1.0625rem/1.62 var(--text);overflow-x:clip;-webkit-font-smoothing:antialiased}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:40;background:var(--tanne)}
h1,h2,h3,p,dl,dd,ol,ul,figure,blockquote{margin:0;padding:0}
ol,ul{list-style:none}
a{color:inherit;text-underline-offset:.22em;text-decoration-thickness:1px}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
input{font:inherit}
:focus-visible{outline:2px solid var(--linde);outline-offset:3px}
.hell :focus-visible{outline-color:var(--tinte)}
.band{padding-left:max(var(--gr),env(safe-area-inset-left,0px));padding-right:max(var(--gr),env(safe-area-inset-right,0px))}
.block{padding-block:clamp(60px,8.5vw,124px)}
h1,h2{font-family:var(--display);font-weight:500;letter-spacing:-.014em;text-wrap:balance;font-variation-settings:"opsz" 34}
h1{font-size:clamp(2.7rem,5.6vw,5.3rem);line-height:1.03}
h2{font-size:clamp(2.2rem,4.6vw,4.2rem);line-height:1.07}
h3{font:500 1.5rem/1.18 var(--display);font-variation-settings:"opsz" 12}
.lede{max-width:60ch;color:var(--salbei);font-size:1.13rem;hyphens:auto}
.fliess{display:grid;gap:1.05em;max-width:62ch;hyphens:auto}
.fliess .gross{font:500 clamp(1.6rem,2.8vw,2.45rem)/1.2 var(--display);font-variation-settings:"opsz" 20;hyphens:manual}
.hell{background:var(--nebel);color:var(--tinte)}
.hell .lede{color:var(--grau)}
.moosig{background:var(--moos)}
.amp{display:block;width:100%;pointer-events:none}

/* Textmarker */
mark{color:inherit;background:linear-gradient(var(--linde),var(--linde)) no-repeat 0 92%/0% .34em;transition:background-size 1.1s cubic-bezier(.3,.7,.2,1)}
mark.da{background-size:100% .34em}
.hell mark{background-position:0 86%;background-size:0% .62em}
.hell mark.da{background-size:100% .62em}

/* Der Punkt, der dem Zeiger folgt */
.punkt{position:fixed;left:0;top:0;width:14px;height:14px;margin:-7px 0 0 -7px;border-radius:50%;background:var(--linde);box-shadow:0 0 0 1px rgba(16,38,31,.55);pointer-events:none;z-index:60;transform:translate(var(--x,-99px),var(--y,-99px));transition:opacity .15s}
@media (pointer:coarse){.punkt{display:none}}

/* Kopf */
.kopf{position:sticky;top:env(safe-area-inset-top,0px);z-index:30;height:var(--nav);background:var(--tanne);display:flex;align-items:center;justify-content:space-between;gap:20px;view-transition-name:kopf}
.marke{font:500 1.42rem/1.2 var(--display);font-variation-settings:"opsz" 14;text-decoration:none;white-space:nowrap}
.marke i{font-style:normal;color:var(--linde)}
.kopf nav ul{display:flex;gap:clamp(16px,2.4vw,34px);align-items:center}
.kopf nav a{position:relative;display:block;padding:8px 0;font-size:.97rem;text-decoration:none;white-space:nowrap;color:var(--salbei);transition:color .25s}
.kopf nav a::after{content:"";position:absolute;left:0;right:0;bottom:6px;height:.34em;background:var(--linde);opacity:.9;mix-blend-mode:multiply;transform:scaleX(0);transform-origin:left;transition:transform .35s}
.kopf nav a:hover,.kopf nav a[aria-current]{color:var(--nebel)}
.kopf nav a[aria-current]::after,.kopf nav a:hover::after{transform:scaleX(1);mix-blend-mode:normal;height:2px;bottom:3px}
.stille{font-size:.84rem;white-space:nowrap;color:var(--salbei);border:1px solid var(--farn);border-radius:99px;padding:5px 12px}
.stille:hover{color:var(--nebel);border-color:var(--linde)}
.menue{display:none;padding:8px 14px;border:1px solid var(--farn);border-radius:99px;font-size:.92rem}
.kopfpuls{position:absolute;left:0;right:0;bottom:-9px;height:18px}

/* Auftakt: der Satz mit dem austauschbaren Zeichen */
.auftakt{position:relative;overflow:hidden;display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,1fr);align-items:end;background:var(--tanne);min-height:min(84vh,780px)}
.riese{position:absolute;right:var(--rx,clamp(0px,9vw,180px));top:50%;font:500 min(92vh,62vw)/1 var(--display);font-variation-settings:"opsz" 96;color:var(--rf,var(--farn));transform:translateY(calc(-50% + var(--ty,0%))) scale(var(--sk,1));transform-origin:50% var(--oy,50%);pointer-events:none;user-select:none;transition:color .5s}
.riese span{display:block;animation:zeichenRein .7s cubic-bezier(.2,.8,.2,1) both}
@keyframes zeichenRein{from{opacity:0;transform:scale(.82)}}
.auftakt[data-z="."]{--ty:-34%;--sk:3.4;--oy:84%;--rx:clamp(40px,12vw,250px);--rf:var(--linde)}
.auftakt[data-z=","]{--ty:-30%;--sk:2.5;--oy:84%;--rx:clamp(40px,14vw,270px)}
.auftakt[data-z="…"]{--ty:-34%;--sk:1.5;--oy:84%}
.auftext{position:relative;z-index:2;padding-block:clamp(36px,5vw,70px) clamp(96px,10vw,132px)}
.vorsatz{font-size:1.05rem;color:var(--salbei);margin-bottom:.8em}
.auftakt h1{font-size:clamp(3rem,6.7vw,6.3rem);line-height:1}
.auftakt h1 b{font-weight:500;color:var(--linde);display:inline-block}
.auftakt h1 b.neu{animation:zeichenRein .5s cubic-bezier(.2,.8,.2,1) both}
.wahl{display:flex;gap:8px;margin-top:clamp(18px,2.4vw,28px)}
.wahl button{width:54px;height:54px;border-radius:50%;border:1px solid var(--farn);font:500 1.9rem/1 var(--display);font-variation-settings:"opsz" 20;display:grid;place-items:center;padding-bottom:6px;transition:background .25s,color .25s,border-color .25s,transform .25s}
.wahl button:hover{border-color:var(--linde);transform:translateY(-3px)}
.wahl button[aria-pressed="true"]{background:var(--linde);border-color:var(--linde);color:var(--tinte)}
.wirkung{min-height:4.9em;margin-top:clamp(14px,2vw,22px);max-width:44ch;font-size:1.16rem;line-height:1.5;color:var(--nebel)}
.wirkung.neu{animation:zeichenRein .5s ease both}
.bild{position:relative;z-index:1;align-self:end;margin-left:-8%;display:flex;justify-content:flex-end}
.bild img{display:block;width:118%;max-width:none;height:auto;margin-bottom:-1px;margin-left:-18%;-webkit-mask-image:linear-gradient(90deg,transparent,#000 12%);mask-image:linear-gradient(90deg,transparent,#000 12%)}
.auftakt-amp{position:absolute;left:0;right:0;bottom:26px;height:clamp(64px,7vw,104px);z-index:3}

/* Fünf Zeichen als Tore */
.tore{display:flex;min-height:clamp(420px,56vh,560px);background:var(--tanne)}
.tor{position:relative;flex:1 1 0;min-width:0;display:flex;flex-direction:column;justify-content:flex-end;gap:6px;padding:clamp(16px,2vw,28px);text-decoration:none;overflow:hidden;background:var(--moos);transition:flex-grow .65s cubic-bezier(.3,.8,.2,1),background .35s,color .35s;border-left:1px solid var(--tanne)}
.tor b{position:absolute;left:clamp(6px,1vw,16px);top:-.26em;font:500 clamp(13rem,25vw,25rem)/1 var(--display);font-variation-settings:"opsz" 96;color:#3a6a56;transition:color .35s,transform .65s cubic-bezier(.3,.8,.2,1);transform-origin:0 30%}
.tor strong{position:relative;font:500 clamp(1.35rem,2.1vw,1.9rem)/1.15 var(--display);font-variation-settings:"opsz" 14}
.tor span{position:relative;font-size:.98rem;line-height:1.4;color:var(--salbei);min-height:2.8em;hyphens:auto;transition:color .35s}
.tor:hover,.tor:focus-visible{flex-grow:2.1;background:var(--nebel);color:var(--tinte)}
.tor:hover b,.tor:focus-visible b{color:var(--tinte);transform:scale(1.12)}
.tor:hover span,.tor:focus-visible span{color:var(--grau)}

/* Klartext-Regler */
.klartext{display:grid;gap:clamp(20px,3vw,34px)}
.ktext{display:grid;min-height:clamp(170px,19vw,250px);align-items:center}
.ktext p{grid-area:1/1;font:500 clamp(1.7rem,3.8vw,3.4rem)/1.14 var(--display);font-variation-settings:"opsz" 28;max-width:24em;transition:opacity .15s linear,filter .15s linear}
.ktext .buzz{opacity:calc(1 - var(--t,0));filter:blur(calc(var(--t,0)*6px));color:var(--grau)}
.ktext .klar{opacity:var(--t,0);filter:blur(calc((1 - var(--t,0))*6px))}
.knopf{display:inline-flex;align-items:center;padding:.62em 1.3em;border-radius:99px;border:1px solid currentColor;font-weight:500;text-decoration:none;transition:background .25s,color .25s,border-color .25s;width:max-content}
.knopf:hover{background:var(--linde);border-color:var(--linde);color:var(--tinte)}

/* Laufband */
.band-lauf{overflow:hidden;padding-block:clamp(12px,1.8vw,22px);white-space:nowrap;background:var(--linde);color:var(--tinte)}
.lauf-spur{display:inline-flex;animation:wandern 80s linear infinite;font:400 clamp(1.4rem,2.6vw,2.2rem)/1.2 var(--display);font-variation-settings:"opsz" 20}
.lauf-spur span{padding-right:.2em}
.lauf-spur span::after{content:",";padding-right:.5em}
.band-lauf:hover .lauf-spur{animation-play-state:paused}
@keyframes wandern{to{transform:translateX(-50%)}}

/* Seitenkopf mit großem Zeichen */
.seitenkopf{position:relative;overflow:hidden;padding-block:clamp(50px,7vw,96px) clamp(84px,9vw,126px)}
.seitenkopf .sz{position:absolute;right:max(var(--gr),env(safe-area-inset-right,0px));bottom:-.1em;font:500 clamp(20rem,44vw,42rem)/1 var(--display);font-variation-settings:"opsz" 96;color:#1f4336;transform:translateY(var(--par,0px));pointer-events:none}
.seitenkopf .lede{margin-top:1em}
.seitenkopf>*:not(.amp):not(.sz){position:relative;z-index:1}
.seitenkopf .amp{position:absolute;left:0;right:0;bottom:8px;height:clamp(52px,6vw,88px);z-index:2}
.seitenkopf.mit-bild{min-height:clamp(460px,44vw,640px)}
.seitenkopf.mit-bild>.kopfbild{position:absolute;z-index:1;right:max(var(--gr),5vw);bottom:0;width:auto;height:calc(100% - 24px);max-width:46%;object-fit:contain;object-position:right bottom}
.seitenkopf.mit-bild .lede{max-width:min(44vw,36em)}
.seitenkopf.mit-bild>.kopfbild.kreisfoto{bottom:clamp(14px,2vw,28px);height:calc(100% - 44px);max-width:44%}
.recht{max-width:44em}
.recht h2{font-size:clamp(1.35rem,2.2vw,1.8rem);margin-top:1.6em}
.recht h2:first-child{margin-top:0}
.recht a{text-decoration:underline}
.offen{background:var(--linde);padding:0 .3em}
.fuss-reihe span a{text-decoration:underline;text-underline-offset:.2em}
.gipfel{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,5vw,72px);align-items:center;overflow:hidden;padding-top:clamp(36px,5vw,72px);scroll-margin-top:70px}
.gipfel .lede{margin-top:.9em}
.gipfel-bild{align-self:end}
.gipfel-bild img{display:block;width:100%;max-width:660px;height:auto;margin-left:auto}

/* Über mich */
.vorstellung{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);gap:clamp(30px,6vw,90px);align-items:end}

/* Gespräch */
.gespraech{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:clamp(24px,5vw,72px);margin-top:clamp(24px,3.4vw,44px);align-items:start}
.fragen{display:flex;flex-direction:column;align-items:flex-start;gap:8px}
.fragen button{text-align:left;padding:.5em 1em;border:1px solid var(--tinte);border-radius:18px 18px 18px 4px;line-height:1.3;transition:background .25s,color .25s}
.fragen button:hover{background:var(--linde)}
.fragen button[aria-pressed="true"]{background:var(--tinte);color:var(--nebel)}
.verlauf{min-height:230px;display:flex;flex-direction:column;gap:12px}
.verlauf .f{align-self:flex-start;background:rgba(16,38,31,.1);padding:.5em 1em;border-radius:18px 18px 18px 4px}
.verlauf .a{align-self:flex-end;background:var(--tanne);color:var(--nebel);padding:clamp(16px,2vw,24px);border-radius:18px 18px 4px 18px;font:500 clamp(1.2rem,2vw,1.65rem)/1.28 var(--display);font-variation-settings:"opsz" 14;max-width:32em;animation:zeichenRein .4s ease both;hyphens:auto}
.tippt{align-self:flex-end;display:flex;gap:6px;padding:18px 20px;border-radius:18px 18px 4px 18px;background:var(--tanne)}
.tippt i{width:8px;height:8px;border-radius:50%;background:var(--nebel);animation:tippen 1s infinite}
.tippt i:nth-child(2){animation-delay:.15s}.tippt i:nth-child(3){animation-delay:.3s}
@keyframes tippen{50%{opacity:.25}}

/* Stärke und Kante */
.tabs{display:flex;flex-wrap:wrap;gap:8px;margin-top:clamp(20px,3vw,34px)}
.tab{padding:.42em 1.05em;border-radius:99px;border:1px solid var(--farn);font-size:.98rem;transition:background .25s,color .25s,border-color .25s}
.tab:hover{border-color:var(--linde)}
.tab[aria-pressed="true"]{background:var(--linde);border-color:var(--linde);color:var(--tinte);font-weight:600}
.hell .tab{border-color:var(--tinte)}
.hell .tab:hover{background:rgba(16,38,31,.1)}
.hell .tab[aria-pressed="true"]{background:var(--tinte);border-color:var(--tinte);color:var(--linde)}
.griff{position:absolute;top:0;bottom:0;left:var(--pos);width:2px;margin-left:-1px;background:var(--linde);pointer-events:none}
.griff::after{content:"";position:absolute;top:50%;left:50%;width:42px;height:42px;margin:-21px 0 0 -21px;border-radius:50%;background:var(--linde);box-shadow:0 0 0 6px rgba(211,222,124,.25)}

/* Kartenstapel */
section:has(.stapel-feld){overflow:hidden}
.stapel-feld{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:clamp(24px,5vw,72px);align-items:center}
.stapel{position:relative;height:clamp(480px,38vw,550px);max-width:480px;width:100%;touch-action:pan-y;cursor:grab}
.kk{--pad:clamp(20px,2.6vw,32px);position:absolute;inset:0;overflow:hidden;background:var(--nebel);color:var(--tinte);padding:var(--pad);display:flex;flex-direction:column;justify-content:flex-end;gap:8px;border-radius:4px;transform:translate(calc(var(--i)*9px),calc(var(--i)*-9px)) rotate(calc(var(--i)*1.8deg));z-index:calc(20 - var(--i));transition:transform .45s cubic-bezier(.3,.8,.2,1),opacity .35s;box-shadow:0 1px 0 rgba(16,38,31,.4)}
.kk b{position:absolute;z-index:1;right:16px;top:-.12em;text-shadow:0 2px 14px rgba(16,38,31,.5);font:500 7.5rem/1 var(--display);font-variation-settings:"opsz" 80;color:var(--linde)}
.kk-bild{display:block;flex:1 1 0;min-height:0;width:calc(100% + 2*var(--pad));max-width:none;height:auto;margin:calc(-1*var(--pad)) calc(-1*var(--pad)) 8px;object-fit:cover;border-radius:4px 4px 0 0;pointer-events:none;-webkit-user-drag:none}
.kk h3{font-size:1.7rem;position:relative}
.kk p{font-size:1rem;line-height:1.48;color:var(--grau);position:relative;hyphens:auto}
.kk.fort{transform:translateX(70%) rotate(13deg);opacity:0}
.kk:nth-child(even){background:var(--salbei)}
.kk:nth-child(even) p{color:var(--tinte)}
.kk:not(:first-child){}
.stapel-zaehler{font-size:.95rem;color:var(--salbei);margin-top:6px}

/* Karussell */
.kk-kopf{display:flex;flex-wrap:wrap;align-items:end;justify-content:space-between;gap:14px 30px;margin-bottom:clamp(20px,3vw,34px)}
.kk-tasten{display:flex;gap:8px}
.rund{flex:none;width:40px;height:40px;border-radius:50%;border:1px solid currentColor;display:grid;place-items:center;transition:background .2s,color .2s,border-color .2s}
.rund:hover{background:var(--linde);border-color:var(--linde);color:var(--tinte)}
.rund svg{width:16px;height:16px;fill:currentColor}
.karte{position:relative;overflow:hidden;background:var(--moos);padding:clamp(20px,2.4vw,30px);min-height:230px;display:flex;flex-direction:column;gap:10px;border-radius:4px;transition:background .3s,color .3s,transform .3s}
.karte:hover{background:var(--nebel);color:var(--tinte);transform:translateY(-4px)}
.karte:hover p{color:var(--grau)}
.hell .karte{background:var(--papier);box-shadow:inset 0 0 0 1px rgba(16,38,31,.14)}
.hell .karte:hover{background:var(--tinte);color:var(--nebel)}
.hell .karte:hover p{color:var(--salbei)}
.karte h3{font-size:1.45rem}
.karte b{font:500 1.22rem/1.24 var(--display);font-variation-settings:"opsz" 12}
.karte p{font-size:1rem;line-height:1.5;color:var(--salbei);hyphens:auto}
.hell .karte p{color:var(--grau)}
.karte .nr{font:500 3rem/1 var(--display);font-variation-settings:"opsz" 28;font-variant-numeric:lining-nums}

/* Mein Weg */
.weg-rahmen{overflow:hidden}
.weg-spur{display:flex;width:max-content;transition:transform .8s cubic-bezier(.2,.7,.2,1);touch-action:pan-y;cursor:grab}
.st{position:relative;width:clamp(286px,29vw,430px);padding-right:44px;flex:none;opacity:.38;transition:opacity .55s}
.st.an{opacity:1}
.jahr{display:block;font:400 clamp(3rem,6.6vw,6rem)/1.05 var(--display);font-variation-settings:"opsz" 34;font-variant-numeric:lining-nums}
.bahn{position:relative;height:66px;display:block}
.bahn::before{content:"";position:absolute;left:var(--spalt,0);right:0;top:calc(8px + var(--h));height:2px;background:var(--salbei)}
.bruch .bahn{--spalt:34px}
.bruch .bahn i{position:absolute;left:-1px;top:calc(8px + min(var(--h),var(--v)) - 2px);width:36px;height:calc(max(var(--h),var(--v)) - min(var(--h),var(--v)) + 6px)}
.bruch .bahn i svg{display:block;width:100%;height:100%;overflow:visible}
.bruch .bahn i path{fill:none;stroke:var(--linde);stroke-width:3;stroke-linecap:round;vector-effect:non-scaling-stroke}
.st h3{font-size:clamp(1.35rem,2vw,1.7rem);margin-bottom:.35em}
.st p{font-size:1.02rem;line-height:1.52;color:var(--salbei);max-width:36ch;hyphens:auto}
.akkordeon details{border-top:1px solid rgba(16,38,31,.28)}
.akkordeon details:last-child{border-bottom:1px solid rgba(16,38,31,.28)}
.akkordeon summary{cursor:pointer;list-style:none;display:grid;grid-template-columns:7.5em minmax(0,1fr) 24px;gap:14px;align-items:baseline;padding:15px 0}
.akkordeon summary::-webkit-details-marker{display:none}
.akkordeon summary span{font-variant-numeric:tabular-nums;color:var(--grau);font-size:.96rem}
.akkordeon summary b{font:500 clamp(1.2rem,1.9vw,1.55rem)/1.2 var(--display);font-variation-settings:"opsz" 14}
.akkordeon summary::after{content:"+";font-size:1.4rem;line-height:1;transition:transform .3s;justify-self:end}
.akkordeon details[open] summary::after{transform:rotate(45deg)}
.akkordeon p{padding:0 38px 18px 0;max-width:68ch;color:var(--grau);hyphens:auto}
@media (min-width:640px){.akkordeon p{margin-left:calc(7.5em + 14px)}}

/* Können */
.tafel{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:clamp(28px,6vw,92px);margin-top:clamp(28px,4vw,48px)}
.tafel>div>h3{font:600 1rem/1.3 var(--text);color:var(--salbei);margin-bottom:12px}
.aufgabe{display:block;width:100%;text-align:left;padding:15px 0;border-top:1px solid var(--farn);font:400 clamp(1.25rem,2vw,1.66rem)/1.2 var(--display);font-variation-settings:"opsz" 16;color:var(--salbei);transition:color .25s,padding .3s}
.aufgabe small{display:block;font:400 .96rem/1.45 var(--text);margin-top:6px;color:var(--salbei);max-width:50ch}
.aufgabe:hover{color:var(--nebel)}
.aufgabe[aria-pressed="true"]{color:var(--linde);padding-left:18px;box-shadow:inset 3px 0 0 var(--linde)}
.koennen li{padding:15px 0;border-top:1px solid var(--farn);transition:opacity .3s,transform .3s}
.koennen b{display:block;font:400 clamp(1.25rem,2vw,1.66rem)/1.2 var(--display);font-variation-settings:"opsz" 16}
.koennen span{display:block;font:400 .96rem/1.45 var(--text);margin-top:6px;color:var(--salbei);max-width:50ch}
.koennen li:not(.an){opacity:.72}
.koennen li.an b{color:var(--linde)}
.zahlen{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(18px,3vw,44px)}
.zahl b{display:block;font:500 clamp(2.8rem,6vw,5.4rem)/1 var(--display);font-variation-settings:"opsz" 40;font-variant-numeric:lining-nums}
.zahl span{display:block;margin-top:6px;font-size:.98rem;line-height:1.4;color:var(--grau)}

/* Haltung */
.zitate{position:relative;display:grid;overflow:hidden;background:var(--moos)}
.zitate blockquote{font:500 clamp(2.2rem,5.7vw,5.3rem)/1.07 var(--display);letter-spacing:-.015em;font-variation-settings:"opsz" 34;max-width:17em;text-wrap:balance}
.zitate p{margin-top:1.1em;max-width:58ch;color:var(--salbei)}
@keyframes fuellen{to{transform:scaleX(1)}}
.vier{display:flex;gap:2px;margin-top:clamp(26px,4vw,46px)}
.zk{flex:1 1 0;min-width:0;text-align:left;background:var(--moos);padding:clamp(18px,2.2vw,30px);display:flex;flex-direction:column;gap:12px;transition:flex-grow .55s cubic-bezier(.3,.7,.2,1),background .3s,color .3s;color:var(--nebel)}
.zk[aria-pressed="true"]{flex-grow:1.8;background:var(--nebel);color:var(--tinte)}
.zk em{font:500 clamp(4rem,8.6vw,8rem)/1 var(--zeichen);font-style:normal}
.zk b{font:500 1.5rem/1.15 var(--display);font-variation-settings:"opsz" 12}
.zk span{font-size:.98rem;line-height:1.45;hyphens:auto}
.plaene{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(22px,3.6vw,52px);margin-top:clamp(40px,5vw,66px)}
.plaene p{font-size:1rem;margin-top:.4em;color:var(--grau);hyphens:auto}

/* Kontakt und Fuß */
.mail{display:flex;flex-wrap:wrap;gap:12px 22px;align-items:center;margin-top:clamp(20px,3vw,34px)}
.mail a{font:400 clamp(1.5rem,4.4vw,3.7rem)/1.14 var(--display);font-variation-settings:"opsz" 28;overflow-wrap:anywhere;text-decoration:none}
.kopier{border:1px solid currentColor;border-radius:99px;padding:7px 16px;font-size:.92rem}
.kopier:hover{background:var(--tinte);color:var(--nebel)}
.kontakt-feld{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:clamp(24px,5vw,72px);align-items:center}
.prost-rahmen{position:relative;margin:0;width:clamp(190px,22vw,320px)}
.prost-rahmen::after{content:"";position:absolute;right:-9%;bottom:-9%;width:26%;aspect-ratio:1;border-radius:50%;background:var(--linde)}
.prost{aspect-ratio:1;border-radius:3px;overflow:hidden;background:var(--salbei)}
.prost-film{display:block;width:100%;height:100%;object-fit:cover}
@media(max-width:700px){.kontakt-feld{grid-template-columns:1fr}.prost-rahmen{justify-self:center;width:min(66vw,250px)}}
.wege{display:flex;flex-wrap:wrap;gap:8px 28px;margin-top:22px}
html:not(.js) .orte,html:not(.js) .stamm,html:not(.js) .musik{display:none}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
@media(max-width:800px){.pb-feld{grid-template-columns:1fr}}
.orte-feld{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(0,1fr);gap:clamp(20px,3.5vw,48px);align-items:center;margin-top:clamp(20px,3vw,34px)}
.orte-svg{display:block;width:100%;height:auto;background:#0f231d;border-radius:8px;box-shadow:inset 0 0 0 1px var(--farn)}
.land{fill:none;stroke-linecap:round;transition:opacity .9s}
.land.welt{stroke:#2c5344;stroke-width:4.4}
.land.nah{stroke:#2c5344;stroke-width:1.25;opacity:0}
.orte-svg.zoom .land.welt{opacity:0}.orte-svg.zoom .land.nah{opacity:1}
.ort-weg{fill:none;stroke:var(--linde);stroke-linecap:round;vector-effect:non-scaling-stroke;stroke-width:2.4;opacity:.85}
.ort-p{cursor:pointer;outline:none}
.ort-p .kern{fill:var(--linde);vector-effect:non-scaling-stroke;stroke:#0f231d;stroke-width:2}
.ort-p .ring{fill:none;stroke:var(--linde);stroke-width:2;vector-effect:non-scaling-stroke;opacity:0}
.ort-p.an .ring{opacity:.8}
.ort-p .griff{fill:transparent}
.ort-p:focus-visible .ring{opacity:1}
.orte-tasten{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;margin-top:12px}
.orte-los{padding:9px 18px;border-radius:99px;background:var(--linde);color:var(--tanne);border:0;cursor:pointer;font-weight:500}
.orte-filter{margin:0}
.ot-bild{width:clamp(120px,14vw,170px);aspect-ratio:1;border-radius:50%;object-fit:cover;display:block;margin-bottom:16px}
.ot-j{font-size:.92rem;letter-spacing:.04em;color:var(--linde);margin:0 0 .3em}
.orte-karte-text h3{font-size:clamp(1.5rem,2.6vw,2.2rem);margin:0 0 .4em;color:var(--nebel)}
.orte-karte-text p{color:var(--salbei);line-height:1.5;margin:0}
.orte-karte-text p.fehlt{font-style:italic;opacity:.75}
@media(max-width:800px){.orte-feld{grid-template-columns:1fr}.orte-karte-text{min-height:230px}}
.stamm-feld{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:clamp(20px,4vw,56px);align-items:center;margin-top:clamp(20px,3vw,34px)}
.stamm-svg{display:block;width:100%;height:auto}
.st-halt{cursor:pointer;outline:none}
.st-halt .aussen{fill:var(--nebel);stroke:var(--tinte);stroke-width:4;transition:fill .2s}
.st-halt.an .aussen{fill:var(--linde)}
.st-halt:focus-visible .aussen{stroke-width:7}
@media(max-width:800px){.stamm-feld{grid-template-columns:1fr}}
.mu-feld{min-width:0}
.mu-puls{display:block;width:100%;height:110px}
.mu-text{margin-top:20px;min-height:150px}
.mu-text small{display:block;font-size:.92rem;color:var(--linde);margin-bottom:.4em}
.mu-text h3{font-size:clamp(1.6rem,3vw,2.4rem);margin:0 0 .35em;color:var(--nebel)}
.mu-text p{margin:0;color:var(--salbei);line-height:1.5}

/* Seitenwechsel: das Satzzeichen wird zum nächsten */
@view-transition{navigation:auto}
@media(prefers-reduced-motion:reduce){@view-transition{navigation:none}}
.kopf{view-transition-name:kopf}
.riese,.seitenkopf .sz{view-transition-name:satzzeichen}
::view-transition-group(satzzeichen){animation-duration:.6s;animation-timing-function:cubic-bezier(.3,.7,.2,1)}
::view-transition-old(root),::view-transition-new(root){animation-duration:.3s}
.still::view-transition-group(*){animation:none}
h1,h2,h3{text-wrap:balance}
p{text-wrap:pretty}
.kw{letter-spacing:-.085em}
details{interpolate-size:allow-keywords}
details::details-content{height:0;overflow:clip;transition:height .35s ease,content-visibility .35s allow-discrete}
details[open]::details-content{height:auto}

/* Frank vor seinem Satzzeichen */
.seitenkopf.mit-bild .sz{display:block;color:var(--linde);right:var(--szr,clamp(40px,10vw,190px));bottom:var(--szb,-.12em);font-size:var(--szg,clamp(20rem,40vw,40rem));opacity:1;transform:translate3d(0,calc(var(--par,0px)*-.3),0) rotate(var(--dr,0deg));z-index:0;font-variation-settings:"opsz" 11,"wght" 650;animation:zeichenRein .8s cubic-bezier(.2,.8,.2,1) both}
.seitenkopf.mit-bild>.kopfbild{z-index:1}
.seitenkopf[data-z=","]{--szr:41vw;--szb:-.04em;--szg:clamp(24rem,50vw,50rem)}
.seitenkopf[data-z=":"]{--szr:46vw;--szb:-.08em;--szg:clamp(22rem,42vw,42rem)}
.seitenkopf[data-z="!"]{--szr:clamp(120px,22vw,420px);--szb:-.1em;--szg:clamp(19rem,36vw,36rem)}
.seitenkopf[data-z="„"]{--szr:33vw;--szb:-.02em;--szg:clamp(22rem,40vw,40rem)}
.seitenkopf.mit-bild>.randbild{right:0;max-width:44%}
.seitenkopf.mit-bild>.buchbild{max-width:50%;-webkit-mask-image:linear-gradient(90deg,transparent 0,rgba(0,0,0,.04) 6%,rgba(0,0,0,.16) 12%,rgba(0,0,0,.38) 19%,rgba(0,0,0,.66) 27%,rgba(0,0,0,.88) 34%,#000 42%);mask-image:linear-gradient(90deg,transparent 0,rgba(0,0,0,.04) 6%,rgba(0,0,0,.16) 12%,rgba(0,0,0,.38) 19%,rgba(0,0,0,.66) 27%,rgba(0,0,0,.88) 34%,#000 42%)}

/* Ecken und Kanten: die Linse zeigt den Preis */
@property --r{syntax:'<length>';inherits:true;initial-value:0px}
.kanten-liste{margin-top:clamp(22px,3vw,36px);border-top:1px solid var(--farn)}
.kz{display:grid;width:100%;text-align:left;border-bottom:1px solid var(--farn);cursor:none;--r:0px;transition:--r .45s cubic-bezier(.2,.7,.2,1);touch-action:manipulation}
@media(hover:none){.kz{cursor:pointer}}
.kz>span{grid-area:1/1;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2.4fr);gap:clamp(12px,3vw,40px);align-items:center;padding:clamp(18px,2.4vw,30px) clamp(10px,1.4vw,18px)}
.kz b{font:500 clamp(1.7rem,3.6vw,3.2rem)/1.05 var(--display);font-variation-settings:"opsz" 34}
.kz span span{font:400 clamp(1.08rem,1.7vw,1.5rem)/1.32 var(--display);font-variation-settings:"opsz" 14;max-width:34em}
.kz-licht{color:var(--nebel)}
.kz-preis{background:var(--linde);color:var(--tinte);clip-path:circle(var(--r) at var(--x,30%) var(--y,50%))}
@media(hover:hover){.kz:hover{--r:clamp(130px,15vw,210px)}}
.kz[aria-pressed="true"]{--r:170vw}
.kz:focus-visible{outline:2px solid var(--linde);outline-offset:-2px}
@media(max-width:700px){.kz>span{grid-template-columns:minmax(0,1fr);gap:6px}}

/* Szenen, die dem Scrollen folgen */
.weg-rahmen{position:relative;cursor:grab;touch-action:pan-y;user-select:none;-webkit-user-select:none;outline-offset:6px}
.weg-rahmen.zieht{cursor:grabbing}
.weg-griff{position:absolute;left:var(--gx,0);top:var(--gy,0);z-index:2;width:18px;height:18px;margin:-8px 0 0 -9px;border-radius:50%;background:var(--linde);box-shadow:0 0 0 7px rgba(211,222,124,.2);pointer-events:none;transition:box-shadow .2s,transform .2s}
.weg-rahmen.zieht .weg-griff{transform:scale(1.35);box-shadow:0 0 0 12px rgba(211,222,124,.28)}
.weg-spur{transition:none;cursor:default;will-change:transform}
.weg-stand{height:2px;background:var(--farn);position:relative;margin-top:clamp(20px,3vw,36px)}
.weg-stand i{position:absolute;inset:0;background:var(--linde);transform:scaleX(var(--p,0));transform-origin:left}
html:not(.js) .weg-rahmen{overflow-x:auto}
html:not(.js) .st{opacity:1}
.mu-spur{height:calc(100vh + 5*40vh)}
.mu-raster{position:sticky;top:calc(var(--nav) + 16px);display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(28px,5vw,72px);align-items:start}
.mu-stufen{list-style:none;display:flex;gap:6px;margin:8px 0 0;padding:0}
.mu-stufen li{flex:1;height:4px;background:var(--farn);transition:background .3s}
.mu-stufen li.an{background:var(--linde)}
@media(max-width:900px){.mu-spur{height:auto}.mu-raster{position:static;display:block;height:calc(100vh + 5*40vh)}.mu-feld{position:sticky;top:calc(var(--nav) + 14px);margin-top:20px}.mu-puls{height:90px}}

/* Zitate: Wort für Wort beim Lesen */
.zitate{display:block;padding-block:clamp(30px,6vw,70px)}
.zs{padding-block:clamp(44px,9vh,110px)}
.zw{transition:opacity .2s linear}
.zitate blockquote{font-size:clamp(2rem,4.8vw,4.6rem)}

/* Können */
.tafel{position:relative}
.tafel-linien{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}
.tafel-linien path{fill:none;stroke:var(--linde);stroke-width:1.5;stroke-dasharray:1;stroke-dashoffset:1;animation:linieZieh .5s ease-out forwards}
@keyframes linieZieh{to{stroke-dashoffset:0}}
.still .tafel-linien path{animation:none;stroke-dashoffset:0}
.zahlen{grid-template-columns:repeat(3,minmax(0,1fr))}
.taten{margin-top:clamp(20px,3vw,34px);border-top:1px solid var(--farn)}
.tz{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2.2fr);gap:clamp(12px,3vw,40px);align-items:baseline;padding-block:clamp(16px,2.2vw,28px);border-bottom:1px solid var(--farn)}
.tz h3{font-size:clamp(1.7rem,3.4vw,3rem);color:var(--linde);font-variation-settings:"opsz" 34}
.tz p{font:400 clamp(1.1rem,1.8vw,1.55rem)/1.32 var(--display);font-variation-settings:"opsz" 14;max-width:34em;margin:0}
.q-liste{list-style:none;margin:clamp(20px,3vw,34px) 0 0;padding:0;border-top:1px solid rgba(16,38,31,.25)}
.q-liste li{display:grid;grid-template-columns:clamp(70px,10vw,150px) minmax(0,1.4fr) minmax(0,1fr);gap:clamp(10px,2.4vw,32px);align-items:baseline;padding-block:clamp(14px,1.8vw,22px);border-bottom:1px solid rgba(16,38,31,.25)}
.q-liste .nr{font:500 clamp(1.5rem,2.6vw,2.3rem)/1 var(--display);font-variation-settings:"opsz" 28;font-variant-numeric:lining-nums}
.q-liste b{font:500 clamp(1.1rem,1.7vw,1.45rem)/1.25 var(--display);font-variation-settings:"opsz" 12}
.q-liste p{margin:0;font-size:1rem;line-height:1.45;color:var(--grau)}
@media(max-width:700px){.tz{grid-template-columns:minmax(0,1fr);gap:6px}.q-liste li{grid-template-columns:70px minmax(0,1fr)}.q-liste p{grid-column:2}}

/* Haltung */
.werte{margin-top:clamp(18px,3vw,32px);--n:0}
.wz{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:clamp(12px,3vw,44px);align-items:baseline;padding-block:clamp(8px,1vw,14px);border-bottom:1px solid rgba(16,38,31,.2)}
.wz h3{font:400 clamp(2.3rem,5vw,4.6rem)/1.08 var(--display);font-variation-settings:"opsz" 96,"wght" calc(400 + var(--n,0)*400);transform:translateX(calc(var(--n,0)*8px));transition:font-variation-settings .25s ease,transform .25s ease}
.wz p{margin:0;font-size:clamp(1.02rem,1.5vw,1.26rem);line-height:1.4;opacity:calc(.62 + var(--n,0)*.38);transition:opacity .25s}
.still .wz p{opacity:1}
@media(max-width:700px){.wz{grid-template-columns:minmax(0,1fr);gap:2px}}
.folgen-feld{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2.2fr);gap:clamp(20px,4vw,60px);align-items:start}
.folgen-feld>h2{position:sticky;top:calc(var(--nav) + 18px)}
.folgen-stapel .karte{position:sticky;top:calc(var(--nav) + 18px + var(--i)*12px);min-height:clamp(180px,17vw,220px);margin-bottom:18px;box-shadow:inset 0 0 0 1px rgba(16,38,31,.14),0 -8px 24px rgba(16,38,31,.08)}
.folgen-stapel .karte:hover{transform:none}
@media(max-width:800px){.folgen-feld{grid-template-columns:minmax(0,1fr)}.folgen-feld>h2{position:static}}
.fragen button,.tab,.kopier{min-height:44px}
@media(max-width:900px){
.seitenkopf.mit-bild .sz{right:var(--szrm,8%);bottom:var(--szbm,-.1em);font-size:var(--szgm,74vw)}
.seitenkopf[data-z=","]{--szrm:50%;--szbm:-.02em;--szgm:92vw}.seitenkopf[data-z=":"]{--szrm:62%;--szbm:-.08em;--szgm:84vw}.seitenkopf[data-z="!"]{--szrm:44%}.seitenkopf[data-z="„"]{--szrm:44%;--szbm:-.02em;--szgm:84vw}
.seitenkopf.mit-bild>.randbild{margin-right:calc(-1*var(--gr))}}
.kopf .kopf-sozial{order:3;margin:0;gap:0;flex:none}
.kopf .kopf-sozial a{width:36px;height:44px;border:0;border-radius:0;color:var(--salbei);background:none}
.kopf .kopf-sozial a:hover,.kopf .kopf-sozial a:focus-visible{color:var(--linde);background:none}
.kopf .kopf-sozial svg{width:19px;height:19px}
.kopf .marke{margin-right:auto}
.kopf .menue{order:4}
@media(min-width:901px) and (max-width:1120px){.kopf{gap:12px}.kopf nav ul{gap:12px}.kopf nav a{font-size:.88rem}.kopf .kopf-sozial a{width:28px}.kopf .kopf-sozial svg{width:17px;height:17px}.stille{padding-inline:8px}}
@media(max-width:480px){.kopf{gap:6px}.kopf .kopf-sozial a{width:32px}.kopf .marke{font-size:1.25rem}.kopf .menue{padding:8px 11px}}
@media(max-width:380px){.kopf .kopf-sozial a{width:28px}.kopf .kopf-sozial svg{width:17px;height:17px}}
@media(max-width:340px){.kopf{gap:4px}.kopf .kopf-sozial a{width:24px}.kopf .kopf-sozial svg{width:16px;height:16px}.kopf .marke{font-size:1rem}.kopf .menue{padding:6px;font-size:.82rem}}
.ktext{position:relative}
.kz small{display:block;font:500 .86rem/1.3 var(--text);margin-bottom:.25em;opacity:.75}
.kk h3{overflow-wrap:anywhere}
details.mehr{padding:0;background:var(--tanne)}
details.mehr>summary{list-style:none;cursor:pointer;padding:clamp(22px,3vw,34px) var(--gr);font:500 clamp(1.5rem,2.8vw,2.3rem)/1.15 var(--display);font-variation-settings:"opsz" 24;display:grid;grid-template-columns:1fr auto;column-gap:16px;align-items:center;border-top:1px solid var(--farn);border-bottom:1px solid var(--farn)}
details.mehr>summary::-webkit-details-marker{display:none}
details.mehr>summary small{grid-column:1;font:400 1rem/1.4 var(--text);color:var(--salbei);margin-top:.3em}
details.mehr>summary::after{content:"+";grid-column:2;grid-row:1/3;color:var(--linde);font-size:1.6em;transition:transform .3s}
details.mehr[open]>summary::after{transform:rotate(45deg)}
.wz{grid-template-columns:clamp(34px,5vw,70px) minmax(0,1fr)}
.wz .nr{font:500 clamp(1rem,1.6vw,1.3rem)/1 var(--text);color:var(--grau)}
@media(max-width:480px){.wz h3{font-size:1.85rem}}
.weg-knoepfe{display:flex;gap:10px;margin-top:16px}
.wt{width:46px;height:46px;border-radius:50%;border:1px solid var(--salbei);color:var(--nebel);font:400 1.5rem/1 var(--text);cursor:pointer;display:grid;place-items:center;padding-bottom:3px}
.wt:hover{background:var(--linde);border-color:var(--linde);color:var(--tinte)}
.wt:disabled{opacity:.3;cursor:default;background:none;color:var(--nebel);border-color:var(--salbei)}
.orte-beruf{max-width:46em;margin-top:clamp(20px,3vw,34px);font-size:1.06rem;line-height:1.5}
.mu-text p{white-space:normal}
.mu-player{margin-top:clamp(22px,3vw,40px)}
.mu-hinweis{margin:.7em 0 0;font-size:.95rem;color:var(--salbei)}
.mu-rahmen{display:block;width:100%;max-width:760px;height:400px;border:0;border-radius:12px;background:var(--tanne)}
/* Über mich: kein Kasten, Foto und Text gleiten herein */

/* Haltung: ein Satzzeichen, ein Satz */
.buehne{background:var(--moos);display:grid;grid-template-columns:minmax(0,.62fr) minmax(0,1.5fr);column-gap:clamp(16px,4vw,60px);align-items:center;padding-block:clamp(44px,7vw,96px);min-height:clamp(420px,46vw,620px);overflow:hidden}
.bu-zeichen{grid-row:1/3;color:var(--linde);font:500 clamp(12rem,27vw,27rem)/.8 var(--display);font-variation-settings:"opsz" 11,"wght" 650;text-align:center;transition:transform .5s cubic-bezier(.2,.8,.2,1),opacity .25s}
.bu-zeichen.um{transform:scale(.3) rotate(-30deg);opacity:0}
.bu-satz blockquote{font:500 clamp(1.9rem,4.2vw,4rem)/1.1 var(--display);letter-spacing:-.012em;font-variation-settings:"opsz" 34;margin:0;text-wrap:balance}
.bu-satz p{margin:1em 0 0;max-width:52ch;color:var(--salbei);font-size:1.08rem;line-height:1.5}
.bu-satz{animation:satzRein .55s cubic-bezier(.2,.8,.2,1) both}
@keyframes satzRein{from{opacity:0;transform:translateY(18px)}}
.still .bu-satz{animation:none}
.bu-wahl{grid-column:2;display:flex;gap:8px;margin-top:clamp(20px,3vw,34px)}
.bu-z{width:50px;height:50px;border-radius:50%;border:1px solid var(--salbei);font:500 1.5rem/1 var(--display);color:var(--nebel);cursor:pointer;display:grid;place-items:center;padding-bottom:8px;transition:background .2s,color .2s,border-color .2s,transform .2s}
.bu-z:hover{transform:translateY(-2px);border-color:var(--linde)}
.bu-z[aria-pressed="true"]{background:var(--linde);color:var(--tinte);border-color:var(--linde)}
@media(max-width:700px){.buehne{grid-template-columns:minmax(0,1fr);min-height:0}.bu-zeichen{grid-row:auto;font-size:9rem;text-align:left;line-height:.7;margin-bottom:8px}.bu-wahl{grid-column:1}.bu-saetze{min-height:230px}}
.pyramide{margin:clamp(24px,3.4vw,44px) auto 0;max-width:1000px;display:grid;gap:8px}
.py-reihe{display:flex;justify-content:center;gap:8px}
.py-s{flex:0 1 25%;min-width:0;position:relative;padding:0;background:none;border:0;color:var(--tinte);font:500 clamp(.95rem,1.55vw,1.45rem)/1.1 var(--display);font-variation-settings:"opsz" 18;cursor:pointer;perspective:900px;hyphens:manual;-webkit-tap-highlight-color:transparent}
.py-in{display:grid;transform-style:preserve-3d;transition:transform .7s cubic-bezier(.3,.75,.2,1)}
.py-v,.py-h{grid-area:1/1;display:flex;flex-direction:column;justify-content:center;padding:clamp(16px,2vw,28px) 10px;border-radius:3px;-webkit-backface-visibility:hidden;backface-visibility:hidden;background:var(--papier);border:1px solid rgba(16,38,31,.18);transition:box-shadow .3s,border-color .3s}
.py-h{transform:rotateX(180deg);background:var(--tanne);color:var(--linde);border-color:var(--tanne);box-shadow:0 14px 28px rgba(16,38,31,.22)}
.py-s small{display:block;font:500 .78rem/1 var(--text);color:var(--grau);margin-bottom:.45em}
.py-h small{color:var(--salbei)}
.py-s:hover .py-v,.py-s:focus-visible .py-v{border-color:var(--tanne);box-shadow:0 10px 22px rgba(16,38,31,.14)}
.py-s[aria-pressed="true"]{z-index:1}
.py-s[aria-pressed="true"] .py-in{transform:rotateX(180deg)}
.py-reihe:first-child .py-v{background:var(--linde)}
.py-satz{max-width:34em;margin:clamp(22px,3vw,34px) auto 0;min-height:2.8em;text-align:center;font:500 clamp(1.12rem,1.7vw,1.4rem)/1.4 var(--display);font-variation-settings:"opsz" 18;color:var(--grau)}
.py-satz b{font-weight:500;color:var(--tinte)}
.py-satz.neu{animation:pySatz .55s cubic-bezier(.2,.7,.2,1)}
@keyframes pySatz{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.py-in{transition:none}.py-satz.neu{animation:none}}
@media(max-width:560px){.py-reihe{flex-wrap:wrap}.py-reihe:last-child .py-s{flex:0 1 calc(50% - 4px)}.py-reihe:nth-child(3) .py-s{flex:0 1 calc(33.3% - 6px);font-size:.92rem}.py-reihe:nth-child(3) .py-v,.py-reihe:nth-child(3) .py-h{padding-inline:2px}.py-satz{min-height:4.2em}}
.dreh{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(12px,1.8vw,24px);margin-top:clamp(24px,3.4vw,44px);perspective:1400px}
.dk{display:block;width:100%;height:clamp(250px,24vw,330px);padding:0;background:none;border:0;cursor:pointer;color:inherit;text-align:left}
.dk-in{display:block;position:relative;width:100%;height:100%;transform-style:preserve-3d;transition:transform .7s cubic-bezier(.3,.8,.2,1)}
.dk[aria-pressed="true"] .dk-in{transform:rotateY(180deg)}
.dk:hover:not([aria-pressed="true"]) .dk-in{transform:rotateY(10deg)}
.dk-v,.dk-h{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;border-radius:4px;padding:clamp(18px,2.2vw,30px);display:flex;flex-direction:column}
.dk-v{background:var(--tanne);box-shadow:inset 0 0 0 1px var(--farn);justify-content:space-between}
.dk-v i{font:500 clamp(3rem,6vw,5.4rem)/.9 var(--display);font-style:normal;color:var(--linde)}
.dk-v b{font:500 clamp(1.3rem,2.2vw,1.95rem)/1.14 var(--display);font-variation-settings:"opsz" 18;color:var(--nebel)}
.dk-h{background:var(--linde);color:var(--tinte);transform:rotateY(180deg);justify-content:center;font-size:clamp(.98rem,1.25vw,1.1rem);line-height:1.42;overflow:auto;hyphens:auto}
.still .dk-in{transition:none}
@media(max-width:800px){.dreh{grid-template-columns:minmax(0,1fr)}.dk{height:230px}}
/* Stammplätze: Karte mit Bezirken */
.stamm-feld{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:clamp(24px,5vw,80px);align-items:center;margin-top:clamp(20px,3vw,34px)}
.stamm-svg{display:block;width:100%;height:auto;background:#eef0e6;border-radius:6px;overflow:hidden}
.stamm-svg .bz{stroke:#f7f8f2;stroke-width:2;stroke-linejoin:round;transition:filter .25s,opacity .25s}
.stamm-svg.wahl .bz{opacity:.55}
.stamm-svg .bz.licht{opacity:1;filter:saturate(1.3) brightness(.92)}
.st-ring{fill:none;stroke:var(--tanne);stroke-width:5;stroke-linejoin:round;pointer-events:none}
.st-ringtext{font:500 18px var(--text);fill:var(--tanne);paint-order:stroke;stroke:#eef0e6;stroke-width:4px}
.st-halt{cursor:pointer;outline:none}
.st-halt .griff{fill:transparent}
.st-halt .kern{fill:var(--tanne);stroke:#f7f8f2;stroke-width:3;transition:r .2s,fill .2s}
.st-halt .puls{fill:var(--tanne);opacity:0}
.st-halt text{font:500 20px var(--text);fill:var(--tinte);paint-order:stroke;stroke:#f7f8f2;stroke-width:5px;stroke-linejoin:round}
.st-halt .st-sub{font-size:15px;font-weight:400}
.st-halt:hover .kern,.st-halt:focus-visible .kern,.st-halt.an .kern{fill:#d3de7c;stroke:var(--tanne);r:12}
.st-halt.an .puls{animation:stPuls 1.8s ease-out infinite}
@keyframes stPuls{0%{opacity:.5;r:9}100%{opacity:0;r:30}}
.still .st-halt.an .puls{animation:none}
@media(max-width:800px){.stamm-feld{grid-template-columns:minmax(0,1fr)}.st-halt text{font-size:27px}.st-halt .st-sub{font-size:20px}.st-ringtext{font-size:24px}}
.st-worte{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.15em 1em}
.st-wort{padding:.06em 0;text-align:left;cursor:pointer;color:var(--tinte);font:500 clamp(1.5rem,2.7vw,2.5rem)/1.2 var(--display);font-variation-settings:"opsz" 24;transition:color .2s,opacity .25s,transform .25s}
.st-wort i{font-style:normal;color:var(--farn)}
@media(hover:hover){.st-wort:hover{color:var(--farn);transform:translateX(4px)}}
.st-worte.aktiv .st-wort{opacity:.32}
.st-worte.aktiv .st-wort.licht{opacity:1;color:var(--tanne);text-decoration:underline;text-decoration-color:var(--linde);text-decoration-thickness:.16em;text-underline-offset:.12em}
.stamm-svg.wahl .st-halt{opacity:.3;transition:opacity .25s}
.stamm-svg.wahl .st-halt.licht{opacity:1}
@media(max-width:800px){.st-worte{display:flex;flex-wrap:wrap;gap:8px}.st-wort{padding:.5em .95em;border:1px solid rgba(16,38,31,.28);border-radius:999px;font-size:1.12rem;line-height:1.1;background:var(--papier);transition:background .2s,color .2s,border-color .2s,opacity .25s}.st-wort i{display:none}.st-worte.aktiv .st-wort.licht{background:var(--tanne);color:var(--linde);border-color:var(--tanne);text-decoration:none}}
.st-halt.licht .kern{fill:#d3de7c;stroke:var(--tanne);r:12}
.st-halt.licht .puls{animation:stPuls 1.8s ease-out infinite}
.still .st-halt.licht .puls{animation:none}
/* Über mich: erst nur Kopf, Foto und Punkt, der Text folgt darunter */
.seitenkopf.mit-bild[data-z="."]{min-height:calc(100svh - var(--nav));--ub:min(46vw,calc((100svh - var(--nav) - 44px)*.882))}
.seitenkopf.mit-bild[data-z="."] .sz{font-size:0;line-height:0;width:calc(var(--ub)*.24);aspect-ratio:1;border-radius:50%;background:var(--linde);right:calc(var(--ub)*.72);bottom:calc(var(--ub)*.44)}
.seitenkopf.mit-bild[data-z="."]>.ueberbild{right:0;bottom:0;width:var(--ub);height:auto;max-width:none;margin:0}
.vorstellung-band{background:var(--moos);color:var(--nebel);padding-block:clamp(44px,6vw,84px)}
.vorstellung-band .vorstellung{display:block}
.vorstellung-band .fliess{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:1.05em clamp(30px,5vw,80px);max-width:none;color:var(--nebel)}
.vorstellung-band .fliess .gross{grid-row:1/4;margin:0}
.vorstellung-band .fliess p:not(.gross){grid-column:2;margin:0}
@media(max-width:900px){.seitenkopf.mit-bild[data-z="."]{--ub:min(88vw,calc((100svh - var(--nav) - 190px)*.882))}.seitenkopf.mit-bild[data-z="."]>.ueberbild{position:absolute;right:0;bottom:0;width:var(--ub);height:auto;max-width:none;margin:0}.vorstellung-band .fliess{grid-template-columns:minmax(0,1fr)}.vorstellung-band .fliess .gross{grid-row:auto}.vorstellung-band .fliess p:not(.gross){grid-column:1}}
.seitenkopf.mit-bild[data-z="„"] .sz,.seitenkopf.mit-bild[data-z=":"] .sz{z-index:2}
.fuss{position:relative;background:var(--tanne);padding-block:0 26px}
.fuss .amp{height:64px;margin-bottom:22px}
.sozial{list-style:none;display:flex;gap:10px;margin:0 0 20px;padding:0}
.sozial a{display:flex;align-items:center;justify-content:center;width:44px;height:44px;border:1px solid var(--farn);border-radius:50%;color:var(--nebel);transition:color .2s,border-color .2s,background .2s}
.sozial a:hover,.sozial a:focus-visible{color:var(--tanne);background:var(--linde);border-color:var(--linde)}
.sozial svg{width:21px;height:21px;display:block}
.sozial-start{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;margin-top:1.4em}
.sozial-start span{font-size:1rem;color:var(--grau)}
.sozial-start .sozial{margin:0}
.sozial-start .sozial a{color:var(--tinte);border-color:var(--salbei)}
.sozial-start .sozial a:hover,.sozial-start .sozial a:focus-visible{color:var(--tanne)}
.fuss-reihe{display:flex;flex-wrap:wrap;gap:10px 34px;justify-content:space-between;font-size:.94rem;color:var(--salbei)}
.fuss-reihe nav{display:flex;flex-wrap:wrap;gap:6px 22px}
.fuss-reihe a{text-decoration:none}
.fuss-reihe a:hover{color:var(--linde)}

/* Einblenden */
.js [data-r]{opacity:.16;transform:translateY(24px);transition:opacity .85s ease,transform .85s cubic-bezier(.2,.7,.2,1);transition-delay:var(--v,0s)}
.js [data-r].da{opacity:1;transform:none}

/* Bewegung aus */
.still *,.still *::before,.still *::after{animation:none!important;transition:none!important}
.still{scroll-behavior:auto}
.still [data-r]{opacity:1!important;transform:none!important}
.still mark{background-size:100% .34em}
.still .hell mark{background-size:100% .62em}
.still .band-lauf{white-space:normal}
.still .lauf-spur{display:block}
.still .lauf-spur .kopie{display:none}
.still .lauf-spur span{display:inline-block}
.still .punkt{display:none}
.still .seg.an i{transform:scaleX(1)}

@media (max-width:900px){
  :root{--nav:58px}
  .menue{display:block}
  .kopf nav{position:fixed;inset:calc(var(--nav) + env(safe-area-inset-top,0px)) 0 0;background:var(--tanne);padding:26px max(var(--gr),env(safe-area-inset-left,0px));display:none;overflow:auto}
  .kopf.offen nav{display:block}
  .kopf nav ul{flex-direction:column;align-items:flex-start;gap:6px}
  .kopf nav a{font:500 2rem/1.2 var(--display);color:var(--nebel)}
  .auftakt{grid-template-columns:minmax(0,1fr);min-height:0}
  .riese{right:-6%;top:auto;bottom:0;font-size:96vw;transform:none;--rf:var(--farn)}
  .auftakt[data-z]{--rf:var(--farn)}
  .auftext{padding-block:32px 8px}
  .wirkung{min-height:6.2em}
  .bild{margin:0}
  .bild img{width:100%;margin-left:0;-webkit-mask-image:none;mask-image:none}
  .auftakt-amp{bottom:8px}
  .tore{flex-direction:column;min-height:0}
  .tor{flex:none;display:grid;grid-template-columns:56px minmax(0,1fr) 12px;column-gap:16px;align-items:center;min-height:0;padding:18px max(var(--gr),env(safe-area-inset-right,0px)) 18px max(var(--gr),env(safe-area-inset-left,0px));border-left:0;border-top:1px solid var(--tanne)}
  .tor::after{content:"";grid-column:3;grid-row:1/3;width:9px;height:9px;border-top:1.5px solid var(--linde);border-right:1.5px solid var(--linde);transform:rotate(45deg)}
  .tor b,.tor:hover b,.tor:focus-visible b{position:static;grid-column:1;grid-row:1/3;display:flex;align-items:center;justify-content:center;width:56px;height:56px;border-radius:50%;background:var(--linde);color:var(--tinte);font:500 2.3rem/1 var(--display);font-variation-settings:"opsz" 28;transform:none}
  .tor:nth-child(1) b,.tor:nth-child(2) b{padding-bottom:.38em}
  .tor:nth-child(3) b{padding-bottom:.12em}
  .tor strong{grid-column:2;align-self:end;font-size:1.4rem}
  .tor span{grid-column:2;align-self:start;min-height:0;margin-top:3px}
  .tor:hover,.tor:focus-visible{flex-grow:0}
  .tor:hover::after,.tor:focus-visible::after{border-color:var(--tinte)}
  .vorstellung,.tafel,.rad-feld,.plaene,.gespraech,.stapel-feld{grid-template-columns:minmax(0,1fr)}
  .stapel{margin-top:96px}
  .kk{transform:translate(calc(var(--i)*5px),calc(var(--i)*-6px)) rotate(calc(var(--i)*1deg))}
  .zahlen{grid-template-columns:repeat(2,minmax(0,1fr))}
  .vier{flex-wrap:wrap}
  .zk{flex:1 1 calc(50% - 2px)}
  .zk[aria-pressed="true"]{flex-grow:1}
  .seitenkopf.mit-bild{min-height:0}
  .seitenkopf.mit-bild .lede{max-width:none}
  .seitenkopf.mit-bild>.kopfbild.kreisfoto{bottom:auto;height:auto;width:min(76%,320px);margin:26px 0 -58px auto}
  .seitenkopf.mit-bild>.kopfbild{position:relative;display:block;right:auto;width:min(66%,290px);height:auto;max-width:none;margin:26px 0 -84px auto}
  .gipfel{grid-template-columns:minmax(0,1fr);padding-top:40px}
  .gipfel-bild img{max-width:480px;margin-inline:auto}
  .akkordeon summary{grid-template-columns:minmax(0,1fr) 24px}
  .akkordeon summary span{grid-column:1;grid-row:1}
  .akkordeon summary b{grid-column:1;grid-row:2}
  .akkordeon summary::after{grid-column:2;grid-row:1/3;align-self:center}
}
.einw{position:fixed;left:16px;right:16px;bottom:16px;z-index:80;max-width:540px;margin-inline:auto;background:var(--tanne);color:var(--nebel);border:1px solid rgba(188,202,187,.25);border-radius:10px;padding:18px 20px 16px;box-shadow:0 18px 44px rgba(0,0,0,.3);font:400 .95rem/1.5 var(--text);animation:einwRein .45s cubic-bezier(.2,.7,.2,1)}
.einw[hidden]{display:none}
.einw p{margin:0}
.einw b{display:block;margin-bottom:.25em;font:500 1.3rem/1.2 var(--display);color:var(--linde)}
.einw a{color:var(--linde)}
.einw-k{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
.einw-k button{flex:1 1 140px;padding:.75em 1em;border:1px solid var(--salbei);border-radius:999px;background:transparent;color:var(--nebel);font:500 .95rem/1 var(--text);cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.einw-k button:hover,.einw-k button:focus-visible{background:var(--linde);border-color:var(--linde);color:var(--tanne)}
@keyframes einwRein{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.einw{animation:none}}